mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-05-19 08:39:42 +02:00
Code Issues Releases Wiki Activity

modal refactor and some style fixes

Browse Source
This commit is contained in:
Kushagra Gour 2017-05-08 02:53:13 +05:30
parent d7bfe24a0a
commit 1c82dcaafd
2 changed files with 14 additions and 8 deletions

2
src/index.html

@ -23,7 +23,7 @@
</svg>Run
</a>
<a id="js-add-library-btn" class="fleex-v-center hint--rounded hint--bottom-left" aria-label="Add a JS/CSS library">
<a id="js-add-library-btn" class="flex-v-center hint--rounded hint--bottom-left" aria-label="Add a JS/CSS library">
Add library <span id="js-external-lib-count" style="display:none;" class="count-label"></span>
</a>

20
src/script.js

@ -985,7 +985,7 @@ runBtn, searchInput, consoleEl, consoleLogEl
});
function openSettings() {
settingsModal.classList.toggle('is-modal-visible');
scope.toggleModal(settingsModal);
/* if (chrome.runtime.openOptionsPage) {
// New way to open options pages, if supported (Chrome 42+).
@ -1289,6 +1289,14 @@ runBtn, searchInput, consoleEl, consoleLogEl
trackEvent('ui', 'saveBtnClick', currentItem.id ? 'saved' : 'new');
saveItem();
};
/**
* Toggles a modal and logs an event.
* @param {Node} modal modal to be toggled
*/
scope.toggleModal = function (modal) {
modal.classList.toggle('is-modal-visible');
document.body.classList[modal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
};
scope.onSearchInputChange = function (e) {
const text = e.target.value;
let el;
@ -1363,19 +1371,17 @@ runBtn, searchInput, consoleEl, consoleLogEl
layoutBtn4.addEventListener('click', getToggleLayoutButtonListener(4));
utils.onButtonClick(helpBtn, function () {
helpModal.classList.toggle('is-modal-visible');
document.body.classList[helpModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
scope.toggleModal(helpModal);
trackEvent('ui', 'helpButtonClick');
});
utils.onButtonClick(addLibraryBtn, function () {
addLibraryModal.classList.toggle('is-modal-visible');
document.body.classList[addLibraryModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
scope.toggleModal(addLibraryModal);
trackEvent('ui', 'addLibraryButtonClick');
});
notificationsBtn.addEventListener('click', function () {
notificationsModal.classList.toggle('is-modal-visible');
document.body.classList[notificationsModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
scope.toggleModal(notificationsModal);
if (notificationsModal.classList.contains('is-modal-visible') && !hasSeenNotifications) {
hasSeenNotifications = true;
notificationsBtn.classList.remove('has-new');