Merge pull request #129 from richardfrost/ui_updates

UI updates
FrostCo · Apr 2, 2019 · 31346ac · 31346ac
2 parents de9ea30 + 14f95f7
commit 31346ac
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 15 deletions.
diff --git a/bin/watch.js b/bin/watch.js
@@ -23,7 +23,7 @@ function compileScript(file) {
 
   try {
     console.log('Building Typescript...');
-    execSync('npm run webpack');
+    execSync('npm run build');
   } catch(err) {
     console.log('Error: ', err);
   }
@@ -47,5 +47,5 @@ watcher.on('ready', () => log('Initial scan complete. Watching for changes...\n\
 watcher.on('change', (filePath, stats) => {
   // console.log(filePath, stats);
   if (filePath.match(/[\/\\]static[\/\\]/)) { copyStatic(filePath); }
-  if (filePath.match(/[\/\\]src[\/\\]/)) { compileScript(filePath); }
+  if (filePath.match(/[\/\\]script[\/\\]/)) { compileScript(filePath); }
 });
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "advancedprofanityfilter",
-  "version": "2.0.5",
+  "version": "2.1.0",
   "description": "A browser extension to filter profanity from webpages.",
   "main": "filter.js",
   "repository": {

diff --git a/src/script/lib/config.ts b/src/script/lib/config.ts
@@ -66,7 +66,7 @@ export default class Config {
     showSubtitles: 0,
     showSummary: true,
     showUpdateNotification: true,
-    substitutionMark: true
+    substitutionMark: false
   };
 
   static readonly _defaultWords = {

diff --git a/src/script/optionPage.ts b/src/script/optionPage.ts
@@ -145,6 +145,7 @@ export default class OptionPage {
   confirm(evt, action) {
     let ok = document.getElementById('confirmModalOK');
     ok.removeEventListener('click', importConfig);
+    ok.removeEventListener('click', removeAllWords);
     ok.removeEventListener('click', restoreDefaults);
     ok.removeEventListener('click', setPassword);
 
@@ -156,6 +157,10 @@ export default class OptionPage {
         ok.addEventListener('click', importConfig);
         break;
       }
+      case 'removeAllWords':
+        OptionPage.configureConfirmModal('Are you sure you want to remove all words?<br><br><i>(Note: The default words will return if no words are added.)</i>');
+        ok.addEventListener('click', removeAllWords);
+        break;
       case 'restoreDefaults':
         OptionPage.configureConfirmModal('Are you sure you want to restore defaults?');
         ok.addEventListener('click', restoreDefaults);
@@ -429,17 +434,23 @@ export default class OptionPage {
     this.populateWord();
   }
 
+  removeAllWords(evt) {
+    this.cfg.words = {};
+    let wordList = document.getElementById('wordList') as HTMLSelectElement;
+    wordList.selectedIndex = 0;
+    this.populateWordsList();
+  }
+
   async removeWord(evt) {
     if (evt.target.classList.contains('disabled')) return false;
     let wordList = document.getElementById('wordList') as HTMLSelectElement;
     let word = wordList.value;
 
     delete this.cfg.words[word];
-    let success = this.saveOptions(evt);
+    let success = await this.saveOptions(evt);
 
     if (success) {
       // Update states and Reset word form
-      filter.init();
       wordList.selectedIndex = 0;
       this.populateWordsList();
     }
@@ -666,6 +677,7 @@ let option = new OptionPage;
 // Events
 // Functions
 function importConfig(e) { option.importConfig(e); }
+function removeAllWords(e) { option.removeAllWords(e); }
 function restoreDefaults(e) { option.restoreDefaults(e); }
 function setPassword(e) { option.auth.setPassword(option); }
 // Add event listeners to DOM
@@ -697,6 +709,7 @@ document.getElementById('wordList').addEventListener('click', e => { option.popu
 document.getElementById('wordText').addEventListener('input', e => { OptionPage.hideInputError(e.target); });
 document.getElementById('wordSave').addEventListener('click', e => { option.saveWord(e); });
 document.getElementById('wordRemove').addEventListener('click', e => { option.removeWord(e); });
+document.getElementById('wordRemoveAll').addEventListener('click', e => { option.confirm(e, 'removeAllWords'); });
 // Domains
 document.getElementById('advDomainSelect').addEventListener('change', e => { option.advancedDomainPopulate(); });
 document.getElementById('advDomainText').addEventListener('input', e => { OptionPage.hideInputError(e.target); });

diff --git a/src/static/manifest.json b/src/static/manifest.json
@@ -3,7 +3,7 @@
   "short_name": "Profanity Filter",
   "author": "Richard Frost",
   "manifest_version": 2,
-  "version": "2.0.5",
+  "version": "2.1.0",
   "description": "Advanced Profanity Filter helps to clean up bad language on the websites you and your family visit.",
   "icons": {
     "16": "img/icon16.png",

diff --git a/src/static/optionPage.html b/src/static/optionPage.html
@@ -136,11 +136,6 @@ <h4 class="sectionHeader">General Settings</h4>
       <input id="showUpdateNotification" type="checkbox" class="w3-check">
       Show update notification
     </label>
-    <br>
-    <label>
-      <input id="filterWordList" type="checkbox" class="w3-check">
-      Filter word list in Options
-    </label>
   </div>
 
   <div id="defaultOptions">
@@ -161,6 +156,7 @@ <h4 class="sectionHeader">Default Settings (for new words/phrases)</h4>
 <div id="wordsPage" class="w3-container w3-hide">
   <h4 class="sectionHeader">Words & Phrases</h4>
   <select id="wordList" class="w3-select w3-border small"></select>
+  <label><input id="filterWordList" type="checkbox" class="w3-check">  Filter</label>
 
   <h4 class="sectionHeader">Word/Phrase</h4>
   <input id="wordText" class="w3-input w3-border small" type="text" pattern=".+">
@@ -206,6 +202,7 @@ <h4 class="sectionHeader">Other</h4>
   <div class="w3-right">
     <button id="wordSave" class="w3-btn w3-round-large w3-flat-peter-river">SAVE</button>
     <button id="wordRemove" class="w3-btn w3-round-large w3-flat-pomegranate">REMOVE</button>
+    <button id="wordRemoveAll" class="w3-btn w3-round-large w3-flat-pomegranate">REMOVE ALL</button>
   </div>
 </div>
 

diff --git a/src/static/w3.css b/src/static/w3.css
@@ -1,4 +1,4 @@
-/* W3.CSS 4.10 February 2018 by Jan Egil and Borge Refsnes */
+/* W3.CSS 4.12 November 2018 by Jan Egil and Borge Refsnes */
 html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
 /* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
 html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
@@ -79,18 +79,20 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 @media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%}
 .w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%}
 .w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}}
-.w3-content{max-width:980px;margin:auto}.w3-rest{overflow:hidden}
+.w3-rest{overflow:hidden}.w3-stretch{margin-left:-16px;margin-right:-16px}
+.w3-content,.w3-auto{margin-left:auto;margin-right:auto}.w3-content{max-width:980px}.w3-auto{max-width:1140px}
 .w3-cell-row{display:table;width:100%}.w3-cell{display:table-cell}
 .w3-cell-top{vertical-align:top}.w3-cell-middle{vertical-align:middle}.w3-cell-bottom{vertical-align:bottom}
 .w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important}.w3-show-inline-block{display:inline-block!important}
+@media (max-width:1205px){.w3-auto{max-width:95%}}
 @media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}
 .w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative}	
 .w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center}
 .w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}}
 @media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
 @media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
 @media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
-@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}}
+@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}
 .w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
 .w3-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
 .w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0}