Permalink
Fetching contributors…
Cannot retrieve contributors at this time
496 lines (468 sloc) 16.6 KB
<html>
<head><title>Scroll To Top Button Options</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<script type="text/javascript" src="/libraries/jquery.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
</style>
<script type="text/javascript">
// Restores default settings.
function defaults() {
loadcount=localStorage["loadcount"];
donated=localStorage["donated"];
bothered=localStorage["bothered"];
bothered2=localStorage["bothered2"];
localStorage.clear();
localStorage["loadcount"]=loadcount;
localStorage["bothered"]=bothered;
localStorage["bothered2"]=bothered2;
localStorage["donated"]=donated;
localStorage["latest"]="2";
restore_options();
save_options();
textChange();
}
// Sets options to my personal setup
function authorsettings() {
localStorage["scroll_speed"]="1000";
localStorage["scroll_speed2"]="1000";
localStorage["size"]="50px";
localStorage["arrow"]="arrow_only_blue";
localStorage["location"]="CR";
localStorage["stbb"]="dual";
localStorage["transparency"]="0.5";
localStorage["contextmenu"]="on";
localStorage["shortcuts"]="arrows";
restore_options();
save_options();
textChange();
}
// Saves options to localStorage.
function save_options() {
var select = document.getElementById("speed");
var speed = select.children[select.selectedIndex].value;
localStorage["scroll_speed"] = speed;
var select = document.getElementById("speed2");
var speed2 = select.children[select.selectedIndex].value;
localStorage["scroll_speed2"] = speed2;
var select = document.getElementById("distance");
var distance = select.children[select.selectedIndex].value;
localStorage["distance_length"] = distance;
var select = document.getElementById("buttonsize");
var size = select.children[select.selectedIndex].value;
localStorage["size"] = size;
var select = document.getElementById("buttoncolor");
var color = select.children[select.selectedIndex].value;
localStorage["arrow"] = color;
/*var select = document.getElementById("scroll");
var scroll = select.children[select.selectedIndex].value;
localStorage["scroll"] = scroll;*/
var select = document.getElementById("location");
var location = select.children[select.selectedIndex].value;
localStorage["location"] = location;
var select = document.getElementById("stbb");
var stbb = select.children[select.selectedIndex].value;
localStorage["stbb"] = stbb;
var select = document.getElementById("transparency");
var transparency = select.children[select.selectedIndex].value;
localStorage["transparency"] = transparency;
var select = document.getElementById("contextmenu");
var contextmenu = select.children[select.selectedIndex].value;
localStorage["contextmenu"] = contextmenu;
var select = document.getElementById("shortcuts");
var shortcuts = select.children[select.selectedIndex].value;
localStorage["shortcuts"] = shortcuts;
// Update status to let user know options were saved.
var status = document.getElementById("status");
status.innerHTML = "Options Saved.";
setTimeout(function() {
status.innerHTML = "";
}, 3000);
}
// Message to restart Chrome when setting change requires it
var restartChange = "false";
function restart() {
if (restartChange=="false") {
var status = document.getElementById("restartstatus");
status.innerHTML = "Restart Google Chrome to take effect.";
restartChange = "true";
}
else if (restartChange=="true") {
var status = document.getElementById("restartstatus");
status.innerHTML = "";
restartChange = "false";
}
}
// Restores select box state to saved value from localStorage.
function restore_options() {
var favorite = localStorage["scroll_speed"];
if (!favorite) {
favorite = 1000;
}
var select = document.getElementById("speed");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite) {
child.selected = "true";
break;
}
}
var favorite9 = localStorage["scroll_speed2"];
if (!favorite9) {
favorite9 = 1000;
}
var select = document.getElementById("speed2");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite9) {
child.selected = "true";
break;
}
}
var favorite2 = localStorage["distance_length"];
if (!favorite2) {
favorite2 = 400;
}
var select = document.getElementById("distance");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite2) {
child.selected = "true";
break;
}
}
var favorite3 = localStorage["size"];
if (!favorite3) {
favorite3 = "50px";
}
var select = document.getElementById("buttonsize");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite3) {
child.selected = "true";
break;
}
}
var favorite4 = localStorage["arrow"];
if (!favorite4) {
favorite4 = "arrow_blue";
}
var select = document.getElementById("buttoncolor");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite4) {
child.selected = "true";
break;
}
}
/*var favorite5 = localStorage["scroll"];
if (!favorite5) {
favorite5 = "jswing";
}
var select = document.getElementById("scroll");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite5) {
child.selected = "true";
break;
}
}*/
var favorite6 = localStorage["location"];
if (!favorite6) {
favorite6 = "TR";
}
var select = document.getElementById("location");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite6) {
child.selected = "true";
break;
}
}
var favorite7 = localStorage["stbb"];
if (!favorite7) {
favorite7 = "off";
}
var select = document.getElementById("stbb");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite7) {
child.selected = "true";
break;
}
}
var favorite8 = localStorage["transparency"];
if (!favorite8) {
favorite8 = "0.5";
}
var select = document.getElementById("transparency");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite8) {
child.selected = "true";
break;
}
}
var favorite10 = localStorage["contextmenu"];
if (!favorite10) {
favorite10 = "on";
}
var select = document.getElementById("contextmenu");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite10) {
child.selected = "true";
break;
}
}
var favorite11 = localStorage["shortcuts"];
if (!favorite11) {
favorite11 = "shortcuts";
}
var select = document.getElementById("shortcuts");
for (var i = 0; i < select.children.length; i++) {
var child = select.children[i];
if (child.value == favorite11) {
child.selected = "true";
break;
}
}
save_options();
}
// Reports events to Google Analytics.
function report(option) {
if (option == 1) {
_gaq.push(['_trackEvent', 'Scroll Speed', localStorage["scroll_speed"]]);
}
else if (option == 2) {
_gaq.push(['_trackEvent', 'Distance to Scroll', localStorage["distance_length"]]);
}
else if (option == 3) {
_gaq.push(['_trackEvent', 'Button Size', localStorage["size"]]);
}
else if (option == 4) {
_gaq.push(['_trackEvent', 'Button Kind', localStorage["arrow"]]);
}
else if (option == 5) {
_gaq.push(['_trackEvent', 'Scroll Type', localStorage["scroll"]]);
}
else if (option == 6) {
_gaq.push(['_trackEvent', 'Button Location', localStorage["location"]]);
}
else if (option == 7) {
_gaq.push(['_trackEvent', 'Scroll to Bottom Button', localStorage["stbb"]]);
}
else if (option == 8) {
_gaq.push(['_trackEvent', 'Transparency', localStorage["transparency"]]);
}
else if (option == 9) {
_gaq.push(['_trackEvent', 'Scroll Speed Down', localStorage["scroll_speed2"]]);
}
else if (option == 10) {
_gaq.push(['_trackEvent', 'Context Menu', localStorage["contextmenu"]]);
}
else if (option == 11) {
_gaq.push(['_trackEvent', 'Shortcut Keys', localStorage["shortcuts"]]);
}
}
function textChange(){
if(localStorage["stbb"]=="flip"){
$("#textChange").html("Flip Distance:");
$("#textChange").show();
$("#distance").show();
$(".appearance").show();
$(".down").show();
}
else if(localStorage["stbb"]=="dual"){
$("#textChange").hide();
$("#distance").hide();
$(".appearance").show();
$(".down").show();
}
else if(localStorage["stbb"]=="keys"){
$("#textChange").hide();
$("#distance").hide();
$(".appearance").hide();
$(".down").show();
}
else{
$("#textChange").html("Appear Distance:");
$("#textChange").show();
$("#distance").show();
$(".appearance").show();
$(".down").hide();
}
}
</script>
</head>
<body onLoad="restore_options()">
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-17657222-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = 'https://ssl.google-analytics.com/ga.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);
})();
</script>
<Div id="options">
<div id="headerTitle"></div>
<div id="content">
<Div id="welcome">
<!--<center><p id="header">Welcome to Version 4!</p></center>
<strong><p class="version">New Stuff:</p>
<ul class="features">
<li>Dual button mode! Scroll to the top or the bottom!</li>
<li>You can now choose to put it on the middle left or right</li>
<li>Keyboard shortcuts! Alt+T or Alt+B (Thanks to <a href="http://davidblasiak.tumblr.com/" target="_blank">David Blasiak</a>!)</li>
<li>Bug fixes</li></ul></strong>
<p><center><a href="http://scrolltotopbutton.tumblr.com/" target="_blank">Keep up to date on new features here!</a></center></p>-->
</div>
<p><strong><center>Please <a href="https://chrome.google.com/webstore/detail/chiikmhgllekggjhdfjhajkfdkcngplp" target="_blank">rate this extension</a> if you enjoy it!<br/>The feedback really helps others find this extension!</strong></center></p>
<p>
Button Mode:
<select id="stbb" onChange="save_options();textChange();report(7)">
<option value="off">Scroll to Top Only</option>
<option value="flip">Flip between Top/Bottom</option>
<option value="dual">Dual Arrows</option>
<option value="keys">Keyboard Only</option>
</select>
</p>
<p>
Scroll Up Speed:
<select id="speed" onChange="save_options();report(1)">
<option value="40000">Slowest</option>
<option value="20000">Slower</option>
<option value="2000">Slow</option>
<option value="1000">Fast</option>
<option value="100">Faster</option>
<option value="1">Fastest (Instant)</option>
</select>
</p>
<p>
<div class="down" style="clear:left;padding-right:4px;">Scroll Down Speed:
<select id="speed2" onChange="save_options();report(9)">
<option value="40000">Slowest</option>
<option value="20000">Slower</option>
<option value="2000">Slow</option>
<option value="1000">Fast</option>
<option value="100">Faster</option>
<option value="1">Fastest (Instant)</option>
</select>
</div>
</p>
<p>
<div id="textChange" style="float:left;padding-right:4px;">Appear Distance:</div>
<select id="distance" onChange="save_options();report(2)">;
<option value="100">Barely Any</option>
<option value="275">A little</option>
<option value="400">Medium</option>
<option value="700">More than average</option>
<option value="1000">A lot</option>
<option value="2500">A ton</option>
</select>
</p>
<p>
<div class="appearance" style="clear:left;padding-right:4px;">Button Size:
<select id="buttonsize" onChange="save_options();report(3)">
<option value="35px">35x35 pixels</option>
<option value="40px">40x40 pixels</option>
<option value="45px">45x45 pixels</option>
<option value="50px">50x50 pixels</option>
</select>
</div>
</p>
<p>
<div class="appearance" style="clear:left;padding-right:4px;">Button Design:
<select id="buttoncolor" onChange="save_options();report(4)">
<option value="arrow_blue">Tumblr Blue</option>
<option value="arrow_grey">Grey</option>
<option value="arrow_black">Black</option>
<option value="" disabled="disabled">Colors</option>
<option value="arrow_red">Red</option>
<option value="arrow_orange">Orange</option>
<option value="arrow_yellow">Yellow</option>
<option value="arrow_green">Green</option>
<option value="arrow_blue2">Blue</option>
<option value="arrow_purple">Purple</option>
<option value="arrow_pink">Pink</option>
<option value="" disabled="disabled">Arrow Only</option>
<option value="arrow_only_blue">Tumblr Blue - Arrow Only</option>
<option value="arrow_only_grey">Grey - Arrow Only</option>
<option value="" disabled="disabled">Alternate Designs</option>
<option value="arrow_pixel_blue">Pixel Design</option>
</select>
</div>
</p>
<!--<p>
Page Bounce:
<select id="scroll" onChange="save_options();report(5)">
<option value="jswing">Off</option>
<option value="easeOutBounce">On</option>
</select>
</p>-->
<p>
<div class="appearance" style="clear:left;padding-right:4px;">Button Location:
<select id="location" onChange="save_options();report(6)">
<option value="TR">Top Right</option>
<option value="TL">Top Left</option>
<option value="TC">Top Center</option>
<option value="CR">Center Right</option>
<option value="CL">Center Left</option>
<option value="BR">Bottom Right</option>
<option value="BL">Bottom Left</option>
<option value="BC">Bottom Center</option>
</select>
</div>
</p>
<p>
<div class="appearance" style="clear:left;padding-right:4px;">Opacity of button while idle:
<select id="transparency" onChange="save_options();report(8)">
<option value="0.0">Invisible</option>
<option value="0.5">Transparent</option>
<option value="1.0">Opaque</option>
</select>
</div>
</p>
<p>
Keyboard Shortcuts:
<select id="shortcuts" onChange="save_options();report(11)">
<option value="arrows">Alt + Up/Down Arrows</option>
<option value="tb">Alt + T/B</option>
<option value="off">Off</option>
</select>
</p>
<p><p style="float:left; margin-top:0px; padding-right:4px;">
Context (Right-click) Menu:</p>
<select id="contextmenu" style="float:left; margin-top:0px;" onChange="save_options();report(10);restart()">
<option value="on">On</option>
<option value="off">Off</option>
</select>
<p id="restartstatus" style="float:left; font-size:.9em; line-height:.5; margin-top:0px; padding:6px 0 0 10px;"></p>
</p>
<script type="text/javascript">$(document).ready(textChange());</script>
<button id="restore" title="Restore Defaults" onClick="defaults()"></button>
<button id="author" title="Author's Settings" onClick="authorsettings()"></button>
<p id="status" style="float:left; font-size:.9em; line-height:.5; padding:3px 0 0 10px;"></p>
<p style="padding-top:10px;clear:left;"><strong><center>Pick a shortcut above or use Home/End keys on a page to scroll with just your keyboard!</center></strong></p>
<!--<p><strong>Do you speak multiple languages? Please help me translate this extension! <a href="mailto:sttb@codysherman.com">Email me!</a></strong></p>-->
<div id="bottomNav">
<a href="http://scrolltotopbutton.com/" title="Release Notes" target="_blank"><div id="release"></div></a>
<a href="http://github.com/codysherman/Scroll-to-Top-Button-Extension" title="Source Code" target="_blank"><div id="source"></div></a>
<a href="http://codysherman.com/" title="By Cody Sherman" target="_blank"><div id="cody"></div></a>
</div>
<div style="border:1px #434b52 solid;height:60px;">
<div style="float:left;padding-left:3px;width:440px;padding-top:3px;">A fan of Scroll To Top Button? Donate! You can donate whatever amount you would like, and I would appreciate anything I can get to help pay for college and stuffs :) <a href="http://scrolltotopbutton.com/donate" target="_blank">More reasons to donate!</a></div>
<div style="padding-top:12px;padding-left:10px;float:left;">
<a href="http://scrolltotopbutton.com/donate" title="Donate Now" target="_blank"><img src="/images/donate.png" alt="Donate"/></a>
</div>
</div>
</div>
</div>
<script>
if (localStorage["latest"]!="2"){
localStorage["latest"]="2";
};
</script>
</body>
</html>