2016-09-18(日)
全体公開
ミニゲームとして15パズル紹介してもらいました。
ハルsのご協力のおかげで、成績登録も可能になりました。
さて、昨日の日記で美しくないとか言っていたプログラムですが、
今日の日記では簡単なコーディングとプログラム解説をします。
デザイン部分は基本的にCSSで記述。
この関係で閲覧環境によってはバグがあるかもしれません。
この辺の修正については、対応してないブラウザの方が極めて少数であるからパス。
大丈夫だとは思いますが、widthで指定した幅がcontentの幅で互換が取れてるはず。
昔の記述だと標準か互換かモードの関係で、widhtにborderを含むか含まないかが変わってた気がする。
ピクセル単位で端を合わせているので、これがずれてると隙間とかはみ出しとか起きます。
ページを読み込むと同時にJavaScriptの関数が起動します。
まず、数字パネル1から16を生成。
そして16番のパネルを上下左右ランダムに移動させます。(300回繰り返し)
これで適当な初期配置の完成です。
(繰り返し回数100だと不十分だったので、思い切って300回)
数字パネルをクリックするとパネルを入れ替える関数が起動します。
この時、上下左右に16番のパネルがあるかどうかを調べ、あれば入れ替えです。
最後に変更後のゲーム板の色を変更します。
この時16番のパネルの文字色が白になり、空白のパネル(に見えるよう)になります。
何回かプレーして通常プレーで問題が出ることはないと思います。
何かあればミニメでお知らせください。
2016-09-17(土)
全体公開
久々にJavaScriptでゲーム作りました(昨日からだけど)
[リンク削除]
まだ試作版なのでメインの遊べるところだけです。
レイアウトやスコア等はこれから追加予定。
ソースは美しくないです。
始めは数字が書かれたパネル部分をJavaScriptで以下で生成しようとしました。
for(var i = 0; i < 16; i ++){
var div = document.createElement('div');
div.style.left = 64 * (i % 4) + 'px';
div.style.top = 64 * Math.floor(i / 4) + 'px';
div.textContent = i + 1;
div.onclick = function(){alert(div.textContent);};
playarea.appendChild(div);
}
パネルの生成は上手くいくんですが、onclickの処理が上手くいきませんでした。
(どの数字を押してもalertが16になる)
おそらく、変数divが上書きされ最後に追加された要素(div)になっているんだと思います。
この問題を自力で解決できなかったため、上の案はやめました。
実際はalertの部分で個々のパネルからそれらを識別する値を
パネルを入れ替える関数に渡す予定でした。
仕方ないので、htmlで各々のパネルを作り、onClickを実装しておきました。
(ここがソースが美しくないというところです)
パネルのいろいろな処理は0から15までの一次元配列で行っています。
4*4のゲーム版なんだから2次元配列使えばよかったじゃんと言うひともいるかもしれません。
個人的には2次元配列になるとforの繰り返しが増えるので避けました。
(正直面倒だった)
今回は4*4で小さい盤面なので1次元でも簡単に書けました。
ハルポップ
2016-09-18 13:09:33
おぉミニゲーム作ったんだね!
最初のスクリプトは以下のようにしたらいけるよ。
(function(){
var a = i + 1;
div.onclick = function(){
alert(a);
};
})();
僕も前に同じ状況に遭遇したけど忘れたので、「javascript onclick 変数」でぐぐったら解決法が載ってた。
@master
おおお、まさにこれがやりたかったんです。ありがとうございます。
後学のため参考になりました。
ググっても見ましたが、変数をローカルに落として処理させているんですね。
2016-09-16(金)
全体公開
朝からぬくぬくと暇人していた私です。
ふとlineのメッセージが届きました。
「今日ミーティング出席するなら俺が欠席すること伝えといて」
……そうか、今日金曜か、ミーティングの日か……
すっかりミーティングのことを忘れていた私です。
11時過ぎにブランチとして焼きそば2食分作り、吐きそうになりながら完食。
(最後の方でソースの味に飽きてしまい)
そしてお昼の三―ティングのため学校に行きました。
そして教職員が来ませんでした←は? ふざけんなよ
先輩の判断で今日はミーティングが中止となりました。
lineのメッセージが無ければミーティング自体を忘れて学校なんて行かんかったのに。
ちょっと悔しいです。
挙句の果て帰り道に通り雨に合うし。
2016-09-15(木)
全体公開
さて、昨日の続きで最終回まで視聴しました。
全26話、2クールみっちりですね。
13話のEDから14話の間で5年が経過します。
陸男は普通に大学生、サブヒロインが団地妻になっててワロタ。
姪が主人公好き路線でいくのかな~って感じの走り出しです。
つーか、モブ男どこ行った
上から数話後
痴漢キター
さらに数話後
ヒロイン生きてたパターンか
数話後
失ったものって結局それか
目が死んでた当たりで確信はしてたが
そして最後
ハッピーエンドつまんね
ヒロイン死んでて良かったのに
姪とくっ付けばよかったのに
モブ男だってロリ性癖出したんだぞ
変わってもいい、だけど変わらなたっていい、だって自由だ
自由だに意味不明。
だったら告白シーン入れるのも自由だったろ
2016-09-14(水)
全体公開
数年前のアニメ、凪のあすから
突如として見たくなったので視聴中。
(未視聴作品ですが、作品評価が高いので見たかった)
取り敢えず前半13話まで視聴。
メインキャラは海の人4人と陸の人1人、他両方とも多数のわき役
主人公はヒロインが好きで、ヒロインは陸の少年に恋をし、
モブ男はサブヒロインに恋を、サブヒロインは主人公に恋を
なんか大変ですね。
そして13話でモブ男はどうなったのか……