Release 0.7.0

christianalfoni · Mar 8, 2016 · bdd5a5f · bdd5a5f
1 parent fc174fd
commit bdd5a5f
Show file tree

Hide file tree

Showing 34 changed files with 865 additions and 95 deletions.
diff --git a/app/components/Bin/index.js b/app/components/Bin/index.js
@@ -7,14 +7,16 @@ import Preview from '../Preview';
 import Log from '../Log';
 import LiveUsers from '../LiveUsers';
 import LiveUser from '../LiveUser';
+import Welcome from '../Welcome';
 
 @Cerebral({
   snackbar: 'bin.snackbar',
   isRunning: 'bin.isRunning',
   isLoadingBin: 'bin.isLoadingBin',
   showLog: 'bin.showLog',
   showLoadingBin: 'bin.showLoadingBin',
-  live: 'live'
+  live: 'live',
+  showWelcome: 'bin.showWelcome'
 })
 class Bin extends React.Component {
   constructor(props) {
@@ -23,6 +25,9 @@ class Bin extends React.Component {
       showSnackbar: false
     };
   }
+  componentWillMount() {
+    document.querySelector('#loader').style.display = 'none';
+  }
   componentDidMount() {
     window.addEventListener('keydown', (event) => {
       if ((event.metaKey || event.ctrlKey) && event.keyCode === 83) {
@@ -65,6 +70,11 @@ class Bin extends React.Component {
     }, 4000);
   }
   render() {
+
+    if (this.props.showWelcome) {
+      return <Welcome/>;
+    }
+
     return (
       <div onClick={() => this.props.signals.bin.appClicked()}>
         <Toolbar/>

diff --git a/app/components/CodeEditor/html-lint.js b/app/components/CodeEditor/html-lint.js
@@ -0,0 +1,30 @@
+const defaultRules = {
+  'tagname-lowercase': true,
+  'attr-lowercase': true,
+  'attr-value-double-quotes': true,
+  'doctype-first': false,
+  'tag-pair': true,
+  'spec-char-escape': true,
+  'id-unique': true,
+  'src-not-empty': true,
+  'attr-no-duplication': true
+};
+
+module.exports = function (CodeMirror, HTMLHint) {
+  return function(text, options) {
+    const found = [];
+
+    const messages = HTMLHint.verify(text, options && options.rules || defaultRules);
+    for (let i = 0; i < messages.length; i++) {
+      const message = messages[i];
+      var startLine = message.line - 1, endLine = message.line - 1, startCol = message.col - 1, endCol = message.col;
+      found.push({
+        from: CodeMirror.Pos(startLine, startCol),
+        to: CodeMirror.Pos(endLine, endCol),
+        message: message.message,
+        severity : message.type
+      });
+    }
+    return found;
+  };
+}
diff --git a/app/components/CodeEditor/index.js b/app/components/CodeEditor/index.js
@@ -96,6 +96,10 @@ class CodeEditor extends React.Component {
         return 'text/x-less';
       case 'scss':
         return 'text/x-sass';
+      case 'html':
+        return 'htmlmixed';
+      case 'json':
+        return 'application/json';
       default:
         return 'jsx';
     }
@@ -252,6 +256,62 @@ class CodeEditor extends React.Component {
 
     }
 
+    if (mode === 'htmlmixed') {
+
+      const setHtmlModeAndLinter = function () {
+        loadedLinters.push(mode);
+        require('codemirror/mode/htmlmixed/htmlmixed.js');
+        require('codemirror/addon/edit/matchtags.js');
+        require('codemirror/addon/edit/closetag.js');
+        const htmlhint = require('htmlhint');
+        const linter = require('./html-lint.js');
+        this.codemirror.setOption('lint', {
+          getAnnotations: linter(CodeMirror, htmlhint.HTMLHint),
+          onUpdateLinting: this.onUpdateLinting
+        });
+        this.codemirror.setOption('mode', mode);
+        this.setEditorValue(this.codemirror.getValue());
+      }.bind(this);
+
+      if (loadedLinters.indexOf(mode) >= 0) {
+        setHtmlModeAndLinter();
+      } else {
+        this.props.signals.bin.linterRequested();
+        return require.ensure([], () => {
+          setHtmlModeAndLinter();
+          this.props.signals.bin.linterLoaded();
+        });
+      }
+
+    }
+
+    if (mode === 'application/json') {
+
+      const setJsonModeAndLinter = function () {
+        loadedLinters.push(mode);
+        require('codemirror/mode/javascript/javascript.js');
+        const jsonLint = require('./linters/json.js');
+        const linter = require('./json-lint.js');
+        this.codemirror.setOption('lint', {
+          getAnnotations: linter(CodeMirror, jsonLint),
+          onUpdateLinting: this.onUpdateLinting
+        });
+        this.codemirror.setOption('mode', mode);
+        this.setEditorValue(this.codemirror.getValue());
+      }.bind(this);
+
+      if (loadedLinters.indexOf(mode) >= 0) {
+        setJsonModeAndLinter();
+      } else {
+        this.props.signals.bin.linterRequested();
+        return require.ensure([], () => {
+          setJsonModeAndLinter();
+          this.props.signals.bin.linterLoaded();
+        });
+      }
+
+    }
+
     this.codemirror.setOption('mode', mode);
 
     return false;

diff --git a/app/components/CodeEditor/json-lint.js b/app/components/CodeEditor/json-lint.js
@@ -0,0 +1,14 @@
+module.exports = function (CodeMirror, jsonlint) {
+  CodeMirror.registerHelper("lint", "json", function(text) {
+    var found = [];
+    jsonlint.parseError = function(str, hash) {
+      var loc = hash.loc;
+      found.push({from: CodeMirror.Pos(loc.first_line - 1, loc.first_column),
+                  to: CodeMirror.Pos(loc.last_line - 1, loc.last_column),
+                  message: str});
+    };
+    try { jsonlint.parse(text); }
+    catch(e) {}
+    return found;
+  });
+}