diff --git a/package.json b/package.json index b8b3d98..003de2e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "muezzin", - "version": "2.6.0", + "version": "2.6.1", "description": "Prayer Time Caller", "main": "src/main/main.js", "scripts": { diff --git a/src/mediaPlayer/renderer.js b/src/mediaPlayer/renderer.js index e154e1e..518b5ab 100644 --- a/src/mediaPlayer/renderer.js +++ b/src/mediaPlayer/renderer.js @@ -30,7 +30,6 @@ function setUpHandlers(){ athan = new Audio(msg.adhan.path); setUpAdhanListeners() athan.play(); - console.log("SALAMAMAMAM") }) window.api.handle('playFajr', msg => { diff --git a/src/settings/settings.css b/src/settings/settings.css index 7971f31..ef41007 100644 --- a/src/settings/settings.css +++ b/src/settings/settings.css @@ -177,6 +177,8 @@ footer{ top: 100%; left: 0; right: 0; + max-height: 60vh; + overflow-y: auto; } .autocomplete-items div { @@ -188,11 +190,11 @@ footer{ /*when hovering an item:*/ .autocomplete-items div:hover { - background-color: #212121; + background-color: #161616; } /*when navigating through the items using the arrow keys:*/ .autocomplete-active { - background-color: #13111e !important; + background-color: #161616 !important; color: #ffffff; } diff --git a/src/settings/settings.js b/src/settings/settings.js index 3fe0cb1..212ed20 100644 --- a/src/settings/settings.js +++ b/src/settings/settings.js @@ -2,6 +2,7 @@ var timeDisplay, language, adhanFile, bgImage, sunnahTimes, settings, weather, c calculationMethod, quran; var lat,lon; var fromQuran = false; +var locationName; window.addEventListener('DOMContentLoaded', () => { loadSettings() @@ -26,6 +27,7 @@ async function saveSettings(){ //Values that might change too much should not be saved automaticaly (no saver) await window.api.setToStore('latitude', document.getElementById("latInput").value); await window.api.setToStore('longitude', document.getElementById("lonInput").value); + await window.api.setToStore('locationName', locationName); await window.api.setToStore("timezone", document.getElementById("tzlist").value) await window.api.setToStore("language", document.getElementById("langlist").value) await window.api.setToStore('darkMode', document.getElementById("darkModeCheck").checked) @@ -77,6 +79,7 @@ async function saveSettings(){ async function loadSettings(){ lat = await window.api.getFromStore('latitude', 0.00); lon = await window.api.getFromStore('longitude', 0.00); + locationName = await window.api.getFromStore('locationName', ""); var tzVal = await window.api.getFromStore('timezone', 'US/Central'); var darkMode = await window.api.getFromStore('darkMode', false); language = await window.api.getFromStore('language', 'en'); @@ -122,6 +125,8 @@ async function loadSettings(){ document.getElementById("latInput").value = lat document.getElementById("lonInput").value = lon + document.getElementById("cityInput").value = locationName + //Selects the loaded value from the lists selectFromList(document.getElementById('langlist'), language) selectFromList(document.getElementById("tzlist"), tzVal) @@ -1231,71 +1236,86 @@ async function saveCustomTimes(){ var countries = ["Afghanistan","Albania","Algeria","Andorra","Angola","Anguilla","Antigua & Barbuda","Argentina","Armenia","Aruba","Australia","Austria","Azerbaijan","Bahamas","Bahrain","Bangladesh","Barbados","Belarus","Belgium","Belize","Benin","Bermuda","Bhutan","Bolivia","Bosnia & Herzegovina","Botswana","Brazil","British Virgin Islands","Brunei","Bulgaria","Burkina Faso","Burundi","Cambodia","Cameroon","Canada","Cape Verde","Cayman Islands","Central Arfrican Republic","Chad","Chile","China","Colombia","Congo","Cook Islands","Costa Rica","Cote D Ivoire","Croatia","Cuba","Curacao","Cyprus","Czech Republic","Denmark","Djibouti","Dominica","Dominican Republic","Ecuador","Egypt","El Salvador","Equatorial Guinea","Eritrea","Estonia","Ethiopia","Falkland Islands","Faroe Islands","Fiji","Finland","France","French Polynesia","French West Indies","Gabon","Gambia","Georgia","Germany","Ghana","Gibraltar","Greece","Greenland","Grenada","Guam","Guatemala","Guernsey","Guinea","Guinea Bissau","Guyana","Haiti","Honduras","Hong Kong","Hungary","Iceland","India","Indonesia","Iran","Iraq","Ireland","Isle of Man","Israel","Italy","Jamaica","Japan","Jersey","Jordan","Kazakhstan","Kenya","Kiribati","Kosovo","Kuwait","Kyrgyzstan","Laos","Latvia","Lebanon","Lesotho","Liberia","Libya","Liechtenstein","Lithuania","Luxembourg","Macau","Macedonia","Madagascar","Malawi","Malaysia","Maldives","Mali","Malta","Marshall Islands","Mauritania","Mauritius","Mexico","Micronesia","Moldova","Monaco","Mongolia","Montenegro","Montserrat","Morocco","Mozambique","Myanmar","Namibia","Nauro","Nepal","Netherlands","Netherlands Antilles","New Caledonia","New Zealand","Nicaragua","Niger","Nigeria","North Korea","Norway","Oman","Pakistan","Palau","Palestine","Panama","Papua New Guinea","Paraguay","Peru","Philippines","Poland","Portugal","Puerto Rico","Qatar","Reunion","Romania","Russia","Rwanda","Saint Pierre & Miquelon","Samoa","San Marino","Sao Tome and Principe","Saudi Arabia","Senegal","Serbia","Seychelles","Sierra Leone","Singapore","Slovakia","Slovenia","Solomon Islands","Somalia","South Africa","South Korea","South Sudan","Spain","Sri Lanka","St Kitts & Nevis","St Lucia","St Vincent","Sudan","Suriname","Swaziland","Sweden","Switzerland","Syria","Taiwan","Tajikistan","Tanzania","Thailand","Timor L'Este","Togo","Tonga","Trinidad & Tobago","Tunisia","Turkey","Turkmenistan","Turks & Caicos","Tuvalu","Uganda","Ukraine","United Arab Emirates","United Kingdom","United States of America","Uruguay","Uzbekistan","Vanuatu","Vatican City","Venezuela","Vietnam","Virgin Islands (US)","Yemen","Zambia","Zimbabwe"]; -function autocomplete(inp, latitude, longitude, arr) { - var countries; +function autocomplete(inp, arr) { var apiUrl; /*the autocomplete function takes two arguments, the text field element and an array of possible autocompleted values:*/ var currentFocus; /*execute a function when someone writes in the text field:*/ - inp.addEventListener("input", function(e) { - - var a, b, i, val = this.value; - var j = 0; - /*close any already open lists of autocompleted values*/ - closeAllLists(); - if ((!val) || (val.length < 3)) { return false;} - - currentFocus = -1; - /*create a DIV element that will contain the items (values):*/ - a = document.createElement("DIV"); - a.setAttribute("id", this.id + "autocomplete-list"); - a.setAttribute("class", "autocomplete-items"); - /*append the DIV element as a child of the autocomplete container:*/ - this.parentNode.appendChild(a); - /*for each item in the array...*/ - apiUrl = `https://nominatim.openstreetmap.org/search?format=json&city=${encodeURIComponent(val)}`; - fetch(apiUrl) - .then(response => response.json()) - .then(data => { - // Handle the data returned from the API - const uniqueDisplayNames = new Set(); - arr = data.filter(item => { - if (!uniqueDisplayNames.has(item.display_name)) { - uniqueDisplayNames.add(item.display_name); - return true; + + lookForMatches("click") + lookForMatches("input") + + function lookForMatches(listenerType){ + inp.addEventListener(listenerType, function(e) { + if (listenerType == "click"){ + inp.select() + } + var a, b, i, val = this.value; + var j = 0; + /*close any already open lists of autocompleted values*/ + closeAllLists(); + if ((!val) || (val.length < 3)) { return false;} + val = val.toLowerCase(); //Value entered by user is converted to lowercase. + currentFocus = -1; + + /*create a DIV element that will contain the items (values):*/ + a = document.createElement("DIV"); + a.setAttribute("id", this.id + "autocomplete-list"); + a.setAttribute("class", "autocomplete-items"); + + /*append the DIV element as a child of the autocomplete container:*/ + this.parentNode.appendChild(a); + /*for each item in the array...*/ + apiUrl = `https://nominatim.openstreetmap.org/search?format=json&city=${encodeURIComponent(val)}`; + fetch(apiUrl) + .then(response => response.json()) + .then(data => { + // Handle the data returned from the API + const uniqueDisplayNames = new Set(); + arr = data.filter(item => { + if (!uniqueDisplayNames.has(item.display_name)) { + uniqueDisplayNames.add(item.display_name); + return true; + } + return false; + }) + for (i = 0; i < arr.length; i++) { + /*check if the item starts with the same letters as the text field value:*/ + j = j+1 + if (j > 20) break; + + /*create a DIV element for each matching element:*/ + b = document.createElement("DIV"); + /*make the matching letters bold:*/ + b.innerHTML = arr[i].display_name + b.innerHTML = b.innerHTML.replace(val.charAt(0).toUpperCase()+val.slice(1), + "" + val.charAt(0).toUpperCase()+val.slice(1) +"") //For uppercase names + b.innerHTML = b.innerHTML.replace(val, + "" + val +"") //For lowercase names + + /*insert a input field that will hold the current array item's value:*/ + b.innerHTML += ""; + b.innerHTML += ""; + b.innerHTML += ""; + + /*execute a function when someone clicks on the item value (DIV element):*/ + b.addEventListener("click", function(e) { + /*insert the value for the autocomplete text field:*/ + inp.value = this.getElementsByTagName("Input")[0].value; + locationName = inp.value; //Saves the location name for later uses. + document.getElementById("lonInput").value = this.getElementsByTagName("Input")[1].value; + document.getElementById("latInput").value = this.getElementsByTagName("Input")[2].value; + /*close the list of autocompleted values, + (or any other open lists of autocompleted values:*/ + closeAllLists(); + }); + a.appendChild(b); } - return false; }) - for (i = 0; i < arr.length; i++) { - /*check if the item starts with the same letters as the text field value:*/ - - j = j+1 - if (j > 8) break; - /*create a DIV element for each matching element:*/ - b = document.createElement("DIV"); - /*make the matching letters bold:*/ - b.innerHTML = arr[i].display_name - /*insert a input field that will hold the current array item's value:*/ - b.innerHTML += ""; - b.innerHTML += ""; - b.innerHTML += ""; - /*execute a function when someone clicks on the item value (DIV element):*/ - b.addEventListener("click", function(e) { - /*insert the value for the autocomplete text field:*/ - inp.value = this.getElementsByTagName("Input")[0].value; - document.getElementById("lonInput").value = this.getElementsByTagName("Input")[1].value; - document.getElementById("latInput").value = this.getElementsByTagName("Input")[2].value; - /*close the list of autocompleted values, - (or any other open lists of autocompleted values:*/ - closeAllLists(); - }); - a.appendChild(b); - } - }) - + }); + } - }); /*execute a function presses a key on the keyboard:*/ inp.addEventListener("keydown", function(e) { var x = document.getElementById(this.id + "autocomplete-list"); @@ -1347,6 +1367,8 @@ function autocomplete(inp, latitude, longitude, arr) { } } } + + /*execute a function when someone clicks in the document:*/ document.addEventListener("click", function (e) { closeAllLists(e.target);