--- a/WebBrowser/data/html/speeddialPage.html Sun May 28 16:59:18 2017 +0200 +++ b/WebBrowser/data/html/speeddialPage.html Wed May 31 19:47:32 2017 +0200 @@ -219,349 +219,343 @@ <script type="text/javascript" src="@JQUERY@"></script> <script type="text/javascript" src="@JQUERY-UI@"></script> <script type="text/javascript"> - var LOADING_IMAGE = '@LOADING-IMG@'; - var URL = '@URL@'; - var TITLE = '@TITLE@'; - var EDIT = '@APPLY@'; - var NEW_PAGE = '@NEW-PAGE@'; - var TITLE_EDIT = '@TITLE-EDIT@'; - var TITLE_REMOVE = '@TITLE-REMOVE@'; - var TITLE_RELOAD = '@TITLE-RELOAD@'; - var TITLE_FETCHTITLE = '@TITLE-FETCHTITLE@'; - var MAX_PAGES_ROW = @ROW-PAGES@; - var DIAL_WIDTH = @SD-SIZE@; +var LOADING_IMAGE = '@LOADING-IMG@'; +var URL = '@URL@'; +var TITLE = '@TITLE@'; +var EDIT = '@APPLY@'; +var NEW_PAGE = '@NEW-PAGE@'; +var TITLE_EDIT = '@TITLE-EDIT@'; +var TITLE_REMOVE = '@TITLE-REMOVE@'; +var TITLE_RELOAD = '@TITLE-RELOAD@'; +var TITLE_FETCHTITLE = '@TITLE-FETCHTITLE@'; +var MAX_PAGES_ROW = @ROW-PAGES@; +var DIAL_WIDTH = @SD-SIZE@; - var editingId = -1; - var ignoreNextChanged = false; +var editingId = -1; +var ignoreNextChanged = false; - function escapeTitle(title) { - title = title.replace(/"/g, '"'); - title = title.replace(/'/g, '''); - return title; - } - - function unescapeTitle(title) { - title = title.replace(/"/g, '"'); - title = title.replace(/'/g, '\''); - return title; - } +function escapeTitle(title) { + title = title.replace(/"/g, '"'); + title = title.replace(/'/g, '''); + return title; +} - function escapeUrl(url) { - url = url.replace(/"/g, ''); - url = url.replace(/'/g, ''); - return url; - } +function unescapeTitle(title) { + title = title.replace(/"/g, '"'); + title = title.replace(/'/g, '\''); + return title; +} - function onRemoveClick(box) { - removeBox($(box).index()); - } +function escapeUrl(url) { + url = url.replace(/"/g, ''); + url = url.replace(/'/g, ''); + return url; +} - function onEditKeyPress(e) { - if (e.keyCode == 13) { - boxEdited(); - return false; - } - else if (e.keyCode == 27) { - $('#fadeOverlay').click(); - return false; - } - return true; +function onRemoveClick(box) { + removeBox($(box).index()); +} + +function onEditKeyPress(e) { + if (e.keyCode == 13) { + boxEdited(); + return false; } - - function onFetchTitleClick(checkbox) { - var displayStyle; - checkbox.checked ? displayStyle = 'hidden' : displayStyle = 'visible'; - $('#titleLine').css({'visibility' : displayStyle }); + else if (e.keyCode == 27) { + $('#fadeOverlay').click(); + return false; } + return true; +} - function hideEditBox() { - $('#fadeOverlay').fadeOut("slow", function() {$("#fadeOverlay").remove();}); - } +function onFetchTitleClick(checkbox) { + var displayStyle; + checkbox.checked ? displayStyle = 'hidden' : displayStyle = 'visible'; + $('#titleLine').css({'visibility' : displayStyle }); +} + +function hideEditBox() { + $('#fadeOverlay').fadeOut("slow", function() {$("#fadeOverlay").remove();}); +} - function emitChanged(pages) - { - ignoreNextChanged = true; - external.speedDial.changed(pages); - } +function emitChanged(pages) { + ignoreNextChanged = true; + external.speedDial.changed(pages); +} + +function addSpeedDial() { + onEditClick(addBox('', NEW_PAGE, '')); + alignPage(); +} + +function onEditClick(box) { + editingId = $(box).index(); + var boxUrl = $(box).children('a').first().attr('href'); + var boxTitle = escapeTitle($(box).children('span').first().text()); + if (boxUrl === '') + boxUrl = 'http://'; - function addSpeedDial() - { - onEditClick(addBox('', NEW_PAGE, '')); - alignPage(); - } - - function onEditClick(box) { - editingId = $(box).index(); - var boxUrl = $(box).children('a').first().attr('href'); - var boxTitle = escapeTitle($(box).children('span').first().text()); - if (boxUrl === '') - boxUrl = 'http://'; + $('body').append('<div id="fadeOverlay" style="opacity:0.9;display:none;position:fixed;left:0;' + + 'top:0;width:100%;height:100%;z-index:9999;background:#85784A;">' + + '<div id="overlay-edit" onkeypress="return onEditKeyPress(event)">' + + '<img src="' + $(box).children('img').first().attr('src') + '"> ' + + '<table class="formTable"><tr><td>' + URL + ': </td><td>' + + '<input type="text" id="formUrl" value="' + boxUrl + '"></td></tr>' + + '<tr id="titleLine"><td>' + TITLE + ': </td><td>' + + '<input type="text" id="formTitle" value="' + boxTitle + '"></td></tr>' + + '<tr><td></td><td><input type="checkbox" id="fetchTitle" onclick="onFetchTitleClick(this)">' + + '<label for="fetchTitle"> ' + TITLE_FETCHTITLE + ' </label></td></tr>' + + '</table><p class="buttonbox">' + + '<input type="button" value=" @CLOSE@ " onClick="hideEditBox();">' + + '<input type="button" value=" ' + EDIT + ' " onClick="boxEdited()"></p>' + + '</div></div>'); + + $('#fadeOverlay').css({'filter' : 'alpha(opacity=90)'}).fadeIn(); + $('#fadeOverlay').click(function() {hideEditBox()}); + $('#overlay-edit').click(function(event) { event.stopPropagation(); }); + $('#formUrl').focus(); +} + +function onReloadClick(box) { + var url = $(box).children('a').first().attr('href'); + var img = $(box).children('img').first(); + + if (url === '') + return; + + $(img).attr('src', LOADING_IMAGE); + external.speedDial.loadThumbnail(url, false); +} + +function boxEdited() { + if (editingId == -1) + return; - $('body').append('<div id="fadeOverlay" style="opacity:0.9;display:none;position:fixed;left:0;' + - 'top:0;width:100%;height:100%;z-index:9999;background:#85784A;">' + - '<div id="overlay-edit" onkeypress="return onEditKeyPress(event)">' + - '<img src="' + $(box).children('img').first().attr('src') + '"> ' + - '<table class="formTable"><tr><td>' + URL + ': </td><td>' + - '<input type="text" id="formUrl" value="' + boxUrl + '"></td></tr>' + - '<tr id="titleLine"><td>' + TITLE + ': </td><td>' + - '<input type="text" id="formTitle" value="' + boxTitle + '"></td></tr>' + - '<tr><td></td><td><input type="checkbox" id="fetchTitle" onclick="onFetchTitleClick(this)">' + - '<label for="fetchTitle"> ' + TITLE_FETCHTITLE + ' </label></td></tr>' + - '</table><p class="buttonbox">' + - '<input type="button" value=" @CLOSE@ " onClick="hideEditBox();">' + - '<input type="button" value=" ' + EDIT + ' " onClick="boxEdited()"></p>' + - '</div></div>'); + external.speedDial.urlFromUserInput($('#formUrl').attr("value"), function(newUrl) { + var box = document.getElementById('quickdial').getElementsByTagName('div')[editingId]; + var a = box.getElementsByTagName('a')[0]; + var originalUrl = a.getAttribute('href'); + setBoxUrl(editingId, newUrl); + setBoxTitle(editingId, $('#formTitle').attr("value")); + var changedUrl = a.getAttribute('href'); + var fetchTitleChecked = document.getElementById('fetchTitle').checked; + + var pages = allPages() + + if (fetchTitleChecked || (originalUrl != changedUrl && changedUrl !== '') ) { + var img = box.getElementsByTagName('img')[0]; + img.setAttribute('src', LOADING_IMAGE); + + $('#fadeOverlay').fadeOut("slow", function() { + $("#fadeOverlay").remove(); + }); + external.speedDial.loadThumbnail(a.getAttribute('href'), fetchTitleChecked); + external.speedDial.removeImageForUrl(a.getAttribute('href')); + } else { + hideEditBox(); + } + emitChanged(pages); + }); +} + +function allPages() { + var urls = $('a[class="boxUrl"]'); + var titles = $('span[class="boxTitle"]'); + var value = ""; + $('div.entry').each(function(i) { + var url = $(this).children('a').first().attr('href'); + var title = $(this).children('span[class="boxTitle"]').first().text(); + var img = $(this).children('img').first().attr('src'); + value += 'url:"' + escapeUrl(url) + '"|title:"' + escapeTitle(title) + '"|img:"' + escapeUrl(img) + '";'; + }); - $('#fadeOverlay').css({'filter' : 'alpha(opacity=90)'}).fadeIn(); - $('#fadeOverlay').click(function() {hideEditBox()}); - $('#overlay-edit').click(function(event) { event.stopPropagation(); }); - $('#formUrl').focus(); - } + return value; +} - function onReloadClick(box) { - var url = $(box).children('a').first().attr('href'); - var img = $(box).children('img').first(); +function addBox(url, title, img_source) { + var div = document.createElement('div'); + div.setAttribute('class', 'entry'); + var img = document.createElement('img'); + img.setAttribute('src', img_source); + var a = document.createElement('a'); + a.setAttribute('href', url); + a.setAttribute('class', 'boxUrl'); + var span1 = document.createElement('span'); + span1.setAttribute('class', 'boxTitle'); + span1.innerText = unescapeTitle(title); + var span2 = document.createElement('span'); + span2.setAttribute('class', 'edit'); + span2.setAttribute('onClick', 'onEditClick(parentNode)'); + span2.setAttribute('title', TITLE_EDIT); + var span3 = document.createElement('span'); + span3.setAttribute('class', 'close'); + span3.setAttribute('onClick', 'onRemoveClick(parentNode)'); + span3.setAttribute('title', TITLE_REMOVE); + var span4 = document.createElement('span'); + span4.setAttribute('class', 'reload'); + span4.setAttribute('onClick', 'onReloadClick(parentNode)'); + span4.setAttribute('title', TITLE_RELOAD); - if (url === '') - return; + div.appendChild(img); + div.appendChild(img); + div.appendChild(a); + div.appendChild(span1); + div.appendChild(span2); + div.appendChild(span3); + div.appendChild(span4); - $(img).attr('src', LOADING_IMAGE); + document.getElementById("quickdial").appendChild(div); + + if (img_source == LOADING_IMAGE) { external.speedDial.loadThumbnail(url, false); } - function boxEdited() { - if (editingId == -1) - return; - - external.speedDial.urlFromUserInput($('#formUrl').attr("value"), function(newUrl) { - var box = document.getElementById('quickdial').getElementsByTagName('div')[editingId]; - var a = box.getElementsByTagName('a')[0]; - var originalUrl = a.getAttribute('href'); - setBoxUrl(editingId, newUrl); - setBoxTitle(editingId, $('#formTitle').attr("value")); - var changedUrl = a.getAttribute('href'); - var fetchTitleChecked = document.getElementById('fetchTitle').checked; - - var pages = allPages() - - if (fetchTitleChecked || (originalUrl != changedUrl && changedUrl !== '') ) { - var img = box.getElementsByTagName('img')[0]; - img.setAttribute('src', LOADING_IMAGE); + return div; +} - $('#fadeOverlay').fadeOut("slow", function() { - $("#fadeOverlay").remove(); - }); - external.speedDial.loadThumbnail(a.getAttribute('href'), fetchTitleChecked); - external.speedDial.removeImageForUrl(a.getAttribute('href')); - } else { - hideEditBox(); - } - emitChanged(pages); - }); - } +function setBoxImage(id, img_source) { + var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; + if (box === undefined) + return; - function allPages() { - var urls = $('a[class="boxUrl"]'); - var titles = $('span[class="boxTitle"]'); - var value = ""; - $('div.entry').each(function(i) { - var url = $(this).children('a').first().attr('href'); - var title = $(this).children('span[class="boxTitle"]').first().text(); - var img = $(this).children('img').first().attr('src'); - value += 'url:"' + escapeUrl(url) + '"|title:"' + escapeTitle(title) + '"|img:"' + escapeUrl(img) + '";'; - }); - - return value; - } + var img = box.getElementsByTagName('img')[0]; + img.setAttribute('src', img_source + '?' + new Date()); +} - function addBox(url, title, img_source) { - var div = document.createElement('div'); - div.setAttribute('class', 'entry'); - var img = document.createElement('img'); - img.setAttribute('src', img_source); - var a = document.createElement('a'); - a.setAttribute('href', url); - a.setAttribute('class', 'boxUrl'); - var span1 = document.createElement('span'); - span1.setAttribute('class', 'boxTitle'); - span1.innerText = unescapeTitle(title); - var span2 = document.createElement('span'); - span2.setAttribute('class', 'edit'); - span2.setAttribute('onClick', 'onEditClick(parentNode)'); - span2.setAttribute('title', TITLE_EDIT); - var span3 = document.createElement('span'); - span3.setAttribute('class', 'close'); - span3.setAttribute('onClick', 'onRemoveClick(parentNode)'); - span3.setAttribute('title', TITLE_REMOVE); - var span4 = document.createElement('span'); - span4.setAttribute('class', 'reload'); - span4.setAttribute('onClick', 'onReloadClick(parentNode)'); - span4.setAttribute('title', TITLE_RELOAD); +function setTitleToUrl(url, title) { + var changed = false; + var boxes = document.getElementById('quickdial').getElementsByTagName('div'); + for (i = 0; i < boxes.length; ++i) { + var box = boxes[i]; + + if (box === undefined) + continue; - div.appendChild(img); - div.appendChild(img); - div.appendChild(a); - div.appendChild(span1); - div.appendChild(span2); - div.appendChild(span3); - div.appendChild(span4); - - document.getElementById("quickdial").appendChild(div); + var boxUrl = box.getElementsByTagName('a')[0].getAttribute('href'); + if (url != boxUrl) + continue; - if (img_source == LOADING_IMAGE) { - external.speedDial.loadThumbnail(url, false); + var span = box.getElementsByTagName('span')[0]; + if (span.innerText != title) { + changed = true; + span.innerText = title; } - - return div; - } - - function setBoxImage(id, img_source) { - var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; - if (box === undefined) - return; - - var img = box.getElementsByTagName('img')[0]; - img.setAttribute('src', img_source + '?' + new Date()); } - function setTitleToUrl(url, title) { - var changed = false; - var boxes = document.getElementById('quickdial').getElementsByTagName('div'); - for (i = 0; i < boxes.length; ++i) { - var box = boxes[i]; - - if (box === undefined) - continue; - - var boxUrl = box.getElementsByTagName('a')[0].getAttribute('href'); - if (url != boxUrl) - continue; - - var span = box.getElementsByTagName('span')[0]; - if (span.innerText != title) { - changed = true; - span.innerText = title; - } - } - - emitChanged(allPages()); - } + emitChanged(allPages()); +} - function setImageToUrl(url, img_source) { - var aElement = $('a[href="' + url + '"]'); - $(aElement).each(function() { - var box = $(this).parent(); - var imgElement = $(box).children("img").first(); - if ($(imgElement).size() == 0) - return; - - $(imgElement).attr('src', img_source); - }); - } - - function setBoxUrl(id, url) { - var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; - if (box === undefined) - return; - - var a = box.getElementsByTagName('a')[0]; - a.setAttribute('href', url); - } - - function setBoxTitle(id, title) { - var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; - if (box === undefined) - return; - - var span = box.getElementsByTagName('span')[0]; - span.innerText = title; - } - - function removeBox(id) { - if (confirm("@TITLE-WARN@")) - var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; - if (box === undefined) +function setImageToUrl(url, img_source) { + var aElement = $('a[href="' + url + '"]'); + $(aElement).each(function() { + var box = $(this).parent(); + var imgElement = $(box).children("img").first(); + if ($(imgElement).size() == 0) return; - var url = box.getElementsByTagName('a')[0].getAttribute('href'); - document.getElementById("quickdial").removeChild(box); - alignPage(); + $(imgElement).attr('src', img_source); + }); +} - external.speedDial.removeImageForUrl(url); - emitChanged(allPages()); - } +function setBoxUrl(id, url) { + var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; + if (box === undefined) + return; - function alignPage() { - $('head').append('<style>#quickdial img[src*=".png"]{height:auto;width:'+DIAL_WIDTH+'px}</style>'); - $('#quickdial div.entry').css({'width' : DIAL_WIDTH + 'px', - 'height' : Math.round(DIAL_WIDTH / 1.54) + 'px'}); + var a = box.getElementsByTagName('a')[0]; + a.setAttribute('href', url); +} - var width = $(window).width(); - var height = $(window).height(); - var boxWidth = Math.floor(DIAL_WIDTH + 30); - var boxHeight = Math.floor(Math.round(DIAL_WIDTH / 1.54) + 40); +function setBoxTitle(id, title) { + var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; + if (box === undefined) + return; + + var span = box.getElementsByTagName('span')[0]; + span.innerText = title; +} - var maxBoxes = Math.floor(width / boxWidth); - if (maxBoxes > MAX_PAGES_ROW) maxBoxes = MAX_PAGES_ROW; - if (maxBoxes < 1) maxBoxes = 1; +function removeBox(id) { + if (confirm("@TITLE-WARN@")) + var box = document.getElementById('quickdial').getElementsByTagName('div')[id]; + if (box === undefined) + return; - var maxwidth = maxBoxes * boxWidth; - $("#quickdial").css('width', maxwidth + 'px'); + var url = box.getElementsByTagName('a')[0].getAttribute('href'); + document.getElementById("quickdial").removeChild(box); + alignPage(); + + external.speedDial.removeImageForUrl(url); + emitChanged(allPages()); +} - var boxesCount = $("#quickdial").children("div").size(); - var rows = Math.ceil(boxesCount / maxBoxes); - var margintop = (height - rows * boxHeight) / 2; - - if (margintop < 0) margintop = 0; +function alignPage() { + $('head').append('<style>#quickdial img[src*=".png"]{height:auto;width:'+DIAL_WIDTH+'px}</style>'); + $('#quickdial div.entry').css({'width' : DIAL_WIDTH + 'px', + 'height' : Math.round(DIAL_WIDTH / 1.54) + 'px'}); - $("#quickdial").css('margin-top', margintop + 'px'); - } - + var width = $(window).width(); + var height = $(window).height(); + var boxWidth = Math.floor(DIAL_WIDTH + 30); + var boxHeight = Math.floor(Math.round(DIAL_WIDTH / 1.54) + 40); - function saveSettings() { - MAX_PAGES_ROW = $('#PgInRow').val(); - DIAL_WIDTH = parseInt($('#SdSize').val()); + var maxBoxes = Math.floor(width / boxWidth); + if (maxBoxes > MAX_PAGES_ROW) maxBoxes = MAX_PAGES_ROW; + if (maxBoxes < 1) maxBoxes = 1; - external.speedDial.setPagesInRow(MAX_PAGES_ROW); - external.speedDial.setSdSize(DIAL_WIDTH); + var maxwidth = maxBoxes * boxWidth; + $("#quickdial").css('width', maxwidth + 'px'); - alignPage(); - } + var boxesCount = $("#quickdial").children("div").size(); + var rows = Math.ceil(boxesCount / maxBoxes); + var margintop = (height - rows * boxHeight) / 2; + if (margintop < 0) margintop = 0; + + $("#quickdial").css('margin-top', margintop + 'px'); +} - function sdSizeToggle() { - var check = document.getElementById('SdSizeToggle'); - var SdSize = document.getElementById('SdSize'); - var SdSizeSl = document.getElementById('sliderValueSd'); - - SdSize.disabled = (check.checked ? false : true); - SdSize.value = (check.checked ? SdSize.value : 231); - SdSizeSl.innerHTML = (check.checked ? DIAL_WIDTH : 231); - } +function saveSettings() { + MAX_PAGES_ROW = $('#PgInRow').val(); + DIAL_WIDTH = parseInt($('#SdSize').val()); + + external.speedDial.setPagesInRow(MAX_PAGES_ROW); + external.speedDial.setSdSize(DIAL_WIDTH); + + alignPage(); +} + +function sdSizeToggle() { + var check = document.getElementById('SdSizeToggle'); + var SdSize = document.getElementById('SdSize'); + var SdSizeSl = document.getElementById('sliderValueSd'); - function configureSpeedDial() - { - // Load settings - $('#PgInRow').val(MAX_PAGES_ROW); - $('#sliderValuePg').html(MAX_PAGES_ROW); - $('#SdSize').val(DIAL_WIDTH); - $('#SdSizeToggle').prop('checked', DIAL_WIDTH != 231); - $('#sliderValueSd').html(DIAL_WIDTH); - $('#SdSizeToggle').is(':checked') ? $('#SdSize').removeAttr('disabled') : $('#SdSize').attr('disabled', 'disabled'); + SdSize.disabled = (check.checked ? false : true); + SdSize.value = (check.checked ? SdSize.value : 231); + SdSizeSl.innerHTML = (check.checked ? DIAL_WIDTH : 231); +} - // Show dialog - $('#fadeOverlay2').css({'filter' : 'alpha(opacity=100)'}).fadeIn(); - $('#fadeOverlay2').click(function() { $(this).fadeOut('slow'); }); - $('#settingsBox').click(function(event) { event.stopPropagation(); }); - } - - function reloadAll() { - if (confirm("@TITLE-WARN-REL@")) - $('div.entry').each(function(i) { - onReloadClick($(this)); - }); - } +function configureSpeedDial() { + // Load settings + $('#PgInRow').val(MAX_PAGES_ROW); + $('#sliderValuePg').html(MAX_PAGES_ROW); + $('#SdSize').val(DIAL_WIDTH); + $('#SdSizeToggle').prop('checked', DIAL_WIDTH != 231); + $('#sliderValueSd').html(DIAL_WIDTH); + $('#SdSizeToggle').is(':checked') ? $('#SdSize').removeAttr('disabled') : $('#SdSize').attr('disabled', 'disabled'); + // Show dialog + $('#fadeOverlay2').css({'filter' : 'alpha(opacity=100)'}).fadeIn(); + $('#fadeOverlay2').click(function() { $(this).fadeOut('slow'); }); + $('#settingsBox').click(function(event) { event.stopPropagation(); }); +} + +function reloadAll() { + if (confirm("@TITLE-WARN-REL@")) + $('div.entry').each(function(i) { + onReloadClick($(this)); + }); +} </script> </head> @@ -571,8 +565,12 @@ <a onClick="addSpeedDial();" title="@ADD-TITLE@" class="add"></a> <script type="text/javascript"> - function init() - { + function init() { + if (!external.speedDial) { + setTimeout(init, 50); + return; + } + @INITIAL-SCRIPT@ external.speedDial.pagesChanged.connect(function() { @@ -600,7 +598,7 @@ } }); } - + // Initialize if (window.external) { init();