// Obiekt implementujący wzorzec KVC/KVO
Editor.Object = Class.extend({
+ _className: 'Editor.Object',
_observers: {},
+ _guid: null,
+
+ init: function() {
+ this._observers = {};
+ console.log('Created', this.guid());
+ },
+
+ description: function() {
+ return this._className + '(guid = ' + this.guid() + ')';
+ },
addObserver: function(observer, property, callback) {
+ console.log('Add observer', observer.description(), 'to', this.description(), '[', property, ']');
if (!this._observers[property]) {
this._observers[property] = {}
}
- this._observers[property][this.guid()] = callback;
+ this._observers[property][observer.guid()] = callback;
return this;
},
this.removeObserver(observer, property)
}
} else {
+ console.log('Remove observer', observer.description(), 'from', this.description(), '[', property, ']');
delete this._observers[property][observer.guid()];
}
return this;
notifyObservers: function(property) {
var currentValue = this[property];
for (var guid in this._observers[property]) {
- this._observers[property][guid](property, currentValue);
+ console.log(this._observers[property][guid]);
+ console.log('Notifying', guid, 'of', this.description(), '[', property, ']');
+ this._observers[property][guid](property, currentValue, this);
}
return this;
},
Editor.XMLModel = Editor.Model.extend({
+ _className: 'Editor.XMLModel',
serverURL: null,
init: function(serverURL) {
+ this._super();
this.serverURL = serverURL;
},
return this.data;
},
- setData: function(data) {
- this.data = data;
- this.dataChanged();
- },
-
load: function() {
if (!this.get('synced')) {
$.ajax({
Editor.HTMLModel = Editor.Model.extend({
+ _className: 'Editor.HTMLModel',
serverURL: null,
+ data: '',
init: function(serverURL) {
+ this._super();
this.serverURL = serverURL;
},
Editor.DocumentModel = Editor.Model.extend({
+ _className: 'Editor.DocumentModel',
data: null, // name, text_url, latest_rev, latest_shared_rev, parts_url, dc_url, size
contentModels: {},
init: function() {
+ this._super();
this.load();
},
'xml': new Editor.XMLModel(data.text_url),
'html': new Editor.HTMLModel(data.html_url)
};
+ for (var key in this.contentModels) {
+ this.contentModels[key].addObserver(this, 'data', this.contentModelDataChanged.bind(this));
+ }
+ },
+
+ contentModelDataChanged: function(property, value, contentModel) {
+ console.log('data of', contentModel.description(), 'changed!');
+ for (var key in this.contentModels) {
+ if (this.contentModels[key].guid() != contentModel.guid()) {
+ console.log(this.contentModels[key].description(), 'frozen');
+ this.contentModels[key].set('synced', false);
+ }
+ }
}
});
/*global View render_template panels */
var HTMLView = View.extend({
+ _className: 'HTMLView',
element: null,
model: null,
template: 'html-view-template',
- init: function(element, model, template) {
+ init: function(element, model, parent, template) {
this._super(element, model, template);
+ this.parent = parent;
this.model
.addObserver(this, 'data', this.modelDataChanged.bind(this))
.addObserver(this, 'synced', this.modelSyncChanged.bind(this));
+ $('.htmlview', this.element).html(this.model.get('data'));
if (!this.model.get('synced')) {
- this.freeze('Niezsynchronizowany...');
+ this.parent.freeze('Niezsynchronizowany...');
this.model.load();
- } else {
- $('.htmlview', this.element).html(this.model.get('data'));
}
},
modelSyncChanged: function(property, value) {
if (value) {
- this.unfreeze();
+ this.parent.unfreeze();
} else {
- this.freeze('Niezsynchronizowany...');
+ this.parent.freeze('Niezsynchronizowany...');
}
},
/*globals View render_template panels*/
var PanelContainerView = View.extend({
+ _className: 'PanelContainerView',
element: null,
model: null,
template: 'panel-container-view-template',
contentView: null,
init: function(element, model, template) {
- this.element = $(element);
- this.model = model;
- this.template = template || this.template;
-
- this.element.html(render_template(this.template, {panels: panels}));
+ this._super(element, model, template);
+
$('select', this.element.get(0)).bind('change.panel-container-view', this.selectChanged.bind(this));
},
this.contentView = null;
}
this.contentView = new klass($('.content-view',
- this.element.get(0)), this.model.contentModels[value]);
+ this.element.get(0)), this.model.contentModels[value], this);
},
dispose: function() {
// Split view inspired by jQuery Splitter Plugin http://methvin.com/splitter/
var SplitView = View.extend({
+ _className: 'SplitView',
splitbarClass: 'splitview-splitbar',
activeClass: 'splitview-active',
overlayClass: 'splitview-overlay',
_splitbarWidth: 0,
init: function(element, model) {
- this.element = $(element).css('position', 'relative');
- this.model = model;
+ this._super(element, model, null);
+ this.element.css('position', 'relative');
+ this._resizingSubviews = false;
+
this.views = $(">*", this.element[0]).css({
position: 'absolute', // positioned inside splitter container
'z-index': 1, // splitbar is positioned above
.unbind('mouseup.splitview');
},
+ resized: function(event) {
+ if (!this._resizingSubviews) {
+ this.resplit(Math.min(this.leftView.width(), this.element.width() - this._splitbarWidth));
+ }
+ },
+
resplit: function(newPosition) {
newPosition = Math.max(0, Math.min(newPosition, this.element.width() - this._splitbarWidth));
this.splitbar.css('left', newPosition);
width: this.element.width() - newPosition - this._splitbarWidth
});
if (!$.browser.msie) {
- this.views.trigger("resize");
+ this._resizingSubviews = true;
+ $(window).trigger('resize');
+ this._resizingSubviews = false;
}
},
/*globals Editor render_template*/
var View = Editor.Object.extend({
+ _className: 'View',
element: null,
model: null,
template: null,
overlayClass: 'view-overlay',
overlay: null,
- id: null,
init: function(element, model, template) {
this.element = $(element);
this.element.html(render_template(this.template, this));
}
- View.lastId = View.lastId + 1;
- this.id = 'view-' + View.lastId;
- },
-
- // Identyczność
- hash: function() {
-
+ this._resizeHandler = this.resized.bind(this);
+ $(window).bind('resize', this._resizeHandler);
+ $(this.element).bind('resize', this._resizeHandler);
},
frozen: function() {
width: this.element.width(),
height: this.element.height(),
top: this.element.position().top,
- left: this.element.position().left
+ left: this.element.position().left,
+ 'user-select': 'none',
+ '-webkit-user-select': 'none',
+ '-khtml-user-select': 'none',
+ '-moz-user-select': 'none',
+ overflow: 'hidden'
})
+ .attr('unselectable', 'on')
.appendTo(this.element.parent());
this.overlay.children('div').css({
}
},
+ resized: function(event) {
+ console.log('resized', this.description(), this.element);
+ if (this.frozen()) {
+ console.log('css!');
+ this.overlay.css({
+ position: 'absolute',
+ width: this.element.width(),
+ height: this.element.height(),
+ top: this.element.position().top,
+ left: this.element.position().left
+ });
+ }
+ },
+
dispose: function() {
+ $(window).unbind('resize', this._resizeHandler);
+ $(this.element).unbind('resize', this._resizeHandler);
this.unfreeze();
this.element.contents().remove();
}
});
-
-
-View.lastId = 0;
/*global View CodeMirror render_template panels */
var XMLView = View.extend({
+ _className: 'XMLView',
element: null,
model: null,
template: 'xml-view-template',
editor: null,
buttonToolbar: null,
- init: function(element, model, template) {
+ init: function(element, model, parent, template) {
this._super(element, model, template);
+ this.parent = parent;
- this.freeze('Ładowanie edytora...');
+ this.parent.freeze('Ładowanie edytora...');
this.editor = new CodeMirror($('.xmlview', this.element).get(0), {
parserfile: 'parsexml.js',
path: "/static/js/lib/codemirror/",
.addObserver(this, 'data', this.modelDataChanged.bind(this))
.addObserver(this, 'synced', this.modelSyncChanged.bind(this));
+ this.parent.unfreeze();
+
if (!this.model.get('synced')) {
- this.freeze('Niezsynchronizowany...');
+ this.parent.freeze('Niezsynchronizowany...');
this.model.load();
} else {
this.editor.setCode(this.model.get('data'));
}
- this.unfreeze();
// editor.grabKeys(
// $.fbind(self, self.hotkeyPressed),
modelSyncChanged: function(property, value) {
if (value) {
- this.unfreeze();
+ this.parent.unfreeze();
} else {
- this.freeze('Niezsynchronizowany...');
+ this.parent.freeze('Niezsynchronizowany...');
}
},