project/static/js/models.js

   1 /*globals Editor fileId SplitView PanelContainerView*/
   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 Editor.XMLModel = Editor.Model.extend({
  37   _className: 'Editor.XMLModel',
  38   serverURL: null,
  39   data: '',
  40
  41   init: function(serverURL) {
  42     this._super();
  43     this.serverURL = serverURL;
  44     this.toolbarButtonsModel = new Editor.ToolbarButtonsModel();
  45   },
  46
  47   getData: function() {
  48     if (!this.data) {
  49       this.reload();
  50     }
  51     return this.data;
  52   },
  53
  54   load: function() {
  55     if (!this.get('synced')) {
  56       $.ajax({
  57         url: this.serverURL,
  58         dataType: 'text',
  59         success: this.reloadSucceeded.bind(this)
  60       });
  61     }
  62   },
  63
  64   reloadSucceeded: function(data) {
  65     this.set('data', data);
  66     this.set('synced', true);
  67   }
  68 });
  69
  70
  71 Editor.HTMLModel = Editor.Model.extend({
  72   _className: 'Editor.HTMLModel',
  73   serverURL: null,
  74   data: '',
  75
  76   init: function(serverURL) {
  77     this._super();
  78     this.serverURL = serverURL;
  79   },
  80
  81   load: function() {
  82     if (!this.get('synced')) {
  83       $.ajax({
  84         url: this.serverURL,
  85         dataType: 'text',
  86         success: this.reloadSucceeded.bind(this)
  87       });
  88     }
  89   },
  90
  91   reloadSucceeded: function(data) {
  92     this.set('data', data);
  93     this.set('synced', true);
  94   }
  95 });
  96
  97
  98 Editor.DocumentModel = Editor.Model.extend({
  99   _className: 'Editor.DocumentModel',
 100   data: null, // name, text_url, latest_rev, latest_shared_rev, parts_url, dc_url, size
 101   contentModels: {},
 102
 103   init: function() {
 104     this._super();
 105     this.load();
 106   },
 107
 108   load: function() {
 109     console.log('DocumentModel#load');
 110     $.ajax({
 111       cache: false,
 112       url: documentsUrl + fileId,
 113       dataType: 'json',
 114       success: this.successfulLoad.bind(this)
 115     });
 116   },
 117
 118   successfulLoad: function(data) {
 119     console.log('DocumentModel#successfulLoad:', data);
 120     this.set('data', data);
 121     this.contentModels = {
 122       'xml': new Editor.XMLModel(data.text_url),
 123       'html': new Editor.HTMLModel(data.html_url)
 124     };
 125     for (var key in this.contentModels) {
 126       this.contentModels[key].addObserver(this, 'data', this.contentModelDataChanged.bind(this));
 127     }
 128   },
 129
 130   contentModelDataChanged: function(property, value, contentModel) {
 131     console.log('data of', contentModel.description(), 'changed!');
 132     for (var key in this.contentModels) {
 133       if (this.contentModels[key].guid() != contentModel.guid()) {
 134         console.log(this.contentModels[key].description(), 'frozen');
 135         this.contentModels[key].set('synced', false);
 136       }
 137     }
 138   }
 139 });
 140
 141
 142 var leftPanelView, rightPanelContainer, doc;
 143
 144 $(function() {
 145   doc = new Editor.DocumentModel();
 146   var editor = new EditorView('body', doc);
 147   var splitView = new SplitView('#splitview', doc);
 148   leftPanelView = new PanelContainerView('#left-panel-container', doc);
 149   rightPanelContainer = new PanelContainerView('#right-panel-container', doc);
 150 });