X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/ff3ac103aa103b9b5cb56e71a6782c9ca98acf94..6d29b81537b9a6b32bd5415d0c4ff3323faa51a0:/project/static/js/views/xml.js?ds=sidebyside diff --git a/project/static/js/views/xml.js b/project/static/js/views/xml.js index 78f83806..333b1c2b 100644 --- a/project/static/js/views/xml.js +++ b/project/static/js/views/xml.js @@ -1,5 +1,5 @@ -/*global Class CodeMirror render_template panels */ -var XMLView = Class.extend({ +/*global View CodeMirror render_template panels */ +var XMLView = View.extend({ element: null, model: null, template: 'xml-view-template', @@ -8,44 +8,60 @@ var XMLView = Class.extend({ init: function(element, model, template) { this.element = $(element); this.model = $(model).get(0); - console.log('XMLView#init model:', model); this.template = template || this.template; this.element.html(render_template(this.template, {})); - var self = this; + this.model + .addObserver(this, 'xml-freeze') + .addObserver(this, 'xml-unfreeze'); + + this.freeze('Ładowanie edytora...'); this.editor = new CodeMirror($('.xmlview', this.element).get(0), { parserfile: 'parsexml.js', path: "/static/js/lib/codemirror/", stylesheet: "/static/css/xmlcolors.css", parserConfig: {useHTMLKludges: false}, - // onChange: function() { - // self.fireEvent('contentChanged'); - // }, + textWrapping: false, + tabMode: 'spaces', + indentUnit: 0, + onChange: this.changed.bind(this), initCallback: this.editorDidLoad.bind(this) }); }, + changed: function() { + this.model.set('text', this.editor.getCode()); + }, + editorDidLoad: function(editor) { - console.log('init', this.model); - editor.setCode('Ładowanie...'); + editor.setCode('Ładowanie edytora...'); $(editor.frame).css({width: '100%', height: '100%'}); - this.editor.setCode(this.model.xml); - $(this.model).bind('modelxmlchanged.xmlview', this.codeChanged.bind(this)); - this.model.getXML(); + this.editor.setCode(this.model.get('text')); + this.model.addObserver(this, 'text-changed'); + this.unfreeze(); // editor.grabKeys( // $.fbind(self, self.hotkeyPressed), // $.fbind(self, self.isHotkey) // ); }, - codeChanged: function() { - console.log('setCode:', this.editor, this.model); - this.editor.setCode(this.model.xml); + handle: function(event, data) { + console.log('handle', this, event, data); + if (event == 'text-changed') { + this.freeze('Niezsynchronizowany'); + // this.unfreeze(); + } else if (event == 'xml-freeze') { + this.freeze('Ładowanie XMLa...'); + } else if (event == 'xml-unfreeze') { + this.editor.setCode(this.model.get('text')); + this.unfreeze(); + } }, dispose: function() { - $(this.model).unbind('modelxmlchanged.xmlview'); + this.model.removeObserver(this); $(this.editor.frame).remove(); + this._super(); } });