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

fix dropdown bug on safari

Browse source
This commit is contained in:
Cassie Tarakajian 2016-10-19 13:03:19 -04:00
parent 5e36617de4
commit a4b6dd194e
4 changed files with 15 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
client/modules/IDE/components/Editor.js
View file

@ -103,11 +103,11 @@ class Editor extends React.Component {
this._cm.setOption('indentWithTabs', this.props.isTabIndent); this._cm.setOption('indentWithTabs', this.props.isTabIndent);
} }
if (this.props.file.name !== prevProps.name) { if (this.props.file.name !== prevProps.name) {
if (this.props.file.name.match(/.+\.js$/)) { if (this.props.file.name.match(/.+\.js$/i)) {
this._cm.setOption('mode', 'javascript'); this._cm.setOption('mode', 'javascript');
} else if (this.props.file.name.match(/.+\.css$/)) { } else if (this.props.file.name.match(/.+\.css$/i)) {
this._cm.setOption('mode', 'css'); this._cm.setOption('mode', 'css');
} else if (this.props.file.name.match(/.+\.html$/)) { } else if (this.props.file.name.match(/.+\.html$/i)) {
this._cm.setOption('mode', 'htmlmixed'); this._cm.setOption('mode', 'htmlmixed');
} }
} }
@ -155,8 +155,9 @@ class Editor extends React.Component {
className="editor__options-button" className="editor__options-button"
aria-label="editor options" aria-label="editor options"
tabIndex="0" tabIndex="0"
onClick={(e) => { ref="optionsButton"
e.target.focus(); onClick={() => {
this.refs.optionsButton.focus();
this.props.showEditorOptions(); this.props.showEditorOptions();
}} }}
onBlur={() => setTimeout(this.props.closeEditorOptions, 200)} onBlur={() => setTimeout(this.props.closeEditorOptions, 200)}

6
client/modules/IDE/components/FileNode.js
View file

@ -117,8 +117,10 @@ export class FileNode extends React.Component {
<button <button
className="sidebar__file-item-show-options" className="sidebar__file-item-show-options"
aria-label="view file options" aria-label="view file options"
onClick={(e) => { ref={`fileOptions-${this.props.id}`}
e.target.focus(); tabIndex="0"
onClick={() => {
this.refs[`fileOptions-${this.props.id}`].focus();
this.props.showFileOptions(this.props.id); this.props.showFileOptions(this.props.id);
}} }}
> >

2
client/modules/IDE/components/PreviewFrame.js
View file

@ -256,7 +256,7 @@ class PreviewFrame extends React.Component {
frameBorder="0" frameBorder="0"
ref="iframe" ref="iframe"
title="sketch output" title="sketch output"
sandbox="allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-modals allow-forms" sandbox="allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-forms"
/> />
); );
} }

6
client/modules/IDE/components/Sidebar.js
View file

@ -38,8 +38,10 @@ class Sidebar extends React.Component {
<button <button
aria-label="add file or folder" aria-label="add file or folder"
className="sidebar__add" className="sidebar__add"
onClick={(e) => { tabIndex="0"
e.target.focus(); ref="sidebarOptions"
onClick={() => {
this.refs.sidebarOptions.focus();
this.props.openProjectOptions(); this.props.openProjectOptions();
}} }}
onBlur={() => setTimeout(this.props.closeProjectOptions, 200)} onBlur={() => setTimeout(this.props.closeProjectOptions, 200)}