27 lines
2.6 KiB
JavaScript
27 lines
2.6 KiB
JavaScript
const backgrounds = document.getElementById("backgrounds")
|
|
|
|
const availableBackgrounds = [{id:"aurora",name:"Aurora",image:"images/aurora.jpg"},{id:"beach",name:"Beach",image:"images/beach.jpg"},{id:"bitday",name:"Bitday",image:"images/bitday.png"},{id:"catalina",name:"Catalina",image:"images/catalina.jpg"},{id:"chihuahuan",name:"Chihuahuan",image:"images/chihuahuan.jpg"},{id:"cliffs",name:"Cliffs",image:"images/cliffs.jpg"},{id:"colony",name:"Colony",image:"images/colony.jpg"},{id:"desert",name:"Desert",image:"images/desert.jpg"},{id:"earth",name:"Earth",image:"images/earth.jpg"},{id:"exodus",name:"Exodus",image:"images/exodus.jpg"},{id:"Factory",name:"Factory",image:"images/factory.jpg"},{id:"firewatch",name:"Firewatch",image:"images/firewatch.jpg"},{id:"forest",name:"Forest",image:"images/forest.jpg"},{id:"gradient",name:"Gradient",image:"images/gradient.png"},{id:"home",name:"Home",image:"images/home.jpg"},{id:"island",name:"Island",image:"images/island.jpg"},{id:"lake",name:"Lake",image:"images/lake.jpg"},{id:"lakeside",name:"Lakeside",image:"images/lakeside.jpg"},{id:"london",name:"London",image:"images/london.jpg"},{id:"maldives",name:"Maldives",image:"images/maldives.jpg"},{id:"market",name:"Market",image:"images/market.jpg"},{id:"mojave",name:"Mojave",image:"images/mojave.jpg"},{id:"mojave_HD",name:"Mojave HD",image:"images/mojave_HD.jpg"},{id:"moon",name:"Moon",image:"images/moon.jpg"},{id:"mountains",name:"Mountains",image:"images/mountains.jpg"},{id:"mount_fuji",name:"Mount Fuji",image:"images/mount_fuji.jpg"},{id:"room",name:"Room",image:"images/room.jpg"},{id:"sahara",name:"Sahara",image:"images/sahara.jpg"},{id:"seoul",name:"Seoul",image:"images/seoul.jpg"},{id:"street",name:"Street",image:"images/street.jpg"},{id:"tokyo",name:"Tokyo",image:"images/tokyo.jpg"}]
|
|
|
|
let availableBackgroundsHTML = ""
|
|
|
|
availableBackgrounds.forEach((background)=>{
|
|
availableBackgroundsHTML+=`<div id="${background.id}" class="box" style="overflow:hidden;border-radius: 25px"><div style="
|
|
background-image: url('/static/${background.image}');
|
|
background-size: cover;
|
|
border-radius:25px;
|
|
padding-top: 20%;
|
|
padding-bottom: 20%;
|
|
margin-bottom: 20px;
|
|
margin-top:20px;
|
|
text-align: center;" class="backgroundView"><div class="title">${background.name}</div></div></div>`
|
|
})
|
|
|
|
backgrounds.innerHTML= availableBackgroundsHTML;
|
|
|
|
document.querySelectorAll(".box").forEach((element)=>{
|
|
document.getElementById(element.getAttribute("id")).onclick = ()=>{
|
|
$.get("/setWallpaper",{wallpaper: element.getAttribute("id")}).done((data)=>{
|
|
alert(`Task ${(data)?"Success":"Failed"}`);
|
|
})
|
|
}
|
|
})
|