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
Line 1: Line 1:
<select id="fryas_font_picker">
<div 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.getElementById("fryas_font_picker");
var lang_picker = document.querySelector("#fryas_font_picker > .picker");
lang_picker.addEventListener((event) => {
lang_picker.addEventListener((event) => {
  var fryas_text = document.getElementById("fryas_text");
   switch (lang_picker.value) {
   switch (lang_picker.value) {
     case "latin":
     case "latin":
       lang_picker.classList.remove("standskrift");
       fryas_text.classList.remove("standskrift");
       lang_picker.classList.remove("wagumskrift");
       fryas_text.classList.remove("wagumskrift");
       break;
       break;
     case "standskrift":
     case "standskrift":
       lang_picker.classList.add("standskrift");
       fryas_text.classList.add("standskrift");
       lang_picker.classList.remove("wagumskrift");
       fryas_text.classList.remove("wagumskrift");
       break;
       break;
     case "wagumskrift":
     case "wagumskrift":
       lang_picker.classList.remove("standskrift");
       fryas_text.classList.remove("standskrift");
       lang_picker.classList.add("wagumskrift");
       fryas_text.classList.add("wagumskrift");
       break;
       break;
   }
   }

Revision as of 09:40, 2 June 2023

Choose a Fryas font:

<select class="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"); lang_picker.addEventListener((event) => {

 var fryas_text = document.getElementById("fryas_text");
 switch (lang_picker.value) {
   case "latin":
     fryas_text.classList.remove("standskrift");
     fryas_text.classList.remove("wagumskrift");
     break;
   case "standskrift":
     fryas_text.classList.add("standskrift");
     fryas_text.classList.remove("wagumskrift");
     break;
   case "wagumskrift":
     fryas_text.classList.remove("standskrift");
     fryas_text.classList.add("wagumskrift");
     break;
 }
 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>