get fonts data using fetch
This commit is contained in:
parent
4332786658
commit
acb9b0dfb0
66
index.js
66
index.js
|
@ -110,7 +110,6 @@ function renderSelectList () {
|
||||||
'<svg class="octicon octicon-pin" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 1.2V2l.5 1L6 6H2.2c-.44 0-.67.53-.34.86L5 10l-4 5 5-4 3.14 3.14a.5.5 0 0 0 .86-.34V10l3-4.5 1 .5h.8c.44 0 .67-.53.34-.86L10.86.86a.5.5 0 0 0-.86.34z"></path></svg>'
|
'<svg class="octicon octicon-pin" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 1.2V2l.5 1L6 6H2.2c-.44 0-.67.53-.34.86L5 10l-4 5 5-4 3.14 3.14a.5.5 0 0 0 .86-.34V10l3-4.5 1 .5h.8c.44 0 .67-.53.34-.86L10.86.86a.5.5 0 0 0-.86.34z"></path></svg>'
|
||||||
let favoritesMap = {}
|
let favoritesMap = {}
|
||||||
let favorites = []
|
let favorites = []
|
||||||
const ajax = new XMLHttpRequest()
|
|
||||||
|
|
||||||
document.getElementById('select-font').innerHTML = ''
|
document.getElementById('select-font').innerHTML = ''
|
||||||
|
|
||||||
|
@ -125,23 +124,16 @@ function renderSelectList () {
|
||||||
console.error('could not render favorites', err)
|
console.error('could not render favorites', err)
|
||||||
}
|
}
|
||||||
|
|
||||||
ajax.onreadystatechange = () => {
|
const renderAuthors = (authors) => {
|
||||||
const fonts = []
|
|
||||||
const authors = []
|
|
||||||
if (ajax.readyState === 4 && ajax.status === 200) {
|
|
||||||
fontData = ajax.response
|
|
||||||
|
|
||||||
Object.keys(fontData).forEach((key) => {
|
|
||||||
const v = fontData[key]
|
|
||||||
v.alias = key
|
|
||||||
fonts.push(v)
|
|
||||||
if (authors.indexOf(v.author) < 0) {
|
|
||||||
authors.push(v.author)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
authors.sort()
|
authors.sort()
|
||||||
|
authors.forEach((author) => {
|
||||||
|
const option = document.createElement('option')
|
||||||
|
option.innerHTML = author
|
||||||
|
document.getElementById('authors-list').querySelector('.other').appendChild(option)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const renderFonts = (fonts) => {
|
||||||
fonts.sort((a, b) => {
|
fonts.sort((a, b) => {
|
||||||
if (favoritesMap[a.alias] && !favoritesMap[b.alias]) {
|
if (favoritesMap[a.alias] && !favoritesMap[b.alias]) {
|
||||||
return -1
|
return -1
|
||||||
|
@ -158,12 +150,6 @@ function renderSelectList () {
|
||||||
return 0
|
return 0
|
||||||
})
|
})
|
||||||
|
|
||||||
authors.forEach((author) => {
|
|
||||||
const option = document.createElement('option')
|
|
||||||
option.innerHTML = author
|
|
||||||
document.getElementById('authors-list').querySelector('.other').appendChild(option)
|
|
||||||
})
|
|
||||||
|
|
||||||
fonts.forEach((v) => {
|
fonts.forEach((v) => {
|
||||||
const option = document.createElement('div')
|
const option = document.createElement('div')
|
||||||
|
|
||||||
|
@ -177,13 +163,33 @@ function renderSelectList () {
|
||||||
|
|
||||||
document.getElementById('select-font').appendChild(option)
|
document.getElementById('select-font').appendChild(option)
|
||||||
})
|
})
|
||||||
|
|
||||||
selectFont()
|
|
||||||
new Filters(fontData).init()
|
|
||||||
}
|
}
|
||||||
ajax.responseType = 'json'
|
|
||||||
ajax.open('GET', 'fonts.json', true)
|
fetch('fonts.json')
|
||||||
ajax.send()
|
.then((response) => {
|
||||||
|
if (response.ok) {
|
||||||
|
return response.json()
|
||||||
|
} else {
|
||||||
|
console.error(response.status + ': ' + response.statusText)
|
||||||
|
}
|
||||||
|
}).then((data) => {
|
||||||
|
const fonts = []
|
||||||
|
const authors = []
|
||||||
|
|
||||||
|
Object.keys(data).forEach((key) => {
|
||||||
|
const v = data[key]
|
||||||
|
v.alias = key
|
||||||
|
fonts.push(v)
|
||||||
|
if (authors.indexOf(v.author) < 0) {
|
||||||
|
authors.push(v.author)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
renderAuthors(authors)
|
||||||
|
renderFonts(fonts)
|
||||||
|
selectFont()
|
||||||
|
new Filters(data).init()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
window.toggleFavorite = (alias) => {
|
window.toggleFavorite = (alias) => {
|
||||||
|
@ -233,8 +239,8 @@ window.onhashchange = () => {
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
renderSelectList()
|
renderSelectList()
|
||||||
new Theme().init()
|
|
||||||
fontsize.init()
|
fontsize.init()
|
||||||
|
new Theme().init()
|
||||||
new Spacing().init()
|
new Spacing().init()
|
||||||
new Language().init()
|
new Language().init()
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue