diff --git a/.gitignore b/.gitignore index d4e2b05..c1c864e 100644 --- a/.gitignore +++ b/.gitignore @@ -5,4 +5,4 @@ package-lock.json vendor composer.json composer.lock -composer.phar +composer.phar \ No newline at end of file diff --git a/CSS/*.css b/CSS/*.css index b6a9d68..f3448dd 100644 --- a/CSS/*.css +++ b/CSS/*.css @@ -14,7 +14,6 @@ body{ font-family: 'Noto Sans', sans-serif; } - .select-div{ position: relative; padding: 10px; diff --git a/CSS/index.css b/CSS/index.css index a09cc9d..0d1977c 100644 --- a/CSS/index.css +++ b/CSS/index.css @@ -1,7 +1,7 @@ body{ display: grid; grid-template-rows: 65px 1fr; - overflow: hidden; + overflow: auto; } /*? Navigation Bar */ @@ -413,7 +413,7 @@ body{ width: 17.5rem; overflow: hidden; } - .side-bar-content{ + .side-bar-content { font-size: 0.875rem; height: 100%; width: 17.5rem; @@ -537,11 +537,12 @@ body{ } /** Main Section */ .main-content-section { - width: 1180px; - min-width: 500px; + max-width: 1176px; + width: 1080px; + min-width: 250px; height: 100%; padding: 20px; - margin-top: 65px; + margin: auto; } .main-content-container { height: 100%; @@ -1330,15 +1331,22 @@ body{ } /** Responsiveness */ - /* @media screen and (max-width: 930px) { - .navigation-bar{ - grid-template-columns: 120px 1fr 85px; + /* @media screen and (max-width: 1150px) { + .article-container { + grid-column: 1/8; } - .main-search-input,.extra-option-icon{ - display: none; + #main-side-content-container { + grid-column: 8/13; } - .search-icon-figure{ - grid-column: 3/4; + } */ + @media screen and (max-width: 1681px) { + .main-content-section { + margin-left: 280px; + } + } + @media screen and (max-width: 1100px) { + .main-content-section { + margin-left: 0px; } .side-bar-content { background-color: var(--bg); @@ -1346,6 +1354,29 @@ body{ overflow: auto; z-index: 2; } - - } */ - \ No newline at end of file + .side-bar-content { + left: -280px; + } + } + @media screen and (max-width: 964px) { + .navigation-bar { grid-template-columns: 120px 1fr 85px; } + .main-search-input, + .extra-option-icon { + display: none; + } + .search-icon-figure{ + grid-column: 3/4; + } + } + /* Ipad */ + @media screen and (max-width: 768px) { + #main-side-content-container { + display: none; + } + .article-container { + grid-column: 1/13; + } + .main-content-section { + width: 100%; + } + } \ No newline at end of file diff --git a/JS/diacritics.js b/JS/diacritics.js index b8ad9de..c2f52ae 100644 --- a/JS/diacritics.js +++ b/JS/diacritics.js @@ -302,4 +302,4 @@ for (let i = 0; i < replacementList.length; i++) { for (let j = 0; j < chars.length; j++) diacriticsMap[chars[j]] = replacementList[i].base } -function removeDiacritics(str) { return str.replace(/[^\u0000-\u007e]/g, function(c) { return diacriticsMap[c] || c }) } +function removeDiacritics(str) { return str.replace(/[^\u0000-\u007e]/g, (c) => { return diacriticsMap[c] || c }) } diff --git a/JS/main.js b/JS/main.js index 54b3deb..ec894f5 100644 --- a/JS/main.js +++ b/JS/main.js @@ -71,12 +71,13 @@ const searchBox = { update : async (query) => { let i = 0 let images = await searchBox.fetch(query) + let searchAside = document.querySelector('article.search.aside') if(images.hits.length === 0) { images = await searchBox.fetch('nature') i = Math.round(Math.random() * images.hits.length) - } - - let searchAside = document.querySelector('article.search.aside') + searchAside.firstElementChild.lastElementChild.innerHTML = 'Search' + } else searchAside.firstElementChild.lastElementChild.innerHTML = 'Topic' + searchAside.firstElementChild.firstElementChild.innerHTML = capitalizeString(mainSearchInput.value) searchAside.firstElementChild.querySelector('figure img').src = images.hits[i].webformatURL searchAside.firstElementChild.querySelector('figure img').classList.remove('disable') @@ -93,6 +94,7 @@ let mouseSuggestHover = false let moreSuggestWordsArray = [] const suggest = { fetch : async (input) => { + // const res = await fetch(`https://api.datamuse.com/words?ml=${input}`) const res = await fetch(`https://api.datamuse.com/sug?s=${input}`) return words = await res.json() }, @@ -102,11 +104,12 @@ const suggest = { let input = mainSearchInput.value.split(' ') let n = 0 - while(suggestWordsArray.length < 16) { + while(suggestWordsArray.length < 21) { fetchArray = await suggest.fetch(input[n]) for(let i = 0; i < fetchArray.length; i++) if(suggestWordsArray.indexOf(fetchArray[i].word) === -1 && fetchArray[i].word !== mainSearchInput.value) suggestWordsArray.push(fetchArray[i].word) + input[n] = removeCharactersInString(input[n], 0, -1) if(input.length === 0) break } @@ -161,7 +164,7 @@ const suggest = { selectSuggestedSearchOption : (element) => { removeActiveSidebarCategory() hideSuggestWords() - let elementInnerHTML = addCharacterBetweenSpaceInString(element.innerHTML, ' ', '+') + let elementInnerHTML = removeDiacritics(element.innerHTML).trim() let selectedCountryAcronym = getCountryAcronym(selectedCountry.innerHTML) historyPushState(location.origin + location.pathname, `?q=${elementInnerHTML}&`, `cou=${selectedCountryAcronym}&`,`bg=${backgroundColor}`) mainSearch() @@ -169,32 +172,31 @@ const suggest = { } const responsiveVersion = { - mobileVersionNavigationBar() { - mainSearchIcon.classList.add('disable') - mainSearchBackLeftIcon.classList.remove('disable') - navigationBarLeft.classList.add('disable') - navigationBarRight.classList.add('disable') - navigationBarMiddle.style.gridColumn = '1/4' - mainSearchFigure.style.gridColumn = '1/2' - mainSearchBackLeftTooltiptext.classList.remove('disable') - mainSearchInput.style.display = 'grid' - extOptIcon.style.display = 'flex' - mainSearchInput.focus() - sideBarContent.style.left = '-100%' - sideMenuCounter = 1 - }, - desktopVersionNavigationBar() { - mainSearchIcon.classList.remove('disable') - mainSearchBackLeftIcon.classList.add('disable') - navigationBarLeft.classList.remove('disable') - navigationBarRight.classList.remove('disable') - navigationBarMiddle.style.gridColumn = '2/3' - mainSearchFigure.style.gridColumn = '3/4' - mainSearchBackLeftTooltiptext.classList.add('disable') - mainSearchInput.style.display = 'none' - extOptIcon.style.display = 'none' - } - + // mobileVersionNavigationBar() { + // mainSearchIcon.classList.add('disable') + // mainSearchBackLeftIcon.classList.remove('disable') + // navigationBarLeft.classList.add('disable') + // navigationBarRight.classList.add('disable') + // navigationBarMiddle.style.gridColumn = '1/4' + // mainSearchFigure.style.gridColumn = '1/2' + // mainSearchBackLeftTooltiptext.classList.remove('disable') + // mainSearchInput.style.display = 'grid' + // extOptIcon.style.display = 'flex' + // mainSearchInput.focus() + // sideBarContent.style.left = '-100%' + // sideMenuCounter = 1 + // }, + // desktopVersionNavigationBar() { + // mainSearchIcon.classList.remove('disable') + // mainSearchBackLeftIcon.classList.add('disable') + // navigationBarLeft.classList.remove('disable') + // navigationBarRight.classList.remove('disable') + // navigationBarMiddle.style.gridColumn = '2/3' + // mainSearchFigure.style.gridColumn = '3/4' + // mainSearchBackLeftTooltiptext.classList.add('disable') + // mainSearchInput.style.display = 'none' + // extOptIcon.style.display = 'none' + // } } const regularExpressions = { @@ -225,7 +227,43 @@ const php = { } } +const error = { + headlines : () => { + + }, + search : () => { + if(!window.location.search.match(regularExpressions.url.country) + || !window.location.search.match(regularExpressions.url.backgroundColor) + || !window.location.search.match(regularExpressions.url.search)) openLinks(filePath.headlines) + } +} + +// const error = { +// headlines : () => { + +// }, +// search : () => { +// // let countryAcronym = window.location.search.match(regularExpressions.url.country)[0].slice(5, 7) +// if(!window.location.search.match(regularExpressions.url.country) +// || !getAcronymCountry(countryAcronym) +// || !window.location.search.match(regularExpressions.url.query) +// || !window.location.search.match(regularExpressions.url.backgroundColor)) +// openLinks(filePath.headlines) +// else { +// let urlCountryAcronym = countryAcronym +// let urlCountry = getAcronymCountry(urlCountryAcronym) +// updateCountrySelect(urlCountry) +// } +// } +// } + window.onload = async () => { + // Close all open windows + hideExtraSearchOptions() + hideSuggestWords() + + document.querySelectorAll('input').forEach(input => { input.autocomplete = 'off' }) + await user.location() removeActiveSidebarCategory() if (window.location.pathname.includes('headlines')) headlines() @@ -245,27 +283,14 @@ window.onload = async () => { else if (window.location.pathname.includes('search')) mainSearch() // changeBackgroundColor() - let selectedCountryAcronym = getCountryAcronym(selectedCountry.innerHTML) - // if(!window.location.search.match(regularExpressions.url.country)) - - //historyPushState(window.location.origin + window.location.pathname, '', `?cou=${selectedCountryAcronym}&`,`bg=${backgroundColor}`) - // else { - // urlCountryAcronym = window.location.search.match(regularExpressions.url.country)[0].slice(5, 7) - // if(getAcronymCountry(urlCountryAcronym) === undefined) return openLinks(filePath.headlines) - // urlCountry = getAcronymCountry(urlCountryAcronym) - // updateCountrySelect(urlCountry) - // } + // let query = location.search.match(regularExpressions.url.query)[0] + // query = removeCharactersInString(query, 3, query.length - 1) - if(!window.location.search.match(regularExpressions.url.query)) return - - let query = location.search.match(regularExpressions.url.query)[0] - query = removeCharactersInString(query, 3, query.length - 1) /* Search news */ } -window.onclick = (e) => { - +window.onclick = (e) => { if(logInOptions.classList.contains('active')) clickInOutCheck(logInOptions, e.target) else if(!suggestMainInput.classList.contains('disable')) clickInOutCheck(suggestMainInput, e.target) else if(!extOptProfile.classList.contains('disable')) clickInOutCheck(extOptProfile, e.target) @@ -279,18 +304,6 @@ function historyPushState(webiste, string, country, background) { history.pushSt function changeBackgroundColor() { document.body.className = window.location.search.match(regularExpressions.url.backgroundColor)[0].slice(4,10) } -// console.log(changeDiacritics()) -// function changeDiacritics() { -// let string = 'leščać' -// string = string.split('') -// console.log(string) -// // const regexDiacritics = /č|ć|đ|š|ž/g -// for(let i = 0; i < string.length; i++) -// if(diacriticLetters.test(string[i])) -// string[i] = diacriticsReplacement[string[i]] -// return string -// } - function getLanguageAcronym(target) { for(let i = 0; i < language.length; i++) if(language[i] === target) @@ -312,7 +325,6 @@ function getAcronymLanguage(acronym) { return language[i] } - function changeTemperatureUnit(element) { const unit = element.innerHTML const temperatureElements = document.querySelectorAll('.temperature') @@ -366,76 +378,81 @@ function fahrenheitToCelsius(number) { return (number - 32) * 5/9 } function fahrenheitToKelvin(number) { return (number - 32) * 5/9 + 273 } /* HEADLINES */ - async function headlines() { // await weather.getWeather() // weather.updateWeather() sidebarCategorySelect(document.querySelector('.fa-newspaper').parentElement) + + historyPushState(window.location.origin + window.location.pathname, '', `?cou=${getCountryAcronym(selectedCountry.innerHTML)}`,`&bg=${backgroundColor}`) } /* SEARCH */ - function mainSearch(extra) { - if(!window.location.pathname.includes('search')) return newSearch(extra) - if(window.location.search.match(regularExpressions.url.query) === null) return openLinks(filePath.headlines) + function mainSearch(extra, type) { + let url = '' + let newSearch = false - addDisableSideElements() - // console.log(extra === undefined) - if(extra === undefined) { + // error.search() + + if(!type) type = 'main-url' + if(!window.location.pathname.includes('search')) newSearch = true + if(window.location.search.match(regularExpressions.url.query) === null && newSearch === false) return openLinks(filePath.headlines) + + if(!extra && newSearch === true) { + url = removeDiacritics(mainSearchInput.value).trim() + return openLinks(filePath.search + `?q=${url}&cou=${getCountryAcronym(selectedCountry.innerHTML)}&bg=${backgroundColor}`) + } else if(extra && newSearch === true) { + url = createUrlExtraOptions() + return openLinks(filePath.search + url[1] + url[2] + url[3]) + } else if(!extra && newSearch === false) { + addDisableSideElements() + url = createUrlExtraOptions(type) + historyPushState(url[0], url[1], url[2], url[3]) let searchInputValue = window.location.search.match(regularExpressions.url.query)[0].slice(3, -1) - mainSearchInput.value = addCharacterBetweenSpaceInString(searchInputValue, '+', ' ') - searchBox.update(mainSearchInput.value.trim()) - } else { - let extraOptionsUrl = createUrlExtraOptions() - let selectedCountryAcronym = getCountryAcronym(selectedCountry.innerHTML) - historyPushState(websiteURL, extraOptionsUrl, selectedCountryAcronym, backgroundColor) + mainSearchInput.value = urlEdit(searchInputValue) + } else if(extra && newSearch === false) { + addDisableSideElements() + url = createUrlExtraOptions() + historyPushState(url[0], url[1], url[2], url[3]) } + let searchInputValue = window.location.search.match(regularExpressions.url.query)[0].slice(3, -1) + mainSearchInput.value = urlEdit(searchInputValue) + + searchBox.update(mainSearchInput.value.trim()) + hideExtraSearchOptions() hideSuggestWords() suggest.suggest() /* Search news articles */ + // console.log(url[4]) } - - function newSearch(extra) { - if(extra !== undefined) { - - } - // if(mainSearchInput.value.length === 0) return - - // if(!mainSearchIcon.classList.contains('disable') && window.innerWidth < 930) mobileVersionNavigationBar() - // else if(mainSearchIcon.classList.contains('disable') && window.innerWidth > 930) desktopVersionNavigationBar() - - // let selectedCountryAcronym = getCountryAcronym(selectedCountry.innerHTML) - // if(extraSearchOptions.classList.contains('disable')) searchQuery = addCharacterBetweenSpaceInString(mainSearchInput.value,' ','+') - - - - // else { - // let urlPath = createUrlPath('search', searchQuery) - // return console.log(urlPath) - // } - - } - - function createUrlExtraOptions() { + function createUrlExtraOptions(option) { let url - let exactPhraseV = exactPhrase.value.trim() - let hasWordsV = hasWords.value.trim() - let excludeWordsV = excludeWords.value.trim() + let exactPhraseV = removeDiacritics(exactPhrase.value).trim().replace(/\s\s+/g, ' ') + let hasWordsV = removeDiacritics(hasWords.value).trim().replace(/\s\s+/g, ' ') + let excludeWordsV = removeDiacritics(excludeWords.value).trim().replace(/\s\s+/g, ' ') + let time = `&t=${indexTimeLabel.innerHTML.trim().replace(' ','').toLowerCase()}` - if(exactPhraseV.length !== 0 && hasWordsV.length === 0 && excludeWordsV.length === 0) url = `"${exactPhraseV.trim()}"` - else if(hasWordsV.length !== 0 && exactPhraseV.length === 0 && excludeWordsV.length === 0) url = addCharacterBetweenSpaceInString(hasWordsV, ' ', '+') - else if(excludeWordsV.length !== 0 && exactPhraseV.length === 0 && hasWordsV.length === 0) url = addCharacterBetweenSpaceInString(excludeWordsV, ' ', '-') - // else if (exactPhraseV.length !== 0 && hasWordsV.length !== 0 && excludeWordsV.length === 0) return `"${exactPhraseV}"+${devideStringIntoWords(hasWordsV,'HW')}` - // else if(hasWordsV.length !== 0 && excludeWordsV.length !== 0 && exactPhraseV.length === 0) return `${devideStringIntoWords(hasWordsV,'HW')} ${devideStringIntoWords(excludeWordsV,'EW')}` - // else if(exactPhraseV.length !== 0 && excludeWordsV.length !== 0 && hasWordsV.length === 0) return `"${exactPhraseV}" ${devideStringIntoWords(excludeWordsV,'EW')}` - // else if(exactPhraseV.length !== 0 && excludeWordsV.length !== 0 && hasWordsV.length !== 0) return `"${exactPhraseV}" ${devideStringIntoWords(hasWordsV,'HW')} ${devideStringIntoWords(excludeWordsV,'EW')}` - return url - // historyPushState(location.origin + location.pathname, `?q=${addCharacterBetweenSpaceInString(mainSearchInput.value, ' ', '+')}&`, `cou=${getCountryAcronym(selectedCountry.innerHTML)}&`,`bg=${backgroundColor}`) + resetExtraSearchOptions() + + if(option === 'main-url') { + url = removeDiacritics(window.location.search.match(regularExpressions.url.query)[0].slice(3, -1)) + time = '' + } else if(option === 'main-input') { + url = removeDiacritics(mainSearchInput.value).trim() + time = '' + } else if(exactPhraseV.length !== 0 && hasWordsV.length === 0 && excludeWordsV.length === 0) url = `"${exactPhraseV}"` + else if(hasWordsV.length !== 0 && exactPhraseV.length === 0 && excludeWordsV.length === 0) url = hasWordsV + else if(excludeWordsV.length !== 0 && exactPhraseV.length === 0 && hasWordsV.length === 0) url = `-${excludeWordsV}` + else if (exactPhraseV.length !== 0 && hasWordsV.length !== 0 && excludeWordsV.length === 0) url = `"${exactPhraseV}" ${hasWordsV}` + else if(hasWordsV.length !== 0 && excludeWordsV.length !== 0 && exactPhraseV.length === 0) url = `${hasWordsV} ${devideStringIntoWords(excludeWordsV, 'EW')}` + else if(exactPhraseV.length !== 0 && excludeWordsV.length !== 0 && hasWordsV.length === 0) url = `"${exactPhraseV}" ${devideStringIntoWords(excludeWordsV, 'EW')}` + else if(exactPhraseV.length !== 0 && excludeWordsV.length !== 0 && hasWordsV.length !== 0) url = `"${exactPhraseV}" ${hasWordsV} ${devideStringIntoWords(excludeWordsV, 'EW')}` + return [`${location.origin}/News-website/search.php`,`?q=${url + time}`,`&cou=${getCountryAcronym(selectedCountry.innerHTML)}`,`&bg=${backgroundColor}`, url] } function devideStringIntoWords(string, keyword){ if(keyword === 'HW') return `+${string.replace(/\s/g, ' +')}` - if(keyword === 'EW') return `-${string.replace(/\s/g, ' -')}` + if(keyword === 'EW') return `-${string.replace(/\s/g, ' -')}` } /* FOR YOU */ @@ -473,7 +490,7 @@ function about() { } mainSearchInput.onfocus = () => { - if(!extraSearchOptions.classList.contains('disable')) return manageExtraSearchOptions() + if(!extraSearchOptions.classList.contains('disable')) return hideExtraSearchOptions() else if(mainSearchInput.value.length !== 0) showSuggestWords() suggest.manageSuggestWords() } @@ -487,19 +504,13 @@ let place = 0 mainSearchInput.onkeyup = (e) => { let suggestDivs = suggestMainInput.querySelectorAll('div') let suggestDivActiveKey = suggestMainInput.querySelectorAll('div.active.key') - if(e.keyCode === 13) { - - if(suggestDivActiveKey.length === 1)//historyPushState - console.log(location.origin + location.pathname, `?q=${addCharacterBetweenSpaceInString(suggestDivActiveKey[0].firstElementChild.innerHTML, ' ', '+')}&`, `cou=${getCountryAcronym(selectedCountry.innerHTML)}&`,`bg=${backgroundColor}`) - else //historyPushState - console.log(location.origin + location.pathname, `?q=${addCharacterBetweenSpaceInString(mainSearchInput.value, ' ', '+')}&`, `cou=${getCountryAcronym(selectedCountry.innerHTML)}&`,`bg=${backgroundColor}`) + if(e.keyCode === 13) { + if(suggestDivActiveKey.length === 1) historyPushState(location.origin + location.pathname, `?q=${removeDiacritics(suggestDivActiveKey[0].firstElementChild.innerHTML).trim()}&`, `cou=${getCountryAcronym(selectedCountry.innerHTML)}&`,`bg=${backgroundColor}`) + else historyPushState(location.origin + location.pathname, `?q=${removeDiacritics(mainSearchInput.value).trim()}&`, `cou=${getCountryAcronym(selectedCountry.innerHTML)}&`,`bg=${backgroundColor}`) mainSearch() - // if(!suggestMainInput.classList.contains('disable')) hideSuggestWords() - // return mainSearch() } if(suggestMainInput.classList.contains('disable') || suggestMainInput.querySelectorAll('div').length === 0) return - if(suggestMainInput.querySelectorAll('div.active').length === 0 && (e.keyCode === 40 || e.keyCode === 38)) { mainSearchInput.value = suggestDivs[place].firstElementChild.innerHTML return suggestDivs[place].classList.add('active') @@ -654,7 +665,7 @@ searchCountriesInput.oninput = () => { } function elementAdjustmentsSearchCountries(order) { - if(order == 'change') { + if(order === 'change') { document.querySelectorAll('#select-country > h6')[0].classList.add('disable') document.querySelectorAll('#select-country > h6')[1].classList.add('disable') listOfCountries.style.gridRow = '3/8' @@ -669,8 +680,9 @@ let children = [] let hasChildren = [] let noChildren = [] let clickOnOpenedElement +const countryDivExceptions = [showCountriesLink, sclSpan, sclStrong] function clickInOutCheck(parent, target) { - + clickOnOpenedElement = false doesElementHaveChildren(parent) @@ -678,23 +690,15 @@ function clickInOutCheck(parent, target) { doesElementHaveChildren(children[0]) children.shift() } - - if(parent === selectCountryDiv || parent === logInOptions){ - if(target === overlay) clickOnOpenedElement = false - else clickOnOpenedElement = true - } else { - if(target.lastElementChild == document.querySelectorAll('script').lastElementChild) clickOnOpenedElement = true - else clickOnOpenedElement = false - } - - checkIfClickIsOnElement(hasChildren, target) - checkIfClickIsOnElement(noChildren, target) - if(clickOnOpenedElement == false && parent == extraSearchOptions) manageExtraSearchOptions() - else if(clickOnOpenedElement == false && parent == suggestMainInput) hideSuggestWords() - else if(clickOnOpenedElement == false && parent == extOptProfile) manageExtraProfileOptions() - else if(clickOnOpenedElement == false && parent == selectCountryDiv) hideSelectCountry() - else if(clickOnOpenedElement == false && parent == logInOptions) manageLoginOptions() + if(checkIfClickIsOnElement(hasChildren, target) === true || checkIfClickIsOnElement(noChildren, target) === true) clickOnOpenedElement = true + else clickOnOpenedElement = false + + if(clickOnOpenedElement === false && parent === extraSearchOptions && target !== extOptIcon) hideExtraSearchOptions() + else if(clickOnOpenedElement === false && parent === suggestMainInput) hideSuggestWords() + else if(clickOnOpenedElement === false && parent === extOptProfile) manageExtraProfileOptions() + else if(clickOnOpenedElement === false && parent === selectCountryDiv && countryDivExceptions.some((val) => val === target) === false) hideSelectCountry() + else if(clickOnOpenedElement === false && parent === logInOptions && target !== loginButton) manageLoginOptions() children = [] hasChildren = [] @@ -708,7 +712,7 @@ function doesElementHaveChildren(parent) { } else noChildren.push(parent) } -function checkIfClickIsOnElement(array, target) { return array.filter(val => { return val === target}) } +function checkIfClickIsOnElement(array, target) { return array.some(val => { return val === target}) } exactPhrase.oninput = () => { inputExtraSearchOptionChange() } @@ -770,17 +774,8 @@ async function fetchNewsArticles() { // }) const json = await response.json() const articles = await json.articles - - console.log(articles, `http://cors-anywhere.herokuapp.com/http://newsapi.org/v2/everything?q=-velenje america "coronavirus"&sortBy=popularity&apiKey=${key}`) } -const information = { - firstName : 'Nik', - lastName : 'Topler' -} -let { firstName } = information -// console.log(firstName) - function createFormData(word) { let formData = new FormData formData.append(word, '') @@ -790,9 +785,5 @@ function capitalizeString(string) { return string.charAt(0).toUpperCase() + stri function removeCharactersInString(string, frontNumber, backNumber) { return string.slice(frontNumber, backNumber)} function removeDuplicates(array) { array.splice(0, array.length, ...(new Set(array))) } function removeSelectedValuesFromArray(array, target) { return target.filter(val => !array.includes(val)) } -function addCharacterBetweenSpaceInString(word, replace, character) { -word = word.trim().replace(/\s\s+/g, ' ') - if(replace === ' ') return word.replace(/\s/g, character) - else if(replace === '+') return word.replace(/\+/g, character) -} - +function urlEdit(string) { return decodeURIComponent(string).trim().replace(/\s\s+/g, ' ') } +// string.trim().replace(/\s\s+/g, ' ').replace(/%20/g, ' ').replace(/%22/g, '"') \ No newline at end of file diff --git a/JS/show.js b/JS/show.js index 5ef0331..1f72104 100644 --- a/JS/show.js +++ b/JS/show.js @@ -25,17 +25,21 @@ function checkWindowWidth900() { function manageExtraSearchOptions() { if(extraSearchOptions.classList.contains('disable')) { hideSuggestWords() - extraSearchOptions.classList.remove('disable') - mainSearchInput.style.borderBottomLeftRadius = '0' - mainSearchInput.style.borderBottomRightRadius = '0' - extOptIcon.style.transform = 'rotate(180deg)' - if(!indexTimeSelect.classList.contains('disable')) indexTimeSelect.classList.add('disable') - } else { - extraSearchOptions.classList.add('disable') - mainSearchInput.style.borderBottomLeftRadius = '6px' - mainSearchInput.style.borderBottomRightRadius = '6px' - extOptIcon.style.transform = 'rotate(0deg)' - } + showExtraSearchOptions() + } else hideExtraSearchOptions() +} +function showExtraSearchOptions() { + extraSearchOptions.classList.remove('disable') + mainSearchInput.style.borderBottomLeftRadius = '0' + mainSearchInput.style.borderBottomRightRadius = '0' + extOptIcon.style.transform = 'rotate(180deg)' + if(!indexTimeSelect.classList.contains('disable')) indexTimeSelect.classList.add('disable') +} +function hideExtraSearchOptions() { + extraSearchOptions.classList.add('disable') + mainSearchInput.style.borderBottomLeftRadius = '6px' + mainSearchInput.style.borderBottomRightRadius = '6px' + extOptIcon.style.transform = 'rotate(0deg)' } function resetExtraSearchOptions() { indexTimeLabel.innerHTML = 'Anytime' diff --git a/JS/sign.js b/JS/sign.js index 1a19887..b3509f3 100644 --- a/JS/sign.js +++ b/JS/sign.js @@ -1,113 +1,101 @@ -// /** Google */ - function onSignIn(googleUser) { - console.log('Logged in as: ' + JSON.stringify(googleUser.getBasicProfile())) +// // /** Google */ - let profile = googleUser.getBasicProfile() - // console.log('ID: ' + profile.getId()) // Do not send to your backend! Use an ID token instead. - // console.log('Name: ' + profile.getName()) - // console.log('Image URL: ' + profile.getImageUrl()) - // console.log('Email: ' + profile.getEmail()) - } - - function onFailure(error) { - console.log(error) - } - var googleUser = {}; - var startApp = function() { - gapi.load('auth2', function(){ - auth2 = gapi.auth2.init({ - client_id: '571327981909-r5sunoo4l6uqducmqm7vjon1af0tmso1.apps.googleusercontent.com', - cookiepolicy: 'single_host_origin', - }); - attachSignin(document.getElementById('googleBtn')); - }); - }; - function attachSignin(element) { - auth2.attachClickHandler(element, {}, - (googleUser) =>{ - console.log(googleUser.getBasicProfile())}, - (error) => { - // alert(JSON.stringify(error, undefined, 2)); - }); - } - startApp() - function signOut() { - var auth2 = gapi.auth2.getAuthInstance() - auth2.signOut().then(function () { - console.log('User signed out.') - }) - } +// let googleUser = {} +// function startApp() { +// gapi.load('auth2', () => { +// auth2 = gapi.auth2.init({ +// client_id: '571327981909-r5sunoo4l6uqducmqm7vjon1af0tmso1.apps.googleusercontent.com', +// cookiepolicy: 'single_host_origin', +// }) +// attachSignin(document.getElementById('googleBtn')) +// }) +// } +// function attachSignin(element) { +// auth2.attachClickHandler(element, {}, +// (googleUser) => { +// console.log(googleUser.getBasicProfile())}, +// (error) => { +// alert(JSON.stringify(error, undefined, 2)) +// }) +// } +// startApp() +// function signOut() { +// let auth2 = gapi.auth2.getAuthInstance() +// auth2.signOut().then(function () { +// console.log('User signed out.') +// }) +// } -/** GitHub */ +// /** GitHub */ - document.getElementById('github-button').addEventListener('click', () => { - // Initialize with your OAuth.io app public key - OAuth.initialize('_nPRfzTNGplyDCW0vD9dmek5QAg'); - // Use popup for oauth - // Alternative is redirect - OAuth.popup('github').then(github => { - console.log('github:', github); - // Retrieves user data from oauth provider - // Prompts 'welcome' message with User's email on successful login - // #me() is a convenient method to retrieve user data without requiring you - // to know which OAuth provider url to call - github.me().then(data => { - console.log('me data:', data); - // alert('GitHub says your email is:' + data.email + ".\nView browser 'Console Log' for more details"); - }); - // Retrieves user data from OAuth provider by using #get() and - // OAuth provider url - github.get('/user').then(data => { - console.log('self data:', data); - }) - }); - }) +// document.getElementById('github-button').addEventListener('click', () => { +// // Initialize with your OAuth.io app public key +// OAuth.initialize('_nPRfzTNGplyDCW0vD9dmek5QAg'); +// // Use popup for oauth +// // Alternative is redirect +// OAuth.popup('github').then(github => { +// console.log('github:', github); +// // Retrieves user data from oauth provider +// // Prompts 'welcome' message with User's email on successful login +// // #me() is a convenient method to retrieve user data without requiring you +// // to know which OAuth provider url to call +// github.me().then(data => { +// console.log('me data:', data); +// // alert('GitHub says your email is:' + data.email + ".\nView browser 'Console Log' for more details"); +// }); +// // Retrieves user data from OAuth provider by using #get() and +// // OAuth provider url +// github.get('/user').then(data => { +// console.log('self data:', data); +// }) +// }); +// }) -// /** FaceBook */ +// // /** FaceBook */ -// // function statusChangeCallback(response) { // Called with the results from FB.getLoginStatus(). -// // console.log('statusChangeCallback'); -// // console.log(response); // The current login status of the person. -// // if (response.status === 'connected') { // Logged into your webpage and Facebook. -// // testAPI(); -// // } else { // Not logged into your webpage or we are unable to tell. -// // document.getElementById('status').innerHTML = 'Please log ' + -// // 'into this webpage.'; -// // } -// // } +// // // function statusChangeCallback(response) { // Called with the results from FB.getLoginStatus(). +// // // console.log('statusChangeCallback'); +// // // console.log(response); // The current login status of the person. +// // // if (response.status === 'connected') { // Logged into your webpage and Facebook. +// // // testAPI(); +// // // } else { // Not logged into your webpage or we are unable to tell. +// // // document.getElementById('status').innerHTML = 'Please log ' + +// // // 'into this webpage.'; +// // // } +// // // } -// // function checkLoginState() { // Called when a person is finished with the Login Button. -// // FB.getLoginStatus(function(response) { // See the onlogin handler -// // statusChangeCallback(response); -// // }); -// // } +// // // function checkLoginState() { // Called when a person is finished with the Login Button. +// // // FB.getLoginStatus(function(response) { // See the onlogin handler +// // // statusChangeCallback(response); +// // // }); +// // // } -// // window.fbAsyncInit = function() { -// // FB.init({ -// // appId : '1318555625202480', -// // cookie : true, // Enable cookies to allow the server to access the session. -// // xfbml : true, // Parse social plugins on this webpage. -// // version : '' // Use this Graph API version for this call. -// // }); +// // // window.fbAsyncInit = function() { +// // // FB.init({ +// // // appId : '1318555625202480', +// // // cookie : true, // Enable cookies to allow the server to access the session. +// // // xfbml : true, // Parse social plugins on this webpage. +// // // version : '' // Use this Graph API version for this call. +// // // }); -// // FB.getLoginStatus(function(response) { // Called after the JS SDK has been initialized. -// // statusChangeCallback(response); // Returns the login status. -// // }); -// // }; +// // // FB.getLoginStatus(function(response) { // Called after the JS SDK has been initialized. +// // // statusChangeCallback(response); // Returns the login status. +// // // }); +// // // }; -// // function testAPI() { // Testing Graph API after login. See statusChangeCallback() for when this call is made. -// // console.log('Welcome! Fetching your information.... '); -// // FB.api('/me', function(response) { -// // console.log('Successful login for: ' + response.name); -// // document.getElementById('status').innerHTML = -// // 'Thanks for logging in, ' + response.name + '!'; -// // }); -// // } +// // // function testAPI() { // Testing Graph API after login. See statusChangeCallback() for when this call is made. +// // // console.log('Welcome! Fetching your information.... '); +// // // FB.api('/me', function(response) { +// // // console.log('Successful login for: ' + response.name); +// // // document.getElementById('status').innerHTML = +// // // 'Thanks for logging in, ' + response.name + '!'; +// // // }); +// // // } \ No newline at end of file diff --git a/JS/variables.js b/JS/variables.js index 1d43938..31ce9de 100644 --- a/JS/variables.js +++ b/JS/variables.js @@ -40,10 +40,11 @@ const submitButton = document.getElementById('extraOptionsSearchButton') const date = document.getElementById('extra-option-select') - + /** Navigation Bar Right */ + const loginButton = document.getElementById('login-button') /** Extra Search Options */ - let indexTimeSelect = document.getElementById('index-time-select') - let indexTimeLabel = document.getElementById('index-time-label') + const indexTimeSelect = document.getElementById('index-time-select') + const indexTimeLabel = document.getElementById('index-time-label') /* Navigation Bar Right */ const logInOptions = document.getElementById('login-option-div') @@ -62,6 +63,9 @@ const sideBarAboutContent = document.getElementById('about-sidebar-content') const mainContentContainer = document.getElementById('main-content-container') let mainContentHeader = document.getElementById('main-content-header') + const showCountriesLink = document.getElementById('show-countries-button') + const sclSpan = showCountriesLink.firstElementChild + const sclStrong = showCountriesLink.lastElementChild const overlay = document.getElementById('overlay') diff --git a/add-ons/head.php b/add-ons/head.php index 7ef6cdb..f53a291 100644 --- a/add-ons/head.php +++ b/add-ons/head.php @@ -13,8 +13,8 @@ - + diff --git a/add-ons/navigation-bar.php b/add-ons/navigation-bar.php index d05f6f8..3688535 100644 --- a/add-ons/navigation-bar.php +++ b/add-ons/navigation-bar.php @@ -15,7 +15,7 @@ placeholder="Search for latest news articles" autocomplete="off" value="">
+ id="main-search-icon-a" onclick="mainSearch(undefined,'main-input')"> diff --git a/headlines.php b/headlines.php index 4682175..da18c4a 100644 --- a/headlines.php +++ b/headlines.php @@ -13,6 +13,7 @@ + diff --git a/search.php b/search.php index 2bb426b..237dfb6 100644 --- a/search.php +++ b/search.php @@ -33,9 +33,105 @@
-
- -
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+