JavaScriptおれおれAdvent Calendar 2014 – 18日目分 あとから更新。 JSオジサンでお話してきた内容です。というか、先月JSConf.Asiaでもお話してきた内容ですね。 みんなで幸せになろうよ。 スライド こちらご覧ください。 ModelとViewに分ける設計 – #JSオジサン つらいアプリ実装の例 カラーピッカーの実装を考えます。 よくあるカラーピッカーUI。 実装 要素はご覧のとおり、四つ。 プレビュー カラーマップ(クリックで色を選択できる) 数値入力欄 スライダー それぞれ現在選択中の色の値を表現します。またプレビュー以外は色を変更する事ができます。 カラーマップは以下の実装が必要ですね。 カラーマップをクリックしたら、 プレビューを更新 カラーマップ自身を更新 数値入力欄を更新 スライダーを更新 カラーマップクリック時の処理。 他も同様です。