self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00
Code Issues Releases Activity

Desktop: New: Added option to open development tools, to make it easier to create custom CSS

Browse Source
This commit is contained in:
Laurent Cozic 2019-06-05 17:41:30 +01:00
parent c362c38dc0
commit a13ba63ab8
4 changed files with 53 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
ElectronClient/app/app.js
View File

@ -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,

3
ElectronClient/app/gui/MainScreen.jsx
View File

@ -496,7 +496,7 @@ class MainScreenComponent extends React.Component {
<VerticalResizer style={styles.verticalResizer} onDrag={this.sidebar_onDrag}/>
<NoteList style={styles.noteList} />
<VerticalResizer style={styles.verticalResizer} onDrag={this.noteList_onDrag}/>
<NoteText style={styles.noteText} visiblePanes={this.props.noteVisiblePanes} />
<NoteText style={styles.noteText} visiblePanes={this.props.noteVisiblePanes} noteDevToolsVisible={this.props.noteDevToolsVisible}/>
{pluginDialog}
</div>
@ -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,
};
};

16
ElectronClient/app/gui/NoteText.jsx
View File

@ -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);

17
ElectronClient/app/gui/NoteTextViewer.jsx
View File

@ -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)
// ----------------------------------------------------------------