slide out menu, save button

Author: ShMcK

lib/atom/editor.js

@@ -16,6 +16,11 @@ function setAtomGlobals() {
 }
 exports.setAtomGlobals = setAtomGlobals;
 var getEditorCount = 0;
+function save() {
+    var editor = findEditor();
+    editor.save();
+}
+exports.save = save;
 function findEditor() {
     var editor = atom.workspace.getActiveTextEditor();
     if (!editor) {

lib/components/_components.js

@@ -1,7 +1,7 @@
 "use strict";
 var app_1 = require('./app/app');
 exports.App = app_1.default;
-var router_1 = require('./app/router');
+var router_1 = require('./router');
 exports.Router = router_1.default;
 var page_1 = require('./page/page');
 exports.Page = page_1.default;

lib/components/app/app.js

@@ -1,4 +1,4 @@
-'use strict';
+"use strict";
 var __extends = (this && this.__extends) || function (d, b) {
     for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
     function __() { this.constructor = d; }
@@ -18,7 +18,6 @@ var react_redux_1 = require('react-redux');
 var _components_1 = require('../_components');
 var ThemeManager = require('material-ui/lib/styles/theme-manager');
 var theme_1 = require('../theme/theme');
-var react_addons_css_transition_group_1 = require('react-addons-css-transition-group');
 var default_1 = (function (_super) {
     __extends(default_1, _super);
     function default_1() {
@@ -31,7 +30,7 @@ var default_1 = (function (_super) {
     };
     default_1.prototype.render = function () {
         var state = this.props.state;
-        return (React.createElement(react_addons_css_transition_group_1.default, {transitionName: 'example', transitionEnterTimeout: 500, transitionLeaveTimeout: 300}, React.createElement("section", {className: 'cr', key: 'main'}, React.createElement(_components_1.Menu, {route: state.route, position: state.position}), React.createElement(_components_1.Router, {state: state}), React.createElement(_components_1.Alert, {alert: state.alert}))));
+        return (React.createElement("section", {className: 'cr', key: 'main'}, React.createElement(_components_1.Menu, {route: state.route, position: state.position}), React.createElement(_components_1.Router, {state: state}), React.createElement(_components_1.Alert, {alert: state.alert})));
     };
     default_1.childContextTypes = {
         muiTheme: React.PropTypes.object,

lib/components/page/toolbar.js

@@ -17,9 +17,10 @@ var React = require('react');
 var react_redux_1 = require('react-redux');
 var Action = require('../../actions/actions');
 var material_ui_1 = require('material-ui');
+var editor_1 = require('../../atom/editor');
 var ProgressBar = function (_a) {
     var progress = _a.progress;
-    return React.createElement(material_ui_1.LinearProgress, {mode: 'determinate', value: progress, style: { height: '8px' }});
+    return React.createElement(material_ui_1.LinearProgress, {mode: 'determinate', value: progress, style: { height: '10px' }});
 };
 function taskProgress(current, max) {
     return (current / max) * 100;
@@ -37,13 +38,13 @@ var default_1 = (function (_super) {
         return (React.createElement("section", {className: 'cr-page-toolbar'}, React.createElement(ProgressBar, {progress: progress}), React.createElement(material_ui_1.Toolbar, null, React.createElement(material_ui_1.ToolbarGroup, {float: 'right'}, allComplete ?
             React.createElement(material_ui_1.RaisedButton, {label: 'Continue', primary: true, onTouchTap: callNextPage})
             :
-                React.createElement(material_ui_1.RaisedButton, {label: 'Run', secondary: true, onTouchTap: callRunTests})))));
+                React.createElement(material_ui_1.RaisedButton, {label: 'Save', secondary: true, onTouchTap: callRunTests})))));
     };
     default_1 = __decorate([
         react_redux_1.connect(null, function (dispatch, state) {
             return {
                 callNextPage: function () { return dispatch(Action.nextPage()); },
-                callRunTests: function () { return dispatch(Action.runTests()); },
+                callSave: function () { return editor_1.save(); },
                 toggleLog: function () { return dispatch(Action.toggleLog()); }
             };
         }), 

lib/components/router.js

@@ -0,0 +1,33 @@
+"use strict";
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var React = require('react');
+var _components_1 = require('./_components');
+var default_1 = (function (_super) {
+    __extends(default_1, _super);
+    function default_1() {
+        _super.apply(this, arguments);
+    }
+    default_1.prototype.chooseRoute = function (state) {
+        switch (state.route) {
+            case 'page':
+                return React.createElement(_components_1.Page, {page: state.page, tasks: state.tasks, taskPosition: state.taskPosition, hintPosition: state.hintPosition, editorActions: state.editorActions, runTests: state.runTests, log: state.log});
+            case 'progress':
+                return React.createElement(_components_1.Progress, {progress: state.progress, position: state.position});
+            case 'projects':
+                return React.createElement(_components_1.Projects, {tutorials: state.tutorials});
+            default:
+                throw 'Error: Route not found.';
+        }
+    };
+    default_1.prototype.render = function () {
+        var state = this.props.state;
+        return this.chooseRoute(state);
+    };
+    return default_1;
+}(React.Component));
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;

src/actions/actions.ts

@@ -38,6 +38,7 @@ export function logMessage(message: string): CR.Action {
   return { type: Type.LOG_MESSAGE, payload: { message }};
 }
 
+
 /* Page */
 export {setPage, nextPage} from './page-actions';
 

src/atom/editor.ts

@@ -16,6 +16,11 @@ export function setAtomGlobals() {
 
 let getEditorCount = 0;
 
+export function save() {
+  const editor = findEditor();
+  editor.save();
+}
+
 export function findEditor() {
   let editor = atom.workspace.getActiveTextEditor();
   if (!editor) {

src/components/_components.ts

@@ -5,7 +5,7 @@
 export {default as App} from './app/app';
 
 // Router
-export {default as Router} from './app/router';
+export {default as Router} from './router';
 
 // Components
 export {default as Page} from './page/page';

src/components/_index.less

@@ -1,14 +1,12 @@
-// root: ../styles/tut.less
+@import './app/_app';
 @import './menu/_menu';
 @import './page/_chapter';
 @import './page/_page';
 @import './progress/_progress';
 @import './alert/_alert';
 @import './projects/_projects';
-@import './app/app';
 
 #crv {
-  width: 400px;
   height: 100%;
   overflow: scroll;
 }

src/components/app/_app.less

@@ -0,0 +1,11 @@
+atom-panel-container > atom-panel > #crv {
+  animation: slide 0.3s forwards;
+  animation-timing-function: ease-in-out;
+}
+
+@keyframes slide {
+  0% { width: 0px; }
+}
+@keyframes slide {
+  100% { width: 400px; }
+}