Mercurial > wikked
changeset 181:87d6922340d9
Page editing:
- Fixed broken page editing.
- Use the bundled Pagedown library.
- Added ability to add new pages.
Miscellaneous:
- Better UI for subtitles and details.
| author | Ludovic Chabant <ludovic@chabant.com> |
|---|---|
| date | Sat, 01 Feb 2014 14:03:20 -0800 |
| parents | ca1a810a4811 |
| children | 7533ffec1b5a |
| files | wikked/assets/css/wikked/page.less wikked/assets/js/wikked/app.js wikked/assets/js/wikked/models.js wikked/assets/js/wikked/views.js wikked/assets/tpl/diff-page.html wikked/assets/tpl/edit-page.html wikked/views/edit.py |
| diffstat | 7 files changed, 112 insertions(+), 91 deletions(-) [+] |
line wrap: on
line diff
--- a/wikked/assets/css/wikked/page.less Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/css/wikked/page.less Sat Feb 01 14:03:20 2014 -0800 @@ -74,6 +74,22 @@ }*/ } +// Page title decorator +.decorator, .decorator-sm { + text-transform: uppercase; + font-family: @font-family-sans-serif; + font-weight: 200; + font-size: 0.7em; + letter-spacing: 0.1em; + color: @color-footer; + .rev_id { + font-family: @font-family-monospace; + } +} +.decorator-sm { + font-size: 0.5em; +} + // Page info section.info { margin: @line-height-computed 0 0 0; @@ -124,16 +140,7 @@ .special>article footer { background: @colorGreen; } -.decorator { - text-transform: uppercase; - font-weight: lighter; - font-size: 0.7em; - letter-spacing: 0.1em; - color: @colorBlue; - .rev_id { - font-family: @font-family-monospace; - } -}*/ +*/ // Search ul#search-preview { @@ -227,6 +234,9 @@ article, .footer-wrapper { width: 700px; } + .wide { + width: 100%; + } } /* Medium devices (desktops, 992px and up) */
--- a/wikked/assets/js/wikked/app.js Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/js/wikked/app.js Sat Feb 01 14:03:20 2014 -0800 @@ -64,6 +64,7 @@ routes: { 'read/*path': "readPage", '': "readMainPage", + 'create/*path': "createPage", 'edit/*path': "editPage", 'changes/*path': "showPageHistory", 'inlinks/*path': "showIncomingLinks", @@ -92,6 +93,13 @@ readMainPage: function() { this.readPage(''); }, + createPage: function(path) { + var view = new Views.PageEditView({ + model: new Models.PageEditModel({ is_new: true, create_in: path }) + }); + this.viewManager.switchView(view); + this.navigate('/create/' + path); + }, editPage: function(path) { var view = new Views.PageEditView({ model: new Models.PageEditModel({ path: path })
--- a/wikked/assets/js/wikked/models.js Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/js/wikked/models.js Sat Feb 01 14:03:20 2014 -0800 @@ -55,7 +55,7 @@ this.navigate('/search/' + $(form.q).val(), { trigger: true }); }, doNewPage: function(form) { - this.navigate('/edit/', { trigger: true }); + this.navigate('/create/', { trigger: true }); }, _onChangePath: function(path) { this.set({ @@ -286,6 +286,10 @@ action: 'edit', urlRoot: '/api/edit/', doEdit: function(form) { + if (this.get('is_new')) { + this.set('path', $('input[name="title"]', form).val()); + } + var $model = this; $.post(this.url(), $(form).serialize(), null, 'json') .done(function(data) {
--- a/wikked/assets/js/wikked/views.js Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/js/wikked/views.js Sat Feb 01 14:03:20 2014 -0800 @@ -9,6 +9,9 @@ 'bootstrap_tooltip', 'bootstrap_alert', 'bootstrap_collapse', + 'pagedown_converter', + 'pagedown_editor', + 'pagedown_sanitizer', 'js/wikked/client', 'js/wikked/models', 'js/wikked/util', @@ -32,7 +35,10 @@ 'text!tpl/special-changes.html', 'text!tpl/special-orphans.html' ], - function($, _, Backbone, Handlebars, BootstrapTooltip, BootstrapAlert, BootstrapCollapse, Client, Models, Util, + function($, _, Backbone, Handlebars, + BootstrapTooltip, BootstrapAlert, BootstrapCollapse, + PageDownConverter, PageDownEditor, PageDownSanitizer, + Client, Models, Util, tplReadPage, tplMetaPage, tplEditPage, tplHistoryPage, tplRevisionPage, tplDiffPage, tplInLinksPage, tplNav, tplFooter, tplSearchResults, tplLogin, tplErrorNotAuthorized, tplErrorNotFound, tplErrorUnauthorizedEdit, tplStateWarning, @@ -336,17 +342,16 @@ // Cache some stuff. this._ctrlInput = $('#wmd-input'); this._ctrlPreview = $('#wmd-preview'); - this._originalInputHeight = this._ctrlInput.height(); // Create the Markdown editor. var formatter = new Client.PageFormatter(); formatter.baseUrl = this.model.get('path').match(/.*\//); - var converter = new Markdown.Converter(); + var converter = PageDownConverter.getSanitizingConverter(); converter.hooks.chain("preConversion", function(text) { return formatter.formatText(text); }); var $view = this; - var editor = new Markdown.Editor(converter); //TODO: pass options + var editor = new PageDownConverter.Editor(converter); //TODO: pass options editor.hooks.chain("onPreviewRefresh", function() { $view._updateUI(true); }); @@ -354,7 +359,7 @@ // Setup UI. this._updateUI(); - $('#wmd-preview-wrapper').hide(); + $('.preview').hide(); }, events: { "mousedown #wmd-input-grip": "_inputGripMouseDown", @@ -388,36 +393,23 @@ return false; }, _addPreview: function() { - $('#app') - .removeClass('container') - .addClass('container-fluid'); - $('#page-edit') - .removeClass('row') - .addClass('row-fluid'); - $('#wmd-form-wrapper') - .removeClass('span12') - .addClass('span6'); - $('#wmd-preview-wrapper') - .show() - .addClass('span6'); + $('article').addClass('container-fluid').addClass('wide'); + $('.header-wrapper').addClass('row'); + $('.header-wrapper>header').addClass('col-md-12'); + $('.editing-wrapper').addClass('row'); + $('.editing-wrapper>.editing').addClass('col-md-6'); + $('.editing-wrapper>.preview').addClass('col-md-6').show(); this._updateUI(true); }, _removePreview: function() { - $('#wmd-form-wrapper') - .removeClass('span6') - .addClass('span12'); - $('#wmd-preview-wrapper') - .hide() - .removeClass('span6'); - $('#page-edit') - .removeClass('row-fluid') - .addClass('row'); - $('#app') - .removeClass('container-fluid') - .addClass('container'); - - this._ctrlInput.height(this._originalInputHeight); + $('article').removeClass('container-fluid').removeClass('wide'); + $('.header-wrapper').removeClass('row'); + $('.header-wrapper>header').removeClass('col-md-12'); + $('.editing-wrapper').removeClass('row'); + $('.editing-wrapper>.editing').removeClass('col-md-6'); + $('.editing-wrapper>.preview').removeClass('col-md-6').hide(); + this._updateUI(); }, _toggleFullPreview: function(e) {
--- a/wikked/assets/tpl/diff-page.html Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/tpl/diff-page.html Sat Feb 01 14:03:20 2014 -0800 @@ -2,7 +2,8 @@ <header> <h1> {{meta.title}} - <span class="decorator">Diff: + <span class="decorator">Diff</span></br/> + <span class="decorator-sm"> {{#if disp_rev2}} <span class="rev_id">{{disp_rev1}}</span> to <span class="rev_id">{{disp_rev2}}</span> {{else}}
--- a/wikked/assets/tpl/edit-page.html Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/assets/tpl/edit-page.html Sat Feb 01 14:03:20 2014 -0800 @@ -1,52 +1,57 @@ <article> - <header> - <h1>{{meta.title}} <span class="decorator">Editing</span></h1> - </header> - <form id="page-edit" class="row"> - <div id="wmd-form-wrapper" class="span12"> - <section id="wmd-button-bar-wrapper"> - <div id="wmd-button-bar"></div> - <div id="wmd-extra-bar"> - <ul class="wmd-button-row"> - <li class="wmd-button" id="wmd-preview-button" title="Toggle Preview"><span></span></li> - </ul> - </div> - </section> - {{#if error}} - <section class="alert alert-danger"> - <p><strong>Error:</strong> {{error.message}}</p> - </section> - {{/if}} - <section id="wmd-input-wrapper"> - <textarea id="wmd-input" name="text" placeholder="Your page's contents go here...">{{content}}</textarea> - <div id="wmd-input-grip"></div> - </section> - <section id="wmd-meta-wrapper"> - <div id="wmd-meta" class="controls commit-meta"> - <div class="control-group input-prepend"> - <label for="author" class="control-label add-on">Author: </label> - <input type="text" name="author" class="" placeholder="{{commit_meta.author}}"></input> + <form id="page-edit"> + <div class="header-wrapper"> + <header> + {{#if is_new}} + <input type="text" name="title" class="input-xxlarge" placeholder="New Page"></input> + {{else}} + <h1>{{meta.title}} <span class="decorator">Editing</span></h1> + {{/if}} + </header> + </div> + <div class="editing-wrapper"> + <div class="editing"> + <section id="wmd-button-bar-wrapper"> + <div id="wmd-button-bar"></div> + <div id="wmd-extra-bar"> + <ul class="wmd-button-row"> + <li class="wmd-button" id="wmd-preview-button" title="Toggle Preview"><span></span></li> + </ul> </div> - <div class="control-group input-prepend"> - <label for="message" class="control-label add-on">Change Description: </label> - <input type="text" name="message" class="input-xxlarge" placeholder="{{commit_meta.desc}}"></input> + </section> + {{#if error}} + <section class="alert alert-danger"> + <p><strong>Error:</strong> {{error.message}}</p> + </section> + {{/if}} + <section id="wmd-input-wrapper"> + <textarea id="wmd-input" name="text" placeholder="Your page's contents go here...">{{content}}</textarea> + <div id="wmd-input-grip"></div> + </section> + <section id="wmd-meta-wrapper"> + <div id="wmd-meta" class="controls commit-meta"> + <div class="control-group input-prepend"> + <label for="author" class="control-label add-on">Author: </label> + <input type="text" name="author" class="" placeholder="{{commit_meta.author}}"></input> + </div> + <div class="control-group input-prepend"> + <label for="message" class="control-label add-on">Change Description: </label> + <input type="text" name="message" class="input-xxlarge" placeholder="{{commit_meta.desc}}"></input> + </div> </div> - </div> - </section> - <section id="wmd-commit-wrapper" class="row"> - <div id="wmd-commit"> - <button type="submit" class="btn btn-primary"><i class="icon-ok icon-white"></i> Save</button> - <a href="{{url_read}}" class="btn">Cancel</a> - </div> - </section> - </div> - <div id="wmd-preview-wrapper"> - <h3>Preview</h3> - <button id="wmd-full-preview-button" class="btn">Full Preview</button> - <div id="wmd-preview"></div> + </section> + <section id="wmd-commit-wrapper" class="row"> + <div id="wmd-commit"> + <button type="submit" class="btn btn-primary"><i class="icon-ok icon-white"></i> Save</button> + <a href="{{url_read}}" class="btn">Cancel</a> + </div> + </section> + </div> + <div class="preview"> + <h3>Preview</h3> + <button id="wmd-full-preview-button" class="btn">Full Preview</button> + <div id="wmd-preview"></div> + </div> </div> </form> </article> -<script type="text/javascript" src="/static/js/pagedown/Markdown.Converter.js"></script> -<script type="text/javascript" src="/static/js/pagedown/Markdown.Sanitizer.js"></script> -<script type="text/javascript" src="/static/js/pagedown/Markdown.Editor.js"></script>
--- a/wikked/views/edit.py Sat Feb 01 14:01:27 2014 -0800 +++ b/wikked/views/edit.py Sat Feb 01 14:03:20 2014 -0800 @@ -17,7 +17,7 @@ self._text = text def _loadData(self): - extension = self.wiki.config.get('wiki', 'default_extension') + extension = self.wiki.fs.default_extension data = PageData() data.path = '__preview__.' + extension data.filename = '__preview__' @@ -30,7 +30,8 @@ data.local_meta = ctx.meta data.local_links = ctx.out_links - data.title = make_page_title(self.url) + data.title = (data.local_meta.get('title') or + make_page_title(self.url)) return data