Popup dimensions: can now be set in settings form
This commit is contained in:
		
							parent
							
								
									6e23d4f3a5
								
							
						
					
					
						commit
						ed73b53c58
					
				| 
						 | 
					@ -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{
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -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>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -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);
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/**
 | 
					/**
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in a new issue