Bootstrap + BootstrapSwitch がわかりにくかったのでメモしとく。

BootstrapSwitchは、Bootstrap本来のデザインを損なわずに実装できるスライドスイッチ（フリップスイッチ）プラグイン。
BootstrapSwitch2は、スイッチの枠の隅が欠けたように見えて、イマイチ。
BootstrapSwitch3では、デザインは改善されたが、すぐに使えそうなコード付きのサンプルがネットで見つけにくい。というかほぼ無い。

サンプル（非公式？）：
http://www.jque.re/plugins/version3/bootstrap.switch/
やりたいことが実現できそうなので使いたいが、情報も知識も少なくどうしたものか。
本家サイトにサンプルコードがあるが、説明がそっけなく実装しようとしてもうまくいかない。しかも公式ドキュメントの記述が誤っている模様で難儀する。
で、上記のサンプルで動作している現物を手元に取り込んで必要なコードを抜き書いてみた。自分用テンプレートみたいなもの。
これはキャプチャ画像。

ようやくちゃんと実装ができたのでいろいろ試したところ、操作フィーリングもよいし、内部的にもきちんと動いているようにみえる。 ちなみに、他にもいくつか試して採用できなかったブラグインもある。 Switchery…スイッチの状態をdisableにできない。Flat UI…スライドスイッチだけを導入できずページ全体のデザインが変わってしまう。など。

バージョン：
Bootstrap 3.2.0
（http://getbootstrap.com/）
Bootstrap Switch 3
（http://www.bootstrap-switch.org/）

実装の方法：
bootstrap-switch.orgからダウンロードした bootstrap-switch-master.zip に含まれる２つのファイルをすでにBootstrapが使える環境に追加する。
static/js/bootstrap-switch.js
static/stylesheets/bootstrap-switch.css
（ダウンロード元：https://github.com/nostalgiaz/bootstrap-switch）

実装したコード。
やりたいことは、スイッチの色を変える、スイッチが押されたことを取得する（onClickイベント）、スイッチの状態を取得する（statusメソッド）、スイッチを無効化する（setActiveオプション）。など。
---------------------------- ----------------------------
このブログ本文にHTMLリストを表示するときの参考
http://www.netyasun.com/syntaxhighlighter/source-escape.html
※ コード中、<br>が反映されていません。