Works

イラストロジック自動解答

# 使用方法 JavaScriptタグのコードはイラストロジックを解くためのアルゴリズムだけ書いているので他の作品から読み込むことができます。(一応) ただし、仕様変更で変数名を変えたりする可能性あり。 ## グローバル領域に取り込み ### 読み込み - フォーク、または"Add Library"で /reosablo/illustlogic を選択 - 必須のライブラリはありません。 - 使用するグローバル変数は"IllustLogic"のみです。 ### オブジェクトの生成 ``` var hint = { rows: [ [3], [1,1], [1] ], cols: [ [3], [1], [2] ] }); var solver = IllustLogic.Solver( { hint: hint } ); ``` ### イベントの設定 内部でWeb Workersを用いて解いているので計算結果はイベントを通じて得る必要があります。 独自のEventクラスで、Event#typeとEvent#timeStampが定義されています。 ``` // ひとつのセルの中身が確定したとき solver.addEventListener('cellsolve',function(event){ console.log(data.rowIndex,data.colIndex); // セルの座標 console.log(); // セルの中身(Boolean) }); // ひとつの行または列のセルがすべて確定したとき solver.addEventListener('linesolve',function(event){ console.log(event.index); // 行または列のindex console.log(event.lineType); // 行か列かの区別("row"または"col") }); // すべてのセルが確定して計算を終了したとき solver.addEventListener('solve',function(event){ console.log(event.value); // セルの中身(Boolean)の配列の配列 }); // すべてのセルを確定できないまま計算が終了した(解が複数ある)とき solver.addEventListener('solvestop',function(event){ }); // 解が存在しないと判明して計算を終了したとき solver.addEventListener('solvefail',function(event){ }); ``` ### 計算開始 ``` solver.solve(); ``` # アルゴリズム 人間がイラストロジックを解くときのアルゴリズムに似せています。 - 行(または列)1個に着目する - ヒントを見て、セルのパターンをすべて考える 例) 5個のセルでヒントが[2,1]だったら[■■☒■☒]、[☒■■☒■]の2パターンが考えられる - 現状の解答を見て、適用できないセルのパターンを除外する 例) 先の例で、現状の解答が[□□□□☒]だったら2つのうち後者のパターンが除外される - 残ったパターンのうち、すべてに共通するセルを確定させる。 例) もし現状の解答が[☒□□□□]で、残ったパターンが[☒■■■☒]、[☒☒■■■]の2つであった場合、 4番目と5番目のセルが■が新しく確定し、現状の解答は[☒□■■□]に更新される - 別の行(または列)1個に着目する(以下繰り返し)

  • 3325
  • 4

Flickr Fullscreen Slideshow

  • 2624
  • 0

高速化 forked: 水面へ落ちる桜

リファクタリングの練習を兼ねて高速化を試みました。 □ドット演算子、添字演算子を削減 └オブジェクトのキャッシュ □ループ中のオブジェクト生成消滅を削減 └初期化時に生成したオブジェクトを再利用 □初期値代入の手間を削減 └prototypeで事前に初期値を定義 □アルゴリズムの簡略化 └組み込み関数の使用(Array#sort(),Array#splice()) □キャンバスコンテキスト状態設定の手間を削減 └ctx.save()とctx.restore()で状態の保存・復元 その他、変更箇所はJavaScriptのコメントに記載しています。 ※ 4/20追記 @mikemokeさん 指摘ありがとうございます! グローバル変数fallNumberですが、勘違いしていたようです…。"fallNumberは論理的に無意味"は私の間違いでしたm(_ _m ※ 4/20追記 クリックで花びらを描画する関数を切り替える機能をつけてみました。 デフォルトではフォーク元と同じようにdrawImage()を使っていますが、切り替えるとパスで描きます。見た目が綺麗になりますがわずかに遅くなります。

  • 3123
  • 9

SCSS版 forked: ブロックを消していくゲーム。

2年前に作ったときは「CSS版」でしたが、CSSコードが見苦しいので全面的にSCSSで書き換えました。 SCSSコードは約3000行のCSSコードを出力しています。 …え、JavaScript使ってるじゃないかって?行数が少なくてよく見えないのでわかりません。

  • 3669
  • 0

JavaScript Quiz: +0と-0を区別せよ!

# JavaScript Quiz ### 問題 **引数xが`+0`だったら`true`、`-0`だったら`false`を返すような関数を作ってください。** 入力フォームには何を書いてもらっても構いません。 引数xには+0か-0が10回ランダムに渡されるので、すべて正しく区別できれば正解と判定します。 悩みすぎてハゲるのを防止するため、10回以上試行するとヒントがでるようにしました。 ### 動作確認済み - Chrome - IE 11 - Firefox WebWorkerを使っているのでレガシーな環境では動きません。 ### 解答例と解説 [twitter.com/reosablo/status/454952743010963456](https://twitter.com/reosablo/status/454952743010963456) ### 関連項目 - [JavaScript Quiz: 配列に関数を格納せよ!](/reosablo/quiz-fns)

  • 2195
  • 1

キラキラ

観賞用 マウスを乗せると追尾します。 クリックすると追尾を中断します。

  • 4763
  • 6

電話のプッシュ音再現

マウス、スクリーンタッチ、キーボードどれでもボタンを押すと電話の音が鳴ります。 どこかに電話がかかったりしないのでボタン押し放題です。 [https://ja.wikipedia.org/wiki/DTMF](https://ja.wikipedia.org/wiki/DTMF) - - - ## 初期化 第1引数にAudioContextのインスタンスを渡して初期化します。 AudioNodeっぽく扱うことにしているのでconnectが必要です。 ``` var audioContext = new AudioContext(); var toner = new DTMFToner(audioContext); console.assert(toner.context === audioContext); toner.connect(audioContext.destination); ``` - - - ## トーン開始 第1引数は押すボタンとして'0'〜'9','*','#'のいずれかを指定します。それ以外の値の場合、トーンは開始されません。 第2引数はreleaseのときに同じ値を使います。省略すると`undefined`として扱います。 pressしたあと、releaseせずにpressしても何も起こりません。 ``` // void press(String button, [id]) toner.press('*', 'foo'); toner.press('1', 'bar'); // does nothing ``` - - - ## トーン終了 第1引数でpressのときに渡した値と同じ値を渡すと終了します。省略すると`undefined`として扱います。 pressせずにreleaseしても何も起こりません。 ``` // void release([id]) toner.release('foo'); toner.release('buz'); // does nothing ```

  • 1613
  • 0

マウスカーソルじろじろ

  • 4436
  • 1

Skills

Hot tags

Categories

HTML / CSS / JavaScript