1 line
No EOL
3.8 KiB
JavaScript
1 line
No EOL
3.8 KiB
JavaScript
const inputTitle=document.querySelector(".simple-note__input--title"),inputBody=document.querySelector(".simple-note__input--body"),clearButton=document.querySelector(".settings__button--clear"),downloadButton=document.querySelector(".settings__button--download"),printHelperTitle=document.querySelector(".print-helper__title"),printHelperBody=document.querySelector(".print-helper__body");function clearNote(){let e=confirm("Are you sure you want to clear your note? Press OK to clear.");e&&(inputTitle.value="",inputBody.value="",saveTitle(),saveBody(),updatePrint())}function downloadNote(){let e=inputTitle.value||"Simple Note",t=inputBody.value,n=document.createElement("a");n.setAttribute("href","data:text/plain;charset=utf-8,"+encodeURIComponent(t)),n.setAttribute("download",e),n.style.display="none",document.body.appendChild(n),n.click(),document.body.removeChild(n)}function updatePrint(){printHelperTitle.innerText=inputTitle.value,printHelperBody.innerText=inputBody.value}const note_title="Note_Title",note_body="Note_Body";function saveTitle(){localStorage.setItem(note_title,inputTitle.value)}function saveBody(){localStorage.setItem(note_body,inputBody.value)}function loadNote(){let e=localStorage.getItem(note_title)||"";inputTitle.value=e;let t=localStorage.getItem(note_body)||"";inputBody.value=t}function debounce(e,t=250){let n;return(...i)=>{clearTimeout(n),n=setTimeout(()=>{e.apply(this,i)},t)}}const debouncedSaveTitle=debounce(saveTitle),debouncedSaveBody=debounce(saveBody);inputTitle.addEventListener("input",debouncedSaveTitle),inputBody.addEventListener("input",debouncedSaveBody),inputTitle.addEventListener("change",updatePrint),inputBody.addEventListener("change",updatePrint),downloadButton.addEventListener("click",downloadNote),clearButton.addEventListener("click",clearNote),document.addEventListener("DOMContentLoaded",()=>{loadNote(),updatePrint()});const settings=document.querySelector(".settings"),settingsToggle=document.querySelector(".settings__button--toggle-settings"),settingsToggleDescription=document.querySelector(".settings__button-description--toggle-settings"),settingsList=document.querySelector(".settings__buttons"),settingsItems=settingsList.querySelectorAll("a, button");function toggleSettings(){let e="true"==settingsToggle.getAttribute("aria-expanded");e?(settings.setAttribute("data-expanded",!1),settingsToggle.setAttribute("aria-expanded",!1),settingsToggleDescription.innerText="Press to open settings.",settingsList.setAttribute("aria-hidden",!0),settingsList.tabIndex=-1,settingsItems.forEach(e=>{e.tabIndex=-1})):(settings.setAttribute("data-expanded",!0),settingsToggle.setAttribute("aria-expanded",!0),settingsToggleDescription.innerText="Press to close settings.",settingsList.setAttribute("aria-hidden",!1),settingsList.removeAttribute("tabIndex"),settingsItems.forEach(e=>{e.tabIndex=0}))}settingsToggle.addEventListener("click",toggleSettings),document.addEventListener("DOMContentLoaded",()=>{settingsList.setAttribute("aria-hidden",!0),settingsItems.forEach(e=>{e.tabIndex=-1})});let theme=localStorage.getItem("theme")||"light";const themeButton=document.querySelector(".settings__button--theme"),themeDescription=document.querySelector(".settings__button-description--theme");function enableLightTheme(){document.documentElement.setAttribute("data-theme","light"),localStorage.setItem("theme","light"),themeDescription.innerText="Press to change to dark theme."}function enableDarkTheme(){document.documentElement.setAttribute("data-theme","dark"),localStorage.setItem("theme","dark"),themeDescription.innerText="Press to change to light theme."}themeButton.addEventListener("click",()=>{"dark"===(theme=localStorage.getItem("theme"))?enableLightTheme():enableDarkTheme()}),document.addEventListener("DOMContentLoaded",()=>{"dark"===theme&&enableDarkTheme()}); |