Popup dimensions: can now be set in settings form

This commit is contained in:
ikipatang 2017-11-30 14:09:59 +01:00
parent 6e23d4f3a5
commit ed73b53c58
3 changed files with 24 additions and 6 deletions

View file

@ -4,13 +4,15 @@
.main .row{ .main .row{
text-align: left; text-align: left;
padding-top: 10px;
} }
/* The form title */ /* The form title */
.main .row > label span{ .main .row > label span{
color: #1a1a1a; color: #1a1a1a;
width: 100em; width: 200px;
display: inline-block;
vertical-align: center; vertical-align: center;
padding-left: 5px; padding-left: 5px;
padding-right: 30px; padding-right: 30px;
@ -24,10 +26,14 @@
border: 1px solid #dbdbdb; border: 1px solid #dbdbdb;
} }
#popupWidth, #popupHeight {
width: 50px;
margin-right: 10px;
}
.main input[type=checkbox]{ .main input[type=checkbox]{
box-shadow: none; box-shadow: none;
width: auto; width: auto;
margin-top: 13px;
} }
.main button{ .main button{

View file

@ -14,6 +14,12 @@
<input id="url" type="text" name="url"> <input id="url" type="text" name="url">
</label> </label>
</div> </div>
<div class="row">
<label>
<span>Popup dimensions (px)</span>
<input id="popupWidth" type="text" name="popupWidth"><input id="popupHeight" type="text" name="popupWidth"> (default : 900 x 600)
</label>
</div>
<div class="row"> <div class="row">
<label> <label>
<span>Address bar</span> <span>Address bar</span>

View file

@ -5,6 +5,8 @@
function storeSettings() { function storeSettings() {
const settings = { const settings = {
url: document.querySelector("#url").value, url: document.querySelector("#url").value,
popupWidth: parseInt(document.querySelector("#popupWidth").value),
popupHeight: parseInt(document.querySelector("#popupHeight").value),
pageAction: document.querySelector("#pageAction").checked, pageAction: document.querySelector("#pageAction").checked,
}; };
// console.log('storeSettings settings'); // console.log('storeSettings settings');
@ -19,15 +21,19 @@ function storeSettings() {
* @return {void} - * @return {void} -
*/ */
function updateUI(restoredSettings) { function updateUI(restoredSettings) {
// console.log('restoredSettings');
// console.dir(restoredSettings, { depth: 10, colors: true }); // DEBUG
const url = document.querySelector("#url"); const url = document.querySelector("#url");
url.value = restoredSettings.url; url.value = restoredSettings.url;
// console.log('restoredSettings url');
// console.log(url); const popupWidth = document.querySelector("#popupWidth");
popupWidth.value = restoredSettings.popupWidth;
const popupHeight = document.querySelector("#popupHeight");
popupHeight.value = restoredSettings.popupHeight;
const pageAction = document.querySelector("#pageAction"); const pageAction = document.querySelector("#pageAction");
pageAction.checked = restoredSettings.pageAction; pageAction.checked = restoredSettings.pageAction;
// console.log('restoredSettings pageAction');
// console.log(pageAction);
} }
/** /**