X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/ab093330473e6cee879256b9902ce90bd1832c35..1d07e208b0897af64f71755c974762bc7cd19ca0:/project/static/js/models.js?ds=sidebyside diff --git a/project/static/js/models.js b/project/static/js/models.js index e141346a..d183f992 100644 --- a/project/static/js/models.js +++ b/project/static/js/models.js @@ -1,7 +1,4 @@ -/*globals Editor fileId SplitView PanelContainerView EditorView*/ -var documentsUrl = '/api/documents/'; - - +/*globals Editor fileId SplitView PanelContainerView EditorView FlashView messageCenter*/ Editor.Model = Editor.Object.extend({ synced: false, data: null @@ -9,8 +6,7 @@ Editor.Model = Editor.Object.extend({ Editor.ToolbarButtonsModel = Editor.Model.extend({ - _className: 'Editor.ToolbarButtonsModel', - serverURL: '/api/toolbar/buttons', + className: 'Editor.ToolbarButtonsModel', buttons: {}, init: function() { @@ -20,7 +16,7 @@ Editor.ToolbarButtonsModel = Editor.Model.extend({ load: function() { if (!this.get('buttons').length) { $.ajax({ - url: this.serverURL, + url: toolbarUrl, dataType: 'json', success: this.loadSucceeded.bind(this) }); @@ -35,6 +31,8 @@ Editor.ToolbarButtonsModel = Editor.Model.extend({ // Stany modelu: // +// -> error -> loading +// / // empty -> loading -> synced -> unsynced -> loading // \ // -> dirty -> updating -> updated -> synced @@ -54,20 +52,37 @@ Editor.XMLModel = Editor.Model.extend({ this.addObserver(this, 'data', this.dataChanged.bind(this)); }, - load: function() { - if (this.get('state') == 'empty') { + load: function(force) { + if (force || this.get('state') == 'empty') { this.set('state', 'loading'); $.ajax({ url: this.serverURL, dataType: 'text', data: {revision: this.get('revision')}, - success: this.loadingSucceeded.bind(this) + success: this.loadingSucceeded.bind(this), + error: this.loadingFailed.bind(this) }); return true; } return false; }, + loadingSucceeded: function(data) { + if (this.get('state') != 'loading') { + alert('erroneous state:', this.get('state')); + } + this.set('data', data); + this.set('state', 'synced'); + }, + + loadingFailed: function() { + if (this.get('state') != 'loading') { + alert('erroneous state:', this.get('state')); + } + this.set('error', 'Nie udało się załadować panelu'); + this.set('state', 'error'); + }, + update: function(message) { if (this.get('state') == 'dirty') { this.set('state', 'updating'); @@ -82,7 +97,7 @@ Editor.XMLModel = Editor.Model.extend({ $.ajax({ url: this.serverURL, - type: 'put', + type: 'post', dataType: 'json', data: payload, success: this.updatingSucceeded.bind(this), @@ -93,10 +108,11 @@ Editor.XMLModel = Editor.Model.extend({ return false; }, - updatingSucceeded: function() { + updatingSucceeded: function(data) { if (this.get('state') != 'updating') { alert('erroneous state:', this.get('state')); } + this.set('revision', data.revision); this.set('state', 'updated'); }, @@ -104,6 +120,7 @@ Editor.XMLModel = Editor.Model.extend({ if (this.get('state') != 'updating') { alert('erroneous state:', this.get('state')); } + messageCenter.addMessage('error', 'Uaktualnienie nie powiodło się', 'Uaktualnienie nie powiodło się'); this.set('state', 'dirty'); }, @@ -121,14 +138,6 @@ Editor.XMLModel = Editor.Model.extend({ } }, - loadingSucceeded: function(data) { - if (this.get('state') != 'loading') { - alert('erroneous state:', this.get('state')); - } - this.set('data', data); - this.set('state', 'synced'); - }, - dispose: function() { this.removeObserver(this); this._super(); @@ -138,25 +147,34 @@ Editor.XMLModel = Editor.Model.extend({ Editor.HTMLModel = Editor.Model.extend({ _className: 'Editor.HTMLModel', - serverURL: null, - data: '', + dataURL: null, + htmlURL: null, + renderURL: null, + displaData: '', + xmlParts: {}, state: 'empty', - init: function(serverURL, revision) { + init: function(htmlURL, revision, dataURL) { this._super(); this.set('state', 'empty'); this.set('revision', revision); - this.serverURL = serverURL; + this.htmlURL = htmlURL; + this.dataURL = dataURL; + this.renderURL = "http://localhost:8000/api/render"; + this.xmlParts = {}; }, - load: function() { - if (this.get('state') == 'empty') { + load: function(force) { + if (force || this.get('state') == 'empty') { this.set('state', 'loading'); + + // load the transformed data $.ajax({ - url: this.serverURL, + url: this.htmlURL, dataType: 'text', data: {revision: this.get('revision')}, - success: this.loadingSucceeded.bind(this) + success: this.loadingSucceeded.bind(this), + error: this.loadingFailed.bind(this) }); } }, @@ -168,6 +186,117 @@ Editor.HTMLModel = Editor.Model.extend({ this.set('data', data); this.set('state', 'synced'); }, + + loadingFailed: function() { + if (this.get('state') != 'loading') { + alert('erroneous state:', this.get('state')); + } + this.set('error', 'Nie udało się załadować panelu'); + this.set('state', 'error'); + }, + + getXMLPart: function(elem, callback) + { + var path = elem.attr('wl2o:path'); + if(!this.xmlParts[path]) + this.loadXMLPart(elem, callback); + else + callback(path, this.xmlParts[path]); + }, + + loadXMLPart: function(elem, callback) + { + var path = elem.attr('wl2o:path'); + var self = this; + + $.ajax({ + url: this.dataURL, + dataType: 'text; charset=utf-8', + data: { + revision: this.get('revision'), + part: path + }, + success: function(data) { + self.xmlParts[path] = data; + callback(path, data); + }, + // TODO: error handling + error: function(data) { + console.log('Failed to load fragment'); + callback(undefined, undefined); + } + }); + }, + + putXMLPart: function(elem, data) { + var self = this; + + var path = elem.attr('wl2o:path'); + this.xmlParts[path] = data; + + this.set('state', 'unsynced'); + + /* re-render the changed fragment */ + $.ajax({ + url: this.renderURL, + type: "POST", + dataType: 'text; charset=utf-8', + data: {fragment: data, part: path}, + success: function(htmldata) { + elem.replaceWith(htmldata); + self.set('state', 'dirty'); + } + }); + }, + + update: function(message) { + if (this.get('state') == 'dirty') { + this.set('state', 'updating'); + + var payload = { + chunks: $.toJSON(this.xmlParts), + revision: this.get('revision') + }; + + if (message) { + payload.message = message; + } + + console.log(payload) + + $.ajax({ + url: this.dataURL, + type: 'post', + dataType: 'json', + data: payload, + success: this.updatingSucceeded.bind(this), + error: this.updatingFailed.bind(this) + }); + return true; + } + return false; + + }, + + updatingSucceeded: function(data) { + if (this.get('state') != 'updating') { + alert('erroneous state:', this.get('state')); + } + + // flush the cache + this.xmlParts = {}; + + this.set('revision', data.revision); + this.set('state', 'updated'); + }, + + updatingFailed: function() { + if (this.get('state') != 'updating') { + alert('erroneous state:', this.get('state')); + } + messageCenter.addMessage('error', 'Uaktualnienie nie powiodło się', 'Uaktualnienie nie powiodło się'); + this.set('state', 'dirty'); + }, // For debbuging set: function(property, value) { @@ -179,6 +308,57 @@ Editor.HTMLModel = Editor.Model.extend({ }); +Editor.ImageGalleryModel = Editor.Model.extend({ + _className: 'Editor.ImageGalleryModel', + serverURL: null, + data: [], + state: 'empty', + + init: function(serverURL) { + this._super(); + this.set('state', 'empty'); + this.serverURL = serverURL; + // olewać data + this.pages = []; + }, + + load: function(force) { + if (force || this.get('state') == 'empty') { + this.set('state', 'loading'); + $.ajax({ + url: this.serverURL, + dataType: 'json', + success: this.loadingSucceeded.bind(this) + }); + } + }, + + loadingSucceeded: function(data) { + if (this.get('state') != 'loading') { + alert('erroneous state:', this.get('state')); + } + + console.log('galleries:', data); + + if (data.length === 0) { + this.set('data', []); + } else { + console.log('dupa'); + this.set('data', data[0].pages); + } + + this.set('state', 'synced'); + }, + + set: function(property, value) { + if (property == 'state') { + console.log(this.description(), ':', property, '=', value); + } + return this._super(property, value); + } +}); + + Editor.DocumentModel = Editor.Model.extend({ _className: 'Editor.DocumentModel', data: null, // name, text_url, user_revision, latest_shared_rev, parts_url, dc_url, size, merge_url @@ -208,7 +388,8 @@ Editor.DocumentModel = Editor.Model.extend({ this.set('state', 'synced'); this.contentModels = { 'xml': new Editor.XMLModel(data.text_url, data.user_revision), - 'html': new Editor.HTMLModel(data.html_url, data.user_revision) + 'html': new Editor.HTMLModel(data.html_url, data.user_revision, data.text_url), + 'gallery': new Editor.ImageGalleryModel(data.gallery_url) }; for (var key in this.contentModels) { this.contentModels[key].addObserver(this, 'state', this.contentModelStateChanged.bind(this)); @@ -228,7 +409,14 @@ Editor.DocumentModel = Editor.Model.extend({ for (key in this.contentModels) { if (this.contentModels[key].guid() == contentModel.guid()) { this.contentModels[key].set('state', 'synced'); - } else if (this.contentModels[key].get('state') == 'unsynced') { + this.data.user_revision = this.contentModels[key].get('revision'); + messageCenter.addMessage('info', 'Uaktualnienie dokumentu do wersji ' + this.data.user_revision, + 'Uaktualnienie dokumentu do wersji ' + this.data.user_revision); + } + } + for (key in this.contentModels) { + if (this.contentModels[key].guid() != contentModel.guid()) { + this.contentModels[key].set('revision', this.data.user_revision); this.contentModels[key].set('state', 'empty'); } } @@ -263,11 +451,13 @@ Editor.DocumentModel = Editor.Model.extend({ console.log(xhr.status, textStatus); if (xhr.status == 200) { // Sukces this.data.user_revision = this.get('updateData').revision; + messageCenter.addMessage('info', 'Uaktualnienie dokumentu do wersji ' + this.get('updateData').revision, + 'Uaktualnienie dokumentu do wersji ' + this.get('updateData').revision); for (var key in this.contentModels) { this.contentModels[key].set('revision', this.data.user_revision); this.contentModels[key].set('state', 'empty'); } - } else if (xhr.status == 202) { // Wygenerowano PullRequest + } else if (xhr.status == 202) { // Wygenerowano PullRequest (tutaj?) } else if (xhr.status == 204) { // Nic nie zmieniono } else if (xhr.status == 409) { // Konflikt podczas operacji } @@ -299,7 +489,9 @@ Editor.DocumentModel = Editor.Model.extend({ this.contentModels[key].set('revision', this.data.user_revision); this.contentModels[key].set('state', 'empty'); } - } else if (xhr.status == 202) { // Wygenerowano PullRequest (tutaj?) + messageCenter.addMessage('info', 'Uaktualnienie dokumentu do wersji ' + this.get('mergeData').revision, + 'Uaktualnienie dokumentu do wersji ' + this.get('mergeData').revision); + } else if (xhr.status == 202) { // Wygenerowano PullRequest } else if (xhr.status == 204) { // Nic nie zmieniono } else if (xhr.status == 409) { // Konflikt podczas operacji } @@ -319,11 +511,18 @@ Editor.DocumentModel = Editor.Model.extend({ var leftPanelView, rightPanelContainer, doc; -$(function() { +$(function() +{ + documentsUrl = $('#api-base-url').text() + '/'; + toolbarUrl = $('#api-toolbar-url').text(); + doc = new Editor.DocumentModel(); - var editor = new EditorView('#body-wrap', doc); + var editor = new EditorView('#body-wrap', doc); editor.freeze(); + + var flashView = new FlashView('#flashview', messageCenter); var splitView = new SplitView('#splitview', doc); + leftPanelView = new PanelContainerView('#left-panel-container', doc); - rightPanelContainer = new PanelContainerView('#right-panel-container', doc); + rightPanelContainer = new PanelContainerView('#right-panel-container', doc); });