r
/
p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull Requests Releases 1 Wiki Activity

added requested changes

This commit is contained in:
nik72619c 2019-03-26 21:30:43 +05:30
parent 0095e96c62
commit ec00f32a5b
3 changed files with 74 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
.env.example
View File

@ -1,22 +0,0 @@
API_URL=/api
AWS_ACCESS_KEY=<your-aws-access-key>
AWS_REGION=<your-aws-region>
AWS_SECRET_KEY=<your-aws-secret-key>
EMAIL_SENDER=<transactional-email-sender>
EMAIL_VERIFY_SECRET_TOKEN=whatever_you_want_this_to_be_it_only_matters_for_production
EXAMPLE_USER_EMAIL=examples@p5js.org
EXAMPLE_USER_PASSWORD=hellop5js
GG_EXAMPLES_EMAIL=benedikt.gross@generative-gestaltung.de
GG_EXAMPLES_PASS=generativedesign
GG_EXAMPLES_USERNAME=generative-design
GITHUB_ID=<your-github-client-id>
GITHUB_SECRET=<your-github-client-secret>
GOOGLE_ID=<your-google-client-id> (use google+ api)
GOOGLE_SECRET=<your-google-client-secret> (use google+ api)
MAILGUN_DOMAIN=<your-mailgun-domain>
MAILGUN_KEY=<your-mailgun-api-key>
MONGO_URL=mongodb://localhost:27017/p5js-web-editor
PORT=8000
S3_BUCKET=<your-s3-bucket>
S3_BUCKET_URL_BASE=<alt-for-s3-url>
SESSION_SECRET=whatever_you_want_this_to_be_it_only_matters_for_production

95
client/components/Nav.jsx
View File

@ -44,6 +44,17 @@ class Nav extends React.PureComponent {
this.handleStopAccessible = this.handleStopAccessible.bind(this); this.handleStopAccessible = this.handleStopAccessible.bind(this);
this.handleKeyboardShortcuts = this.handleKeyboardShortcuts.bind(this); this.handleKeyboardShortcuts = this.handleKeyboardShortcuts.bind(this);
this.handleLogout = this.handleLogout.bind(this); this.handleLogout = this.handleLogout.bind(this);
this.toggleDropdownForFile = this.toggleDropdown.bind(this, 'file');
this.handleFocusForFile = this.handleFocus.bind(this, 'file');
this.setDropdownForNone = this.setDropdown.bind(this, 'none');
this.toggleDropdownForEdit = this.toggleDropdown.bind(this, 'edit');
this.handleFocusForEdit = this.handleFocus.bind(this, 'edit');
this.toggleDropdownForSketch = this.toggleDropdown.bind(this, 'sketch');
this.handleFocusForSketch = this.handleFocus.bind(this, 'sketch');
this.toggleDropdownForHelp = this.toggleDropdown.bind(this, 'help');
this.handleFocusForHelp = this.handleFocus.bind(this, 'help');
this.toggleDropdownForAccount = this.toggleDropdown.bind(this, 'account');
this.handleFocusForAccount = this.handleFocus.bind(this, 'account');
} }
componentWillMount() { componentWillMount() {
@ -226,7 +237,7 @@ class Nav extends React.PureComponent {
</li> </li>
<li className={navDropdownState.file}> <li className={navDropdownState.file}>
<button <button
onClick={this.toggleDropdown.bind(this, 'file')} onClick={this.toggleDropdownForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onFocus={this.clearHideTimeout} onFocus={this.clearHideTimeout}
> >
@ -235,7 +246,7 @@ class Nav extends React.PureComponent {
</button> </button>
<ul className="nav__dropdown"> <ul className="nav__dropdown">
<button <button
onClick={this.toggleDropdown.bind(this, 'file')} onClick={this.toggleDropdownForFile}
className="nav__dropdown-heading" className="nav__dropdown-heading"
> >
<span>File</span> <span>File</span>
@ -244,7 +255,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleNew} onClick={this.handleNew}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
New New
@ -254,7 +265,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleSave} onClick={this.handleSave}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Save Save
@ -265,7 +276,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleDuplicate} onClick={this.handleDuplicate}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Duplicate Duplicate
@ -275,7 +286,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleShare} onClick={this.handleShare}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Share Share
@ -285,7 +296,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleDownload} onClick={this.handleDownload}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Download Download
@ -295,9 +306,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to={`/${this.props.user.username}/sketches`} to={`/${this.props.user.username}/sketches`}
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
Open Open
</Link> </Link>
@ -306,9 +317,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to="/p5/sketches" to="/p5/sketches"
onFocus={this.handleFocus.bind(this, 'file')} onFocus={this.handleFocusForFile}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
Examples Examples
</Link> </Link>
@ -317,7 +328,7 @@ class Nav extends React.PureComponent {
</li> </li>
<li className={navDropdownState.edit}> <li className={navDropdownState.edit}>
<button <button
onClick={this.toggleDropdown.bind(this, 'edit')} onClick={this.toggleDropdownForEdit}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onFocus={this.clearHideTimeout} onFocus={this.clearHideTimeout}
> >
@ -326,7 +337,7 @@ class Nav extends React.PureComponent {
</button> </button>
<ul className="nav__dropdown"> <ul className="nav__dropdown">
<button <button
onClick={this.toggleDropdown.bind(this, 'edit')} onClick={this.toggleDropdownForEdit}
className="nav__dropdown-heading" className="nav__dropdown-heading"
> >
<span>Edit</span> <span>Edit</span>
@ -338,7 +349,7 @@ class Nav extends React.PureComponent {
this.props.cmController.tidyCode(); this.props.cmController.tidyCode();
this.setDropdown('none'); this.setDropdown('none');
}} }}
onFocus={this.handleFocus.bind(this, 'edit')} onFocus={this.handleFocusForEdit}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Tidy Code Tidy Code
@ -348,7 +359,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleFind} onClick={this.handleFind}
onFocus={this.handleFocus.bind(this, 'edit')} onFocus={this.handleFocusForEdit}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Find Find
@ -358,7 +369,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleFindNext} onClick={this.handleFindNext}
onFocus={this.handleFocus.bind(this, 'edit')} onFocus={this.handleFocusForEdit}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Find Next Find Next
@ -368,7 +379,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleFindPrevious} onClick={this.handleFindPrevious}
onFocus={this.handleFocus.bind(this, 'edit')} onFocus={this.handleFocusForEdit}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Find Previous Find Previous
@ -379,7 +390,7 @@ class Nav extends React.PureComponent {
</li> </li>
<li className={navDropdownState.sketch}> <li className={navDropdownState.sketch}>
<button <button
onClick={this.toggleDropdown.bind(this, 'sketch')} onClick={this.toggleDropdownForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onFocus={this.clearHideTimeout} onFocus={this.clearHideTimeout}
> >
@ -388,7 +399,7 @@ class Nav extends React.PureComponent {
</button> </button>
<ul className="nav__dropdown"> <ul className="nav__dropdown">
<button <button
onClick={this.toggleDropdown.bind(this, 'sketch')} onClick={this.toggleDropdownForSketch}
className="nav__dropdown-heading" className="nav__dropdown-heading"
> >
<span>Sketch</span> <span>Sketch</span>
@ -397,7 +408,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleAddFile} onClick={this.handleAddFile}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Add File Add File
@ -406,7 +417,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleAddFolder} onClick={this.handleAddFolder}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Add Folder Add Folder
@ -415,7 +426,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleRun} onClick={this.handleRun}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Run Run
@ -425,7 +436,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleStop} onClick={this.handleStop}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Stop Stop
@ -435,7 +446,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleStartAccessible} onClick={this.handleStartAccessible}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Start Accessible Start Accessible
@ -445,7 +456,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleStopAccessible} onClick={this.handleStopAccessible}
onFocus={this.handleFocus.bind(this, 'sketch')} onFocus={this.handleFocusForSketch}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Stop Accessible Stop Accessible
@ -456,7 +467,7 @@ class Nav extends React.PureComponent {
</li> </li>
<li className={navDropdownState.help}> <li className={navDropdownState.help}>
<button <button
onClick={this.toggleDropdown.bind(this, 'help')} onClick={this.toggleDropdownForHelp}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onFocus={this.clearHideTimeout} onFocus={this.clearHideTimeout}
> >
@ -465,7 +476,7 @@ class Nav extends React.PureComponent {
</button> </button>
<ul className="nav__dropdown"> <ul className="nav__dropdown">
<button <button
onClick={this.toggleDropdown.bind(this, 'help')} onClick={this.toggleDropdownForHelp}
className="nav__dropdown-heading" className="nav__dropdown-heading"
> >
<span>Help & Feedback</span> <span>Help & Feedback</span>
@ -473,7 +484,7 @@ class Nav extends React.PureComponent {
</button> </button>
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onFocus={this.handleFocus.bind(this, 'help')} onFocus={this.handleFocusForHelp}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.handleKeyboardShortcuts} onClick={this.handleKeyboardShortcuts}
> >
@ -485,18 +496,18 @@ class Nav extends React.PureComponent {
href="https://p5js.org/reference/" href="https://p5js.org/reference/"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
onFocus={this.handleFocus.bind(this, 'help')} onFocus={this.handleFocusForHelp}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
>Reference >Reference
</a> </a>
</li> </li>
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to="/about" to="/about"
onFocus={this.handleFocus.bind(this, 'help')} onFocus={this.handleFocusForHelp}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
About About
</Link> </Link>
@ -504,9 +515,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to="/feedback" to="/feedback"
onFocus={this.handleFocus.bind(this, 'help')} onFocus={this.handleFocusForHelp}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
Feedback Feedback
</Link> </Link>
@ -533,7 +544,7 @@ class Nav extends React.PureComponent {
<li className={navDropdownState.account}> <li className={navDropdownState.account}>
<button <button
className="nav__item-header" className="nav__item-header"
onClick={this.toggleDropdown.bind(this, 'account')} onClick={this.toggleDropdownForAccount}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onFocus={this.clearHideTimeout} onFocus={this.clearHideTimeout}
> >
@ -551,9 +562,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to={`/${this.props.user.username}/sketches`} to={`/${this.props.user.username}/sketches`}
onFocus={this.handleFocus.bind(this, 'account')} onFocus={this.handleFocusForAccount}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
My sketches My sketches
</Link> </Link>
@ -561,9 +572,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to="/assets" to="/assets"
onFocus={this.handleFocus.bind(this, 'account')} onFocus={this.handleFocusForAccount}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
My assets My assets
</Link> </Link>
@ -571,9 +582,9 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<Link <Link
to="/account" to="/account"
onFocus={this.handleFocus.bind(this, 'account')} onFocus={this.handleFocusForAccount}
onBlur={this.handleBlur} onBlur={this.handleBlur}
onClick={this.setDropdown.bind(this, 'none')} onClick={this.setDropdownForNone}
> >
Settings Settings
</Link> </Link>
@ -581,7 +592,7 @@ class Nav extends React.PureComponent {
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
<button <button
onClick={this.handleLogout} onClick={this.handleLogout}
onFocus={this.handleFocus.bind(this, 'account')} onFocus={this.handleFocusForAccount}
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Log out Log out

28
package-lock.json generated
View File

@ -5099,11 +5099,13 @@
}, },
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true "bundled": true,
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -5116,15 +5118,18 @@
}, },
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true "bundled": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true "bundled": true,
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true "bundled": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -5227,7 +5232,8 @@
}, },
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true "bundled": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -5237,6 +5243,7 @@
"is-fullwidth-code-point": { "is-fullwidth-code-point": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -5249,17 +5256,20 @@
"minimatch": { "minimatch": {
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
}, },
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true "bundled": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -5276,6 +5286,7 @@
"mkdirp": { "mkdirp": {
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -5348,7 +5359,8 @@
}, },
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true "bundled": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -5358,6 +5370,7 @@
"once": { "once": {
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -5463,6 +5476,7 @@
"string-width": { "string-width": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",