JavaScriptおれおれAdvent Calendar 2014 – 18日目分 あとから更新。 JSオジサンでお話してきた内容です。というか、先月JSConf.Asiaでもお話してきた内容ですね。 みんなで幸せになろうよ。 スライド こちらご覧ください。 ModelとViewに分ける設計 – #JSオジサン つらいアプリ実装の例 カラーピッカーの実装を考えます。 よくあるカラーピッカーUI。 実装 要素はご覧のとおり、四つ。 プレビュー カラーマップ(クリックで色を選択できる) 数値入力欄 スライダー それぞれ現在選択中の色の値を表現します。またプレビュー以外は色を変更する事ができます。 カラーマップは以下の実装が必要ですね。 カラーマップをクリックしたら、 プレビューを更新 カラーマップ自身を更新 数値入力欄を更新 スライダーを更新 カラーマップクリック時の処理。 他も同様です。
![ModelとViewに分ける設計の話。ちょい難しめ。(JavaScriptおれおれAdvent Calendar 2014 – 18日目) | Ginpen.com](https://cdn-ak-scissors.b.st-hatena.com/image/square/de4af7f62b39439905833504e59ba1e153be6d8b/height=288;version=1;width=512/https%3A%2F%2Fginpen.com%2Fwp-content%2Fthemes%2Fginpen-theme%2Fimg%2Ficon-512.png)