add loading css

dist/css/editormd.css

@@ -6,7 +6,7 @@
  * @license     MIT License
  * @author      Pandao
  * {@link       https://github.com/pandao/editor.md}
- * @updateTime  2015-02-05
+ * @updateTime  2015-02-06
  */
 
 /*!
@@ -2370,11 +2370,24 @@
   border: 1px solid #ddd;
   text-align: left;
   overflow: hidden;
+  background: url("../images/loading.gif") no-repeat center center;
+  -webkit-background-size: 32px 32px;
+  background-size: 32px 32px;
 }
 .editormd a {
   text-decoration: none;
 }
 
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
+  .editormd {
+    background-image: url(../images/loading@2x.gif);
+  }
+}
+@media only screen and (-webkit-min-device-pixel-ratio: 3), only screen and (min-device-pixel-ratio: 3) {
+  .editormd {
+    background-image: url(../images/loading@3x.gif);
+  }
+}
 .editormd-toolbar {
   width: 100%;
   min-height: 35px;

dist/js/editormd.js

@@ -1,12 +1,12 @@
 /*
  * Editor.md
  * @file        editormd.js 
- * @version     v0.1.0 
+ * @version     v1.0.0 
  * @description A simple online markdown editor.
  * @license     MIT License
  * @author      Pandao
  * {@link       https://github.com/pandao/editor.md}
- * @updateTime  2015-02-05
+ * @updateTime  2015-02-06
  */
 
 ;(function(factory) {
@@ -792,6 +792,8 @@
             var htmlTextarea     = this.htmlTextarea     = editor.find("."+this.classNames.textarea.html);
             var markdownTextarea = this.markdownTextarea = editor.find("."+this.classNames.textarea.markdown);
             
+            editor.css("background", "none");
+            
             this.saveToTextareas();
             
             preview.show();

src/js/editormd.js

@@ -781,6 +781,8 @@
             var htmlTextarea     = this.htmlTextarea     = editor.find("."+this.classNames.textarea.html);
             var markdownTextarea = this.markdownTextarea = editor.find("."+this.classNames.textarea.markdown);
             
+            editor.css("background", "none");
+            
             this.saveToTextareas();
             
             preview.show();

src/scss/editormd.scss

@@ -12,13 +12,27 @@
     @include box-sizing(border-box);             
     border: 1px solid $borderColor;
     text-align: left;
-    overflow: hidden;
+    overflow: hidden;    
+    background: url("../images/loading.gif") no-repeat center center;
+    @include background-size(32px 32px);
     
     a {
         text-decoration: none;
     }
 }
 
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
+    .editormd {
+        background-image: url(../images/loading@2x.gif);
+    }
+}
+
+@media only screen and (-webkit-min-device-pixel-ratio: 3), only screen and (min-device-pixel-ratio: 3) {
+    .editormd {
+        background-image: url(../images/loading@3x.gif);
+    }
+}
+
 #{$prefix}toolbar {
     width: 100%;
     min-height: 35px;