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

Palette creator can save palettes to local storage

Browse Source
This commit is contained in:
jdescottes
2014-09-06 12:37:11 +02:00
parent e8db80a0ec
commit 8441f28ac1
25 changed files with 603 additions and 846 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,19 +13,26 @@
ns.PalettesListController = function (paletteController, usedColorService) {
this.usedColorService = usedColorService;
this.paletteService = pskl.app.paletteService;
this.paletteController = paletteController;
};
ns.PalettesListController.prototype.init = function () {
this.paletteColorTemplate_ = pskl.utils.Template.get('palette-color-template');
this.colorListContainer_ = document.querySelector('.palettes-list-colors');
this.colorPaletteSelect_ = document.querySelector('.palettes-list-select');
this.createPaletteButton_ = document.querySelector('.create-palette-button');
var createPaletteButton_ = document.querySelector('.create-palette-button');
var paletteActions = document.querySelector('.palette-actions');
this.colorPaletteSelect_.addEventListener('change', this.onPaletteSelected_.bind(this));
this.colorListContainer_.addEventListener('mouseup', this.onColorContainerMouseup.bind(this));
this.colorListContainer_.addEventListener('contextmenu', this.onColorContainerContextMenu.bind(this));
this.createPaletteButton_.addEventListener('click', this.onCreatePaletteClick_.bind(this));
createPaletteButton_.addEventListener('click', this.onCreatePaletteClick_.bind(this));
paletteActions.addEventListener('click', this.onPaletteActionsClick_.bind(this));
$.subscribe(Events.PALETTE_LIST_UPDATED, this.onPaletteListUpdated.bind(this));
$.subscribe(Events.CURRENT_COLORS_UPDATED, this.fillColorListContainer.bind(this));
@ -42,7 +49,7 @@
id : Constants.CURRENT_COLORS_PALETTE_ID,
name : 'Current colors'
}];
palettes = palettes.concat(this.retrievePalettes());
palettes = palettes.concat(this.paletteService.getPalettes());
var html = palettes.map(function (palette) {
return pskl.utils.Template.replace('<option value="{{id}}">{{name}}</option>', palette);
@ -74,7 +81,7 @@
if (paletteId === Constants.CURRENT_COLORS_PALETTE_ID) {
colors = this.usedColorService.getCurrentColors();
} else {
var palette = this.getPaletteById(paletteId, this.retrievePalettes());
var palette = this.paletteService.getPaletteById(paletteId);
if (palette) {
colors = palette.colors;
}
@ -87,14 +94,14 @@
return colors;
};
ns.PalettesListController.prototype.selectPalette = function (paletteId) {
this.colorPaletteSelect_.value = paletteId;
};
ns.PalettesListController.prototype.selectPaletteFromUserSettings = function () {
this.selectPalette(pskl.UserSettings.get(pskl.UserSettings.SELECTED_PALETTE));
};
ns.PalettesListController.prototype.selectPalette = function (paletteId) {
this.colorPaletteSelect_.value = paletteId;
};
ns.PalettesListController.prototype.onPaletteSelected_ = function (evt) {
var paletteId = this.colorPaletteSelect_.value;
pskl.UserSettings.set(pskl.UserSettings.SELECTED_PALETTE, paletteId);
@ -102,7 +109,39 @@
};
ns.PalettesListController.prototype.onCreatePaletteClick_ = function (evt) {
$.publish(Events.DIALOG_DISPLAY, 'create-palette-method');
$.publish(Events.DIALOG_DISPLAY, 'create-palette');
};
ns.PalettesListController.prototype.onPaletteActionsClick_ = function (evt) {
var classList = evt.target.classList;
if (classList.contains('palette-action-edit')) {
this.editSelectedPalette_();
} else if (classList.contains('palette-action-delete')) {
this.deleteSelectedPalette_();
} else if (classList.contains('palette-action-download')) {
this.downloadSelectedPalette_();
}
};
ns.PalettesListController.prototype.editSelectedPalette_ = function () {
var paletteId = this.colorPaletteSelect_.value;
$.publish(Events.DIALOG_DISPLAY, {
dialogId : 'create-palette',
initArgs : paletteId
});
};
ns.PalettesListController.prototype.deleteSelectedPalette_ = function () {
var paletteId = this.colorPaletteSelect_.value;
var palette = this.paletteService.getPaletteById(paletteId);
if (window.confirm('Are you sure you want to delete palette ' + palette.name)) {
this.paletteService.deletePaletteById(palette.id);
this.selectPalette(Constants.CURRENT_COLORS_PALETTE_ID);
}
};
ns.PalettesListController.prototype.downloadSelectedPalette_ = function () {
window.alert('not implemented yet');
};
ns.PalettesListController.prototype.onColorContainerContextMenu = function (event) {
@ -155,21 +194,4 @@
this.selectPaletteFromUserSettings();
this.fillColorListContainer();
};
ns.PalettesListController.prototype.getPaletteById = function (paletteId, palettes) {
var match = null;
palettes.forEach(function (palette) {
if (palette.id === paletteId) {
match = palette;
}
});
return match;
};
ns.PalettesListController.prototype.retrievePalettes = function () {
var palettesString = window.localStorage.getItem('piskel.palettes');
return JSON.parse(palettesString) || [];
};
})();