Skip to content

Commit 00ac235

Browse files
ShMcKShMcK
committed
app structure refactor
1 parent b7108e7 commit 00ac235

File tree

18 files changed

+141
-55
lines changed

18 files changed

+141
-55
lines changed

‎CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,6 @@ This project adheres to [Semantic Versioning](http://semver.org/).
2121
## [0.5.3] - 2016-03-07
2222
- fix tutorial progress issues
2323
- use `::>` to set cursor position
24+
25+
## [0.5.4] - 2016-03
26+
- fix bug that prevented scroll in Atom 1.6+

‎lib/atom/subscriptions.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ function onActivateSubscriptions() {
2525
}
2626
exports.onActivateSubscriptions = onActivateSubscriptions;
2727
function onDeactivateSubscriptionsAndUnmount() {
28+
window.onresize = null;
2829
render_1.unmount(document.getElementById('crv'));
2930
subscriptions.dispose();
3031
}

‎lib/components/_components.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
"use strict";
2-
var app_1 = require('./app/app');
2+
var app_1 = require('./app');
33
exports.App = app_1.default;
4-
var router_1 = require('./app/router');
5-
exports.Router = router_1.default;
4+
var theme_1 = require('./theme/theme');
5+
exports.Theme = theme_1.default;
6+
var routes_1 = require('./routes/routes');
7+
exports.Routes = routes_1.default;
68
var page_1 = require('./page/page');
79
exports.Page = page_1.default;
810
var chapter_1 = require('./page/chapter');

‎lib/components/app.js

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
8+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
9+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
10+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
11+
return c > 3 && r && Object.defineProperty(target, key, r), r;
12+
};
13+
var __metadata = (this && this.__metadata) || function (k, v) {
14+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
15+
};
16+
var React = require('react');
17+
var react_redux_1 = require('react-redux');
18+
var _components_1 = require('./_components');
19+
var ThemeDecorator = require('material-ui/lib/styles/theme-decorator');
20+
var ThemeManager = require('material-ui/lib/styles/theme-manager');
21+
var height = atom.getSize().height;
22+
window.onresize = function () {
23+
height = atom.getSize().height;
24+
};
25+
var default_1 = (function (_super) {
26+
__extends(default_1, _super);
27+
function default_1() {
28+
_super.apply(this, arguments);
29+
}
30+
default_1.prototype.render = function () {
31+
var state = this.props.state;
32+
return (React.createElement("section", {className: 'cr', key: 'main', style: { height: height }}, React.createElement(_components_1.Menu, {route: state.route, position: state.position}), React.createElement(_components_1.Routes, {state: state, ref: 'route'}), React.createElement(_components_1.Alert, {alert: state.alert})));
33+
};
34+
default_1 = __decorate([
35+
ThemeDecorator(ThemeManager.getMuiTheme(_components_1.Theme)),
36+
react_redux_1.connect(function (state) {
37+
return { state: state };
38+
}),
39+
__metadata('design:paramtypes', [])
40+
], default_1);
41+
return default_1;
42+
}(React.Component));
43+
Object.defineProperty(exports, "__esModule", { value: true });
44+
exports.default = default_1;
45+
;

‎lib/components/render.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ var React = require('react');
33
var ReactDOM = require('react-dom');
44
var react_redux_1 = require('react-redux');
55
var _base_1 = require('../_base');
6-
var app_1 = require('./app/app');
6+
var app_1 = require('./app');
77
require('./remove-later');
88
var rootName = 'crv';
99
function render(target) {

‎lib/components/routes/routes.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var React = require('react');
8+
var _components_1 = require('../_components');
9+
var default_1 = (function (_super) {
10+
__extends(default_1, _super);
11+
function default_1() {
12+
_super.apply(this, arguments);
13+
}
14+
default_1.prototype.chooseRoute = function (state) {
15+
switch (state.route) {
16+
case 'page':
17+
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});
18+
case 'progress':
19+
return React.createElement(_components_1.Progress, {progress: state.progress, position: state.position});
20+
case 'projects':
21+
return React.createElement(_components_1.Start, {tutorials: state.tutorials, warning: state.warning});
22+
case 'final':
23+
return React.createElement(_components_1.FinalPage, null);
24+
default:
25+
throw 'Error: Route not found.';
26+
}
27+
};
28+
default_1.prototype.render = function () {
29+
var state = this.props.state;
30+
return (React.createElement("div", null, this.chooseRoute(state)));
31+
};
32+
return default_1;
33+
}(React.Component));
34+
Object.defineProperty(exports, "__esModule", { value: true });
35+
exports.default = default_1;

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
},
5656
"scripts": {
5757
"test": "ava",
58-
"styles": "lessc src/components/_index.less styles/styles.css",
58+
"styles": "lessc src/components/_app.less styles/styles.css",
5959
"compile": "tsc",
6060
"build": "npm run styles && npm run compile"
6161
}

‎src/atom/subscriptions.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ export function onActivateSubscriptions() {
4141
export function onDeactivateSubscriptionsAndUnmount() {
4242
// unmount React
4343
// TODO: animate close first
44+
window.onresize = null;
4445
unmount(document.getElementById('crv'));
4546
// cleanup subscriptions
4647
subscriptions.dispose();

‎src/components/_index.less renamed to ‎src/components/_app.less

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,30 @@
1-
@import './app/_app';
2-
@import './app/_route';
1+
@import './routes/_routes';
32
@import './menu/_menu';
43
@import './page/_chapter';
54
@import './page/_page';
65
@import './progress/_progress';
76
@import './alert/_alert';
87
@import './start/_start';
98

9+
atom-panel-container > atom-panel > #crv {
10+
animation: slide 0.3s forwards;
11+
animation-timing-function: ease-in-out;
12+
}
13+
14+
@keyframes slide {
15+
0% { width: 0px; }
16+
}
17+
@keyframes slide {
18+
100% { width: 400px; }
19+
}
20+
1021
#crv {
1122
position: relative;
1223
overflow-y: scroll;
24+
25+
code {
26+
background-color: rgb(22, 23, 25);
27+
}
1328
}
1429

1530
#crv a, #crv a:hover, #crv a:visited {

‎src/components/_components.ts

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1-
/**
2-
* Component List
3-
*/
41
// Root App
5-
export {default as App} from './app/app';
2+
export {default as App} from './app';
3+
export {default as Theme} from './theme/theme';
64

75
// Router
8-
export {default as Router} from './app/router';
6+
export {default as Routes} from './routes/routes';
97

108
// Components
119
export {default as Page} from './page/page';

‎src/components/app/app.tsx renamed to ‎src/components/app.tsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
import * as React from 'react';
22
import {connect} from 'react-redux';
3-
import {Menu, Router, Alert} from '../_components';
3+
import {Menu, Routes, Alert, Theme} from './_components';
44
import * as ThemeDecorator from 'material-ui/lib/styles/theme-decorator';
55
import * as ThemeManager from 'material-ui/lib/styles/theme-manager';
6-
import Theme from '../theme/theme';
6+
7+
let height: number = atom.getSize().height;
8+
window.onresize = function() {
9+
height = atom.getSize().height;
10+
}
711

812
@ThemeDecorator(ThemeManager.getMuiTheme(Theme))
913
@connect((state: CR.State) => {
@@ -12,11 +16,10 @@ import Theme from '../theme/theme';
1216
export default class extends React.Component<{state?: CR.State}, {}> {
1317
render(): React.ReactElement<{}> {
1418
const state = this.props.state;
15-
const height = atom.getCurrentWindow().getBounds().height;
1619
return (
1720
<section className='cr' key='main' style={{height}}>
1821
<Menu route={state.route} position={state.position} />
19-
<Router state={state} ref='route' />
22+
<Routes state={state} ref='route' />
2023
<Alert alert={state.alert} />
2124
</section>
2225

‎src/components/app/_app.less

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎src/components/render.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
44
import {Provider} from 'react-redux';
55
import * as Action from '../actions/actions';
66
import {store} from '../_base';
7-
import App from './app/app';
7+
import App from './app';
88
import './remove-later';
99

1010
const rootName = 'crv';

‎src/components/app/_route.less renamed to ‎src/components/routes/_routes.less

File renamed without changes.

‎src/components/app/router.tsx renamed to ‎src/components/routes/routes.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import {Page, Progress, Start, FinalPage} from './../_components';
2+
import {Page, Progress, Start, FinalPage} from '../_components';
33

44
export default class extends React.Component<{state: CR.State}, {}> {
55
chooseRoute(state: CR.State) {

‎src/typings/atom/atom.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1245,7 +1245,6 @@ declare module AtomCore {
12451245
loadOrCreate(mode: 'spec'): IAtom;
12461246
/* Load or create the Atom environment in the given mode */
12471247
loadOrCreate(mode: string): IAtom;
1248-
12491248
loadState(mode: any): void;
12501249
getStatePath(mode: any): string;
12511250
getConfigDirPath(): string;
@@ -1302,6 +1301,7 @@ declare module AtomCore {
13021301
// registerRepresentationClasses:Function;
13031302
setBodyPlatformClass: Function;
13041303
getCurrentWindow(): IBrowserWindow;
1304+
getSize(): {height: number, width: number};
13051305
getWindowDimensions: Function;
13061306
setWindowDimensions: Function;
13071307
restoreWindowDimensions: Function;

‎styles/styles.css

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,3 @@
1-
atom-panel-container > atom-panel > #crv {
2-
animation: slide 0.3s forwards;
3-
animation-timing-function: ease-in-out;
4-
}
5-
@keyframes slide {
6-
0% {
7-
width: 0px;
8-
}
9-
}
10-
@keyframes slide {
11-
100% {
12-
width: 400px;
13-
}
14-
}
15-
#crv code {
16-
background-color: #161719;
17-
}
181
.route-enter {
192
opacity: 0.01;
203
}
@@ -157,10 +140,27 @@ atom-panel-container > atom-panel > #crv {
157140
.cr-tutorials {
158141
padding: 10px;
159142
}
143+
atom-panel-container > atom-panel > #crv {
144+
animation: slide 0.3s forwards;
145+
animation-timing-function: ease-in-out;
146+
}
147+
@keyframes slide {
148+
0% {
149+
width: 0px;
150+
}
151+
}
152+
@keyframes slide {
153+
100% {
154+
width: 400px;
155+
}
156+
}
160157
#crv {
161158
position: relative;
162159
overflow-y: scroll;
163160
}
161+
#crv code {
162+
background-color: #161719;
163+
}
164164
#crv a,
165165
#crv a:hover,
166166
#crv a:visited {

‎tsconfig.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,8 +101,7 @@
101101
"src/components/account/login.tsx",
102102
"src/components/account/signup.tsx",
103103
"src/components/alert/alert.tsx",
104-
"src/components/app/app.tsx",
105-
"src/components/app/router.tsx",
104+
"src/components/app.tsx",
106105
"src/components/final-page/final-page.tsx",
107106
"src/components/markdown/markdown.tsx",
108107
"src/components/menu/menu.tsx",
@@ -117,6 +116,7 @@
117116
"src/components/page/toolbar.tsx",
118117
"src/components/progress/progress.tsx",
119118
"src/components/render.tsx",
119+
"src/components/routes/routes.tsx",
120120
"src/components/start/setup.tsx",
121121
"src/components/start/start.tsx",
122122
"src/components/start/tutorials.tsx"

0 commit comments

Comments
 (0)