scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-12-03 12:27:30 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Merge pull request #3196 from LLK/develop

Browse source 
Update release branch with latest changes.
This commit is contained in:
Karishma Chadha 2019-07-31 15:47:12 -04:00 committed by GitHub
commit 0d4ff800fb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 186 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
README.md
View file

@ -57,10 +57,10 @@ These currently exist in static/js/lib
### To Run
If you would like to create a temporary version of the site on your machine that you can access through your web browser run the command below. Building (see To Build above) is not necessary for this step and the temporary server can be turned off (see To Stop below).
The intl directory must be built separately with the `make translations` line below in order for the text to appear properly.
The intl directory must be built separately with the `npm run translate` line below in order for the text to appear properly.
```bash
make translations
npm run translate
npm start
```

12
package-lock.json generated
View file

@ -15084,15 +15084,15 @@
}
},
"scratch-gui": {
"version": "0.1.0-prerelease.20190725155313",
"resolved": "https://registry.npmjs.org/scratch-gui/-/scratch-gui-0.1.0-prerelease.20190725155313.tgz",
"integrity": "sha512-L2qJNu3HGi8KbuPxw/3DSa56eeqR2N67MA6SZ5r+at3UrwSH68dzqp7NDJqmAjm66+dX7IaiammZ0QE6fLbKUQ==",
"version": "0.1.0-prerelease.20190731192641",
"resolved": "https://registry.npmjs.org/scratch-gui/-/scratch-gui-0.1.0-prerelease.20190731192641.tgz",
"integrity": "sha512-f5fQKHt1LjJ5jBvtuFu1ULOwggs0g54FARVr1dz4oi98yL64jP6tlowORKoejX5P1sO9Awt1/26d6Gp+411L0A==",
"dev": true
},
"scratch-l10n": {
"version": "3.5.20190724182907",
"resolved": "https://registry.npmjs.org/scratch-l10n/-/scratch-l10n-3.5.20190724182907.tgz",
"integrity": "sha512-HEYsebVd53+eugt2N8OkWUYhnn/GEtAhH33dwUCIKAkzRJAwMmzcDUf1MyNzpAcGMH8Zr0K5QtyYH95bGfcpZA==",
"version": "3.5.20190731161310",
"resolved": "https://registry.npmjs.org/scratch-l10n/-/scratch-l10n-3.5.20190731161310.tgz",
"integrity": "sha512-9McnU3CVt8BdLP1rYmlb6IhJNFYdhcI6AaBs9dEH+C+dBJ2ncPg71nLt3Te4OE2v8L2JyKvVsWSTrffeEHLlfQ==",
"dev": true,
"requires": {
"@babel/cli": "^7.1.2",

2
package.json
View file

@ -120,7 +120,7 @@
"redux": "3.5.2",
"redux-thunk": "2.0.1",
"sass-loader": "6.0.6",
"scratch-gui": "0.1.0-prerelease.20190725155313",
"scratch-gui": "0.1.0-prerelease.20190731192641",
"scratch-l10n": "latest",
"selenium-webdriver": "3.6.0",
"slick-carousel": "1.6.0",

2
src/components/formik-forms/formik-select.jsx
View file

@ -24,7 +24,7 @@ const FormikSelect = ({
</option>
));
return (
<div className="select">
<div className="select row-with-tooltip">
<Field
className={classNames(
className

1
src/components/forms/validation-message.scss
View file

@ -17,6 +17,7 @@
min-height: 1rem;
overflow: visible;
color: $type-white;
z-index: 1;
&:before {
display: block;

8
src/components/join-flow/birthdate-step.jsx
View file

@ -86,9 +86,9 @@ class BirthDateStep extends React.Component {
} = props;
return (
<JoinFlowStep
description={this.props.intl.formatMessage({id: 'registration.birthDateStepDescription'})}
description={this.props.intl.formatMessage({id: 'registration.private'})}
headerImgSrc="/images/hoc/getting-started.jpg"
title={this.props.intl.formatMessage({id: 'general.joinScratch'})}
title={this.props.intl.formatMessage({id: 'registration.birthDateStepTitle'})}
waiting={isSubmitting}
onSubmit={handleSubmit}
>
@ -110,7 +110,7 @@ class BirthDateStep extends React.Component {
name="birth_month"
options={birthMonthOptions}
validate={this.validateSelect}
validationClassName="validation-full-width-input"
validationClassName="validation-birthdate-input"
/>
<FormikSelect
className={classNames(
@ -122,7 +122,7 @@ class BirthDateStep extends React.Component {
name="birth_year"
options={birthYearOptions}
validate={this.validateSelect}
validationClassName="validation-full-width-input"
validationClassName="validation-birthdate-input"
/>
</div>
</JoinFlowStep>

61
src/components/join-flow/email-step.jsx Normal file
View file

@ -0,0 +1,61 @@
const bindAll = require('lodash.bindall');
const React = require('react');
const PropTypes = require('prop-types');
import {Formik} from 'formik';
const {injectIntl, intlShape} = require('react-intl');
const JoinFlowStep = require('./join-flow-step.jsx');
require('./join-flow-steps.scss');
class EmailStep extends React.Component {
constructor (props) {
super(props);
bindAll(this, [
'handleValidSubmit',
'validateForm'
]);
}
validateForm () {
return {};
}
handleValidSubmit (formData, formikBag) {
formikBag.setSubmitting(false);
this.props.onNextStep(formData);
}
render () {
return (
<Formik
initialValues={{
}}
validate={this.validateForm}
validateOnBlur={false}
validateOnChange={false}
onSubmit={this.handleValidSubmit}
>
{props => {
const {
handleSubmit,
isSubmitting
} = props;
return (
<JoinFlowStep
description={this.props.intl.formatMessage({id: 'registration.emailStepDescription'})}
headerImgSrc="/images/hoc/getting-started.jpg"
title={this.props.intl.formatMessage({id: 'registration.emailStepTitle'})}
waiting={isSubmitting}
onSubmit={handleSubmit}
/>
);
}}
</Formik>
);
}
}
EmailStep.propTypes = {
intl: intlShape,
onNextStep: PropTypes.func
};
module.exports = injectIntl(EmailStep);

2
src/components/join-flow/join-flow-step.scss
View file

@ -9,6 +9,8 @@
.join-flow-description {
font-size: .875rem;
font-weight: bold;
line-height: 1.37500rem;
margin-top: 0.78125rem;
margin-bottom: 1.875rem;
text-align: center;
}

19
src/components/join-flow/join-flow-steps.scss
View file

@ -22,7 +22,24 @@
transform: translate(21.5625rem, 0);
}
select.join-flow-select {
.validation-birthdate-input {
transform: translate(8.75rem, .25rem);
width: 7.25rem;
}
@media #{$intermediate-and-smaller} {
.validation-full-width-input {
transform: unset;
margin-bottom: .75rem;
}
.validation-birthdate-input {
transform: unset;
width: 8rem;
}
}
.select .join-flow-select {
width: 9.125rem;
}

7
src/components/join-flow/join-flow.jsx
View file

@ -9,6 +9,8 @@ const intlShape = require('../../lib/intl.jsx').intlShape;
const Progression = require('../progression/progression.jsx');
const UsernameStep = require('./username-step.jsx');
const BirthDateStep = require('./birthdate-step.jsx');
const EmailStep = require('./email-step.jsx');
const WelcomeStep = require('./welcome-step.jsx');
/*
eslint-disable react/prefer-stateless-function, react/no-unused-prop-types, no-useless-constructor
@ -38,6 +40,11 @@ class JoinFlow extends React.Component {
<Progression step={this.state.step}>
<UsernameStep onNextStep={this.handleAdvanceStep} />
<BirthDateStep onNextStep={this.handleAdvanceStep} />
<EmailStep onNextStep={this.handleAdvanceStep} />
<WelcomeStep
username={this.state.formData.username}
onNextStep={this.handleAdvanceStep}
/>
</Progression>
</React.Fragment>
);

6
src/components/join-flow/username-step.jsx
View file

@ -110,7 +110,9 @@ class UsernameStep extends React.Component {
} = props;
return (
<JoinFlowStep
description={this.props.intl.formatMessage({id: 'registration.usernameStepDescription'})}
description={this.props.intl.formatMessage({
id: 'registration.usernameStepDescriptionNonEducator'
})}
title={this.props.intl.formatMessage({id: 'general.joinScratch'})}
waiting={isSubmitting}
onSubmit={handleSubmit}
@ -133,7 +135,7 @@ class UsernameStep extends React.Component {
/>
<div className="join-flow-password-section">
<div className="join-flow-input-title">
{this.props.intl.formatMessage({id: 'general.password'})}
{this.props.intl.formatMessage({id: 'registration.choosePasswordStepTitle'})}
</div>
<FormikInput
className={classNames(

67
src/components/join-flow/welcome-step.jsx Normal file
View file

@ -0,0 +1,67 @@
const bindAll = require('lodash.bindall');
const React = require('react');
const PropTypes = require('prop-types');
import {Formik} from 'formik';
const {injectIntl, intlShape} = require('react-intl');
const JoinFlowStep = require('./join-flow-step.jsx');
require('./join-flow-steps.scss');
class WelcomeStep extends React.Component {
constructor (props) {
super(props);
bindAll(this, [
'handleValidSubmit',
'validateForm'
]);
}
validateForm () {
return {};
}
handleValidSubmit (formData, formikBag) {
formikBag.setSubmitting(false);
this.props.onNextStep(formData);
}
render () {
return (
<Formik
initialValues={{
}}
validate={this.validateForm}
validateOnBlur={false}
validateOnChange={false}
onSubmit={this.handleValidSubmit}
>
{props => {
const {
handleSubmit,
isSubmitting
} = props;
return (
<JoinFlowStep
description={this.props.intl.formatMessage({
id: 'registration.welcomeStepDescriptionNonEducator'
})}
headerImgSrc="/images/hoc/getting-started.jpg"
title={`${this.props.intl.formatMessage(
{id: 'registration.welcomeStepTitleNonEducator'},
{username: this.props.username}
)}`}
waiting={isSubmitting}
onSubmit={handleSubmit}
/>
);
}}
</Formik>
);
}
}
WelcomeStep.propTypes = {
intl: intlShape,
onNextStep: PropTypes.func,
username: PropTypes.string
};
module.exports = injectIntl(WelcomeStep);

11
src/l10n.json
View file

@ -40,6 +40,7 @@
"general.learnMore": "Learn More",
"general.male": "Male",
"general.messages": "Messages",
"general.month": "Month",
"general.monthJanuary": "January",
"general.monthFebruary": "February",
"general.monthMarch": "March",
@ -110,6 +111,7 @@
"general.unsupportedBrowser": "This browser is not supported",
"general.unsupportedBrowserDescription": "We're very sorry, but Scratch 3.0 does not support Internet Explorer, Vivaldi, Opera or Silk. We recommend trying a newer browser such as Google Chrome, Mozilla Firefox, or Microsoft Edge.",
"general.3faq": "To learn more, go to the {faqLink}.",
"general.year": "Year",
"footer.discuss": "Discussion Forums",
"footer.scratchFamily": "Scratch Family",
@ -137,6 +139,7 @@
"parents.FaqResourcesQ": "What resources are available for learning Scratch?",
"parents.introDescription": "Scratch is a programming language and an online community where children can program and share interactive media such as stories, games, and animation with people from all over the world. As children create with Scratch, they learn to think creatively, work collaboratively, and reason systematically. Scratch is designed and maintained by the Lifelong Kindergarten group at the MIT Media Lab.",
"registration.birthDateStepTitle": "When were you born?",
"registration.checkOutResources": "Get Started with Resources",
"registration.checkOutResourcesDescription": "Explore materials for educators and facilitators written by the Scratch Team, including <a href='/educators#resources'>tips, tutorials, and guides</a>.",
"registration.choosePasswordStepDescription": "Type in a new password for your account. You will use this password the next time you log into Scratch.",
@ -148,7 +151,9 @@
"registration.classroomInviteNewStudentStepDescription": "Your teacher has invited you to join a class:",
"registration.confirmYourEmail": "Confirm Your Email",
"registration.confirmYourEmailDescription": "If you haven't already, please click the link in the confirmation email sent to:",
"registration.createUsername": "Create a Username",
"registration.createUsername": "Create a username",
"registration.emailStepTitle": "What's your email?",
"registration.emailStepDescription": "We need this to finish creating your account. Scratch will always keep this information private.",
"registration.goToClass": "Go to Class",
"registration.invitedBy": "invited by",
"registration.lastStepTitle": "Thank you for requesting a Scratch Teacher Account",
@ -161,10 +166,12 @@
"registration.optIn": "Send me updates on using Scratch in educational settings",
"registration.personalStepTitle": "Personal Information",
"registration.personalStepDescription": "Your individual responses will not be displayed publicly, and will be kept confidential and secure",
"registration.private": "Scratch will always keep this information private.",
"registration.selectCountry": "select country",
"registration.studentPersonalStepDescription": "This information will not appear on the Scratch website.",
"registration.showPassword": "Show password",
"registration.usernameStepDescription": "Fill in the following forms to request an account. The approval process may take up to one day.",
"registration.usernameStepDescriptionNonEducator": "Create projects, share ideas, make friends. It’s free!",
"registration.usernameStepRealName": "Please do not use any portion of your real name in your username.",
"registration.studentUsernameStepDescription": "You can make games, animations, and stories using Scratch. Setting up an account is easy and it's free. Fill in the form below to get started.",
"registration.studentUsernameStepHelpText": "Already have a Scratch account?",
@ -185,8 +192,10 @@
"registration.waitForApproval": "Wait for Approval",
"registration.waitForApprovalDescription": "You can log into your Scratch Account now, but the features specific to Teachers are not yet available. Your information is being reviewed. Please be patient, the approval process can take up to one day. You will receive an email indicating your account has been upgraded once your account has been approved.",
"registration.welcomeStepDescription": "You have successfully set up a Scratch account! You are now a member of the class:",
"registration.welcomeStepDescriptionNonEducator": "You’re now logged in! You can start exploring and creating projects.",
"registration.welcomeStepPrompt": "To get started, click on the button below.",
"registration.welcomeStepTitle": "Hurray! Welcome to Scratch!",
"registration.welcomeStepTitleNonEducator": "Welcome to Scratch, {username}!",
"thumbnail.by": "by",
"report.error": "Something went wrong when trying to send your message. Please try again.",

3
src/views/preview/comment/comment.jsx
View file

@ -196,11 +196,12 @@ class Comment extends React.Component {
*/}
<span className="comment-content">
{commentText.map(fragment => {
{commentText.map((fragment, index) => {
if (typeof fragment === 'string') {
return (
<EmojiText
as="span"
key={`comments-${id}-fragment-${index}`}
text={fragment}
/>
);