Falkon/falkonOfficial
Falkon/falkonOfficial
1
Fork 0
mirror of https://invent.kde.org/network/falkon.git synced 2024-12-20 18:56:34 +01:00
Code Releases Activity

Resizing Speed Dials + eye candy, v2

Browse Source
This commit is contained in:
Mladen Pejaković 2012-01-19 23:30:00 +01:00
parent bdff655dc8
commit 06c123f0e3
2 changed files with 53 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
src/data/html/speeddial.html
View File

@ -15,7 +15,7 @@ body * {-webkit-user-select: none;font-size: 100%;line-height: 1.6;margin: 0px;}
#quickdial a {position: absolute;left: 0px;top: 0px;width: 100%;height: 87%;} #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;} div.entry:hover .edit, div.entry:hover .close, div.entry:hover .reload{display: inline;}
span.boxTitle {width:100%;max-height: 20px; position: absolute;top: 89%;left: 0px;text-align: center;overflow:hidden;} 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%; 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;} 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.close:hover {border-color: grey; border-radius: 3px;}
@ -34,19 +34,18 @@ span.reload:hover {border-color: grey; border-radius: 4px;}
.formTable input[type="text"] {width: 100%;-webkit-user-select: auto;} .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;} .sett {position: absolute;right:36px;top:10px;width: 24px;height: 24px;background: url(%IMG_SETTINGS%); cursor: pointer;}
#settingsBox {position: absolute;right:58px;top:25px;width: auto;height: auto;background: #eeeeee;margin: 5px;-webkit-box-shadow: 0 0 6px 6px#888;box-shadow: 0 0 6px 6px #888;border-radius: 15px;padding: 8px 15px;border: 1px solid transparent;opacity: 1;z-index:200} #settingsBox {position: absolute;right:58px;top:25px;width: 250px;height: auto;background: #eeeeee;margin: 5px;-webkit-box-shadow: 0 0 6px 6px#888;box-shadow: 0 0 6px 6px #888;border-radius: 15px;padding: 8px 15px;border: 1px solid transparent;opacity: 1;z-index:200}
#settingsBox .title {margin-bottom: 1px;padding-bottom:2px;}
#settingsBox .content {float:right;} #settingsBox .content {float:right;}
#settingsBox .thumbhold {margin: 2px;padding: 1px;border-radius: 10px;text-align:center;width: 100px; height: 100px;background: #AAA;} #settingsBox .thumbhold {margin: 2px;padding: 1px;border-radius: 10px;text-align:center;width: 100px; height: 100px;background: #AAA;}
#settingsBox .thumbhold p {margin: 0;padding: 0;background: #eeeeee url(%IMG_BACKGROUND%) no-repeat center center;background-size: %B_SIZE%;width: 98px;height:98px;border-radius: 10px;position: relative;left: 1px;top: 1px;} #settingsBox .thumbhold p {margin: 0;padding: 0;background: #eeeeee url(%IMG_BACKGROUND%) no-repeat center center;background-size: %B_SIZE%;width: 98px;height:98px;border-radius: 10px;position: relative;left: 1px;top: 1px;}
#settingsBox p label {margin: 2px;padding: 1px;text-align: center;} #settingsBox p label {margin: 2px;padding: 1px;text-align: center;}
#settingsBox p select {margin: 2px;padding: 1px;text-align: center;width: 100px;} #settingsBox p select {margin: 2px;padding: 1px;text-align: center;width: 100px;}
#settingsBox p select option {text-align: center;} #settingsBox p select option {text-align: center;}
#settingsBox .togop {margin-bottom: 1px;padding-bottom:2px;}
#settingsBox .button {margin: 2px;padding: 1px;text-align:center;width: 100px;} #settingsBox .button {margin: 2px;padding: 1px;text-align:center;width: 100px;}
#settingsBox .rowsel {margin: 2px;padding: 3px 0;border-bottom: 1px solid #888;} #settingsBox .rowsel {margin: 2px;padding: 3px 0;border-bottom: 1px solid #888;}
#settingsBox .rowsel label {width: 140px;display: inline-block;} #settingsBox .rowsel input {text-align: center;width: 150px;height: 12px;margin: 0px;padding-bottom: 0;}
#settingsBox .rowsel input {text-align: center;width: 80px;height: 15px;margin: 0px;padding-bottom: 0;} #settingsBox .rowsel span {font-weight: bold;text-align: center;margin: 2px;margin-right: 7px;display: inline-block;width: 25px;}
#settingsBox .rowsel span {font-weight: bold;text-align: right;margin: 2px;padding-right: 2px;}
</style> </style>
<script type="text/javascript" src="%JQUERY%"></script> <script type="text/javascript" src="%JQUERY%"></script>
<script type="text/javascript" src="%JQUERY-UI%"></script> <script type="text/javascript" src="%JQUERY-UI%"></script>
@ -296,16 +295,6 @@ function alignPage() {
$("#quickdial").css('margin-top', margintop + 'px'); $("#quickdial").css('margin-top', margintop + 'px');
} }
function checkSet() {
var checkb = document.getElementById('BgImgToggle');
var BgImgSel = document.getElementById('BgImgSel');
var BgImgSz = document.getElementById('BgImgSelSiz');
var bgImg = '%IMG_BACKGROUND%';
checkb.checked = (bgImg == '' ? false : true);
BgImgSel.disabled = (bgImg == '' ? true : false);
BgImgSz.disabled = (bgImg == '' ? true : false);
}
function bgImageSel() { function bgImageSel() {
var img = speeddial.getOpenFileName(); var img = speeddial.getOpenFileName();
if (img) { if (img) {
@ -314,14 +303,10 @@ function bgImageSel() {
} }
function saveSettings() { function saveSettings() {
var BgImg = document.getElementById('BgImgHold').value; speeddial.setBackgroundImage($('#BgImgHold').val());
var BgImgSz = document.getElementById('BgImgSelSiz').value; speeddial.setBackgroundImageSize($('#BgImgSelSiz').val());
var PgInRow = document.getElementById('PgInRow').value; speeddial.setPagesInRow($('#PgInRow').val());
var SdSize = document.getElementById('SdSize').value; speeddial.setSdSize($('#SdSize').val());
speeddial.setBackgroundImage(BgImg);
speeddial.setBackgroundImageSize(BgImgSz);
speeddial.setPagesInRow(PgInRow);
speeddial.setSdSize(SdSize);
} }
function bgImgToggle() { function bgImgToggle() {
@ -329,18 +314,20 @@ function bgImgToggle() {
var BgImgSel = document.getElementById('BgImgSel'); var BgImgSel = document.getElementById('BgImgSel');
var BgImgHold = document.getElementById('BgImgHold'); var BgImgHold = document.getElementById('BgImgHold');
var BgImgSz = document.getElementById('BgImgSelSiz'); var BgImgSz = document.getElementById('BgImgSelSiz');
if (check.checked) {
BgImgSel.disabled = false; BgImgSel.disabled = (check.checked ? false : true);
BgImgHold.disabled = false; BgImgHold.disabled = (check.checked ? false : true);
BgImgSz.disabled = false; BgImgSz.disabled = (check.checked ? false : true);
BgImgHold.value = '%IMG_BACKGROUND%'; BgImgHold.value = (check.checked ? '%IMG_BACKGROUND%' : '');
}
else {
BgImgSel.disabled = true;
BgImgHold.disabled = true;
BgImgSz.disabled = true;
BgImgHold.value = '';
} }
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 ? %SD-SIZE% : 231);
} }
function bgImgUpdate() { function bgImgUpdate() {
@ -354,7 +341,17 @@ function bgImgUpdate() {
document.body.style.backgroundSize = imgSize; document.body.style.backgroundSize = imgSize;
} }
document.addEventListener("DOMContentLoaded", checkSet, false); $(document).ready(function () {
$('#BgImgSelSiz').val('%B_SIZE%').attr('selected','selected');
var bgImg = '%IMG_BACKGROUND%';
var sdSize = '%SD-SIZE%';
bgImg == '' ? $('#BgImgToggle').prop('checked', false) : $('#BgImgToggle').prop('checked', true)
sdSize == '231' ? $('#SdSizeToggle').prop('checked', false) : $('#SdSizeToggle').prop('checked', true)
$('#BgImgToggle').is(':checked') ? $('#BgImgSel').removeAttr('disabled') : $('#BgImgSel').attr('disabled', 'disabled');
$('#BgImgToggle').is(':checked') ? $('#BgImgSelSiz').removeAttr('disabled') : $('#BgImgSelSiz').attr('disabled', 'disabled');
$('#SdSizeToggle').is(':checked') ? $('#SdSize').removeAttr('disabled') : $('#SdSize').attr('disabled', 'disabled');
});
</script> </script>
</head> </head>
@ -382,17 +379,23 @@ $("#quickdial").sortable({
</script> </script>
<div id="fadeOverlay2" style="opacity:0.95;display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:100;background:grey;"> <div id="fadeOverlay2" style="opacity:0.95;display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:100;background:grey;">
<div id="settingsBox"> <div id="settingsBox">
<div class="rowsel"> <div class="togop">
<label for="SdSize">%TXT_SDSIZE%</label>
<input id="SdSize" type="range" min="145" max="280" value="%SD-SIZE%" step="1" onchange="document.getElementById('sliderValueSd').innerHTML = this.value;" />
<span id="sliderValueSd">%SD-SIZE%</span>
</div>
<div class="rowsel">
<label for="PgInRow">%TXT_NRROWS%</label> <label for="PgInRow">%TXT_NRROWS%</label>
<input id="PgInRow" type="range" min="2" max="8" value="%ROW-PAGES%" step="1" onchange="document.getElementById('sliderValuePg').innerHTML = this.value;" />
<span id="sliderValuePg">%ROW-PAGES%</span>
</div> </div>
<div class="title"><input type="checkbox" name="sdbackimg" id="BgImgToggle" onchange="bgImgToggle();bgImgUpdate()" />&nbsp;<label for="BgImgToggle">%TXT_NOTE%</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()" />&nbsp;<label for="SdSizeToggle">%TXT_SDSIZE%</label>
</div>
<div class="rowsel">
<span id="sliderValueSd">%SD-SIZE%</span>
<input id="SdSize" type="range" min="145" max="280" value="%SD-SIZE%" step="1" onchange="$('#sliderValueSd').html(this.value);" />
</div>
<div class="togop">
<input type="checkbox" name="sdbackimg" id="BgImgToggle" onchange="bgImgToggle();bgImgUpdate()" />&nbsp;<label for="BgImgToggle">%TXT_NOTE%</label>
</div>
<div class="content"> <div class="content">
<p> <p>
<input id="BgImgSel" type="button" class="button" value="%TXT_SELECTIMAGE%" onclick="bgImageSel();bgImgUpdate()" /> <input id="BgImgSel" type="button" class="button" value="%TXT_SELECTIMAGE%" onclick="bgImageSel();bgImgUpdate()" />
@ -409,7 +412,7 @@ $("#quickdial").sortable({
</select> </select>
</p> </p>
<p> <p>
<input class="button" type="button" value="%APPLY%" onClick="saveSettings();$('#fadeOverlay2').fadeOut('slow');" /> <input class="button" type="button" value="%APPLY%" onClick="saveSettings();$('#fadeOverlay2').fadeOut('slow', function(){window.location.reload();});" />
</p> </p>
</div> </div>
<div class="thumbhold"><p id="thumb"></p></div> <div class="thumbhold"><p id="thumb"></p></div>

4
src/network/qupzillaschemehandler.cpp
View File

@ -267,8 +267,8 @@ QString QupZillaSchemeReply::speeddialPage()
dPage.replace("%TXT_FHEIGHT%", tr("Fit Height")); dPage.replace("%TXT_FHEIGHT%", tr("Fit Height"));
dPage.replace("%TXT_NOTE%", tr("Use background image")); dPage.replace("%TXT_NOTE%", tr("Use background image"));
dPage.replace("%TXT_SELECTIMAGE%", tr("Select image")); dPage.replace("%TXT_SELECTIMAGE%", tr("Select image"));
dPage.replace("%TXT_NRROWS%", tr("Max pages in row:")); dPage.replace("%TXT_NRROWS%", tr("Max number of pages in a row:"));
dPage.replace("%TXT_SDSIZE%", tr("Size of dials:")); dPage.replace("%TXT_SDSIZE%", tr("Change size of dials"));
} }
QString page = dPage; QString page = dPage;