Skip to content

Commit 6b9c614

Browse files
committed
Solve issues
1 parent 70f90a7 commit 6b9c614

File tree

4 files changed

+73
-6
lines changed

4 files changed

+73
-6
lines changed

Selection_styler.zip

88 Bytes
Binary file not shown.

manifest.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"manifest_version": 2,
33
"name": "Selection styler",
44
"author": "Pythack",
5-
"version": "1.2.3.7",
5+
"version": "1.2.4.1",
66
"description": "Change the color and background color of the selection",
77
"background": {
88
"scripts": ["./background.js"]

popup.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ <h1 id="title">Selection customizer</h1>
1818
<label>Color: </label><br/><input type="text" placeholder="white" id="color"> <input id="color-picker-textColor" type="color"><br/><br/>
1919
<label>Background color: </label><br/><input type="text" placeholder="#007ef3" id="background_color"> <input id="color-picker-backgroundColor" type="color"><br/><br/>
2020
<input id="activate_textShadow" name="activate_textShadow" type="checkbox"><label for="activate_textShadow">Activate text shadow </label><br/><br/>
21-
<div id="textSadowOptions">
21+
<div id="textShadowOptions">
2222
<label>Text shadow color: </label><br/><input type="text" placeholder="none" id="shadow-color"> <input id="color-picker-shadowColor" type="color"><br/><br/>
2323
<label>Text shadow blur (in pixels): </label><br/><input type="number" placeholder="15" min="0" id="shadow-blur"><br/><br/>
2424
</div>

popup.js

Lines changed: 71 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ function restoreOptions() {
7171
document.querySelector("#shadow-blur").value = result.shadowBlur || "0px";
7272
document.querySelector("input#activate_textShadow").checked = result.shadowActivated;
7373
if (result.shadowActivated) {
74-
document.querySelector('div#textSadowOptions').style.display = "block";
74+
document.querySelector('div#textShadowOptions').style.display = "block";
7575
}
7676
result.customOptions.forEach(element => {
7777
var option = document.createElement("option");
@@ -102,10 +102,78 @@ function restoreOptions() {
102102
};
103103

104104

105-
function updateColorInput(){var color=document.querySelector("input#color-picker-textColor").value;document.querySelector("input#color").value=color};function updateBackgroundColorInput(){var color=document.querySelector("input#color-picker-backgroundColor").value;document.querySelector("input#background_color").value=color};function updateColorInputColor(){var color=document.querySelector("input#color").value;document.querySelector("input#color-picker-textColor").value=color};function updateBackgroundColorInputColor(){var color=document.querySelector("input#background_color").value;document.querySelector("input#color-picker-backgroundColor").value=color};function updateShadowColorInput(){var color=document.querySelector("input#color-picker-shadowColor").value;document.querySelector("input#shadow-color").value=color};function updateShadowColorInputColor(){var color=document.querySelector("input#shadow-color").value;document.querySelector("input#color-picker-shadowColor").value=color};function updateShadowColorDisplay(){if(document.querySelector("input#activate_textShadow").checked){document.querySelector('div#textSadowOptions').style.display="block"}else{document.querySelector('div#textSadowOptions').style.display="none"}};
105+
function updateColorInput(){var color=document.querySelector("input#color-picker-textColor").value;document.querySelector("input#color").value=color};function updateBackgroundColorInput(){var color=document.querySelector("input#color-picker-backgroundColor").value;document.querySelector("input#background_color").value=color};function updateColorInputColor(){var color=document.querySelector("input#color").value;document.querySelector("input#color-picker-textColor").value=color};function updateBackgroundColorInputColor(){var color=document.querySelector("input#background_color").value;document.querySelector("input#color-picker-backgroundColor").value=color};function updateShadowColorInput(){var color=document.querySelector("input#color-picker-shadowColor").value;document.querySelector("input#shadow-color").value=color};function updateShadowColorInputColor(){var color=document.querySelector("input#shadow-color").value;document.querySelector("input#color-picker-shadowColor").value=color};function updateShadowColorDisplay(){if(document.querySelector("input#activate_textShadow").checked){document.querySelector('div#textShadowOptions').style.display="block"}else{document.querySelector('div#textShadowOptions').style.display="none"}};
106106

107-
function changeCustomDisplay(){var selectIndex=document.querySelector("#custom_select").selectedIndex;if(selectIndex!=0){document.querySelector("#url_div").style.display="block";document.querySelector("#change_url").value=document.querySelector("#custom_select").value;document.querySelector("#remove_custom").style.display="block";function setCurrentChoice(result){var customs=result.customOptions;document.querySelector("#background_color").value=customs[selectIndex-1].background||"#007ef3";document.querySelector("#color-picker-backgroundColor").value=customs[selectIndex-1].background||"#007ef3";document.querySelector("#color").value=customs[selectIndex-1].color||"white";document.querySelector("#color-picker-textColor").value=customs[selectIndex-1].color||"#ffffff";document.querySelector("#shadow-color").value=customs[selectIndex-1].shadowColor||"#ffffff";document.querySelector("input#color-picker-shadowColor").value=customs[selectIndex-1].shadowColor;document.querySelector("#shadow-blur").value=customs[selectIndex-1].shadowBlur||"0px";document.querySelector("input#activate_textShadow").checked=customs[selectIndex-1].shadowActivated;if(result.shadowActivated){document.querySelector('div#textSadowOptions').style.display="block"}};function onError(error){console.log(`Error:${error}`)};let getting=browser.storage.local.get();getting.then(setCurrentChoice,onError)}else{document.querySelector("#url_div").style.display="none";document.querySelector("#remove_custom").style.display="none";function setCurrentChoice(result){document.querySelector("#background_color").value=result.background_color||"#007ef3";document.querySelector("#color-picker-backgroundColor").value=result.background_color||"#007ef3";document.querySelector("#color").value=result.color||"white";document.querySelector("#color-picker-textColor").value=result.color||"#ffffff";document.querySelector("#shadow-color").value=result.shadowColor||"#ffffff";document.querySelector("input#color-picker-shadowColor").value=result.shadowColor;document.querySelector("#shadow-blur").value=result.shadowBlur||"0px";document.querySelector("input#activate_textShadow").checked=result.shadowActivated;if(result.shadowActivated){document.querySelector('div#textSadowOptions').style.display="block"}};function onError(error){console.log(`Error:${error}`)};let getting=browser.storage.local.get();getting.then(setCurrentChoice,onError)}};
107+
function changeCustomDisplay() {
108+
var selectIndex = document.querySelector("#custom_select").selectedIndex;
109+
if(selectIndex != 0) {
110+
document.querySelector("#url_div").style.display = "block";
111+
document.querySelector("#change_url").value = document.querySelector("#custom_select").value;
112+
document.querySelector("#remove_custom").style.display = "block";
113+
114+
function setCurrentChoice(result) {
115+
var customs = result.customOptions;
116+
document.querySelector("#background_color").value = customs[selectIndex - 1].background || "#007ef3";
117+
document.querySelector("#color-picker-backgroundColor").value = customs[selectIndex - 1].background || "#007ef3";
118+
document.querySelector("#color").value = customs[selectIndex - 1].color || "white";
119+
document.querySelector("#color-picker-textColor").value = customs[selectIndex - 1].color || "#ffffff";
120+
document.querySelector("#shadow-color").value = customs[selectIndex - 1].shadowColor || "#ffffff";
121+
document.querySelector("input#color-picker-shadowColor").value = customs[selectIndex - 1].shadowColor;
122+
document.querySelector("#shadow-blur").value = customs[selectIndex - 1].shadowBlur || "0px";
123+
document.querySelector("input#activate_textShadow").checked = customs[selectIndex - 1].shadowActivated;
124+
if(customs[selectIndex - 1].shadowActivated) {
125+
document.querySelector('div#textShadowOptions').style.display = "block"
126+
} else {
127+
document.querySelector('div#textShadowOptions').style.display = "none"
128+
}
129+
document.querySelector("#preview").style.background = document.querySelector("#background_color").value;
130+
document.querySelector("#preview").style.color = document.querySelector("#color").value;
131+
if (document.querySelector("input#activate_textShadow").checked) {
132+
document.querySelector("#preview").style.textShadow = document.querySelector("#shadow-color").value + " 0px 0px " + document.querySelector("#shadow-blur").value + "px";
133+
} else {
134+
document.querySelector("#preview").style.textShadow = "";
135+
}
136+
};
137+
138+
function onError(error) {
139+
console.log(`Error:${error}`)
140+
};
141+
let getting = browser.storage.local.get();
142+
getting.then(setCurrentChoice, onError)
143+
} else {
144+
document.querySelector("#url_div").style.display = "none";
145+
document.querySelector("#remove_custom").style.display = "none";
146+
147+
function setCurrentChoice(result) {
148+
document.querySelector("#background_color").value = result.background_color || "#007ef3";
149+
document.querySelector("#color-picker-backgroundColor").value = result.background_color || "#007ef3";
150+
document.querySelector("#color").value = result.color || "white";
151+
document.querySelector("#color-picker-textColor").value = result.color || "#ffffff";
152+
document.querySelector("#shadow-color").value = result.shadowColor || "#ffffff";
153+
document.querySelector("input#color-picker-shadowColor").value = result.shadowColor;
154+
document.querySelector("#shadow-blur").value = result.shadowBlur || "0px";
155+
document.querySelector("input#activate_textShadow").checked = result.shadowActivated;
156+
if(result.shadowActivated) {
157+
document.querySelector('div#textShadowOptions').style.display = "block"
158+
} else {
159+
document.querySelector('div#textShadowOptions').style.display = "none"
160+
}
161+
document.querySelector("#preview").style.background = document.querySelector("#background_color").value;
162+
document.querySelector("#preview").style.color = document.querySelector("#color").value;
163+
if (document.querySelector("input#activate_textShadow").checked) {
164+
document.querySelector("#preview").style.textShadow = document.querySelector("#shadow-color").value + " 0px 0px " + document.querySelector("#shadow-blur").value + "px";
165+
} else {
166+
document.querySelector("#preview").style.textShadow = "";
167+
}
168+
};
108169

170+
function onError(error) {
171+
console.log(`Error:${error}`)
172+
};
173+
let getting = browser.storage.local.get();
174+
getting.then(setCurrentChoice, onError)
175+
}
176+
};
109177
document.addEventListener("DOMContentLoaded", restoreOptions);
110178
document.addEventListener("DOMContentLoaded", updatePreview);
111179
document.querySelector("form").addEventListener("submit", saveOptions);
@@ -115,7 +183,6 @@ document.querySelector("#add_custom").addEventListener("click", addCustom);
115183
document.querySelector("#remove_custom").addEventListener("click", removeCustom);
116184
document.querySelector("input#activate_textShadow").addEventListener("change", updatePreview);
117185
document.querySelector("select#custom_select").addEventListener("change", changeCustomDisplay);
118-
document.querySelector("select#custom_select").addEventListener("change", updatePreview);
119186
document.querySelector("input#color-picker-textColor").addEventListener("input", updateColorInput);
120187
document.querySelector("input#color-picker-backgroundColor").addEventListener("input", updateBackgroundColorInput);
121188
document.querySelector("input#color").addEventListener("input", updateColorInputColor);

0 commit comments

Comments
 (0)