Dodanie stanów do modeli
[redakcja.git] / project / static / js / models.js
1 /*globals Editor fileId SplitView PanelContainerView EditorView*/
2 var documentsUrl = '/api/documents/';
3
4
5 Editor.Model = Editor.Object.extend({
6   synced: false,
7   data: null
8 });
9
10
11 Editor.ToolbarButtonsModel = Editor.Model.extend({
12   _className: 'Editor.ToolbarButtonsModel',
13   serverURL: '/api/toolbar/buttons',
14   buttons: {},
15   
16   init: function() {
17     this._super();
18   },
19   
20   load: function() {
21     if (!this.get('buttons').length) {
22       $.ajax({
23         url: this.serverURL,
24         dataType: 'json',
25         success: this.loadSucceeded.bind(this)
26       });
27     }
28   },
29   
30   loadSucceeded: function(data) {
31     this.set('buttons', data);
32   }
33 });
34
35
36 // Stany modelu:
37 //
38 // empty -> loading -> synced -> unsynced -> loading
39 //                           \
40 //                            -> dirty -> updating -> synced
41 //
42 Editor.XMLModel = Editor.Model.extend({
43   _className: 'Editor.XMLModel',
44   serverURL: null,
45   data: '',
46   state: 'empty',
47   
48   init: function(serverURL) {
49     this._super();
50     this.set('state', 'empty');
51     this.serverURL = serverURL;
52     this.toolbarButtonsModel = new Editor.ToolbarButtonsModel();
53     this.addObserver(this, 'data', this.dataChanged.bind(this));
54   },
55   
56   load: function() {
57     if (this.get('state') == 'empty') {
58       this.set('state', 'loading');
59       $.ajax({
60         url: this.serverURL,
61         dataType: 'text',
62         success: this.loadingSucceeded.bind(this)
63       });
64     }
65   },
66   
67   set: function(property, value) {
68     if (property == 'state') {
69       console.log(this.description(), ':', property, '=', value);
70     }
71     return this._super(property, value);
72   },
73   
74   dataChanged: function(property, value) {
75     if (this.get('state') == 'synced') {
76       this.set('state', 'dirty');
77     }
78   },
79   
80   loadingSucceeded: function(data) {
81     if (this.get('state') != 'loading') {
82       alert('erroneous state:', this.get('state'));
83     }
84     this.set('data', data);
85     this.set('state', 'synced');
86   },
87   
88   dispose: function() {
89     this.removeObserver(this);
90     this._super();
91   }
92 });
93
94
95 Editor.HTMLModel = Editor.Model.extend({
96   _className: 'Editor.HTMLModel',
97   serverURL: null,
98   data: '',
99   state: 'empty',
100   
101   init: function(serverURL) {
102     this._super();
103     this.set('state', 'empty');
104     this.serverURL = serverURL;
105   },
106   
107   load: function() {
108     if (this.get('state') == 'empty') {
109       this.set('state', 'loading');
110       $.ajax({
111         url: this.serverURL,
112         dataType: 'text',
113         success: this.loadingSucceeded.bind(this)
114       });
115     }
116   },
117   
118   loadingSucceeded: function(data) {
119     if (this.get('state') != 'loading') {
120       alert('erroneous state:', this.get('state'));
121     }
122     this.set('data', data);
123     this.set('state', 'synced');
124   },
125   
126   set: function(property, value) {
127     if (property == 'state') {
128       console.log(this.description(), ':', property, '=', value);
129     }
130     return this._super(property, value);
131   }
132 });
133
134
135 Editor.DocumentModel = Editor.Model.extend({
136   _className: 'Editor.DocumentModel',
137   data: null, // name, text_url, latest_rev, latest_shared_rev, parts_url, dc_url, size
138   contentModels: {},
139   state: 'empty',
140   
141   init: function() {
142     this._super();
143     this.set('state', 'empty');
144     this.load();
145   },
146   
147   load: function() {
148     if (this.get('state') == 'empty') {
149       this.set('state', 'loading');
150       $.ajax({
151         cache: false,
152         url: documentsUrl + fileId,
153         dataType: 'json',
154         success: this.successfulLoad.bind(this)
155       });
156     }
157   },
158   
159   successfulLoad: function(data) {
160     this.set('data', data);
161     this.set('state', 'synced');
162     this.contentModels = {
163       'xml': new Editor.XMLModel(data.text_url),
164       'html': new Editor.HTMLModel(data.html_url)
165     };
166     for (var key in this.contentModels) {
167       this.contentModels[key].addObserver(this, 'state', this.contentModelStateChanged.bind(this));
168     }
169   },
170   
171   contentModelStateChanged: function(property, value, contentModel) {
172     if (value == 'dirty') {
173       for (var key in this.contentModels) {
174         if (this.contentModels[key].guid() != contentModel.guid()) {
175           // console.log(this.contentModels[key].description(), 'frozen');
176           this.contentModels[key].set('state', 'unsynced');
177         }
178       }
179     }
180   }
181 });
182
183
184 var leftPanelView, rightPanelContainer, doc;
185
186 $(function() {
187   doc = new Editor.DocumentModel();
188   var editor = new EditorView('#body-wrap', doc);
189   var splitView = new SplitView('#splitview', doc);
190   leftPanelView = new PanelContainerView('#left-panel-container', doc);
191   rightPanelContainer = new PanelContainerView('#right-panel-container', doc);
192 });