extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2024-10-05 01:31:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

[feature] randomly select background image from list of URLs

Browse Source
This commit is contained in:
Jason 2019-08-31 08:24:40 -07:00 committed by Kombie
parent 07183bbf32
commit 42abeb4987
4 changed files with 35 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/css/form.css
View File

@ -7,7 +7,7 @@ textarea {
font-size: 1em;
font-family: var(--font-regular);
line-height: 2em;
height: 5em;
height: 10em;
min-height: 2.5em;
min-width: 0;
width: 100%;

4
src/index.html
View File

@ -1094,8 +1094,10 @@
</div>
<div class="form-indent">
<div class="input-wrap">
<input id="control-background-image-url" class="control-background-image-url" type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="https://" tabindex="-1">
<textarea id="control-background-image-url" class="control-background-image-url mb-0" spellcheck="false" placeholder="https://..." tabindex="-1"></textarea>
</div>
<p class="control-background-image-url-helper form-helper small">Add one or more URLs separate by a space or on a new lines. If more than one is entered a random background image will be used on load.</p>
<hr>
<p class="control-background-image-url-helper form-helper small">Unsplash can be used for random images, eg:</p>
<p class="control-background-image-url-helper form-helper small"><i>https://source.unsplash.com/random/1920x1080/?night,day,sky</i></p>
<p class="control-background-image-url-helper form-helper small">Change parameters after <i>.../ramdom/</i> for more options. Loading times may vary.</p>

8
src/js/background.js
View File

@ -84,7 +84,13 @@ var background = (function() {
if (state.get().background.image.from == "file") {
html.style.setProperty("--background-image", "url(" + state.get().background.image.file.data + ")");
} else if (state.get().background.image.from == "url") {
html.style.setProperty("--background-image", "url(" + state.get().background.image.url + ")");
if (/\s+/g.test(state.get().background.image.url)) {
var allUrls = state.get().background.image.url.split(/\s+/);
var randomUrl = allUrls[Math.floor(Math.random() * allUrls.length)];
html.style.setProperty("--background-image", "url(" + randomUrl + ")");
} else {
html.style.setProperty("--background-image", "url(" + state.get().background.image.url + ")");
};
};
} else {
html.style.setProperty("--background-image", "url()");

26
src/js/control.js
View File

@ -2199,7 +2199,7 @@ var control = (function() {
}, {
element: helper.e(".control-background-image-url"),
path: "background.image.url",
type: "text",
type: "textarea",
func: function() {
background.render.image();
}
@ -2282,6 +2282,7 @@ var control = (function() {
checkbox: "change",
radio: "change",
text: "input",
textarea: "input",
number: "input",
range: "input",
color: "change",
@ -2297,6 +2298,9 @@ var control = (function() {
text: function(object) {
return object.element.value;
},
textarea: function(object) {
return object.element.value;
},
number: function(object) {
return parseInt(object.element.value, 10);
},
@ -2354,6 +2358,12 @@ var control = (function() {
if (object.func) {
object.func();
};
},
textarea: function(object, event) {
changeValue(object);
if (object.func) {
object.func();
};
}
};
object.element.addEventListener(eventType[object.type], function(event) {
@ -3134,6 +3144,18 @@ var control = (function() {
};
object.element.value = newValue;
},
textarea: function(object) {
var newValue = helper.getObject({
object: state.get(),
path: object.path
});
if (object.valueMod) {
object.valueMod.slice().reverse().forEach(function(arrayItem, index) {
newValue = valueMod[arrayItem](newValue, object.element);
});
};
object.element.value = newValue;
},
number: function(object) {
object.element.value = helper.getObject({
object: state.get(),
@ -3159,7 +3181,7 @@ var control = (function() {
}));
}
};
var supportedType = ["checkbox", "radio", "text", "number", "range", "color"];
var supportedType = ["checkbox", "radio", "text", "number", "range", "color", "textarea"];
_allControl.forEach(function(arrayItem, index) {
if (supportedType.includes(arrayItem.element.type)) {
setValue[arrayItem.type](arrayItem);