diff options
Diffstat (limited to 'public/js/lib/editor')
| -rw-r--r-- | public/js/lib/editor/index.js | 54 | ||||
| -rw-r--r-- | public/js/lib/editor/statusbar.html | 41 |
2 files changed, 61 insertions, 34 deletions
diff --git a/public/js/lib/editor/index.js b/public/js/lib/editor/index.js index c807a17f..8cab486c 100644 --- a/public/js/lib/editor/index.js +++ b/public/js/lib/editor/index.js @@ -1,5 +1,6 @@ import * as utils from './utils' import config from './config' +import statusBarTemplate from './statusbar.html' /* config section */ const isMac = CodeMirror.keyMap.default === CodeMirror.keyMap.macDefault @@ -132,40 +133,27 @@ export default class Editor { }) } - getStatusBarTemplate () { - return new Promise((resolve, reject) => { - $.get(window.serverurl + '/views/statusbar.html').done(template => { - this.statusBarTemplate = template - resolve() - }).fail(reject) - }) - } - addStatusBar () { - if (!this.statusBarTemplate) { - this.getStatusBarTemplate.then(this.addStatusBar) - } else { - this.statusBar = $(this.statusBarTemplate) - this.statusCursor = this.statusBar.find('.status-cursor > .status-line-column') - this.statusSelection = this.statusBar.find('.status-cursor > .status-selection') - this.statusFile = this.statusBar.find('.status-file') - this.statusIndicators = this.statusBar.find('.status-indicators') - this.statusIndent = this.statusBar.find('.status-indent') - this.statusKeymap = this.statusBar.find('.status-keymap') - this.statusLength = this.statusBar.find('.status-length') - this.statusTheme = this.statusBar.find('.status-theme') - this.statusSpellcheck = this.statusBar.find('.status-spellcheck') - this.statusPreferences = this.statusBar.find('.status-preferences') - this.statusPanel = this.editor.addPanel(this.statusBar[0], { - position: 'bottom' - }) + this.statusBar = $(statusBarTemplate) + this.statusCursor = this.statusBar.find('.status-cursor > .status-line-column') + this.statusSelection = this.statusBar.find('.status-cursor > .status-selection') + this.statusFile = this.statusBar.find('.status-file') + this.statusIndicators = this.statusBar.find('.status-indicators') + this.statusIndent = this.statusBar.find('.status-indent') + this.statusKeymap = this.statusBar.find('.status-keymap') + this.statusLength = this.statusBar.find('.status-length') + this.statusTheme = this.statusBar.find('.status-theme') + this.statusSpellcheck = this.statusBar.find('.status-spellcheck') + this.statusPreferences = this.statusBar.find('.status-preferences') + this.statusPanel = this.editor.addPanel(this.statusBar[0], { + position: 'bottom' + }) - this.setIndent() - this.setKeymap() - this.setTheme() - this.setSpellcheck() - this.setPreferences() - } + this.setIndent() + this.setKeymap() + this.setTheme() + this.setSpellcheck() + this.setPreferences() } updateStatusBar () { @@ -508,8 +496,6 @@ export default class Editor { placeholder: "← Start by entering a title here\n===\nVisit /features if you don't know what to do.\nHappy hacking :)" }) - this.getStatusBarTemplate() - return this.editor } diff --git a/public/js/lib/editor/statusbar.html b/public/js/lib/editor/statusbar.html new file mode 100644 index 00000000..24cbf6c2 --- /dev/null +++ b/public/js/lib/editor/statusbar.html @@ -0,0 +1,41 @@ +<div class="status-bar"> + <div class="status-info"> + <div class="status-cursor"> + <span class="status-line-column"></span> + <span class="status-selection"></span> + </div> + <div class="status-file"></div> + </div> + <div class="status-indicators"> + <div class="status-length"></div> + <div class="status-preferences dropup toggle-dropdown pull-right"> + <a id="preferencesLabel" class="ui-preferences-label text-uppercase" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" title="Click to change preferences"> + <i class="fa fa-wrench fa-fw"></i> + </a> + <ul class="dropdown-menu" aria-labelledby="preferencesLabel"> + <li class="ui-preferences-override-browser-keymap"><a><label>Allow override browser keymap <input type="checkbox"></label></a></li> + </ul> + </div> + <div class="status-keymap dropup pull-right"> + <a id="keymapLabel" class="ui-keymap-label text-uppercase" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" title="Click to change keymap"> + Sublime + </a> + <ul class="dropdown-menu" aria-labelledby="keymapLabel"> + <li class="ui-keymap-sublime"><a>Sublime</a></li> + <li class="ui-keymap-emacs"><a>Emacs</a></li> + <li class="ui-keymap-vim"><a>Vim</a></li> + </ul> + </div> + <div class="status-indent"> + <div class="indent-type" title="Click to switch indentation type">Spaces:</div> + <div class="indent-width-label" title="Click to change indentation size">4</div> + <input class="indent-width-input hidden" type="number" min="1" max="10" maxlength="2" size="2"> + </div> + <div class="status-theme"> + <a class="ui-theme-toggle" title="Toggle editor theme"><i class="fa fa-sun-o fa-fw"></i></a> + </div> + <div class="status-spellcheck"> + <a class="ui-spellcheck-toggle" title="Toggle spellcheck"><i class="fa fa-check fa-fw"></i></a> + </div> + </div> +</div> |