Skip to content

Commit 644fb53

Browse files
ShMcKShMcK
committed
prepare core-coderoad merge
1 parent b39a124 commit 644fb53

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+959
-91
lines changed

‎lib/components/Config/index.js

Lines changed: 26 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,32 @@ var TutorialConfig = (function (_super) {
4646
function TutorialConfig() {
4747
_super.apply(this, arguments);
4848
}
49+
TutorialConfig.prototype.render = function () {
50+
var _a = this.props, submitting = _a.submitting, handleSubmit = _a.handleSubmit, invalid = _a.invalid, packageJson = _a.packageJson;
51+
return (React.createElement("section", {className: 'cr-page'},
52+
React.createElement(Card_1.Card, {style: styles.card},
53+
React.createElement(Card_1.CardTitle, {style: styles.title, title: 'Tutorial Configuration'}),
54+
React.createElement(Card_1.CardText, null,
55+
React.createElement("form", {style: styles.form, onSubmit: handleSubmit(this.onSubmit.bind(this))},
56+
React.createElement(redux_form_1.Field, {id: 'name', name: 'name', component: textField_1.default.bind(null, {
57+
floatingLabelText: 'Tutorial Name',
58+
hintText: 'coderoad-tutorial-name',
59+
}), tabIndex: '1'}),
60+
React.createElement(redux_form_1.Field, {name: 'runnerItem', component: selectField_1.default.bind(null, {
61+
children: runnerItems_1.default(),
62+
floatingLabelText: 'runner',
63+
id: 'runner',
64+
}), tabIndex: '2'}),
65+
React.createElement(redux_form_1.Field, {id: 'repo', name: 'repo', component: textField_1.default.bind(null, {
66+
floatingLabelText: 'Path to Repo (optional)',
67+
hintText: 'http://github.com/path/to/repo',
68+
type: 'url',
69+
}), tabIndex: '3'}),
70+
React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: submitting}),
71+
React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, disabled: invalid, onTouchTap: this.routeToPage.bind(this)}))
72+
))
73+
));
74+
};
4975
TutorialConfig.prototype.componentWillMount = function () {
5076
var _this = this;
5177
this.props.pjLoad();
@@ -94,32 +120,6 @@ var TutorialConfig = (function (_super) {
94120
this.props.tutorialInit();
95121
this.props.routeSet('page');
96122
};
97-
TutorialConfig.prototype.render = function () {
98-
var _a = this.props, submitting = _a.submitting, handleSubmit = _a.handleSubmit, invalid = _a.invalid, packageJson = _a.packageJson;
99-
return (React.createElement("section", {className: 'cr-page'},
100-
React.createElement(Card_1.Card, {style: styles.card},
101-
React.createElement(Card_1.CardTitle, {style: styles.title, title: 'Tutorial Configuration'}),
102-
React.createElement(Card_1.CardText, null,
103-
React.createElement("form", {style: styles.form, onSubmit: handleSubmit(this.onSubmit.bind(this))},
104-
React.createElement(redux_form_1.Field, {id: 'name', name: 'name', component: textField_1.default.bind(null, {
105-
floatingLabelText: 'Tutorial Name',
106-
hintText: 'coderoad-tutorial-name',
107-
}), tabIndex: '1'}),
108-
React.createElement(redux_form_1.Field, {name: 'runnerItem', component: selectField_1.default.bind(null, {
109-
children: runnerItems_1.default(),
110-
floatingLabelText: 'runner',
111-
id: 'runner',
112-
}), tabIndex: '2'}),
113-
React.createElement(redux_form_1.Field, {id: 'repo', name: 'repo', component: textField_1.default.bind(null, {
114-
floatingLabelText: 'Path to Repo (optional)',
115-
hintText: 'http://github.com/path/to/repo',
116-
type: 'url',
117-
}), tabIndex: '3'}),
118-
React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: submitting}),
119-
React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, disabled: invalid, onTouchTap: this.routeToPage.bind(this)}))
120-
))
121-
));
122-
};
123123
TutorialConfig = __decorate([
124124
react_redux_1.connect(function (state) { return ({
125125
packageJson: state.packageJson,

‎lib/components/common/Markdown/CodeBlock.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
"use strict";
2+
var React = require('react');
3+
var syntax_highlighter_1 = require('./syntax-highlighter');
4+
var CodeBlock = function (_a) {
5+
var style = _a.style, children = _a.children, lang = _a.lang;
6+
return (React.createElement("pre", null,
7+
React.createElement("code", {style: style ? style : null, dangerouslySetInnerHTML: { __html: syntax_highlighter_1.default(children, lang) }})
8+
));
9+
};
10+
Object.defineProperty(exports, "__esModule", { value: true });
11+
exports.default = CodeBlock;

‎lib/components/common/Markdown/CodeBlock.tsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import * as React from 'react';
2+
3+
import highlight from './syntax-highlighter';
4+
5+
const CodeBlock: React.StatelessComponent<{
6+
children?: string, style?: Object, lang: string
7+
}> = ({style, children, lang}) => (
8+
<pre>
9+
<code
10+
style={style ? style : null}
11+
dangerouslySetInnerHTML={
12+
{__html: highlight(children, lang)}
13+
}
14+
/>
15+
</pre>
16+
);
17+
export default CodeBlock;

‎lib/components/common/Markdown/formatText.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
"use strict";
2+
var marked = require('marked');
3+
var syntax_highlighter_1 = require('./syntax-highlighter');
4+
var options = {
5+
breaks: true,
6+
gfm: true,
7+
highlight: syntax_highlighter_1.default,
8+
tables: true,
9+
sanitize: true,
10+
smartLists: true,
11+
};
12+
function default_1(text) {
13+
return typeof text !== 'string' ? '' : marked(text.toString(), options);
14+
}
15+
Object.defineProperty(exports, "__esModule", { value: true });
16+
exports.default = default_1;

‎lib/components/common/Markdown/formatText.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import * as marked from 'marked';
2+
3+
import highlight from './syntax-highlighter';
4+
5+
const options = {
6+
breaks: true,
7+
gfm: true,
8+
highlight,
9+
tables: true,
10+
sanitize: true,
11+
smartLists: true,
12+
};
13+
14+
export default function (text: string): string {
15+
return typeof text !== 'string' ? '' : marked(text.toString(), options);
16+
}

‎lib/components/common/Markdown/index.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
"use strict";
2+
var React = require('react');
3+
var formatText_1 = require('./formatText');
4+
var Markdown = function (_a) {
5+
var style = _a.style, children = _a.children;
6+
return (React.createElement("span", {className: 'cr-markdown', style: style ? style : null, dangerouslySetInnerHTML: { __html: formatText_1.default(children) }}));
7+
};
8+
Object.defineProperty(exports, "__esModule", { value: true });
9+
exports.default = Markdown;

‎lib/components/common/Markdown/index.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import * as React from 'react';
2+
3+
import formatText from './formatText';
4+
5+
const Markdown: React.StatelessComponent<{
6+
children?: string, style?: Object
7+
}> = ({style, children}) => (
8+
<span
9+
className='cr-markdown'
10+
style={style ? style : null}
11+
dangerouslySetInnerHTML={
12+
{__html: formatText(children)}
13+
}
14+
/>
15+
);
16+
export default Markdown;

‎lib/components/common/Markdown/syntax-highlighter.ts

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
export default function highlight(text: string, lang: string): string {
2+
const scopeName = `source.${lang}`;
3+
// get grammar
4+
const grammar = atom.grammars.grammarForScopeName(scopeName);
5+
// no grammar, return text
6+
if (!grammar) {
7+
return text;
8+
}
9+
// get tokens
10+
const lineTokens = grammar.tokenizeLines(text);
11+
if (lineTokens.length > 0) {
12+
const lastLineTokens = lineTokens[lineTokens.length - 1];
13+
if (lastLineTokens.length === 1 && lastLineTokens[0].value === '') {
14+
lineTokens.pop();
15+
}
16+
}
17+
let html = '<pre class="editor editor-colors">';
18+
19+
lineTokens.forEach(line => {
20+
html += '<div class="line">';
21+
line.forEach(({value, scopes}) => {
22+
// account for spaces
23+
if (!value) {
24+
value = ' ';
25+
}
26+
// wrap text with class spans
27+
scopes.forEach(scope => {
28+
html += `<span class="${scope.replace(/\./g, ' ')}">`;
29+
});
30+
// text
31+
html += `${value}`;
32+
// closing tags
33+
scopes.forEach(scope => {
34+
html += '</span>';
35+
});
36+
});
37+
});
38+
html += '</div></pre>';
39+
return html;
40+
}

‎lib/components/common/TextEditor/index.tsx

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import * as React from 'react';
2+
3+
const styles = {
4+
editor: {
5+
textAlign: 'left',
6+
},
7+
};
8+
9+
export default class TextEditor extends React.Component<{
10+
name: string, text?: string, lang: string, onSave?: () => any,
11+
placeholder?: string,
12+
}, {}> {
13+
14+
// create a new TextEditor
15+
public ed = atom.workspace.buildTextEditor();
16+
public get(): string {
17+
return this.ed.getText();
18+
}
19+
public render() {
20+
return <div id={this.props.name} style={styles.editor} />;
21+
}
22+
private componentDidMount() {
23+
const {name, text, lang, placeholder} = this.props;
24+
// specify language
25+
this.ed.setGrammar(
26+
atom.grammars.grammarForScopeName(`source.${lang}`)
27+
);
28+
if (text) {
29+
this.ed.setText(text || '');
30+
}
31+
if (placeholder) {
32+
this.ed.setPlaceholderText(placeholder);
33+
}
34+
// append editor to rendered div
35+
document.querySelector(`#${name}`).appendChild(this.ed.getElement());
36+
}
37+
}

‎lib/components/index.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ exports.Markdown = core_coderoad_1.Markdown;
77
exports.TextEditor = core_coderoad_1.TextEditor;
88
var Page_1 = require('./Page');
99
exports.Page = Page_1.default;
10-
var Routes_1 = require('./Routes');
11-
exports.Routes = Routes_1.default;
1210
var Start_1 = require('./Start');
1311
exports.Start = Start_1.default;
1412
var Checks_1 = require('./Start/Checks');

‎package.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,10 @@
3434
"react-tap-event-plugin": "1.0.0",
3535
"redux": "3.5.2",
3636
"redux-form": "6.0.0-alpha.15",
37+
"redux-logger": "2.6.1",
38+
"redux-throttle-actions": "1.1.0",
39+
"redux-thunk": "2.1.0",
40+
"reselect": "2.5.3",
3741
"sort-package-json": "1.4.0"
3842
},
3943
"activationCommands": {

‎src/components/Config/index.tsx

Lines changed: 60 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -43,69 +43,10 @@ class TutorialConfig extends React.Component <{
4343
language?: string, invalid?: boolean, initialize?: any,
4444
editorPjOpen?: () => Redux.ActionCreator,
4545
}, {}> {
46-
private refs: {
46+
public refs: {
4747
[key: string]: (Element);
4848
name: HTMLInputElement;
4949
};
50-
private componentWillMount() {
51-
this.props.pjLoad();
52-
this.props.editorPjOpen();
53-
// get props after pjLoad completes
54-
setTimeout(() => {
55-
const {name, config, repository} = this.props.packageJson;
56-
this.props.initialize({
57-
name,
58-
runnerItem: config.language && config.runner ? `${config.language}: ${config.runner}` : null,
59-
repo: repository ? repository : '',
60-
});
61-
});
62-
}
63-
private componentDidMount() {
64-
topElement.toggle(false);
65-
// focus first element
66-
document.getElementsByTagName('input')[0].focus();
67-
}
68-
private shouldComponentUpdate() {
69-
// hack to prevent lost focus on component update
70-
const textInputIsActive = (
71-
document.activeElement &&
72-
typeof document.activeElement.value === 'string'
73-
);
74-
return this.props.submitting || !textInputIsActive;
75-
}
76-
private onSubmit(values) {
77-
const {packageJson} = this.props;
78-
const {name, runnerItem, repo} = values;
79-
const [language, runner] = runnerItem.split(': ');
80-
const dependencies = handleDeps(packageJson, runner);
81-
const repoObj = repo ? {
82-
repository: repo || '',
83-
bugs: {
84-
url: repo || '',
85-
},
86-
} : {};
87-
88-
// trigger submitted updates
89-
this.props.submitting = true;
90-
setTimeout(() => this.props.submitting = false, 300);
91-
92-
this.props.pjSave(Object.assign(
93-
{},
94-
packageJson,
95-
{
96-
name,
97-
dependencies,
98-
config: {
99-
language, runner,
100-
}
101-
},
102-
repoObj)
103-
);
104-
}
105-
private routeToPage() {
106-
this.props.tutorialInit();
107-
this.props.routeSet('page');
108-
}
10950
public render() {
11051
const {submitting, handleSubmit, invalid, packageJson} = this.props;
11152

@@ -174,6 +115,65 @@ class TutorialConfig extends React.Component <{
174115
</section>
175116
);
176117
}
118+
private componentWillMount() {
119+
this.props.pjLoad();
120+
this.props.editorPjOpen();
121+
// get props after pjLoad completes
122+
setTimeout(() => {
123+
const {name, config, repository} = this.props.packageJson;
124+
this.props.initialize({
125+
name,
126+
runnerItem: config.language && config.runner ? `${config.language}: ${config.runner}` : null,
127+
repo: repository ? repository : '',
128+
});
129+
});
130+
}
131+
private componentDidMount() {
132+
topElement.toggle(false);
133+
// focus first element
134+
document.getElementsByTagName('input')[0].focus();
135+
}
136+
private shouldComponentUpdate() {
137+
// hack to prevent lost focus on component update
138+
const textInputIsActive = (
139+
document.activeElement &&
140+
typeof document.activeElement.value === 'string'
141+
);
142+
return this.props.submitting || !textInputIsActive;
143+
}
144+
private onSubmit(values) {
145+
const {packageJson} = this.props;
146+
const {name, runnerItem, repo} = values;
147+
const [language, runner] = runnerItem.split(': ');
148+
const dependencies = handleDeps(packageJson, runner);
149+
const repoObj = repo ? {
150+
repository: repo || '',
151+
bugs: {
152+
url: repo || '',
153+
},
154+
} : {};
155+
156+
// trigger submitted updates
157+
this.props.submitting = true;
158+
setTimeout(() => this.props.submitting = false, 300);
159+
160+
this.props.pjSave(Object.assign(
161+
{},
162+
packageJson,
163+
{
164+
name,
165+
dependencies,
166+
config: {
167+
language, runner,
168+
}
169+
},
170+
repoObj)
171+
);
172+
}
173+
private routeToPage() {
174+
this.props.tutorialInit();
175+
this.props.routeSet('page');
176+
}
177177
}
178178

179179
export default reduxForm({

‎src/components/Config/validate.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
import * as debounce from 'lodash.debounce';
2-
31
import {tutorialConfigOptions} from 'core-coderoad';
42

53
interface ConfigForm {

0 commit comments

Comments
 (0)