1
Fork 0
mirror of https://github.com/Steffo99/chakra-magic.git synced 2024-10-16 06:27:27 +00:00

Improve illuminate button visibility

This commit is contained in:
Steffo 2019-10-04 01:57:14 +02:00
parent 13e735814b
commit c05e0db53b
3 changed files with 49 additions and 16 deletions

View file

@ -1,6 +1,9 @@
.chakramagic-button {
vertical-align: middle;
padding: 1px;
width: 48px;
height: 48px;
color: white;
background: black;
cursor: pointer;
border: none;
@ -93,7 +96,20 @@
}
.chakramagic-image {
width: 28px;
height: 28px;
vertical-align: middle;
width: 100%;
height: 100%;
}
.chakramagic-text {
margin-left: 4px;
}
.chakramagic-service {
display: flex;
align-items: center;
}
.chakramagic-button[disabled] {
opacity: 0.5;
}

View file

@ -1,5 +1,6 @@
function illuminate() {
let chakraElement = document.querySelector(".chakramagic-button");
let illuminateButton = document.querySelector(".chakramagic-illuminate .chakramagic-button");
let illuminateText = document.querySelector(".chakramagic-illuminate .chakramagic-text").childNodes[0];
const read_data = () => {
// Get player name, use this to match it to player name from API response
@ -75,25 +76,41 @@ function illuminate() {
watch_load_more();
};
chakraElement.setAttribute("disabled", "");
chakraElement.setAttribute("onclick", "");
chakraElement.setAttribute("class", "chakramagic-button chakramagic-running")
illuminateButton.setAttribute("disabled", "");
illuminateButton.onclick = null;
illuminateButton.setAttribute("class", "chakramagic-button chakramagic-running")
illuminateText.nodeValue = "Loading all data..."
load_all_data();
}
function chakraMagic() {
let parentElement = document.querySelector(".profile_private_info_dropdowns");
let parentElement = document.querySelector("#mainContents");
let beforeElement = document.querySelector("#personaldata_elements_container")
let chakraElement = document.createElement("button");
parentElement.appendChild(chakraElement);
chakraElement.onclick = illuminate;
chakraElement.setAttribute("class", "chakramagic-button");
let chakraElement = document.createElement("div");
parentElement.insertBefore(chakraElement, beforeElement);
chakraElement.setAttribute("class", "chakramagic-container");
let imageElement = document.createElement("img");
chakraElement.appendChild(imageElement);
imageElement.setAttribute("src", "http://cdn.dota2.com/apps/dota2/images/abilities/keeper_of_the_light_illuminate_hp2.png");
imageElement.setAttribute("class", "chakramagic-image");
let illuminateElement = document.createElement("div");
chakraElement.appendChild(illuminateElement);
illuminateElement.setAttribute("class", "chakramagic-service chakramagic-illuminate");
let illuminateButton = document.createElement("div");
illuminateElement.appendChild(illuminateButton);
illuminateButton.setAttribute("class", "chakramagic-button");
illuminateButton.onclick = illuminate;
let illuminateImage = document.createElement("img");
illuminateButton.appendChild(illuminateImage);
illuminateImage.setAttribute("src", "http://cdn.dota2.com/apps/dota2/images/abilities/keeper_of_the_light_illuminate_hp2.png");
illuminateImage.setAttribute("class", "chakramagic-image");
let illuminateText = document.createElement("span");
illuminateElement.appendChild(illuminateText);
illuminateText.appendChild(document.createTextNode("Parse data with Illuminate"));
illuminateText.setAttribute("class", "chakramagic-text chakramagic-illuminate");
}
chakraMagic();

View file

@ -8,7 +8,7 @@
},
"name": "Chakra Magic",
"version": "2019.10.2.1",
"version": "2019.10.4.1",
"developer": {
"name": "Stefano Pigozzi",
"url": "https://github.com/Steffo99/chakra-magic"