Jump to content

Widget:FryasFontPicker: Difference between revisions

From Oera Linda Wiki
Created page with "<select id="fryas_font_picker"> <option value="latin">Latin</option> <option value="standskrift">Standskrift</option> <option value="wagumskrift">Wagumskrift</option> </select> <script> var lang_picker = document.getElementById("fryas_font_picker"); lang_picker.addEventListener((event) => { switch (lang_picker.value) { case "latin": lang_picker.classList.remove("standskrift"); lang_picker.classList.remove("wagumskrift"); break; case "sta..."
 
No edit summary
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
<select id="fryas_font_picker">
<div id="fryas_font_picker">
  <option value="latin">Latin</option>
<div class="label">Change font:</div>
<select class="picker">
   <option value="standskrift">Standskrift</option>
   <option value="standskrift">Standskrift</option>
   <option value="wagumskrift">Wagumskrift</option>
   <option value="wagumskrift">Wagumskrift</option>
  <option value="latin">Latin</option>
</select>
</select>
</div>
<script>
<script>
var lang_picker = document.getElementById("fryas_font_picker");
window.addEventListener("DOMContentLoaded", (win_ev) => {
lang_picker.addEventListener((event) => {
  var lang_picker = document.querySelector("#fryas_font_picker > .picker");
  switch (lang_picker.value) {
  function pick_font(option) {
    case "latin":
    var fryas = document.querySelectorAll(".fryas");
      lang_picker.classList.remove("standskrift");
    switch (option) {
      lang_picker.classList.remove("wagumskrift");
      case "standskrift":
      break;
        fryas.forEach((element) => {
    case "standskrift":
          element.classList.remove("wagumskrift");
      lang_picker.classList.add("standskrift");
          element.classList.remove("latin");
      lang_picker.classList.remove("wagumskrift");
        });
      break;
        break;
    case "wagumskrift":
      case "wagumskrift":
      lang_picker.classList.remove("standskrift");
        fryas.forEach((element) => {
      lang_picker.classList.add("wagumskrift");
          element.classList.add("wagumskrift");
      break;
          element.classList.remove("latin");
        });
        break;
      case "latin":
        fryas.forEach((element) => {
          element.classList.remove("wagumskrift");
          element.classList.add("latin");
        });
        break;
    }
  }
  lang_picker.addEventListener("change", (ch_ev) => {
    pick_font(lang_picker.value);
    localStorage.setItem("preferred_fryas_font", lang_picker.value);
  });
  var pref_font = localStorage.getItem("preferred_fryas_font");
  if (pref_font != null) {
    lang_picker.value = pref_font;
    pick_font(pref_font);
   }
   }
  localStorage.setItem("preferred_fryas_font", lang_picker.value);
});
});
var pref_font = localStorage.getItem("preferred_fryas_font")
if (pref_font != null) {
  lang_picker.value = pref_font;
}
</script>
</script>

Latest revision as of 17:01, 7 June 2023

Change font:

<select class="picker">

 <option value="standskrift">Standskrift</option>
 <option value="wagumskrift">Wagumskrift</option>
 <option value="latin">Latin</option>

</select>

<script> window.addEventListener("DOMContentLoaded", (win_ev) => {

 var lang_picker = document.querySelector("#fryas_font_picker > .picker");
 function pick_font(option) {
   var fryas = document.querySelectorAll(".fryas");
   switch (option) {
     case "standskrift":
       fryas.forEach((element) => {
         element.classList.remove("wagumskrift");
         element.classList.remove("latin");
       });
       break;
     case "wagumskrift":
       fryas.forEach((element) => {
         element.classList.add("wagumskrift");
         element.classList.remove("latin");
       });
       break;
     case "latin":
       fryas.forEach((element) => {
         element.classList.remove("wagumskrift");
         element.classList.add("latin");
       });
       break;
   }
 }
 lang_picker.addEventListener("change", (ch_ev) => {
   pick_font(lang_picker.value);
   localStorage.setItem("preferred_fryas_font", lang_picker.value);
 });
 var pref_font = localStorage.getItem("preferred_fryas_font");
 if (pref_font != null) {
   lang_picker.value = pref_font;
   pick_font(pref_font);
 }

}); </script>