Skip to content

GitLab

S
scratch-www
Commit e8197e4f authored by Chris Garrity's avatar Chris Garrity
Browse files
Options

Address review comments 

* With Carl decided to put the sidebar back even with just one item. It’s still one we want to emphasize.
* made sure the freshdesk js file would not block loading the form (it doesn’t appear to be needed for the form, it’s probably mainly for the pop-up version)
* moved the query processing into a constructor (more idomatic react)
* expanded the form so it should not need to scroll - also noted that in incognito mode a captcha is shown, so created enough space for that to be visible.
parent ee09ba59
Hide whitespace changes
Inline Side-by-side
Showing with 77 additions and 58 deletions
src/components/helpform/helpform.jsx
View file @ e8197e4f
......@@ -14,6 +14,8 @@ const HelpForm = props => {
return (
<div>
<script
async
defer
src="https://s3.amazonaws.com/assets.freshdesk.com/widget/freshwidget.js"
type="text/javascript"
/>
......@@ -26,7 +28,7 @@ const HelpForm = props => {
<iframe
className="freshwidget-embedded-form"
frameBorder="0"
height="505px"
height="744px"
id="freshwidget-embedded-form"
scrolling="no"
src={`${prefix}&${title}&${username}&${browser}&${formSubject}&${formDescription}`}
......
src/views/contact-us/contact-us.jsx
View file @ e8197e4f
......@@ -10,66 +10,82 @@ const HelpForm = require('../../components/helpform/helpform.jsx');
const InformationPage = require('../../components/informationpage/informationpage.jsx');
let subject = '';
let body = '';
const url = (window.location && window.location.search) || '';
// assumes that scratchr2 will only ever send one parameter
const params = url.split('?')[1];
if (typeof (params) !== 'undefined' && params.indexOf('studio') !== -1) {
subject = `Inappropriate content reported in studio ${params.split('=')[1]}`;
body = `https://scratch.mit.edu/studios/${params.split('=')[1]}`;
} else if (typeof (params) !== 'undefined' && params.indexOf('profile') !== -1) {
subject = `Inappropriate content reported in profile ${params.split('=')[1]}`;
body = `https://scratch.mit.edu/users/${params.split('=')[1]}`;
} else if (typeof (params) !== 'undefined' && params.indexOf('confirmation') !== -1) {
subject = 'Problem with email confirmation';
class ContactUs extends React.Component {
constructor (props) {
super(props);
this.state = {
subject: '',
body: ''
};
const query = window.location.search;
// assumes that scratchr2 will only ever send one parameter
// The subject is not localized because sending in English is easier for Scratch Team
if (query.indexOf('studio=') !== -1) {
this.state.subject = `Inappropriate content reported in studio ${query.split('=')[1]}`;
this.state.body = `https://scratch.mit.edu/studios/${query.split('=')[1]}`;
} else if (query.indexOf('profile=') !== -1) {
this.state.subject = `Inappropriate content reported in profile ${query.split('=')[1]}`;
this.state.body = `https://scratch.mit.edu/users/${query.split('=')[1]}`;
} else if (query.indexOf('confirmation=') !== -1) {
this.state.subject = 'Problem with email confirmation';
}
}
render () {
return (
<InformationPage title={this.props.intl.formatMessage({id: 'contactUs.title'})}>
<div className="inner info-inner">
<section id="contact-us">
<span className="nav-spacer" />
<p><FormattedMessage
id="contactUs.intro"
values={{faqLink: (
<a href="/faq"><FormattedMessage id="contactUs.faqLinkText" /></a>
)}}
/></p>
<p><FormattedMessage id="contactUs.forumsInfo" /></p>
<ul>
<li><FormattedMessage
id="contactUs.questionsForum"
values={{questionsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.questionsLinkText" /></a>
)}}
/></li>
<li><FormattedMessage
id="contactUs.scriptsForum"
values={{scriptsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.scriptsLinkText" /></a>
)}}
/></li>
<li><FormattedMessage
id="contactUs.bugsForum"
values={{bugsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.bugsLinkText" /></a>
)}}
/></li>
</ul>
<p><FormattedMessage id="contactUs.formIntro" /></p>
</section>
</div>
<nav>
<ol>
<li className="nav-header"><FormattedMessage id="contactUs.findHelp" /></li>
<li><a href="/faq"><FormattedMessage id="contactUs.faqLinkText" /></a></li>
</ol>
</nav>
<HelpForm
body={this.state.body}
subject={this.state.subject}
title={this.props.intl.formatMessage({id: 'contactUs.contactScratch'})}
/>
</InformationPage>
);
}
}
const ContactUs = injectIntl(props => (
<InformationPage title={props.intl.formatMessage({id: 'contactUs.title'})}>
<div className="inner info-inner">
<section id="contact-us">
<span className="nav-spacer" />
<p><FormattedMessage
id="contactUs.intro"
values={{faqLink: (
<a href="/faq"><FormattedMessage id="contactUs.faqLinkText" /></a>
)}}
/></p>
<p><FormattedMessage id="contactUs.forumsInfo" /></p>
<ul>
<li><FormattedMessage
id="contactUs.questionsForum"
values={{questionsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.questionsLinkText" /></a>
)}}
/></li>
<li><FormattedMessage
id="contactUs.scriptsForum"
values={{scriptsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.scriptsLinkText" /></a>
)}}
/></li>
<li><FormattedMessage
id="contactUs.bugsForum"
values={{bugsLink: (
<a href="/discuss/4/"><FormattedMessage id="contactUs.bugsLinkText" /></a>
)}}
/></li>
</ul>
<p><FormattedMessage id="contactUs.formIntro" /></p>
</section>
</div>
<HelpForm
body={body}
subject={subject}
title={props.intl.formatMessage({id: 'contactUs.contactScratch'})}
/>
</InformationPage>
));
ContactUs.propTypes = {
intl: intlShape
};
render(<Page><ContactUs /></Page>, document.getElementById('app'));
const WrappedContactUs = injectIntl(ContactUs);
render(<Page><WrappedContactUs /></Page>, document.getElementById('app'));
src/views/contact-us/l10n.json
View file @ e8197e4f
......@@ -11,5 +11,6 @@
"contactUs.bugsForum":"If you want to report a bug in Scratch, check the {bugsLink} forum. It's the best place to report bugs and see if others are experiencing similar difficulties.",
"contactUs.bugsLinkText":"Bugs and Glitches",
"contactUs.formIntro":"If you still need to contact us, please fill out the form below with as much detail as you can. If you have any screenshots, attachments or links that help to explain your problem, please include them. We get a lot of mail, so we may not be able to respond to your message.",
"contactUs.findHelp":"Where to find help:",
"contactUs.contactScratch":"Contact the Scratch Team"
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment