Jump to content

Widget:FryasFontPicker: Difference between revisions

From Oera Linda Wiki
No edit summary
No edit summary
Line 1: Line 1:
<div id="fryas_font_picker">
<select id="fryas_font_picker">
<div class="label">Choose a Fryas font:</div>
<select class="picker">
   <option value="latin">Latin</option>
   <option value="latin">Latin</option>
   <option value="standskrift">Standskrift</option>
   <option value="standskrift">Standskrift</option>
   <option value="wagumskrift">Wagumskrift</option>
   <option value="wagumskrift">Wagumskrift</option>
</select>
</select>
</div>
<script>
<script>
var lang_picker = document.querySelector("#fryas_font_picker > .picker");
var lang_picker = document.querySelector("#fryas_font_picker > .picker");
lang_picker.addEventListener("change", (event) => {
function pick_font(option) {
  var fryas_text = document.getElementById("fryas_text");
   switch (option) {
   switch (event.target.value) {
     case "latin":
     case "latin":
       fryas_text.classList.remove("standskrift");
       lang_picker.classList.remove("standskrift");
       fryas_text.classList.remove("wagumskrift");
       lang_picker.classList.remove("wagumskrift");
       break;
       break;
     case "standskrift":
     case "standskrift":
       fryas_text.classList.add("standskrift");
       lang_picker.classList.add("standskrift");
       fryas_text.classList.remove("wagumskrift");
       lang_picker.classList.remove("wagumskrift");
       break;
       break;
     case "wagumskrift":
     case "wagumskrift":
       fryas_text.classList.remove("standskrift");
       lang_picker.classList.remove("standskrift");
       fryas_text.classList.add("wagumskrift");
       lang_picker.classList.add("wagumskrift");
       break;
       break;
   }
   }
}
lang_picker.addEventListener("change", (event) => {
  pick_font(lang_picker.value);
   localStorage.setItem("preferred_fryas_font", lang_picker.value);
   localStorage.setItem("preferred_fryas_font", lang_picker.value);
});
});
Line 30: Line 29:
if (pref_font != null) {
if (pref_font != null) {
   lang_picker.value = pref_font;
   lang_picker.value = pref_font;
  pick_font(pref_font);
}
}
</script>
</script>

Revision as of 09:54, 2 June 2023

<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.querySelector("#fryas_font_picker > .picker"); function pick_font(option) {

 switch (option) {
   case "latin":
     lang_picker.classList.remove("standskrift");
     lang_picker.classList.remove("wagumskrift");
     break;
   case "standskrift":
     lang_picker.classList.add("standskrift");
     lang_picker.classList.remove("wagumskrift");
     break;
   case "wagumskrift":
     lang_picker.classList.remove("standskrift");
     lang_picker.classList.add("wagumskrift");
     break;
 }

} lang_picker.addEventListener("change", (event) => {

 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>