From 6d29b81537b9a6b32bd5415d0c4ff3323faa51a0 Mon Sep 17 00:00:00 2001 From: zuber Date: Fri, 25 Sep 2009 18:24:05 +0200 Subject: [PATCH] Uproszczenie implementacji wzorca observer. --- project/static/js/app.js | 81 +++++++++++++++++++++++----------- project/static/js/views/xml.js | 45 ++++++++++--------- 2 files changed, 79 insertions(+), 47 deletions(-) diff --git a/project/static/js/app.js b/project/static/js/app.js index 2530ee1a..7586f3fb 100644 --- a/project/static/js/app.js +++ b/project/static/js/app.js @@ -111,9 +111,9 @@ var Model = Class.extend({ signal: function(event, data) { console.log('signal', this, event, data); if (this.observers[event]) { - for (var i=0; i < this.observers[event].length; i++) { - this.observers[event][i].handle(event, data); - }; + for (observer in this.observers[event]) { + observer.handle(event, data); + } }; return this; }, @@ -122,7 +122,7 @@ var Model = Class.extend({ if (!this.observers[event]) { this.observers[event] = []; } - this.observers[event].push(observer); + this.observers[event][observer] = observer; return this; }, @@ -132,20 +132,41 @@ var Model = Class.extend({ this.removeObserver(observer, e); } } else { - for (var i=0; i < this.observers[event].length; i++) { - if (this.observers[event][i] === observer) { - this.observers[event].splice(i, 1); - } - } + delete this.observers[event][observer]; } return this; } +}); + + +var XMLModel = Model.extend({ + parent: null, + data: null, + serverURL: null, + + init: function(parent, serverURL) { + this.parent = parent; + this.serverURL = serverURL; + }, + + reload: function() { + $.ajax({ + url: this.serverURL, + dataType: 'text', + success: this.reloadSucceeded.bind(this) + }); + }, + + reloadSucceeded: function(data) { + this.data = data; + this.signal('reloaded'); + }, }) var DocumentModel = Model.extend({ data: null, // name, text_url, latest_rev, latest_shared_rev, parts_url, dc_url, size - xml: '', - html: '', + xml: null, + html: null, init: function() {}, @@ -167,28 +188,38 @@ var DocumentModel = Model.extend({ } }, - getXML: function(callback) { - this.signal('xml-freeze'); + load: function(key) { if (!this.data) { - this.getData(this.getXML); + this.getData(function() { this.load(key); }.bind(this)); } else { - console.log('getXML:', this.data.text_url); + console.log('load', key, this.data[key + 'url']); $.ajax({ - cache: false, - url: this.data.text_url, + url: this.data[key + '_url'], dataType: 'text', - success: this.successfulGetXML.bind(this, callback) + success: this.loadSucceeded.bind(this, key) }); - }; + } }, - successfulGetXML: function(callback, data) { - if (data != this.xml) { - this.xml = data; - this.signal('changed'); - this.signal('xml-changed'); + loadSucceeded: function(key, data) { + console.log('loadSucceeded', key, data); + this.set(key, data); + }, + + get: function(key) { + console.log(this[key]); + if (this[key]) { + return this[key] + } else { + this.load(key); + return ''; } - this.signal('xml-unfreeze'); + }, + + set: function(key, value) { + this[key] = value; + this.signal(key + '-changed'); + return this; } }); diff --git a/project/static/js/views/xml.js b/project/static/js/views/xml.js index de3131c8..333b1c2b 100644 --- a/project/static/js/views/xml.js +++ b/project/static/js/views/xml.js @@ -8,15 +8,12 @@ var XMLView = View.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, {})); - $(this.model) - .bind('modelxmlfreeze.xmlview', - function() { this.freeze('Ładowanie danych z serwera...'); }.bind(this)) - .bind('modelxmlunfreeze.xmlview', - this.unfreeze.bind(this)); + this.model + .addObserver(this, 'xml-freeze') + .addObserver(this, 'xml-unfreeze'); this.freeze('Ładowanie edytora...'); this.editor = new CodeMirror($('.xmlview', this.element).get(0), { @@ -27,38 +24,42 @@ var XMLView = View.extend({ textWrapping: false, tabMode: 'spaces', indentUnit: 0, - // onChange: function() { - // self.fireEvent('contentChanged'); - // }, + 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.editor.setCode(this.model.get('text')); + this.model.addObserver(this, 'text-changed'); this.unfreeze(); - this.model.getXML(); // 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); - this.unfreeze(); + 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') - .unbind('modelxmlfreeze.xmlview') - .unbind('modelxmlunfreeze.xmlview'); + this.model.removeObserver(this); $(this.editor.frame).remove(); this._super(); } -- 2.20.1