Merge pull request #1142 from Smithster/master

Words Filter

src/js/quote-search-popup.js

@@ -124,13 +124,6 @@ $("#quoteSearchPopup .searchBox").keydown((e) => {
     updateResults(searchText);
   }, 0.1); //arbitrarily v. small time as it's only to allow text to input before searching
 });
-// //sets quote id to searched quote clicked
-// $("#quoteSearchResults").click((e) => {
-//   if ($(e.target).hasClass("quoteSearchButton")) {
-//     document.getElementById("inputNumber").value = e.target.getAttribute("id");
-//     applyMode2Popup();
-//   }
-// });
 
 $("#quoteSearchPopupWrapper").click((e) => {
   if ($(e.target).attr("id") === "quoteSearchPopupWrapper") {

src/js/settings.js

@@ -433,7 +433,7 @@ async function fillSettingsPage() {
   let fontsEl = $(".pageSettings .section.fontFamily .buttons").empty();
   Misc.getFontsList().then((fonts) => {
     fonts.forEach((font) => {
-      if (Config.fontFamily === font.name) isCustomFont(false);
+      if (Config.fontFamily === font.name) isCustomFont = false;
       fontsEl.append(
         `<div class="button${
           Config.fontFamily === font.name ? " active" : ""

src/js/word-filter.js

@@ -0,0 +1,83 @@
+import { setCustomThemeColors } from "./config";
+import * as Misc from "./misc";
+import * as ThemeColors from "./theme-colors";
+//import * as config from "./userconfig";
+
+export async function showWordFilterPopup(){
+
+    $("#wordFilterPopupWrapper").removeClass("hidden");
+    $("#customTextPopupWrapper").addClass("hidden");
+    let LanguageList = await Misc.getLanguageList();
+    LanguageList.forEach(language => {
+        let prettyLang = language;
+        prettyLang = prettyLang.replace("_", " ");
+        $("#languageList").append(`
+            <option value=${language}>${prettyLang}</option>
+        `)
+    })
+    $("#languageList").select2({
+        minimumResultsForSearch: -1,
+    });
+}
+
+function hideWordFilterPopup(){
+    $("#wordFilterPopupWrapper").addClass("hidden");
+    $("#customTextPopupWrapper").removeClass("hidden");
+}
+
+async function applyWordFilterPopup(){
+    let language = $("#languageList").val();
+    let filteredWords = await filter(language);
+    let customText = "";
+    filteredWords.forEach( word => {
+        customText += (word + " ");
+    })
+    hideWordFilterPopup();
+    $("#customTextPopup textarea").val(customText);
+}
+
+$("#wordFilterPopupWrapper").mousedown((e) => {
+    if ($(e.target).attr("id") === "wordFilterPopupWrapper") {
+      hideWordFilterPopup();
+    }
+});
+
+$("#wordFilterPopupWrapper .button").mousedown((e) => {
+    $("#wordFilterPopupWrapper .wfload").removeClass("hidden");
+    $("#wordFilterPopupWrapper .button").addClass("hidden");
+    setTimeout(() => {
+        applyWordFilterPopup();
+        $("#wordFilterPopupWrapper .wfload").addClass("hidden");
+        $("#wordFilterPopupWrapper .button").removeClass("hidden");
+    }, 1)
+});
+
+async function filter(language){
+    let filterin = $("#wordFilter").val();
+    filterin = filterin.trim();
+    filterin = filterin.replace(/ /gi, "|");
+    let regincl = new RegExp(filterin, "i");
+    let filterout = $("#wordExclude").val();
+    filterout = filterout.trim();
+    filterout = filterout.replace(/ /gi, "|");
+    let regexcl = new RegExp(filterout, "i");
+    let filteredWords = [];
+    let languageWordList = await Misc.getLanguage(language);
+    let maxLength = $("#wordMax").val();
+    let minLength = $("#wordMin").val();
+    if(maxLength == ""){
+        maxLength = 999;
+    }
+    if(minLength == ""){
+        minLength = 1;
+    }
+    for( let i = 0; i < languageWordList.words.length; i++){
+        let word = languageWordList.words[i];
+        let test1 = regincl.test(word);
+        let test2 = regexcl.test(word);
+        if((test1 && !test2 || test1 && filterout == "") && word.length <= maxLength && word.length >= minLength){
+            filteredWords.push(word);
+        }
+    }
+    return filteredWords;
+}

src/sass/style.scss

@@ -117,6 +117,85 @@ html {
   overflow-y: scroll;
 }
 
+.select2-dropdown {
+  background-color: var(--bg-color);
+  color: var(--text-color);
+  outline: none;
+}
+
+.select2-selection {
+  background: rgba(0, 0, 0, 0.1);
+  height: fit-content;
+  padding: 5px;
+  border-radius: var(--roundness);
+  color: var(--text-color);
+  font: var(--font);
+  border: none;
+  outline: none;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__rendered {
+  color: var(--text-color);
+  outline: none;
+}
+
+.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
+  background-color: var(--sub-color);
+  color: var(--text-color);
+}
+
+.select2-container--default .select2-results__option--selected {
+  background-color: var(--main-color);
+  color: var(--bg-color);
+}
+
+.select2-container--open .select2-dropdown--below {
+  border-color: rgba(0, 0, 0, 0.1);
+  background: var(--bg-color);
+  color: var(--sub-color);
+  border-radius: var(--roundness);
+}
+
+.select2-container--default .select2-selection--single
+{
+  color: var(--text-color);
+  background: rgba(0, 0, 0, 0.1);
+  outline: none;
+  border: none;
+  height:auto;
+}
+
+.select2-selection:focus{
+  height: fit-content;
+  padding: 5px;
+  border-radius: var(--roundness);
+  color: var(--text-color);
+  font: var(--font);
+  border: none;
+  outline: none;
+}
+.select2-selection:active{
+  height: fit-content;
+  padding: 5px;
+  border-radius: var(--roundness);
+  color: var(--text-color);
+  font: var(--font);
+  border: none;
+  outline: none;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__arrow {
+  height: 35px;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__arrow b {
+  border-color: var(--main-color) transparent transparent transparent;
+}
+
+.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
+  border-color: var(--main-color) transparent;
+}
+
 /* width */
 ::-webkit-scrollbar {
   width: 7px;
@@ -512,6 +591,51 @@ a:hover {
   }
 }
 
+#wordFilterPopupWrapper{
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.75);
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 1000;
+  display: grid;
+  justify-content: center;
+  align-items: center;
+  padding: 5rem 0;
+
+  #wordFilterPopup{
+    background: var(--bg-color);
+    border-radius: var(--roundness);
+    padding: 2rem;
+    display: grid;
+    gap: 1rem;
+    width: 400px;
+
+    
+
+    .lengthgrid{
+      display:grid;
+      grid-template-columns: 1fr 1fr;
+      grid-template-rows: 1fr 1fr;
+      gap: 0.2rem;
+    }
+
+    .wordLength{
+      width: 10rem;
+    }
+
+    .wftip{
+      color: var(--sub-color);
+      font-size: 0.8rem;
+    }
+
+    .wfload{
+      justify-self: center;
+    }
+  }
+}
+
 #simplePopupWrapper {
   width: 100%;
   height: 100%;