added ability to select themes between calm and original

added ability to select themes between calm and original
This commit is contained in:
Hedgehog 2014-03-23 23:35:50 +04:00
parent 853434376b
commit 759ac71d0c
10 changed files with 177 additions and 236 deletions

View File

@ -3,18 +3,9 @@
<head>
<meta charset="utf-8"/>
<title>Aborting...</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="jquery.min.js"></script>
<script src="jQueryPlugins.js"></script>
<script src="jquery.json-2.4.js"></script>
@ -28,7 +19,7 @@ if (theme=='calm') {
<script src="twister_newmsgs.js"></script>
<script src="twister_network.js"></script>
<script src="interface_common.js"></script>
<script>changeStyle();</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />
</head>

View File

@ -1429,7 +1429,7 @@ input.userMenu-search-field:focus::-ms-input-placeholder {
background: #fff;
transition: background-color 100ms linear;
}
.login .module select.local-usernames, .sndOpt, #keysOpt select, #choseLanguage select{
.login .module select.local-usernames, .sndOpt, #keysOpt select, #selectLanguage select, #selectTheme select {
height: 30px;
font: 13px/24px "Open sans";
text-align: center;
@ -1909,7 +1909,7 @@ input.userMenu-search-field:focus::-ms-input-placeholder {
margin-right: -163px;
font: 12px "Open Sans", sans-serif;
}
#notifyForm p, #choseLanguage p, #keysOpt p {
#notifyForm p, #selectLanguage p, #keysOpt p {
margin-top: 15px;
}
/* Following page */

View File

@ -3,18 +3,9 @@
<head>
<meta charset="utf-8"/>
<title>Following</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -35,10 +26,8 @@ if (theme=='calm') {
<script src="jquery-emotions/jquery.emotions.js"></script>
<script>
$(document).ready(function()
{
initInterfaceFollowing();
});
$(document).ready(function(){initInterfaceFollowing()});
changeStyle();
</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />

View File

@ -3,6 +3,9 @@
<head>
<meta charset="utf-8"/>
<title>twister</title>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -28,20 +31,9 @@
<script src="js/options.js"></script>
<script src="jquery-emotions/jquery.emotions.js"></script>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
$(".userMenu-dhtindicator").hide();
}
$(function(){setInterval("networkUpdate()", 2000); homeIntInit();})
changeStyle();
</script>
<script>$(function(){setInterval("networkUpdate()", 2000); homeIntInit ();})</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />
</head>
@ -528,14 +520,5 @@ $(".userMenu-dhtindicator").hide();
<audio id="player"></audio>
<audio id="playerSec"></audio>
<!-- hide elements -->
<script>
if (theme=='calm') {
$(".calm_menu").show();
} else {
$(".userMenu-dhtindicator").hide();
$(".original_menu").show();
}
</script>
</body>
</html>

View File

@ -42,89 +42,6 @@ function modalDMIntr() {
$(".modal-content").removeAttr("style");
});
};
//sound notifications
function soundNotifOptions() {
if(!localStorage['sndDM']) localStorage['sndDM'] = false;
if(!localStorage['sndMention']) localStorage['sndMention'] = false;
$('#notifyForm select').each(function(){
this.value = localStorage[this.id];
});
var player = $('#player');
player[0].pause();
$('#player').empty();
$('form#notifyForm').on('change','select',function(){
localStorage.setItem(this.id, this.value);
if(this.value == false) {player[0].pause(); return;}
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+this.value+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+this.value+'.ogg');
}
player[0].play();
});
}
function volumeControl () {
var playerVol = $('#playerVol');
playerVol[0].value = localStorage[playerVol[0].id] ? localStorage[playerVol[0].id] : 100;
$('.volValue').text((localStorage[playerVol[0].id] * 100).toFixed());
playerVol.on('change',function(){
localStorage.setItem(this.id, this.value);
$('#player')[0].volume = (this.value);
$('.volValue').text((this.value * 100).toFixed());
});
}
function DMsNotif() {
if(localStorage['sndDM'] == "false") return;
var player = $('#player');
$('#player').empty();
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+localStorage['sndDM']+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+localStorage['sndDM']+'.ogg');
}
player[0].volume = localStorage['playerVol'];
player[0].play();
}
function mensNotif() {
if(localStorage['sndMention'] == "false") return;
var player = $('#player');
$('#playerSec').empty();
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+localStorage['sndMention']+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+localStorage['sndMention']+'.ogg');
}
player[0].volume = localStorage['playerVol'];
player[0].play();
};
function keysSend() {
if(!localStorage['keysSend']) localStorage['keysSend'] = 1;
$('#keysOpt select')[0].value = localStorage['keysSend'];
$('#keysOpt select').on('change', function(){
localStorage[this.id] = this.value;
})
}
function mensAutocomplete() {
var suggests = [];
@ -151,20 +68,25 @@ function mensAutocomplete() {
])
}
function setLang() {
$('#language').val(localStorage['locLang'] || 'auto')
$('#language').on('change', function(){
localStorage['locLang'] = $(this).val();
})
function changeStyle() {
var style, profile, menu;
if(localStorage['theme'] == 'calm')
{
style = 'css/style.css';
profile = 'css/profile.css';
menu = '.calm_menu';
}else if(localStorage['theme'] == 'original')
{
style = 'css/orange/style.css';
profile = 'css/orange/profile.css';
menu = '.original_menu';
$(".userMenu-dhtindicator").hide();
}
$('#stylecss').attr('href', style);
$('#profilecss').attr('href', profile);
setTimeout(function(){$(menu).removeAttr('style')}, 0);
}
function InitOptions () {
soundNotifOptions();
volumeControl();
keysSend();
setLang();
}
function homeIntInit () {
modalDMIntr ();
setTimeout(mensAutocomplete, 800);

View File

@ -1,3 +1,110 @@
$(function() {
});
function soundNotifOptions() {
if(!localStorage['sndDM']) localStorage['sndDM'] = false;
if(!localStorage['sndMention']) localStorage['sndMention'] = false;
$('#notifyForm select').each(function(){
this.value = localStorage[this.id];
});
var player = $('#player');
player[0].pause();
$('#player').empty();
$('form#notifyForm').on('change','select',function(){
localStorage.setItem(this.id, this.value);
if(this.value == false) {player[0].pause(); return;}
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+this.value+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+this.value+'.ogg');
}
player[0].play();
});
}
function volumeControl () {
var playerVol = $('#playerVol');
playerVol[0].value = localStorage[playerVol[0].id] ? localStorage[playerVol[0].id] : 100;
$('.volValue').text((localStorage[playerVol[0].id] * 100).toFixed());
playerVol.on('change',function(){
localStorage.setItem(this.id, this.value);
$('#player')[0].volume = (this.value);
$('.volValue').text((this.value * 100).toFixed());
});
}
function DMsNotif() {
if(localStorage['sndDM'] == "false") return;
var player = $('#player');
$('#player').empty();
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+localStorage['sndDM']+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+localStorage['sndDM']+'.ogg');
}
player[0].volume = localStorage['playerVol'];
player[0].play();
}
function mensNotif() {
if(localStorage['sndMention'] == "false") return;
var player = $('#player');
$('#playerSec').empty();
if (player[0].canPlayType('audio/mpeg;')) {
player.attr('type', 'audio/mpeg');
player.attr('src', 'sound/'+localStorage['sndMention']+'.mp3');
} else {
player.attr('type', 'audio/ogg');
player.attr('src', 'sound/'+localStorage['sndMention']+'.ogg');
}
player[0].volume = localStorage['playerVol'];
player[0].play();
};
function keysSend() {
if(!localStorage['keysSend']) localStorage['keysSend'] = 1;
$('#keysOpt select')[0].value = localStorage['keysSend'];
$('#keysOpt select').on('change', function(){
localStorage[this.id] = this.value;
})
}
function setLang() {
$('#language').val(localStorage['locLang'] || 'auto')
$('#language').on('change', function(){
localStorage['locLang'] = $(this).val();
})
}
function setTheme() {
if(!localStorage['theme']) localStorage['theme'] = 'calm';
$('#theme').val(localStorage['theme']).on('change', function(){
localStorage['theme'] = $(this).val();
location.reload();
});
}
function InitOptions () {
soundNotifOptions();
volumeControl();
keysSend();
setLang();
setTheme();
}

View File

@ -3,18 +3,9 @@
<head>
<meta charset="utf-8"/>
<title>twister login</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -31,10 +22,8 @@ if (theme=='calm') {
<script src="js/options.js"></script>
<script>
$(document).ready(function()
{
initInterfaceLogin();
});
$(document).ready(function(){initInterfaceLogin()});
changeStyle();
</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />

View File

@ -3,18 +3,9 @@
<head>
<meta charset="utf-8"/>
<title>Network status</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -33,10 +24,8 @@ if (theme=='calm') {
<script src="js/calm.js"></script>
<script>
$(document).ready(function()
{
initInterfaceNetwork();
});
$(document).ready(function(){initInterfaceNetwork()});
changeStyle();
</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />

View File

@ -2,19 +2,10 @@
<html>
<head>
<meta charset="utf-8"/>
<title>twister login</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<title>Options</title>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script src="js/jQueryPlugins.js"></script>
<script src="js/jquery.json-2.4.js"></script>
@ -30,16 +21,9 @@ if (theme=='calm') {
<script src="js/interface_localization.js"></script>
<script src="js/calm.js"></script>
<script src="js/options.js"></script>
<script>$(function(){
initInterfaceCommon();
InitOptions();})
$(document).ready(function(){
$('#c_theme').change(function(){
localStorage.setItem('theme', $(this).val());
location.reload();
});
});
<script>
$(function(){initInterfaceCommon(); InitOptions()});
changeStyle();
</script>
</head>
@ -71,7 +55,7 @@ if (theme=='calm') {
<div class="module">
<p> Use language </p>
<div>
<form action="" id="choseLanguage">
<form action="" id="selectLanguage">
<select name="" id="language">
<option value="auto">Auto</option>
<option value="en">English</option>
@ -86,6 +70,20 @@ if (theme=='calm') {
</div>
</div>
</div>
<div class="language">
<div class="module">
<p> Theme </p>
<div>
<form action="" id="selectTheme">
<select name="" id="theme">
<option value="calm">Calm</option>
<option value="original">Original</option>
</select>
</form>
</div>
</div>
</div>
<div class="sounds">
@ -131,23 +129,7 @@ if (theme=='calm') {
</form>
</div>
</div>
</div>
<div class="Theme">
<div class="module">
<p> Theme </p>
<div>
<select name="" id="c_theme">
<option value="calm">Calm</option>
<option value="original">Original</option>
</select>
</div>
</div>
</div>
</div>
<script>
var theme = localStorage.getItem('theme');
$("#c_theme").val(theme);
</script>
</body>
</html>

View File

@ -2,18 +2,9 @@
<head>
<meta charset="utf-8">
<title>Edit profile</title>
<script>
var theme = localStorage.getItem('theme');
if (theme=='calm') {
document.write('<link rel="stylesheet" type="text/css" href="css/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/profile.css">');
document.write('<link rel="stylesheet" type="text/css" href="jquery-emotions/jquery.emotions.calm.css">');
} else {
document.write('<link rel="stylesheet" type="text/css" href="css/orange/style.css">');
document.write('<link rel="stylesheet" type="text/css" href="css/orange/profile.css">');
}
</script>
<link id="stylecss" rel="stylesheet" href="css/style.css">
<link id="profilecss" rel="stylesheet" href="css/profile.css">
<link rel="stylesheet" href="jquery-emotions/jquery.emotions.calm.css">
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/qrcode.js"></script>
<script src="js/jQueryPlugins.js"></script>
@ -33,10 +24,8 @@ if (theme=='calm') {
<script src="js/calm.js"></script>
<script>
$(document).ready(function()
{
initProfileEdit();
});
$(document).ready(function(){initProfileEdit()});
changeStyle();
</script>
<link rel="icon" type="image/png" href="img/twister_mini.png" />