Skip to content

Commit 05c4373

Browse files
Merge pull request #3 from processing/develop
updating the fork
2 parents a342f72 + 8ee9b6f commit 05c4373

File tree

15 files changed

+154
-40
lines changed

15 files changed

+154
-40
lines changed

client/modules/IDE/actions/uploader.js

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -77,9 +77,6 @@ export function dropzoneSendingCallback(file, xhr, formData) {
7777
Object.keys(file.postData).forEach((key) => {
7878
formData.append(key, file.postData[key]);
7979
});
80-
formData.append('Content-type', file.type);
81-
formData.append('Content-length', '');
82-
formData.append('acl', 'public-read');
8380
}
8481
};
8582
}

client/modules/IDE/components/CollectionList/CollectionList.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ class CollectionList extends React.Component {
140140
{this._renderLoader()}
141141
{this._renderEmptyTable()}
142142
{this.hasCollections() &&
143-
<table className="sketches-table" summary="table containing all collections">
143+
<table className="sketches-table" summary={this.props.t('CollectionList.TableSummary')}>
144144
<thead>
145145
<tr>
146146
{this._renderFieldHeader('name', this.props.t('CollectionList.HeaderName'))}

client/modules/IDE/components/NewFileModal.jsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,23 @@ class NewFileModal extends React.Component {
2020
constructor(props) {
2121
super(props);
2222
this.focusOnModal = this.focusOnModal.bind(this);
23+
this.handleOutsideClick = this.handleOutsideClick.bind(this);
2324
}
2425

2526
componentDidMount() {
2627
this.focusOnModal();
28+
document.addEventListener('click', this.handleOutsideClick, false);
29+
}
30+
31+
componentWillUnmount() {
32+
document.removeEventListener('click', this.handleOutsideClick, false);
33+
}
34+
35+
handleOutsideClick(e) {
36+
// ignore clicks on the component itself
37+
if (e.path.includes(this.modal)) return;
38+
39+
this.props.closeNewFileModal();
2740
}
2841

2942
focusOnModal() {

client/modules/IDE/components/NewFolderModal.jsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,25 @@ import NewFolderForm from './NewFolderForm';
88
import ExitIcon from '../../../images/exit.svg';
99

1010
class NewFolderModal extends React.Component {
11+
constructor(props) {
12+
super(props);
13+
this.handleOutsideClick = this.handleOutsideClick.bind(this);
14+
}
15+
1116
componentDidMount() {
1217
this.newFolderModal.focus();
18+
document.addEventListener('click', this.handleOutsideClick, false);
19+
}
20+
21+
componentWillUnmount() {
22+
document.removeEventListener('click', this.handleOutsideClick, false);
23+
}
24+
25+
handleOutsideClick(e) {
26+
// ignore clicks on the component itself
27+
if (e.path.includes(this.newFolderModal)) return;
28+
29+
this.props.closeModal();
1330
}
1431

1532
render() {

client/modules/IDE/components/SketchList.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -433,7 +433,7 @@ class SketchList extends React.Component {
433433
{this._renderLoader()}
434434
{this._renderEmptyTable()}
435435
{this.hasSketches() &&
436-
<table className="sketches-table" summary="table containing all saved projects">
436+
<table className="sketches-table" summary={this.props.t('SketchList.TableSummary')}>
437437
<thead>
438438
<tr>
439439
{this._renderFieldHeader('name', this.props.t('SketchList.HeaderName'))}

client/modules/IDE/components/Toolbar.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ class Toolbar extends React.Component {
156156
if (this.props.owner) {
157157
return (
158158
<p className="toolbar__project-owner">
159-
by <Link to={`/${this.props.owner.username}/sketches`}>{this.props.owner.username}</Link>
159+
{this.props.t('Toolbar.By')} <Link to={`/${this.props.owner.username}/sketches`}>{this.props.owner.username}</Link>
160160
</p>
161161
);
162162
}

client/modules/IDE/reducers/ide.js

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,11 @@ const ide = (state = initialState, action) => {
4040
case ActionTypes.CONSOLE_EVENT:
4141
return Object.assign({}, state, { consoleEvent: action.event });
4242
case ActionTypes.SHOW_MODAL:
43-
return Object.assign({}, state, { modalIsVisible: true, parentId: action.parentId });
43+
return Object.assign({}, state, {
44+
modalIsVisible: true,
45+
parentId: action.parentId,
46+
newFolderModalVisible: false
47+
});
4448
case ActionTypes.HIDE_MODAL:
4549
return Object.assign({}, state, { modalIsVisible: false });
4650
case ActionTypes.COLLAPSE_SIDEBAR:
@@ -62,7 +66,11 @@ const ide = (state = initialState, action) => {
6266
case ActionTypes.CLOSE_PROJECT_OPTIONS:
6367
return Object.assign({}, state, { projectOptionsVisible: false });
6468
case ActionTypes.SHOW_NEW_FOLDER_MODAL:
65-
return Object.assign({}, state, { newFolderModalVisible: true, parentId: action.parentId });
69+
return Object.assign({}, state, {
70+
newFolderModalVisible: true,
71+
parentId: action.parentId,
72+
modalIsVisible: false
73+
});
6674
case ActionTypes.CLOSE_NEW_FOLDER_MODAL:
6775
return Object.assign({}, state, { newFolderModalVisible: false });
6876
case ActionTypes.SHOW_SHARE_MODAL:

client/modules/User/components/Collection.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -371,7 +371,7 @@ class Collection extends React.Component {
371371
<div className="collection-table-wrapper">
372372
{this._renderEmptyTable()}
373373
{this.hasCollectionItems() &&
374-
<table className="sketches-table" summary="table containing all collections">
374+
<table className="sketches-table" summary={this.props.t('Collection.TableSummary')}>
375375
<thead>
376376
<tr>
377377
{this._renderFieldHeader('name', this.props.t('Collection.HeaderName'))}

developer_docs/README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ This folder contains documents intended for developers of the p5.js Web Editor.
66
* [Development](development.md) - A guide for adding code to the web editor
77
* [Preparing a pull-request](preparing_a_pull_request.md) - Instructions for how to make a pull-request
88
* [Accessibility Guidelines](accessibility.md) - Guidelines for writing code to create an accessible application
9+
* [Translations Guidelines](translations.md) - Guidelines for translating the application
910
* [Deployment](deployment.md) - A guide to production deployment, and all platforms that are being used.
1011
* [Release](./release.md) - A guide to creating a production release.
1112

developer_docs/translations.md

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
# Translations Guidelines
2+
3+
4+
*How to contribute with Translations for p5 web editor*
5+
6+
## General rules of thumb for translations
7+
8+
In order to simplify the translations process the following rules of thumb were used:
9+
10+
## Technical Part
11+
12+
* There is only one file to translate all the texts in any specific language, which is located under the directory, in respective locale [subdirectory](https://github.com/processing/p5.js-web-editor/tree/develop/translations/locales)
13+
* The new language code must be added to [client/i18n.js](https://github.com/processing/p5.js-web-editor/blob/develop/client/i18n.js#L7)
14+
* New languages will need to be selected using a dropdown in Nav component, specifically in function [renderLanguageMenu.](https://github.com/processing/p5.js-web-editor/blob/develop/client/components/Nav.jsx#L550)
15+
16+
## Translations
17+
18+
* Every component should introduce its own subset of keys inside a dictionary named after the component.
19+
For instance: If you want to translate AssetList.jsx you need to introduce the following namespace in translations.json :
20+
```json
21+
"AssetList": {
22+
"Title": "p5.js Web Editor | My assets",
23+
"ToggleOpenCloseARIA": "Toggle Open/Close Asset Options",
24+
"OpenNewTab": "Open in New Tab",
25+
"HeaderName": "Name",
26+
}
27+
```
28+
* There are common texts that are present with `Common` prefix, try to check first if the exact label is already present there.
29+
* Every key follows PascalCase case style.
30+
* Every key that is used in an ARIA text should end with the suffix `ARIA`.
31+
* The order of keys inside of appearance should be order of in the order they appear in the source code
32+
33+
## Language Use
34+
35+
The Processing Foundation is specifically invested in expanding the communities of technology and the arts to include and support those who have not had equal access because of their race, gender, class, sexuality, and/or disability. We see software as a medium, something that connects two things. We view it as a means for thinking and making. We believe software, and the tools to learn it, should be accessible to everyone
36+
37+
With those principles in mind, we want to strongly suggest the use of non-gendered terms whenever possible. If it is not possible to avoid, use the most inclusive version.
38+
For instance, in Spanish translation we tackled that problem with a particular rule of thumb:
39+
Avoid male-gendered words, use instead the letter ‘e’ , we used the ‘e’ approach vs other approaches like ‘x’ or ‘@’ because you also need to think about how screen readers would read the text aloud.
40+
41+
## Background
42+
43+
Did you want to know the context?
44+
* The original idea for Alpha Editor in Spanish was addressed in [this issue](https://github.com/processing/p5.js-web-editor/issues/595)
45+
* The discussion regarding which library to use was addressed in [Library](https://github.com/processing/p5.js-web-editor/issues/1447)
46+
* [UI Design](https://github.com/processing/p5.js-web-editor/issues/1434)
47+
* [Language Use](https://github.com/processing/p5.js-web-editor/issues/1509)
48+
49+
50+
51+
Thanks!
52+
53+
P5.js Web Editor Community
54+

package-lock.json

Lines changed: 26 additions & 5 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "p5.js-web-editor",
3-
"version": "1.0.7",
3+
"version": "1.0.8",
44
"description": "The web editor for p5.js.",
55
"scripts": {
66
"clean": "rimraf dist",
@@ -215,7 +215,7 @@
215215
"request": "^2.88.2",
216216
"request-promise": "^4.2.5",
217217
"reselect": "^4.0.0",
218-
"s3-policy": "^0.2.0",
218+
"s3-policy-v4": "0.0.3",
219219
"sass-extract": "^2.1.0",
220220
"sass-extract-js": "^0.4.0",
221221
"sass-extract-loader": "^1.1.0",

server/controllers/aws.controller.js

Lines changed: 17 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
import uuid from 'node-uuid';
2-
import policy from 's3-policy';
2+
import S3Policy from 's3-policy-v4';
33
import s3 from '@auth0/s3';
4+
import mongoose from 'mongoose';
45
import { getProjectsForUserId } from './project.controller';
56
import { findUserByUsername } from './user.controller';
67

8+
const { ObjectId } = mongoose.Types;
9+
710
const client = s3.createClient({
811
maxAsyncS3: 20,
912
s3RetryCount: 3,
@@ -18,7 +21,7 @@ const client = s3.createClient({
1821
});
1922

2023
const s3Bucket = process.env.S3_BUCKET_URL_BASE ||
21-
`https://s3-${process.env.AWS_REGION}.amazonaws.com/${process.env.S3_BUCKET}/`;
24+
`https://s3-${process.env.AWS_REGION}.amazonaws.com/${process.env.S3_BUCKET}/`;
2225

2326
function getExtension(filename) {
2427
const i = filename.lastIndexOf('.');
@@ -27,14 +30,10 @@ function getExtension(filename) {
2730

2831
export function getObjectKey(url) {
2932
const urlArray = url.split('/');
30-
let objectKey;
31-
if (urlArray.length === 5) {
32-
const key = urlArray.pop();
33-
const userId = urlArray.pop();
34-
objectKey = `${userId}/${key}`;
35-
} else {
36-
const key = urlArray.pop();
37-
objectKey = key;
33+
const objectKey = urlArray.pop();
34+
const userId = urlArray.pop();
35+
if (ObjectId.isValid(userId) && userId === new ObjectId(userId).toString()) {
36+
return `${userId}/${objectKey}`;
3837
}
3938
return objectKey;
4039
}
@@ -81,21 +80,17 @@ export function signS3(req, res) {
8180
const fileExtension = getExtension(req.body.name);
8281
const filename = uuid.v4() + fileExtension;
8382
const acl = 'public-read';
84-
const p = policy({
83+
const policy = S3Policy.generate({
8584
acl,
86-
secret: process.env.AWS_SECRET_KEY,
87-
length: 5000000, // in bytes?
85+
key: `${req.body.userId}/${filename}`,
8886
bucket: process.env.S3_BUCKET,
89-
key: filename,
90-
expires: new Date(Date.now() + 60000),
87+
contentType: req.body.type,
88+
region: process.env.AWS_REGION,
89+
accessKey: process.env.AWS_ACCESS_KEY,
90+
secretKey: process.env.AWS_SECRET_KEY,
91+
metadata: []
9192
});
92-
const result = {
93-
AWSAccessKeyId: process.env.AWS_ACCESS_KEY,
94-
key: `${req.body.userId}/${filename}`,
95-
policy: p.policy,
96-
signature: p.signature
97-
};
98-
res.json(result);
93+
res.json(policy);
9994
}
10095

10196
export function copyObjectInS3(url, userId) {

translations/locales/en-US/translations.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,8 @@
9999
"PlayOnlyVisualSketchARIA": "Play only visual sketch",
100100
"StopSketchARIA": "Stop sketch",
101101
"EditSketchARIA": "Edit sketch name",
102-
"NewSketchNameARIA": "New sketch name"
102+
"NewSketchNameARIA": "New sketch name",
103+
"By": " by "
103104
},
104105
"Console": {
105106
"Title": "Console",
@@ -407,6 +408,7 @@
407408
"NumSketches_plural": "{{count}} sketches",
408409
"By":"Collection by ",
409410
"NoSketches": "No sketches in collection",
411+
"TableSummary": "table containing all collections",
410412
"HeaderName": "Name",
411413
"HeaderCreatedAt": "Date Added",
412414
"HeaderUser": "Owner",
@@ -445,6 +447,7 @@
445447
"Title": "p5.js Web Editor | My collections",
446448
"AnothersTitle": "p5.js Web Editor | {{anotheruser}}'s collections",
447449
"NoCollections": "No collections.",
450+
"TableSummary": "table containing all collections",
448451
"HeaderName": "Name",
449452
"HeaderCreatedAt": "Date Created",
450453
"HeaderCreatedAt_mobile": "Created",
@@ -487,6 +490,7 @@
487490
"ButtonLabelAscendingARIA": "Sort by {{displayName}} ascending.",
488491
"ButtonLabelDescendingARIA": "Sort by {{displayName}} descending.",
489492
"AddToCollectionOverlayTitle": "Add to collection",
493+
"TableSummary": "table containing all saved projects",
490494
"HeaderName": "Sketch",
491495
"HeaderCreatedAt": "Date Created",
492496
"HeaderCreatedAt_mobile": "Created",

translations/locales/es-419/translations.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,8 @@
9999
"PlayOnlyVisualSketchARIA": "Ejecutar bosquejo visual",
100100
"StopSketchARIA": "Detener bosquejo",
101101
"EditSketchARIA": "Editar nombre de bosquejo",
102-
"NewSketchNameARIA": "Nuevo nombre de bosquejo"
102+
"NewSketchNameARIA": "Nuevo nombre de bosquejo",
103+
"By": " de "
103104
},
104105
"Console": {
105106
"Title": "Consola",
@@ -407,6 +408,7 @@
407408
"NumSketches_plural": "{{count}} bosquejos",
408409
"By":"Colección por ",
409410
"NoSketches": "No hay bosquejos en la colección",
411+
"TableSummary": "tabla que contiene todas las colecciones",
410412
"HeaderName": "Nombre",
411413
"HeaderCreatedAt": "Fecha de agregación",
412414
"HeaderUser": "Propietario",
@@ -445,6 +447,7 @@
445447
"Title": "p5.js Web Editor | Mis colecciones",
446448
"AnothersTitle": "Editor Web p5.js | Colecciones de {{anotheruser}}",
447449
"NoCollections": "No hay colecciones.",
450+
"TableSummary": "la tabla contiene todas las colecciones",
448451
"HeaderName": "Nombre",
449452
"HeaderCreatedAt": "Fecha Creación",
450453
"HeaderCreatedAt_mobile": "Creación",
@@ -487,6 +490,7 @@
487490
"ButtonLabelAscendingARIA": "Ordenar por {{displayName}} ascendente.",
488491
"ButtonLabelDescendingARIA": "Ordenar por {{displayName}} descendente.",
489492
"AddToCollectionOverlayTitle": "Agregar a colección",
493+
"TableSummary": "la tabla contiene todos los proyectos guardados",
490494
"HeaderName": "Bosquejo",
491495
"HeaderCreatedAt": "Fecha Creación",
492496
"HeaderCreatedAt_mobile": "Creación",

0 commit comments

Comments
 (0)