markuapad 0.2.6 → 0.2.7

data/src/jsx/editor.jsx

@@ -20,7 +20,7 @@ class Editor extends React.Component {
 
   // Setup all the editor options when we mount.
   componentDidMount() {
-    this.setupEditor();
+    this.loadFile();
   }
 
   componentWillUpdate(nextProps, nextState) {
@@ -37,16 +37,20 @@ class Editor extends React.Component {
   componentDidUpdate(lastProps, lastState) {
     if (lastProps.currentFile !== this.props.currentFile) {
       this.setState({ currentFileValue: null })
-      this.setupEditor();
+      this.loadFile();
     }
   }
 
-  setupEditor() {
+  loadFile() {
     if (!this.props.currentFile) return;
 
-    // Setup the ace editor
+    // Get the current file to put in the ace editor
+    FileAccessor.get(this.props.currentFile.filename, this.onCurrentFileLoaded, this.props.currentFile.type);
+  }
+
+  setupEditor() {
+    // Set all editor related properties here.
     this.editor = ace.edit(this.refs.editor.getDOMNode());
-    this.editor.getSession().setMode('ace/mode/markdown');
     this.editor.setTheme('ace/theme/xcode');
     this.editor.setKeyboardHandler('ace/keyboard/emacs');
     this.editor.renderer.setShowGutter(false);
@@ -55,15 +59,8 @@ class Editor extends React.Component {
     this.editor.setShowPrintMargin(false);
     this.editor.setFontSize(14);
     this.editor.$blockScrolling = Infinity;
-    this.editor.session.setUseWrapMode(true);
     this.editor.setHighlightActiveLine(false);
-
-    // When the editor changes, alert us
     this.editor.on("change", this.onEditorChanged)
-    this.editor.getSession().selection.on("changeCursor", this.onCursorChanged)
-
-    // Get the current file to put in the ace editor
-    FileAccessor.get(this.props.currentFile.filename, this.onCurrentFileLoaded, this.props.currentFile.type);
   }
 
   // When someone changes the cursor, we need to tell the file that we have a changed cursor
@@ -99,14 +96,29 @@ class Editor extends React.Component {
     if (error)
       return console.error(error)
     else {
-      // Focus the editor
-      this.editor.focus;
-
       // Set the value of it
-      this.setState({ currentFileValue: contents }, () => this.editor.setValue(contents, -1));
+      this.setState({ currentFileValue: contents }, this.setupCurrentFile);
     }
   }
 
+  // Called when we load a new file.  Sets up the files editor session, and initial values.
+  // TODO we should actually probably keep a set of edit sessions in our state, and then switch between them to keep the
+  setupCurrentFile = () => {
+    this.setupEditor();
+
+    let newSession = new ace.EditSession(this.state.currentFileValue);
+    // Add some session modes
+    // TODO parse file type here and change mode and store session info
+    newSession.setMode('ace/mode/markdown');
+    newSession.setUseWrapMode(true);
+    newSession.selection.on("changeCursor", this.onCursorChanged)
+    newSession.setUndoManager(new ace.UndoManager());
+
+    // Make the editor load this session
+    this.editor.setSession(newSession)
+    this.editor.focus()
+  }
+
   renderEditor() {
     return (
       <section key={EDITOR_KEY} ref="editor" className="editor"></section>
@@ -135,4 +147,4 @@ Editor.propTypes = {
   onBookContentChanged: React.PropTypes.func.isRequired
 }
 
-export default Editor;
+export default Editor;

data/src/jsx/toolbar.jsx

@@ -34,7 +34,7 @@ class Toolbar extends React.Component {
   render() {
     return (
       <nav className="toolbar">
-        <h3 className="book-title">{ this.props.bookTitle}</h3>
+        <h3 className="book-title">{ this.props.bookTitle }</h3>
         <ul className="actions">
           <li>
             <a className={`progressMessage ${this.props.inProgress ? 'active' : ''}`}>
@@ -72,4 +72,4 @@ Toolbar.propTypes = {
   bookTitle: React.PropTypes.string.isRequired
 }
 
-export default Toolbar;
+export default Toolbar;

data/src/markuapad.js

@@ -26,11 +26,11 @@ class Markuapad {
     this.options = _.extend({}, this.options, options);
 
     // Project Root
-    let projectTitle = options.title || "My First Markuapad Book";
+    let projectTitle = options.title || "";
     let projectRoot = options.slug || _.string.slugify(projectTitle);
 
     // Instantiate a new markua processor instance
-    this.markua = new Markua(projectRoot, { fileAccessor: this.options.fileAccessor })
+    this.markua = new Markua(projectRoot, { fileAccessor: this.options.fileAccessor });
 
     // Setup the markuapad file accessor
     FileAccessor.setup(this.options.fileAccessor, projectRoot);
@@ -40,4 +40,4 @@ class Markuapad {
   }
 }
 
-export default new Markuapad();
+export default new Markuapad();

data/src/styles/index.scss

@@ -2,29 +2,23 @@
 @import "./variables";
 @import "../../bower_components/bourbon/app/assets/stylesheets/bourbon";
 
-// Move this to an example-only css
-#markuapad-hero {
-  padding: 20px;
-  border: thin solid #bce8f1;
-  margin: 10px;
-  background-color: #d9edf7;
-  border-radius: 3px;
-  h2 { font-family: 'Roboto Slab', serif; font-size: 2em; }
-  position: relative;
-  #markuapad-hero-close {
-    @include appearance(none);
-    background: initial;
-    border-radius: initial;
-    color: initial;
-
-    position: absolute;
-    right: 10px;
-    top: 10px;
-
-    padding: 5px;
-
-    &:focus {
-      outline: none;
+#markuapad-about {
+  padding: 20 10 0 10;
+  .nav-links {
+    float: right;
+    list-style-type: none;
+    height: 50px;
+    line-height: 50px;
+    li {
+      vertical-align: middle;
+      display: inline-block;
+      margin: 0 5px;
+      a {
+        color: #777;
+        &:hover {
+          color: #222;
+        }
+      }
     }
   }
 }

data/src/web.js

@@ -1,4 +1,4 @@
 import Markuapad from "./markuapad"
 
 // Call the api to create a new markuapad instance on the #main element
-Markuapad.create("main", { fileAccessor: ExampleFileAccessor, CHANGED_INTERVAL: 100, enablePreview: true });
+Markuapad.create("main", { fileAccessor: ExampleFileAccessor, CHANGED_INTERVAL: 100, enablePreview: true, slug: 'my-first-markuapad-book' });

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: markuapad
 version: !ruby/object:Gem::Version
-  version: 0.2.6
+  version: 0.2.7
 platform: ruby
 authors:
 - Braden Simpson
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2015-08-24 00:00:00.000000000 Z
+date: 2015-09-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -64,6 +64,8 @@ files:
 - build/browser-polyfill.min.js
 - build/dist.css
 - build/dist.js
+- build/images/markua-icon.png
+- build/images/markua-logo.png
 - build/index.css
 - build/index.html
 - build/index.js
@@ -72,6 +74,7 @@ files:
 - lib/markuapad.rb
 - lib/markuapad/engine.rb
 - lib/markuapad/version.rb
+- markuapad-0.2.6.gem
 - markuapad.gemspec
 - package.json
 - prepare_gem.sh