mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Fix : bug when setting switching primary and secondary colors

Browse Source
This commit is contained in:
jdescottes 2014-05-08 21:56:36 +02:00
parent 637fa05109
commit 3969867dfa
2 changed files with 29 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/js/Constants.js
View File

@ -20,7 +20,7 @@ var Constants = {
TRANSPARENT_COLOR : 'rgba(0, 0, 0, 0)', TRANSPARENT_COLOR : 'rgba(0, 0, 0, 0)',
NO_PALETTE_ID : '__no-palette', NO_PALETTE_ID : '__no-palette',
CURRENT_PALETTE_ID : '__current-colors', CURRENT_COLORS_PALETTE_ID : '__current-colors',
MANAGE_PALETTE_ID : '__manage-palettes', MANAGE_PALETTE_ID : '__manage-palettes',
// Used for Spectrum input // Used for Spectrum input

60
src/js/controller/PalettesListController.js
View File

@ -18,8 +18,8 @@
$.subscribe(Events.PALETTE_LIST_UPDATED, this.onPaletteListUpdated.bind(this)); $.subscribe(Events.PALETTE_LIST_UPDATED, this.onPaletteListUpdated.bind(this));
$.subscribe(Events.CURRENT_COLORS_UPDATED, this.fillColorListContainer.bind(this)); $.subscribe(Events.CURRENT_COLORS_UPDATED, this.fillColorListContainer.bind(this));
$.subscribe(Events.PRIMARY_COLOR_SELECTED, this.onColorUpdated.bind(this, 'primary')); $.subscribe(Events.PRIMARY_COLOR_SELECTED, this.highlightSelectedColors.bind(this));
$.subscribe(Events.SECONDARY_COLOR_SELECTED, this.onColorUpdated.bind(this, 'secondary')); $.subscribe(Events.SECONDARY_COLOR_SELECTED, this.highlightSelectedColors.bind(this));
this.fillPaletteList(); this.fillPaletteList();
this.selectPaletteFromUserSettings(); this.selectPaletteFromUserSettings();
@ -40,23 +40,14 @@
}; };
ns.PalettesListController.prototype.fillColorListContainer = function () { ns.PalettesListController.prototype.fillColorListContainer = function () {
var html = ''; var colors = this.getSelectedPaletteColors_();
var colors = [];
var palette = this.getSelectedPalette();
if (palette) {
colors = palette.colors;
} else if (this.colorPaletteSelect_.value === Constants.CURRENT_PALETTE_ID) {
colors = this.usedColorService.currentColors;
}
html = colors.map(function (color) { var html = colors.map(function (color) {
return pskl.utils.Template.replace(this.paletteColorTemplate_, {color : color}); return pskl.utils.Template.replace(this.paletteColorTemplate_, {color : color});
}.bind(this)).join(''); }.bind(this)).join('');
this.colorListContainer_.innerHTML = html; this.colorListContainer_.innerHTML = html;
this.onColorUpdated('primary', null, this.paletteController.getPrimaryColor()); this.highlightSelectedColors();
this.onColorUpdated('secondary', null, this.paletteController.getSecondaryColor());
var hasScrollbar = colors.length > 20; var hasScrollbar = colors.length > 20;
if (hasScrollbar && !pskl.utils.UserAgent.isChrome) { if (hasScrollbar && !pskl.utils.UserAgent.isChrome) {
@ -66,11 +57,18 @@
} }
}; };
ns.PalettesListController.prototype.getSelectedPalette = function (evt) { ns.PalettesListController.prototype.getSelectedPaletteColors_ = function () {
var colors = [];
var paletteId = this.colorPaletteSelect_.value; var paletteId = this.colorPaletteSelect_.value;
var palettes = this.retrievePalettes(); if (paletteId === Constants.CURRENT_COLORS_PALETTE_ID) {
var palette = this.getPaletteById(paletteId, palettes); colors = this.usedColorService.currentColors;
return palette; } else {
var palette = this.getPaletteById(paletteId, this.retrievePalettes());
if (palette) {
colors = palette.colors;
}
}
return colors;
}; };
ns.PalettesListController.prototype.selectPalette = function (paletteId) { ns.PalettesListController.prototype.selectPalette = function (paletteId) {
@ -112,24 +110,22 @@
} }
}; };
ns.PalettesListController.prototype.onColorUpdated = function (type, event, color) { ns.PalettesListController.prototype.highlightSelectedColors = function (event) {
var colorContainer = this.colorListContainer_.querySelector('.palettes-list-color[data-color="'+color+'"]'); this.removeClass_('primary', '.palettes-list-color');
this.removeClass_('secondary', '.palettes-list-color');
// Color is not in the currently selected palette var secondaryColor = this.paletteController.getSecondaryColor();
if (!colorContainer) { var colorContainer = this.colorListContainer_.querySelector('.palettes-list-color[data-color="'+secondaryColor+'"]');
return; if (colorContainer) {
colorContainer.classList.remove('primary');
colorContainer.classList.add('secondary');
} }
if (type === 'primary') { var primaryColor = this.paletteController.getPrimaryColor();
this.removeClass_('primary', '.palettes-list-color'); colorContainer = this.colorListContainer_.querySelector('.palettes-list-color[data-color="'+primaryColor+'"]');
colorContainer.classList.add('primary'); if (colorContainer) {
colorContainer.classList.remove('secondary'); colorContainer.classList.remove('secondary');
} else if (type === 'secondary') { colorContainer.classList.add('primary');
this.removeClass_('secondary', '.palettes-list-color');
colorContainer.classList.add('secondary');
colorContainer.classList.remove('primary');
} else {
throw 'No type provided for color update. Expecting "primary" or "secondary"';
} }
}; };