1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-07 23:22:43 +02:00

feat: add auto saving. fixes #154

This commit is contained in:
Kushagra Gour
2017-07-15 17:40:25 +05:30
parent 51c5aa8894
commit b7fb978731
2 changed files with 45 additions and 7 deletions

View File

@ -440,6 +440,9 @@
<label class="line">
<input type="checkbox" d-change="updateSetting" data-setting="autoPreview"> Auto-preview
</label>
<label class="line">
<input type="checkbox" d-change="updateSetting" data-setting="autoSave"> Auto-save
</label>
<label class="line">
<input type="checkbox" d-change="updateSetting" data-setting="preserveLastCode"> Preserve last written code
</label>

View File

@ -97,8 +97,11 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
cmDisable: true
};
const AUTO_SAVE_INTERVAL = 15000; // 15 seconds
var updateTimer,
updateDelay = 500,
autoSaveInterval,
unsavedEditWarningCount = 15,
currentLayoutMode,
hasSeenNotifications = true,
@ -117,6 +120,7 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
isSavedItemsPaneOpen = false,
editorWithFocus,
logCount = 0,
isAutoSavingEnabled,
// DOM nodes
frame = $('#demo-frame'),
htmlCode = $('#js-html-code'),
@ -271,18 +275,28 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
}
}
function saveSetting(setting, value, cb) {
function saveSetting(setting, value) {
const d = deferred();
var obj = {};
obj[setting] = value;
chrome.storage.local.set(obj, cb || function() {});
chrome.storage.local.set(obj, d.resolve);
return d.promise;
}
// Save current item to storage
function saveItem() {
var isNewItem = !currentItem.id;
currentItem.id = currentItem.id || 'item-' + utils.generateRandomId();
saveCode();
saveCode().then(() => {
// If this is the first save, and auto-saving settings is enabled,
// then start auto-saving from now on.
// This is done in `saveCode()` completion so that the
// auto-save notification overrides the `saveCode` function's notification.
if (!isAutoSavingEnabled && prefs.autoSave) {
isAutoSavingEnabled = true;
alertsService.add('Auto-save enabled.');
}
});
// Push into the items hash if its a new item being saved
if (isNewItem) {
chrome.storage.local.get(
@ -299,6 +313,14 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
}
}
// Keeps getting called after certain interval to auto-save current creation
// if it needs to be.
function autoSaveLoop() {
if (isAutoSavingEnabled && unsavedEditCount) {
saveItem();
}
}
// Calculates the sizes of html, css & js code panes.
function getCodePaneSizes() {
var sizes;
@ -357,7 +379,7 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
currentItem.mainSizes = getMainPaneSizes();
utils.log('saving key', key || currentItem.id, currentItem);
saveSetting(key || currentItem.id, currentItem, function() {
return saveSetting(key || currentItem.id, currentItem).then(() => {
alertsService.add('Item saved.');
unsavedEditCount = 0;
saveBtn.classList.remove('is-marked');
@ -458,6 +480,8 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
}
function setCurrentItem(item) {
currentItem = item;
// Reset auto-saving flag
isAutoSavingEnabled = false;
// Reset unsaved count, in UI also.
unsavedEditCount = 0;
saveBtn.classList.remove('is-marked');
@ -1558,6 +1582,7 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
$('[data-setting=refreshOnResize]').checked = prefs.refreshOnResize;
$('[data-setting=autoPreview]').checked = prefs.autoPreview;
$('[data-setting=editorFont]').value = prefs.editorFont;
$('[data-setting=autoSave]').checked = prefs.autoSave;
}
/**
@ -1573,7 +1598,7 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
prefs[settingName] = el.type === 'checkbox' ? el.checked : el.value;
obj[settingName] = prefs[settingName];
chrome.storage.sync.set(obj, function() {
alertsService.add('setting saved');
alertsService.add('Setting saved');
});
trackEvent('ui', 'updatePref-' + settingName, prefs[settingName]);
}
@ -1625,6 +1650,14 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
scope.cm[type].refresh();
});
scope.consoleCm.setOption('theme', $('[data-setting=editorTheme]').value);
if (prefs.autoSave) {
if (!autoSaveInterval) {
autoSaveInterval = setInterval(autoSaveLoop, AUTO_SAVE_INTERVAL);
}
} else {
clearInterval(autoSaveInterval);
autoSaveInterval = null;
}
};
scope.onNewBtnClick = function() {
@ -2108,7 +2141,8 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
fontSize: 16,
refreshOnResize: false,
autoPreview: true,
editorFont: 'FiraCode'
editorFont: 'FiraCode',
autoSave: true
},
function syncGetCallback(result) {
if (result.preserveLastCode && lastCode) {
@ -2141,6 +2175,7 @@ runBtn, searchInput, consoleEl, consoleLogEl, logCountEl, fontStyleTag, fontStyl
prefs.refreshOnResize = result.refreshOnResize;
prefs.autoPreview = result.autoPreview;
prefs.editorFont = result.editorFont;
prefs.autoSave = result.autoSave;
updateSettingsInUi();
scope.updateSetting();