    (function() {
      var ET, RoomMirror, appendCSS, byAnnotation, defaultConfig, extend, hilight;

      if (window.CodeMirror == null) {
        window.CodeMirror = require('codemirror');
      }

      ET = require('evaluable-tag');

      appendCSS = require('append-css');

      extend = require('extend');

      defaultConfig = {
        viewportMargin: Infinity,
        readOnly: true
      };

      appendCSS(".RoomMirror {\n  height: auto;\n}");

      hilight = function(et) {
        var config;
        config = extend({}, defaultConfig, this.preset, et.result, {
          value: et.annotated.textContent
        });
        return CodeMirror(function(editor) {
          editor.classList.add('RoomMirror');
          return et.annotated.parentNode.replaceChild(editor, et.annotated);
        }, config);
      };

      byAnnotation = function(qs) {
        var et, evaluated, i, len, results;
        evaluated = ET.evalAnnotationsBy(qs);
        results = [];
        for (i = 0, len = evaluated.length; i < len; i++) {
          et = evaluated[i];
          if (et.annotated != null) {
            results.push((hilight.bind(this))(et));
          } else {
            results.push(null);
          }
        }
        return results;
      };

      /**
      * @class RoomMirror
      * HTML内の任意の要素に`CodeMirror`を使用したシンタックスハイライトを行う<br>
      * `data-eval`の文字列がevalで評価され、デフォルトの設定とマージされた後`CodeMirror`に渡される<br>
      *
      * html
      *
      *     <pre class="rm" data-eval="{ mode:'javascript' }"><code>
      *     var test = 'test';
      *     </code></pre>
      *
      * javascript
      *
      *     var codeBlocks = RoomMirror('.rm');
      *
      * @param {String} qs  String for querySelector
      * @return {[CodeMirror]}
       */

      RoomMirror = function(qs) {
        var et, evaluated, i, len, results;
        evaluated = ET.evalBy(qs);
        results = [];
        for (i = 0, len = evaluated.length; i < len; i++) {
          et = evaluated[i];
          results.push((hilight.bind(RoomMirror))(et));
        }
        return results;
      };

      extend(RoomMirror, {

        /**
        * @cfg {Object} preset
        * コードブロックの共通の設定を指定する<br>
        * デフォルトの設定とマージされた後`CodeMirror`に渡される<br>
        *
        *     RoomMirror.preset = {
        *         mode : 'javascript',
        *         theme: 'monokai'
        *     };
        *
        *     // var defaultConfig = {
        *     //     readOnly      : true,
        *     //     viewportMargin: Infinity
        *     // };
        *
        * シンタックスハイライトとして使う場合は言語とカラースキームの指定程度で大丈夫<br>
        * 下に主なオブションを挙げる。他にも`CodeMirror`の[**Configuration**](http://codemirror.net/doc/manual.html#config)を参照
        * @cfg {Boolean} [preset.readOnly=true]
        * コードブロックを編集可能にしたい場合は`false`に指定<br>
        * `false`を指定することでエディタとして使うことも可能
        * @cfg {Number} [preset.viewportMargin=Infinity]
        * コードブロックの高さを行数で指定する<br>
        * この値を`Infinity`に設定し、CSSで`.RoomMirror { height: auto; }`を指定すると<br>
        * コードブロックの内容に応じて行数が調整される<br>
        * デフォルトではこの設定になっている
        * @cfg {Integer} [preset.tabSize=4]
        * タブのサイズを指定する
        * @cfg {Boolean} [preset.lineWrapping=false]
        * 一行が長い時、はみ出た部分のコードを折り返すかどうかを指定する<br>
        * デフォルトでは`false`に指定されており、はみ出た部分はスクロールで表示する
        * @cfg {Boolean} [preset.lineNumbers=false]
        * 左側に行番号を表示するかどうかを指定する
        * @cfg {Integer} [preset.firstLineNumber=1]
        * `lineNumbers`を`true`に設定した時、行番号がいくつから始まるかを指定する<br>
        * デフォルトでは`1`になっている
        * @cfg {(Integer) -> String} [preset.lineNumberFormatter]
        * `lineNumbers`を`true`に設定した時、行番号の表示フォーマットを指定する<br>
        * 行番号を表す整数を受け取り、整形した文字列を返す関数を指定する
        * @cfg {Boolean} [preset.fixedGutter=true]
        * `lineNumbers`、`lineWrapping`が`true`に設定され、水平スクロールが発生した時<br>
        * 行番号がスクロールに追従するかどうかを指定する<br>
        * デフォルトでは`true`に指定されており、コードブロックの左側に固定して表示される
        *
         */
        preset: {},

        /**
        * @method byAnnotation
        * HTML内の任意の要素をアノテーションとみなして、次に続く要素のシンタックスハイライトを行う<br>
        * `data-eval`の文字列がevalで評価され、デフォルトの設定とマージされた後`CodeMirror`に渡される<br>
        * Markdownのコードブロックをシンタックスハイライトする事を想定している<br>
        *
        * html
        *
        *     <p class="rm-a" data-eval="{ mode:'javascript' }"></p>
        *     <div>
        *     var test = 'test';
        *     </div>
        *
        * javascript
        *
        *     var codeBlocks = RoomMirror.byAnnotation('.rm-a');
        *
        * __Markdownの場合__
        *
        * markdown
        *
        *     <p class="rm-a" data-eval="{ mode:'javascript' }"></p>
        *     ```
        *     var code = 'code blocks in markdown.';
        *     ```
        *
        * javascript
        *
        *     var codeBlocks = RoomMirror.byAnnotation('.rm-a');
        *
        *
        * @param {String} qs  String for querySelector
        * @return {[CodeMirror]}
         */
        byAnnotation: byAnnotation
      });

      module.exports = RoomMirror;

    }).call(this);