Create an event based UserSettings and use it for the grid diplay state.

This commit is contained in:
Vince 2013-06-17 20:24:27 +02:00
parent 889d5c0d53
commit 1d4ff1d2de
5 changed files with 37 additions and 26 deletions

View File

@ -31,7 +31,13 @@ Events = {
*/
REDRAW_PREVIEWFILM: "REDRAW_PREVIEWFILM",
GRID_DISPLAY_STATE_CHANGED: "GRID_DISPLAY_STATE_CHANGED",
/**
* Fired each time a user setting change.
* The payload will be:
* 1st argument: Name of the settings
* 2nd argument: New value
*/
USER_SETTINGS_CHANGED: "USER_SETTINGS_CHANGED",
/**
* The framesheet was reseted and is now probably drastically different.

View File

@ -61,7 +61,7 @@
$(window).resize($.proxy(this.startDPIUpdateTimer_, this));
$.subscribe(Events.FRAME_SIZE_CHANGED, $.proxy(this.updateDPI_, this));
$.subscribe(Events.GRID_DISPLAY_STATE_CHANGED, $.proxy(this.forceRendering_, this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
};
ns.DrawingController.prototype.initMouseBehavior = function() {
@ -83,6 +83,15 @@
this.dpiUpdateTimer = window.setTimeout($.proxy(this.updateDPI_, this), 200);
},
/**
* @private
*/
ns.DrawingController.prototype.onUserSettingsChange_ = function (evt, settingsName, settingsValue) {
if(settingsName == pskl.UserSettings.SHOW_GRID) {
this.forceRendering_();
}
},
/**
* @private
*/

View File

@ -3,19 +3,6 @@
ns.SettingsController = function () {};
/**
* Get state for the checkbox that control the display of the grid
* on the drawing canvas.
* @private
*/
ns.SettingsController.prototype.isShowGridChecked_ = function() {
var showGridCheckbox = $('#show-grid');
var isChecked = showGridCheckbox.is(':checked');
return isChecked;
};
// TODO(vincz): add get/set store
/**
* @public
*/
@ -30,11 +17,9 @@
$('#settings').toggleClass('has-expanded-drawer');
});
// Show/hide the grid on drawing canvas:
$.publish(Events.GRID_DISPLAY_STATE_CHANGED, [this.isShowGridChecked_()]);
// Handle grid display changes:
$('#show-grid').change($.proxy(function(evt) {
var checked = this.isShowGridChecked_();
$.publish(Events.GRID_DISPLAY_STATE_CHANGED, [checked]);
var checked = $('#show-grid').prop('checked');
pskl.UserSettings.set(pskl.UserSettings.SHOW_GRID, checked);
}, this));

View File

@ -21,13 +21,14 @@
this.className = className;
this.canvas = null;
this.hasGrid = renderingOptions.hasGrid;
this.gridStrokeWidth = 0;
this.gridStrokeWidth = pskl.UserSettings.get(pskl.UserSettings.SHOW_GRID) ? Constants.GRID_STROKE_WIDTH : 0;
// Flag to know if the config was altered
this.canvasConfigDirty = true;
if(this.hasGrid) {
$.subscribe(Events.GRID_DISPLAY_STATE_CHANGED, $.proxy(this.showGrid, this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
}
};
@ -41,7 +42,17 @@
this.canvasConfigDirty = true;
};
ns.FrameRenderer.prototype.showGrid = function (evt, show) {
/**
* @private
*/
ns.FrameRenderer.prototype.onUserSettingsChange_ = function (evt, settingsName, settingsValue) {
if(settingsName == pskl.UserSettings.SHOW_GRID) {
this.enableGrid(settingsValue);
}
};
ns.FrameRenderer.prototype.enableGrid = function (show) {
this.gridStrokeWidth = 0;
if(show) {

View File

@ -12,9 +12,7 @@
/**
* @private
*/
cache_: {
},
cache_: {},
/**
* Static method to access a user defined settings value ot its default
@ -31,7 +29,9 @@
set : function (key, value) {
this.checKeyValidity_(key);
this.cache_[key] = value;
this.set_(key, value);
this.set_(key, value);
$.publish(Events.USER_SETTINGS_CHANGED, [key, value]);
},
/**