--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/Helpviewer/data/html/speeddialPage.html Sat Feb 25 17:54:39 2012 +0100
@@ -0,0 +1,545 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=utf-8">
+<title>@SITE-TITLE@</title>
+<link rel="icon" href="@FAVICON@" type="image/x-icon" />
+<style type="text/css" media="screen">
+body {
+ background: -webkit-gradient(linear, left top, left bottom, from(#85784A), to(#FDFDFD), color-stop(0.5, #FDFDFD));
+ background-repeat: repeat-x;
+ font: 13px/22px "Helvetica Neue", Helvetica, Arial, sans-serif;
+ color: #525c66;
+}
+body * {
+ -webkit-user-select: none;
+ font-size: 100%;
+ line-height: 1.6;
+ margin: 0px;
+}
+.add {
+ position: absolute;
+ right:10px;top:10px;
+ width: 24px;
+ height: 24px;
+ background: url(@IMG_PLUS@);
+ cursor: pointer;
+}
+
+
+#quickdial {
+ margin: auto;
+ text-align: center;
+ font-weight: bold;
+}
+#quickdial div.entry {
+ position: relative;
+ float: left;
+ border-width: 10px;
+ -webkit-border-image: url(@BOX-BORDER@) 10;
+ margin: 5px;
+}
+#quickdial img {
+ display: block;
+ margin: auto;
+}
+#quickdial a {
+ position: absolute;
+ left: 0px;
+ top: 0px;
+ width: 100%;
+ height: 87%;
+}
+
+
+div.entry:hover .edit,
+div.entry:hover .close,
+div.entry:hover .reload {
+ display: inline;
+}
+span.boxTitle {
+ width:100%;
+ max-height: 20px;
+ position: absolute;
+ top: 88%;
+ left: 0px;
+ text-align: center;
+ overflow:hidden;
+}
+span.close {
+ width: 14px;
+ height: 14px;
+ position: absolute;
+ left: 92%;
+ top: 90%;
+ background: url(@IMG_CLOSE@) no-repeat;
+ background-position: center;
+ border: 1px solid transparent;
+ display: none;
+}
+span.close:hover {
+ border-color: grey;
+ border-radius: 3px;
+}
+span.edit {
+ width: 14px;
+ height: 14px;
+ position: absolute;
+ left: 0px;
+ top: 90%;
+ background: url(@IMG_EDIT@) no-repeat;
+ background-position: center;
+ border: 1px solid transparent;
+ display: none;
+}
+span.edit:hover {
+ border-color: grey;
+ border-radius: 3px;
+}
+span.reload {
+ width: 16px;
+ height: 16px;
+ position: absolute;
+ left: 92%;
+ top: 0px;
+ background: url(@IMG_RELOAD@) no-repeat;
+ background-position: center;
+ border: 1px solid transparent;
+ display: none;
+}
+span.reload:hover {
+ border-color: grey;
+ border-radius: 4px;
+}
+
+
+#overlay-edit {
+ width: 380px;
+ max-height: 265px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 100px;
+ border-width: 20px;
+ -webkit-border-image: url(@BOX-BORDER@) 25;
+}
+#overlay-edit img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
+#overlay-edit input[type="submit"] {
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 10px;
+ display: block;
+ width: 200px;
+}
+
+
+.formTable {
+ width: 350px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 15px;
+}
+.formTable input[type="text"] {
+ width: 100%;
+ -webkit-user-select: auto;
+}
+
+
+.sett {
+ position: absolute;
+ right:36px;
+ top:10px;
+ width: 24px;
+ height: 24px;
+ background: url(@IMG_SETTINGS@);
+ cursor: pointer;
+}
+#settingsBox {
+ position: absolute;
+ right: 58px;
+ top: 25px;
+ min-width: 250px;
+ width: auto;
+ height: auto;
+ background: #EDECE6;
+ margin: 5px;
+ border-radius: 15px;
+ padding: 8px 15px;
+ border: 1px solid transparent;
+ opacity: 1;
+ z-index: 200;
+}
+#settingsBox .content {
+ float: right;
+ margin-left: 115px;
+}
+#settingsBox p label {
+ margin: 2px;
+ padding: 1px;
+ text-align: center;
+}
+#settingsBox .togop {
+ margin-bottom: 1px;
+ padding-bottom: 2px;
+}
+#settingsBox .button {
+ margin: 2px;
+ padding: 1px;
+ text-align:center;
+ width: 98%;
+}
+#settingsBox .rowsel {
+ margin: 2px;
+ padding: 3px 0;
+ border-bottom: 1px solid #888;
+}
+#settingsBox .rowsel input {
+ text-align: center;
+ width: 80%;
+ height: 12px;
+ margin: 0px;
+ padding-bottom: 0;
+}
+#settingsBox .rowsel span {
+ font-weight: bold;
+ text-align: center;
+ margin: 2px;
+ margin-right: 7px;
+ display: inline-block;
+ width: 25px;
+}
+</style>
+
+<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 editingId = -1;
+
+ function onRemoveClick(box) {
+ removeBox($(box).index());
+ }
+
+ function onEditKeyPress(e) {
+ if (e.keyCode == 13) {
+ boxEdited();
+ return false;
+ }
+ else if (e.keyCode == 27) {
+ $('#fadeOverlay').click();
+ return false;
+ }
+ return true;
+ }
+
+ function onFetchTitleClick(checkbox) {
+ var displayStyle;
+ checkbox.checked ? displayStyle = 'hidden' : displayStyle = 'visible';
+ $('#titleLine').css({'visibility' : displayStyle });
+ }
+
+ function onEditClick(box) {
+ editingId = $(box).index();
+ var boxUrl = $(box).children('a').first().attr('href');
+ var boxTitle = $(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><input type="submit" value="' + EDIT + '" onClick="boxEdited()">' +
+ '</div></div>');
+
+ $('#fadeOverlay').css({'filter' : 'alpha(opacity=90)'}).fadeIn();
+ $('#fadeOverlay').click(function() { $(this).fadeOut("slow", function() {$("#fadeOverlay").remove();}); });
+ $('#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);
+ speeddial.loadThumbnail(url);
+ }
+
+ function boxEdited() {
+ if (editingId == -1)
+ return;
+
+ var box = document.getElementById('quickdial').getElementsByTagName('div')[editingId];
+ var a = box.getElementsByTagName('a')[0];
+ var originalUrl = a.getAttribute('href');
+ setBoxUrl(editingId, speeddial.urlFromUserInput($('#formUrl').attr("value")));
+ setBoxTitle(editingId, $('#formTitle').attr("value"));
+ var changedUrl = a.getAttribute('href');
+ var fetchTitleChecked = document.getElementById('fetchTitle').checked;
+
+ if (fetchTitleChecked || (originalUrl != changedUrl && changedUrl !== '') ) {
+ var img = box.getElementsByTagName('img')[0];
+ img.setAttribute('src', LOADING_IMAGE);
+
+ $('#fadeOverlay').fadeOut("slow", function() {
+ $("#fadeOverlay").remove();
+ speeddial.loadThumbnail(a.getAttribute('href'), fetchTitleChecked);
+ speeddial.removeImageForUrl(a.getAttribute('href'));
+ });
+ } else {
+ $('#fadeOverlay').fadeOut("slow", function() {$("#fadeOverlay").remove();});
+ }
+ speeddial.changed(allPages());
+ }
+
+ 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').replace('"', '').replace(';','');
+ var title = $(this).children('span[class="boxTitle"]').first().text().replace('"', '').replace(';','');
+ var img = $(this).children('img').first().attr('src').replace('"', '').replace(';','');
+ value += 'url:"' + url + '"|title:"' + title + '"|img:"' + img + '";';
+ });
+
+ return value;
+ }
+
+ 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.appendChild( document.createTextNode(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);
+
+ 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);
+
+ 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 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');
+ console.log(boxUrl + " > " + url);
+ if (url != boxUrl)
+ continue;
+
+ var span = box.getElementsByTagName('span')[0];
+ span.innerText = title;
+ }
+
+ speeddial.changed(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 + '?' + new Date());
+ });
+ }
+
+ 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) {
+ var box = document.getElementById('quickdial').getElementsByTagName('div')[id];
+ if (box === undefined)
+ return;
+
+ var url = box.getElementsByTagName('a')[0].getAttribute('href');
+ document.getElementById("quickdial").removeChild(box);
+ alignPage();
+
+ speeddial.removeImageForUrl(url);
+ speeddial.changed(allPages());
+ }
+
+ 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 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);
+
+ var maxBoxes = Math.floor(width / boxWidth);
+ if (maxBoxes > MAX_PAGES_ROW) maxBoxes = MAX_PAGES_ROW;
+ if (maxBoxes < 1) maxBoxes = 1;
+
+ var maxwidth = maxBoxes * boxWidth;
+ $("#quickdial").css('width', maxwidth + 'px');
+
+ 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 saveSettings() {
+ MAX_PAGES_ROW = $('#PgInRow').val();
+ DIAL_WIDTH = parseInt($('#SdSize').val());
+
+ speeddial.setPagesInRow(MAX_PAGES_ROW);
+ speeddial.setSdSize(DIAL_WIDTH);
+
+ alignPage();
+ }
+
+
+ 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);
+ }
+
+
+ $(document).ready(function () {
+ var sdSize = 'DIAL_WIDTH';
+ sdSize == '231' ? $('#SdSizeToggle').prop('checked', false) : $('#SdSizeToggle').prop('checked', true)
+ $('#SdSizeToggle').is(':checked') ? $('#SdSize').removeAttr('disabled') : $('#SdSize').attr('disabled', 'disabled');
+ });
+
+</script>
+</head>
+
+<body>
+ <div id="quickdial"></div>
+ <a onClick="$('#fadeOverlay2').css({'filter' : 'alpha(opacity=90)'}).fadeIn();$('#fadeOverlay2').click(function() { $(this).fadeOut('slow'); });$('#settingsBox').click(function(event) { event.stopPropagation(); });" title="@SETTINGS-TITLE@" class="sett"></a>
+ <a onClick="onEditClick(addBox('', NEW_PAGE, '')); alignPage();" title="@ADD-TITLE@" class="add"></a>
+
+ <script type="text/javascript">
+ @INITIAL-SCRIPT@
+
+ alignPage();
+ $(window).resize(function() { alignPage(); });
+ $("div").disableSelection();
+ $("#quickdial").sortable({
+ revert: true,
+ cursor: 'move',
+ containment: 'document',
+ opacity: 0.8,
+ distance: 40,
+ update: function(event, ui) {
+ speeddial.changed(allPages());
+ }
+ });
+ </script>
+ <div id="fadeOverlay2" style="opacity:0.9;display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:100;background:#85784A;">
+ <div id="settingsBox">
+ <div class="togop">
+ <label for="PgInRow">@TXT_NRROWS@</label>
+ </div>
+ <div class="rowsel">
+ <span id="sliderValuePg">@ROW-PAGES@</span>
+ <input id="PgInRow" type="range" min="2" max="8" value="@ROW-PAGES@" step="1" onchange="$('#sliderValuePg').html(this.value);" />
+ </div>
+ <div class="togop">
+ <input type="checkbox" name="sdsizet" id="SdSizeToggle" onchange="sdSizeToggle()" /> <label for="SdSizeToggle">@TXT_SDSIZE@</label>
+ </div>
+ <div class="rowsel">
+ <span id="sliderValueSd">@SD-SIZE@</span>
+ <input id="SdSize" type="range" min="145" max="360" value="@SD-SIZE@" step="1" onchange="$('#sliderValueSd').html(this.value);" />
+ </div>
+ <div class="content">
+ <p>
+ <input class="button" type="button" value="@APPLY@" onClick="saveSettings();$('#fadeOverlay2').fadeOut('slow');" />
+ </p>
+ </div>
+ </div>
+ </div>
+</body>
+</html>
