Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
206 lines (183 sloc) 6.14 KB
<!DOCTYPE HTML>
<html>
<head>
<title>Better Gmail Options</title>
<link type="text/css" rel="stylesheet" href="main.css" />
<script src="jquery.js"></script>
<script src="dropDown.js"></script>
<script type="text/javascript">
$(function(){
if(localStorage['options']){
var o = JSON.parse(localStorage['options']);
$("#ads").attr('checked', o.ads);
$("#chat").attr('checked', o.chat);
$("#footer").attr('checked', o.footer);
$("#invite").attr('checked', o.invite);
$("#web").attr('checked', o.web);
$("#contact").attr('checked', o.contact);
$("#window").attr('checked', o.window);
$("#icon").attr('checked', o.icon);
$("#row").attr('checked', o.row);
$("#message").attr('checked', o.message);
$("#sound").attr('checked', o.sound);
$("#mailto").attr('checked', o.mailto)
$("#domain").val(o.domain);
$("#timeout").val(o.timeout);
$(".color").css('background-color', o.color);
}
$("#save").click(function(){
localStorage['options'] = JSON.stringify({
"ads":$("#ads").attr('checked'),
"chat":$("#chat").attr('checked'),
"footer":$("#footer").attr('checked'),
"invite":$("#invite").attr('checked'),
"web":$("#web").attr('checked'),
"contact":$("#contact").attr('checked'),
"window":$("#window").attr('checked'),
"icon":$("#icon").attr('checked'),
"row":$("#row").attr('checked'),
"message":$("#message").attr('checked'),
"sound":$("#sound").attr('checked'),
"mailto":$("#mailto").attr('checked'),
"domain":$("#domain").val(),
"timeout":$("#timeout").val(),
"color":$('.color').css('background-color')
});
localStorage['sound'] = $("#sound").attr('checked');
localStorage['timeout'] = $("#timeout").val();
localStorage['message'] = $("#message").attr('checked');
chrome.extension.sendRequest({action: 'reload'});
});
function row(){
if($('#row').attr('checked')==true){
$('.F').show();
}else{
$('.F').hide();
}
}
row();
$('#row').change(function(){
row();
});
$('.palete').click(function(){
$('#save').attr('disabled', false);
});
$('#checkall').click(function(){
$("input[type='checkbox']").attr('checked', "checked");
$('.F').show();
});
function checkcheck(){
if($('#message').attr('checked') == true){
$('#domain, #sound, #timeout').removeAttr('disabled');
}
else {$('#domain, #sound, #timeout').attr('disabled','disabled');}
}
checkcheck();
$('#message').click(function(){
checkcheck();
});
$('.F').dropDown({
menu:'#fmn',
activate:'click',
container:'.F',
afterClick:function(){
var getcolor= $('.color').attr('color');
$('.color').css('background-color', getcolor);
}
});
function playSoundPreview()
{
var soundNoList = document.getElementsByName("soundNo");
var no = 1;
for (var i = 0; i < soundNoList.length; i++) {
if (soundNoList[i].checked) {
no = i + 1;
}
}
var soundVolume = document.getElementById("soundVolume").value;
var sound = document.getElementById("sound");
sound.src = "sound/se" + no + ".ogg";
sound.volume = (soundVolume / 100);
sound.play();
}
});
</script>
</head>
<body>
<h3>Better Gmail Options</h3>
<form>
<table>
<tr>
<td style="padding: 0 25px 0 0;">
<h4>UI Preference</h4>
<div><input type="checkbox" id="ads" /><label for="ads"> Hide ads.</label></div>
<div><input type="checkbox" id="chat" /><label for="chat"> Hide chat.</label></div>
<div><input type="checkbox" id="footer" /><label for="footer"> Hide footer.</label></div>
<div><input type="checkbox" id="invite" /><label for="invite"> Hide invite friends field.</label></div>
<div><input type="checkbox" id="web" /><label for="web"> Hide web search button.</label></div>
<div><input type="checkbox" id="window" />
<label for="window"> Hide buttons "New Window, Print all, Expand and Forward"</label></div>
<div><input type="checkbox" id="contact" /><label for="contact"> Relocate contacts and tasks to top navigation</label></div>
<div><input type="checkbox" id="icon" /><label for="icon"> Add attachment icons.</label></div>
<div class="pr">
<input type="checkbox" id="row" />
<label for="row"> Add row highlight on mouse over.</label>
<div class="btn F">
<img class="color" src="img/dot.gif" />
<img class="arrow" src="img/arrow.png" />
</div>
<div id="fmn" style="display: none;">
<div class="palete r2"></div>
<div class="palete y2"></div>
<div class="palete g2"></div>
<div class="palete o2"></div>
<div class="palete b2"></div>
<div class="palete v2"></div>
<div class="palete r1"></div>
<div class="palete y1"></div>
<div class="palete g1"></div>
<div class="palete o1"></div>
<div class="palete b1"></div>
<div class="palete v1"></div>
</div>
</div>
<div><input type="checkbox" id="mailto"/><label for="mailto"> Open e-mail links with Gmail.</label></div>
</td>
<td style="padding: 0 25px 0 0;">
<h4>Notification Preference</h4>
<div>
<input type="checkbox" id="message" />
<label for="message"> Show desktop notification.</label>
</div>
<div>
<input type="checkbox" id="sound" />
<label for="sound"> Play sound when new messages arrives.</label>
</div>
<div class="bg">
<input type="text" id="timeout" value="18" />
<label for="timeout"> Notification timeout.<br>
<span class="grey" style="font-weight:normal">Indicate how long (in seconds) notification message will stay on before disappear</span>
</label>
</div>
</td>
</tr>
</table>
</form>
<button onClick="button.disabled=true" id="save">Save</button>
<input id="checkall" type="checkbox"></input><label for="checkall"> Check all.</label>
</body>
<script>
// save button disbled enabled
var inputs = document.getElementsByTagName('input'),
button = document.getElementsByTagName('button')[0];
button.disabled=true;
for (var i = 0, j = inputs.length; i < j; i++) {
inputs[i].onchange = function () {
button.disabled = false;
}
inputs[i].onkeydown = function () {
button.disabled = false;
}
}
</script>
</html>