diff --git a/ElectronClient/app/app.js b/ElectronClient/app/app.js index fb6b16ae4b..e592afae1a 100644 --- a/ElectronClient/app/app.js +++ b/ElectronClient/app/app.js @@ -50,6 +50,7 @@ const appDefaultState = Object.assign({}, defaultState, { windowContentSize: bridge().windowContentSize(), watchedNoteFiles: [], lastEditorScrollPercents: {}, + noteDevToolsVisible: false, }); class Application extends BaseApplication { @@ -187,6 +188,12 @@ class Application extends BaseApplication { newState.lastEditorScrollPercents = newPercents; break; + case 'NOTE_DEVTOOLS_TOGGLE': + + newState = Object.assign({}, state); + newState.noteDevToolsVisible = !newState.noteDevToolsVisible; + break; + } } catch (error) { error.message = 'In reducer: ' + error.message + ' Action: ' + JSON.stringify(action); @@ -787,6 +794,17 @@ class Application extends BaseApplication { label: _('Check for updates...'), visible: shim.isMac() ? false : true, click: () => _checkForUpdates(this) + }, { + type: 'separator', + screens: ['Main'], + }, { + label: _('Toggle development tools'), + visible: true, + click: () => { + this.dispatch({ + type: 'NOTE_DEVTOOLS_TOGGLE', + }); + }, }, { type: 'separator', visible: shim.isMac() ? false : true, diff --git a/ElectronClient/app/gui/MainScreen.jsx b/ElectronClient/app/gui/MainScreen.jsx index 3e2a0a9885..c3832d06fa 100644 --- a/ElectronClient/app/gui/MainScreen.jsx +++ b/ElectronClient/app/gui/MainScreen.jsx @@ -496,7 +496,7 @@ class MainScreenComponent extends React.Component { - + {pluginDialog} @@ -521,6 +521,7 @@ const mapStateToProps = (state) => { noteListWidth: state.settings['style.noteList.width'], selectedNoteId: state.selectedNoteIds.length === 1 ? state.selectedNoteIds[0] : null, plugins: state.plugins, + noteDevToolsVisible: state.noteDevToolsVisible, }; }; diff --git a/ElectronClient/app/gui/NoteText.jsx b/ElectronClient/app/gui/NoteText.jsx index 5b42ec0320..caa3cb1e73 100644 --- a/ElectronClient/app/gui/NoteText.jsx +++ b/ElectronClient/app/gui/NoteText.jsx @@ -382,6 +382,22 @@ class NoteTextComponent extends React.Component { ExternalEditWatcher.instance().off('noteChange', this.externalEditWatcher_noteChange); } + componentDidUpdate(prevProps) { + if (this.webviewRef() && this.props.noteDevToolsVisible !== this.webviewRef().isDevToolsOpened()) { + if (this.props.noteDevToolsVisible) { + this.webviewRef().openDevTools(); + } else { + this.webviewRef().closeDevTools(); + } + } + } + + webviewRef() { + if (!this.webviewRef_.current || !this.webviewRef_.current.wrappedInstance) return null; + if (!this.webviewRef_.current.wrappedInstance.domReady()) return null; + return this.webviewRef_.current.wrappedInstance; + } + async saveIfNeeded(saveIfNewNote = false) { const forceSave = saveIfNewNote && (this.state.note && !this.state.note.id); diff --git a/ElectronClient/app/gui/NoteTextViewer.jsx b/ElectronClient/app/gui/NoteTextViewer.jsx index afefea3c75..bde80f4c85 100644 --- a/ElectronClient/app/gui/NoteTextViewer.jsx +++ b/ElectronClient/app/gui/NoteTextViewer.jsx @@ -9,6 +9,7 @@ class NoteTextViewerComponent extends React.Component { super(); this.initialized_ = false; + this.domReady_ = false; this.webviewRef_ = React.createRef(); this.webviewListeners_ = null; @@ -18,6 +19,7 @@ class NoteTextViewerComponent extends React.Component { } webview_domReady(event) { + this.domReady_ = true; if (this.props.onDomReady) this.props.onDomReady(event); } @@ -25,6 +27,10 @@ class NoteTextViewerComponent extends React.Component { if (this.props.onIpcMessage) this.props.onIpcMessage(event); } + domReady() { + return this.domReady_; + } + initWebview() { const wv = this.webviewRef_.current; @@ -65,6 +71,9 @@ class NoteTextViewerComponent extends React.Component { const fn = this.webviewListeners_[n]; wv.removeEventListener(n, fn); } + + this.initialized_ = false; + this.domReady_ = false; } tryInit() { @@ -116,6 +125,14 @@ class NoteTextViewerComponent extends React.Component { return this.webviewRef_.current.openDevTools(); } + closeDevTools() { + return this.webviewRef_.current.closeDevTools(); + } + + isDevToolsOpened() { + return this.webviewRef_.current.isDevToolsOpened(); + } + // ---------------------------------------------------------------- // Wrap WebView functions (END) // ----------------------------------------------------------------