feat(demo): update demo to Angular UI Publisher 1.2.x

Merge branch 'douglasduteil-feat-publisher-1.2'

Closes #34

Author: douglasduteil

bower.json

@@ -25,7 +25,6 @@
     "codemirror": "~3.19.0"
   },
   "devDependencies": {
-    "angular-mocks": ">=1.0.x",
-    "angular-ui-bootstrap-bower": "~0.5.0"
+    "angular-mocks": ">=1.0.x"
   }
 }

demo/demo.html

@@ -1,63 +1,57 @@
 <section id="codemirror" ng-app="doc.ui-codeMirror">
 
-
 <!-- =Minimal code
 --------------------------------------------------------------------------- -->
-<div id="demo-mini" class="row">
-  <div class="span12">
-    <div class="page-header">
-      <h1>Minimal code</h1>
+<div id="demo-mini">
+  <div class="page-header">
+    <h1>Minimal code</h1>
+  </div>
+  <div class="row">
+    <div class="col-md-6">
+      <div ui-codemirror>Code mirror here</div>
     </div>
-    <div class="row">
-      <div class="span6">
-        <div ui-codemirror>Code mirror here</div>
-      </div>
 
-      <div class="span6" ng-controller="PlunkerCtrl"
-           ng-init="
+    <div class="col-md-6" ng-controller="PlunkerCtrl"
+         ng-init="
 vendor_css=['http://codemirror.net/lib/codemirror.css'];
 vendor_js=['http://codemirror.net/lib/codemirror.js'];
-        "
-          >
-        <div class="pull-right">
-          <button class="btn btn-info" ng-click="edit('1.0.7', 'UI.Codemirror', 'ui-codemirror')">
-            <i class="icon-edit icon-white"></i> Edit in plunker
-          </button>
-        </div>
+      "
+        >
+      <div class="pull-right">
+        <button class="btn btn-info" ng-click="edit('1.2.6', 'UI.Codemirror', 'ui-codemirror')">
+          <i class="glyphicon glyphicon-edit"></i> Edit in plunker
+        </button>
+      </div>
 
-        <tabset>
-          <tab heading="Markup">
-            <div plunker-content="markup">
+      <tabset>
+        <tab heading="Markup">
+          <div plunker-content="markup">
 <pre class="prettyprint">&lt;section&gt;
-
   &lt;div ui-codemirror &gt;Code mirror here&lt;/div&gt;
-
 &lt;/section&gt;</pre>
-            </div>
-          </tab>
-        </tabset>
-      </div>
+          </div>
+        </tab>
+      </tabset>
     </div>
   </div>
 </div>
 
 
 <!-- =General options demo
 --------------------------------------------------------------------------- -->
-<div id="demo-general" class="row">
-  <div class="span12">
-    <div class="page-header">
-      <h1>General options</h1>
-    </div>
-    <div class="row">
-      <div class="span6">
-        <div ui-codemirror="{
-              lineNumbers: true,
-              theme:'twilight',
-              readOnly: 'nocursor',
-              lineWrapping : true,
-              mode: 'xml'
-            }">&lt;html style=&quot;color: green&quot;&gt;
+<div id="demo-general">
+  <div class="page-header">
+    <h1>General options</h1>
+  </div>
+  <div class="row">
+    <div class="col-md-6">
+      <div ui-codemirror="{
+            lineNumbers: true,
+            theme:'twilight',
+            readOnly: 'nocursor',
+            lineWrapping : true,
+            mode: 'xml'
+          }">&lt;html style=&quot;color: green&quot;&gt;
 &lt;!-- this is a comment --&gt;
 &lt;head&gt;
 &lt;title&gt;HTML Example&lt;/title&gt;
@@ -67,23 +61,23 @@ <h1>General options</h1>
 I mean&amp;quot;&lt;/em&gt;... but might not match your style.
 &lt;/body&gt;
 &lt;/html&gt;</div>
-      </div>
+    </div>
 
-      <div class="span6" ng-controller="PlunkerCtrl"
-           ng-init="
+    <div class="col-md-6" ng-controller="PlunkerCtrl"
+         ng-init="
 vendor_css=['http://codemirror.net/lib/codemirror.css', 'http://codemirror.net/theme/twilight.css'];
 vendor_js=['http://codemirror.net/lib/codemirror.js', 'http://codemirror.net/mode/xml/xml.js'];
-        "
-          >
-        <div class="pull-right">
-          <button class="btn btn-info" ng-click="edit('1.0.7', 'UI.Codemirror', 'ui-codemirror')">
-            <i class="icon-edit icon-white"></i> Edit in plunker
-          </button>
-        </div>
+      "
+        >
+      <div class="pull-right">
+        <button class="btn btn-info" ng-click="edit('1.2.6', 'UI.Codemirror', 'ui-codemirror')">
+          <i class="glyphicon glyphicon-edit"></i> Edit in plunker
+        </button>
+      </div>
 
-        <tabset>
-          <tab heading="Markup">
-            <div plunker-content="markup">
+      <tabset>
+        <tab heading="Markup">
+          <div plunker-content="markup">
 <pre class="prettyprint">&lt;section&gt;
   &lt;div ui-codemirror=&quot;{
       lineNumbers: true,
@@ -101,26 +95,28 @@ <h1>General options</h1>
 I mean&amp;amp;quot;&amp;lt;/em&amp;gt;... but might not match your style.
 &amp;lt;/body&amp;gt;
 &amp;lt;/html&amp;gt;&lt;/div&gt;
-
 &lt;/section&gt;</pre>
             </div>
           </tab>
         </tabset>
       </div>
     </div>
-  </div>
 </div>
 
 
 <!-- =Mode-Changing demo
 --------------------------------------------------------------------------- -->
-<div id="demo-mode-changing" class="row">
-  <div class="span12" ng-controller="CodemirrorCtrl">
+<div id="demo-mode-changing">
     <div class="page-header">
       <h1>Mode-Changing demo</h1>
     </div>
-    <textarea ui-codemirror="cmOption" ng-model="cmModel"></textarea>
-    Mode : <select ng-model="mode" ng-options="m for m in modes" ng-change="modeChanged()"></select>
+  <div class="row" ng-controller="CodemirrorCtrl">
+    <div class="col-md-12">
+      <textarea ui-codemirror="cmOption" ng-model="cmModel"></textarea>
+    </div>
+    <div class="col-md-6">
+      Mode : <select class="form-control" ng-model="mode" ng-options="m for m in modes" ng-change="modeChanged()"></select>
+    </div>
   </div>
 </div>
 
@@ -135,8 +131,8 @@ <h1>Mode-Changing demo</h1>
         "
       >
     <div class="pull-right">
-      <button class="btn btn-info" ng-click="edit('1.0.7', 'UI.Codemirror', 'ui-codemirror')">
-        <i class="icon-edit icon-white"></i> Edit in plunker
+      <button class="btn btn-info" ng-click="edit('1.2.6', 'UI.Codemirror', 'ui-codemirror')">
+        <i class="glyphicon glyphicon-edit"></i> Edit in plunker
       </button>
     </div>
 
@@ -150,6 +146,8 @@ <h1>Mode-Changing demo</h1>
   Mode : &lt;select ng-model=&quot;mode&quot; ng-options=&quot;m for m in modes&quot; ng-change=&quot;modeChanged()&quot;&gt;&lt;/select&gt;
 
 &lt;/section&gt;</pre>
+
+    <div style="margin-top: 450px;"></div>
         </div>
       </tab>
       <tab heading="JavaScript">

gruntFile.js

@@ -60,6 +60,10 @@ module.exports = function (grunt) {
       demo: {
         files: ['demo/*', 'publish.js'],
         tasks: ['jshint', 'build:gh-pages']
+      },
+      livereload: {
+        files: ['out/built/gh-pages/**/*'],
+        options: { livereload: true }
       }
     },
 
@@ -72,10 +76,8 @@ module.exports = function (grunt) {
     connect: {
       options: {
         base : 'out/built/gh-pages',
-        port: grunt.option('port') || '8000',
-        hostname: grunt.option('host') || 'localhost',
-        open: 'http://<%= connect.options.hostname %>:<%= connect.options.port %>',
-        livereload: grunt.option('port') || '8000'
+        open: true,
+        livereload: true
       },
       server: { options: { keepalive: true } },
       continuous: { options: { keepalive: false } }

package.json

@@ -8,7 +8,7 @@
   "main": "./ui-codemirror.js",
   "dependencies": {},
   "devDependencies": {
-    "angular-ui-publisher": "~1.x",
+    "angular-ui-publisher": "1.2.x",
     "grunt": "~0.4.2",
     "grunt-contrib-connect": "~0.5.0",
     "grunt-contrib-copy": "~0.4.1",

publish.js

@@ -8,7 +8,6 @@ var path = require('path');
 module.exports = function() {
 
   var js_dependencies =[
-    'bower_components/angular-ui-bootstrap-bower/ui-bootstrap-tpls.min.js',
     'bower_components/codemirror/lib/codemirror.js',
     'bower_components/codemirror/mode/scheme/scheme.js',
     'bower_components/codemirror/mode/javascript/javascript.js',