X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/01465cea212ef30b7e580a3ff7e30a82b13ae8f8..359e0f406798548adbf6f0768c3e5c4cd20cbe7b:/project/static/js/models.js diff --git a/project/static/js/models.js b/project/static/js/models.js index f6725a5f..3cd98f67 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 @@ -45,33 +43,57 @@ Editor.XMLModel = Editor.Model.extend({ data: '', state: 'empty', - init: function(serverURL) { + init: function(serverURL, revision) { this._super(); this.set('state', 'empty'); + this.set('revision', revision); this.serverURL = serverURL; this.toolbarButtonsModel = new Editor.ToolbarButtonsModel(); 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'); + messageCenter.addMessage('info', 'Wczytuję XML...'); $.ajax({ url: this.serverURL, dataType: 'text', - success: this.loadingSucceeded.bind(this) + data: {revision: this.get('revision')}, + 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'); + messageCenter.addMessage('success', 'Wczytałem XML :-)'); + }, + + 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'); + messageCenter.addMessage('error', 'Nie udało mi się wczytać XML. Spróbuj ponownie :-('); + }, + update: function(message) { if (this.get('state') == 'dirty') { this.set('state', 'updating'); + messageCenter.addMessage('info', 'Zapisuję XML...'); var payload = { - contents: this.get('data') + contents: this.get('data'), + revision: this.get('revision') }; if (message) { payload.message = message; @@ -79,7 +101,7 @@ Editor.XMLModel = Editor.Model.extend({ $.ajax({ url: this.serverURL, - type: 'put', + type: 'post', dataType: 'json', data: payload, success: this.updatingSucceeded.bind(this), @@ -90,17 +112,20 @@ 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'); + messageCenter.addMessage('success', 'Zapisałem XML :-)'); }, updatingFailed: function() { if (this.get('state') != 'updating') { alert('erroneous state:', this.get('state')); } + messageCenter.addMessage('error', 'Nie udało mi się zapisać XML. Spróbuj ponownie :-('); this.set('state', 'dirty'); }, @@ -118,14 +143,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(); @@ -139,19 +156,23 @@ Editor.HTMLModel = Editor.Model.extend({ data: '', state: 'empty', - init: function(serverURL) { + init: function(serverURL, revision) { this._super(); this.set('state', 'empty'); + this.set('revision', revision); this.serverURL = serverURL; }, - load: function() { - if (this.get('state') == 'empty') { + load: function(force) { + if (force || this.get('state') == 'empty') { this.set('state', 'loading'); + messageCenter.addMessage('info', 'Wczytuję HTML...'); $.ajax({ url: this.serverURL, dataType: 'text', - success: this.loadingSucceeded.bind(this) + data: {revision: this.get('revision')}, + success: this.loadingSucceeded.bind(this), + error: this.loadingFailed.bind(this) }); } }, @@ -162,6 +183,16 @@ Editor.HTMLModel = Editor.Model.extend({ } this.set('data', data); this.set('state', 'synced'); + messageCenter.addMessage('success', 'Wczytałem HTML :-)'); + }, + + 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'); + messageCenter.addMessage('error', 'Nie udało mi się wczytać HTML. Spróbuj ponownie :-('); }, // For debbuging @@ -185,11 +216,11 @@ Editor.ImageGalleryModel = Editor.Model.extend({ this.set('state', 'empty'); this.serverURL = serverURL; // olewać data - this.pages = [] + this.pages = []; }, - load: function() { - if (this.get('state') == 'empty') { + load: function(force) { + if (force || this.get('state') == 'empty') { this.set('state', 'loading'); $.ajax({ url: this.serverURL, @@ -204,15 +235,15 @@ Editor.ImageGalleryModel = Editor.Model.extend({ alert('erroneous state:', this.get('state')); } - $.log('galleries:', data); + console.log('galleries:', data); - if (data.length == 0) + if (data.length === 0) { this.set('data', []); - else { - $.log('dupa'); + } else { + console.log('dupa'); this.set('data', data[0].pages); - } - + } + this.set('state', 'synced'); }, @@ -227,7 +258,7 @@ Editor.ImageGalleryModel = Editor.Model.extend({ Editor.DocumentModel = Editor.Model.extend({ _className: 'Editor.DocumentModel', - data: null, // name, text_url, latest_rev, latest_shared_rev, parts_url, dc_url, size + data: null, // name, text_url, user_revision, latest_shared_rev, parts_url, dc_url, size, merge_url contentModels: {}, state: 'empty', @@ -240,6 +271,7 @@ Editor.DocumentModel = Editor.Model.extend({ load: function() { if (this.get('state') == 'empty') { this.set('state', 'loading'); + messageCenter.addMessage('info', 'Ładuję dane dokumentu...'); $.ajax({ cache: false, url: documentsUrl + fileId, @@ -253,13 +285,14 @@ Editor.DocumentModel = Editor.Model.extend({ this.set('data', data); this.set('state', 'synced'); this.contentModels = { - 'xml': new Editor.XMLModel(data.text_url), - 'html': new Editor.HTMLModel(data.html_url), + 'xml': new Editor.XMLModel(data.text_url, data.user_revision), + 'html': new Editor.HTMLModel(data.html_url, data.user_revision), 'gallery': new Editor.ImageGalleryModel(data.gallery_url) }; for (var key in this.contentModels) { this.contentModels[key].addObserver(this, 'state', this.contentModelStateChanged.bind(this)); } + messageCenter.addMessage('success', 'Dane dokumentu zostały załadowane :-)'); }, contentModelStateChanged: function(property, value, contentModel) { @@ -275,7 +308,12 @@ 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'); + } + } + 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'); } } @@ -292,11 +330,81 @@ Editor.DocumentModel = Editor.Model.extend({ }, update: function() { - + this.set('state', 'loading'); + messageCenter.addMessage('info', 'Uaktualniam dokument...'); + $.ajax({ + url: this.data.merge_url, + dataType: 'json', + type: 'post', + data: { + type: 'update', + target_revision: this.data.user_revision + }, + complete: this.updateCompleted.bind(this), + success: function(data) { this.set('updateData', data); }.bind(this) + }); }, - merge: function() { - + updateCompleted: function(xhr, textStatus) { + 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'); + } + messageCenter.addMessage('success', 'Uaktualniłem dokument do najnowszej wersji :-)'); + } else if (xhr.status == 202) { // Wygenerowano PullRequest (tutaj?) + } else if (xhr.status == 204) { // Nic nie zmieniono + messageCenter.addMessage('info', 'Nic się nie zmieniło od ostatniej aktualizacji. Po co mam uaktualniać?'); + } else if (xhr.status == 409) { // Konflikt podczas operacji + messageCenter.addMessage('error', 'Wystąpił konflikt podczas aktualizacji. Pędź po programistów! :-('); + } else if (xhr.status == 500) { + messageCenter.addMessage('critical', 'Błąd serwera. Pędź po programistów! :-('); + } + this.set('state', 'synced'); + this.set('updateData', null); + }, + + merge: function(message) { + this.set('state', 'loading'); + messageCenter.addMessage('info', 'Scalam dokument z głównym repozytorium...'); + $.ajax({ + url: this.data.merge_url, + type: 'post', + dataType: 'json', + data: { + type: 'share', + target_revision: this.data.user_revision, + message: message + }, + complete: this.mergeCompleted.bind(this), + success: function(data) { this.set('mergeData', data); }.bind(this) + }); + }, + + mergeCompleted: function(xhr, textStatus) { + console.log(xhr.status, textStatus); + if (xhr.status == 200) { // Sukces + this.data.user_revision = this.get('mergeData').revision; + for (var key in this.contentModels) { + this.contentModels[key].set('revision', this.data.user_revision); + this.contentModels[key].set('state', 'empty'); + } + messageCenter.addMessage('success', 'Scaliłem dokument z głównym repozytorium :-)'); + } else if (xhr.status == 202) { // Wygenerowano PullRequest + messageCenter.addMessage('success', 'Wysłałem prośbę o scalenie dokumentu z głównym repozytorium.'); + } else if (xhr.status == 204) { // Nic nie zmieniono + messageCenter.addMessage('info', 'Nic się nie zmieniło od ostatniego scalenia. Po co mam scalać?'); + } else if (xhr.status == 409) { // Konflikt podczas operacji + messageCenter.addMessage('error', 'Wystąpił konflikt podczas scalania. Pędź po programistów! :-('); + } else if (xhr.status == 500) { + messageCenter.addMessage('critical', 'Błąd serwera. Pędź po programistów! :-('); + } + this.set('state', 'synced'); + this.set('mergeData', null); }, // For debbuging @@ -311,11 +419,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); });