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

Issue #277 : Add global StorageService, enable CTRL+S

Browse Source
This commit is contained in:
jdescottes
2015-09-19 22:54:37 +02:00
parent 758cc6202a
commit 6620f7e5a9
11 changed files with 355 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files

219
src/js/controller/settings/SaveController.js
View File

@@ -11,52 +11,61 @@
* @public
*/
ns.SaveController.prototype.init = function () {
// timestamp used to generate unique name when saving as .piskel
this.timestamp = new Date();
var saveForm = document.querySelector('.save-form');
this.getPartials_().forEach(function (partial) {
pskl.utils.Template.insert(saveForm, 'beforeend', partial);
});
this.insertPartials_();
// Only available in app-engine mode
this.piskelName = document.querySelector('.piskel-name');
this.saveOnlineStatus = document.querySelector('#save-online-status');
this.saveFileStatus = document.querySelector('#save-file-status');
this.descriptionInput = document.querySelector('#save-description');
this.nameInput = document.querySelector('#save-name');
this.saveOnlineButton = document.querySelector('#save-online-button');
this.isPublicCheckbox = document.querySelector('input[name=save-public-checkbox]');
this.saveFileButton = document.querySelector('#save-file-button');
this.saveBrowserButton = document.querySelector('#save-browser-button');
var descriptor = this.piskelController.getPiskel().getDescriptor();
this.descriptionInput.value = descriptor.description;
this.nameInput.value = descriptor.name;
if (descriptor.isPublic) {
this.isPublicCheckbox.setAttribute('checked', true);
this.addEventListener(this.saveFileButton, 'click', this.saveFile_);
this.addEventListener(this.saveBrowserButton, 'click', this.saveBrowser_);
this.addEventListener('form[name=save-form]', 'submit', this.onSaveFormSubmit_);
$.subscribe(Events.BEFORE_SAVING_PISKEL, this.disableSaveButtons_.bind(this));
$.subscribe(Events.AFTER_SAVING_PISKEL, this.enableSaveButtons_.bind(this));
if (pskl.app.isLoggedIn()) {
this.authenticatedUserInit_();
}
if (pskl.utils.Environment.detectNodeWebkit()) {
this.addEventListener('#save-as-button', 'click', this.saveAs_);
}
this.addEventListener('#save-file-button', 'click', this.saveFile_);
this.addEventListener('#save-browser-button', 'click', this.saveLocal_);
this.addEventListener(this.saveOnlineButton, 'click', this.saveOnline_);
this.addEventListener('form[name=save-form]', 'submit', this.onSaveFormSubmit_);
if (pskl.app.isLoggedIn()) {
pskl.utils.Template.insert(this.saveOnlineStatus, 'beforeend', 'save-online-status-partial');
} else {
pskl.utils.Template.insert(this.saveOnlineStatus, 'beforeend', 'save-please-login-partial');
var container = document.querySelector('.setting-save-section');
container.classList.add('anonymous');
this.desktopApplicationInit_();
}
};
ns.SaveController.prototype.insertPartials_ = function () {
ns.SaveController.prototype.authenticatedUserInit_ = function () {
var descriptor = this.piskelController.getPiskel().getDescriptor();
this.isPublicCheckbox = document.querySelector('input[name=save-public-checkbox]');
if (descriptor.isPublic) {
this.isPublicCheckbox.setAttribute('checked', true);
}
this.saveOnlineButton = document.querySelector('#save-online-button');
this.addEventListener(this.saveOnlineButton, 'click', this.saveOnline_);
};
ns.SaveController.prototype.desktopApplicationInit_ = function () {
this.saveAsNewButton = document.querySelector('#save-as-button');
this.addEventListener('#save-as-button', 'click', this.saveAs_);
};
ns.SaveController.prototype.getPartials_ = function () {
var partials = [];
if (pskl.utils.Environment.detectNodeWebkit()) {
partials = [
'save-file-nw-partial',
'save-localstorage-partial',
'save-online-partial'
'save-online-unavailable-partial'
];
} else if (pskl.app.isLoggedIn()) {
partials = [
@@ -68,21 +77,11 @@
partials = [
'save-file-partial',
'save-localstorage-partial',
'save-online-partial'
'save-online-unavailable-partial'
];
}
var container = document.querySelector('.save-form');
partials.forEach(function (partial) {
pskl.utils.Template.insert(container, 'beforeend', partial);
});
};
ns.SaveController.prototype.getLocalFilename_ = function () {
var piskelName = this.getName();
var timestamp = pskl.utils.DateUtils.format(this.timestamp, '{{Y}}{{M}}{{D}}-{{H}}{{m}}{{s}}');
return piskelName + '-' + timestamp + '.piskel';
return partials;
};
ns.SaveController.prototype.onSaveFormSubmit_ = function (evt) {
@@ -94,127 +93,105 @@
} else {
this.saveLocal_();
}
};
ns.SaveController.prototype.saveOnline_ = function () {
var name = this.getName();
if (!name) {
name = window.prompt('Please specify a name', 'New piskel');
}
if (name) {
var description = this.getDescription();
var isPublic = this.isPublic_();
var descriptor = new pskl.model.piskel.Descriptor(name, description, isPublic);
this.piskelController.getPiskel().setDescriptor(descriptor);
this.beforeSaving_();
this.saveOnlineButton.setAttribute('disabled', true);
this.saveOnlineStatus.innerHTML = 'Saving ...';
pskl.app.storageService.store({
success : this.onSaveSuccess_.bind(this),
error : this.onSaveError_.bind(this),
after : this.afterOnlineSaving_.bind(this)
});
}
this.beforeSaving_();
var piskel = this.piskelController.getPiskel();
pskl.app.storageService.saveToGallery(piskel).then(this.onSaveSuccess_);
};
ns.SaveController.prototype.saveLocal_ = function () {
var localStorageService = pskl.app.localStorageService;
var isOk = true;
var name = this.getName();
var description = this.getDescription();
if (localStorageService.getPiskel(name)) {
isOk = window.confirm('There is already a piskel saved as ' + name + '. Override ?');
}
if (isOk) {
this.beforeSaving_();
localStorageService.save(name, description, pskl.app.piskelController.serialize());
window.setTimeout(function () {
this.onSaveSuccess_();
this.afterSaving_();
}.bind(this), 500);
}
ns.SaveController.prototype.saveBrowser_ = function () {
this.beforeSaving_();
var piskel = this.piskelController.getPiskel();
pskl.app.storageService.saveToLocalStorage(piskel).then(this.onSaveSuccess_);
};
ns.SaveController.prototype.saveFile_ = function () {
// detect if this is running in NodeWebkit
if (pskl.utils.Environment.detectNodeWebkit()) {
pskl.app.desktopStorageService.save();
this.saveFileDesktop_();
} else {
this.saveFileBrowser_();
}
};
ns.SaveController.prototype.saveAs_ = function () {
pskl.app.desktopStorageService.savePiskelAs();
};
ns.SaveController.prototype.saveFileBrowser_ = function () {
this.beforeSaving_();
pskl.utils.BlobUtils.stringToBlob(pskl.app.piskelController.serialize(), function(blob) {
pskl.utils.FileUtils.downloadAsFile(blob, this.getLocalFilename_());
this.onSaveSuccess_();
this.afterSaving_();
}.bind(this), 'application/piskel+json');
var piskel = this.piskelController.getPiskel();
pskl.app.storageService.saveToFileBrowser(piskel).then(this.onSaveSuccess_);
};
ns.SaveController.prototype.getName = function () {
ns.SaveController.prototype.saveFileDesktop_ = function () {
this.beforeSaving_();
var piskel = this.piskelController.getPiskel();
pskl.app.storageService.saveToFileNodeWebkit(piskel).then(this.onSaveSuccess_);
};
ns.SaveController.prototype.saveAs_ = function () {
this.beforeSaving_();
var piskel = this.piskelController.getPiskel();
pskl.app.storageService.saveToFileNodeWebkit(piskel, true).then(this.onSaveSuccess_);
};
ns.SaveController.prototype.getDescriptor_ = function () {
var name = this.getName_();
var description = this.getDescription_();
var isPublic = this.isPublic_();
return new pskl.model.piskel.Descriptor(name, description, isPublic);
};
ns.SaveController.prototype.getName_ = function () {
return this.nameInput.value;
};
ns.SaveController.prototype.getDescription = function () {
ns.SaveController.prototype.getDescription_ = function () {
return this.descriptionInput.value;
};
ns.SaveController.prototype.isPublic_ = function () {
return !!this.isPublicCheckbox.checked;
};
ns.SaveController.prototype.beforeSaving_ = function () {
this.updatePiskelDescriptor_();
if (this.piskelName) {
this.piskelName.classList.add('piskel-name-saving');
if (!this.isPublicCheckbox) {
return true;
}
};
ns.SaveController.prototype.updatePiskelDescriptor_ = function () {
var name = this.getName();
var description = this.getDescription();
var isPublic = this.isPublic_();
var descriptor = new pskl.model.piskel.Descriptor(name, description, isPublic);
this.piskelController.getPiskel().setDescriptor(descriptor);
return !!this.isPublicCheckbox.checked;
};
ns.SaveController.prototype.onSaveSuccess_ = function () {
$.publish(Events.CLOSE_SETTINGS_DRAWER);
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Successfully saved !'}]);
$.publish(Events.PISKEL_SAVED);
};
ns.SaveController.prototype.onSaveError_ = function (status) {
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Saving failed (' + status + ')'}]);
ns.SaveController.prototype.beforeSaving_ = function () {
this.piskelController.getPiskel().setDescriptor(this.getDescriptor_());
};
ns.SaveController.prototype.afterOnlineSaving_ = function () {
this.saveOnlineButton.setAttribute('disabled', false);
this.saveOnlineStatus.innerHTML = '';
this.afterSaving_();
ns.SaveController.prototype.disableSaveButtons_ = function () {
this.setDisabled_(this.saveFileButton, true);
this.setDisabled_(this.saveBrowserButton, true);
this.setDisabled_(this.saveOnlineButton, true);
this.setDisabled_(this.saveAsNewButton, true);
};
ns.SaveController.prototype.afterSaving_ = function () {
if (this.piskelName) {
this.piskelName.classList.remove('piskel-name-saving');
ns.SaveController.prototype.enableSaveButtons_ = function () {
this.setDisabled_(this.saveFileButton, false);
this.setDisabled_(this.saveBrowserButton, false);
this.setDisabled_(this.saveOnlineButton, false);
this.setDisabled_(this.saveAsNewButton, false);
};
/**
* Safely update the disabled attribute on a HTML element.
* Noop if the element is falsy
*/
ns.SaveController.prototype.setDisabled_ = function (element, isDisabled) {
if (!element) {
return;
}
window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 5000);
if (isDisabled) {
element.setAttribute('disabled', 'disabled');
} else {
element.removeAttribute('disabled');
}
};
})();