test gutter

Author: zesani

codemirror.vue

@@ -7,6 +7,12 @@
   var CodeMirrorMetas = require('./metas.js')
   require('codemirror/lib/codemirror.css')
   // var
+  function makeMarker() {
+    var marker = document.createElement("div");
+    marker.style.color = "#822";
+    marker.innerHTML = "●";
+    return marker;
+  }
   export default {
     data: function() {
       return {
@@ -23,7 +29,8 @@
             styleActiveLine: true,
             lineNumbers: true,
             mode: 'text/javascript',
-            lineWrapping: true
+            lineWrapping: true,
+            gutters: ["CodeMirror-linenumbers", "breakpoints"]
           }
         }
       },
@@ -83,6 +90,10 @@
           _this.$emit('input', _this.content)
         }
       })
+      this.editor.on("gutterClick", function(cm, n) {
+        var info = cm.lineInfo(n);
+        cm.setGutterMarker(n, "breakpoints", info.gutterMarkers ? null : makeMarker())
+      })
     },
     watch: {
       'code': function(newVal, oldVal) {