mirror of
https://github.com/myvesta/vesta
synced 2025-08-14 18:49:21 -07:00
scrollable top panel
This commit is contained in:
Serghey Rodin
parent
6718bdd926
commit
ff9cb08425
3 changed files with 137 additions and 7 deletions
|
|
@ -15,9 +15,11 @@
|
|||
<a class="top-logout" href="/logout/"> <?php print __('Log out') ?> </a>
|
||||
</span>
|
||||
</div>
|
||||
<div style="display:block; float:left;">
|
||||
<div class="main-menu">
|
||||
<span class="nav-logo">
|
||||
<img style="margin: 30px 0 0 10px;" src="/images/logo.png">
|
||||
<div class="logo-container">
|
||||
<img src="/images/logo.png">
|
||||
</div>
|
||||
</span>
|
||||
|
||||
<a class="nav-lnk" href="/list/user/">
|
||||
|
|
@ -29,9 +31,10 @@
|
|||
<?php print __('users');?>: <? echo $panel[$user]['U_USERS'] ?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_USERS']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
<a class="nav-lnk" href="/list/web/">
|
||||
<span class="nav-<?php if($TAB == 'WEB' ) echo 'selected-' ?>block">
|
||||
<p class="nav-<?php if($TAB == 'WEB' ) echo 'selected-' ?>header">
|
||||
|
|
@ -42,6 +45,7 @@
|
|||
<?php print __('aliases');?>: <? echo $panel[$user]['U_WEB_ALIASES']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_WEB']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -55,6 +59,7 @@
|
|||
<?php print __('records');?>: <? echo $panel[$user]['U_DNS_RECORDS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DNS']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -68,6 +73,7 @@
|
|||
<?php print __('accounts');?>: <? echo $panel[$user]['U_MAIL_ACCOUNTS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_MAIL']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -80,6 +86,7 @@
|
|||
<?php print __('databases');?>: <? echo $panel[$user]['U_DATABASES']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DB']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -92,6 +99,7 @@
|
|||
<?php print __('jobs');?>: <? echo $panel[$user]['U_CRON_JOBS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_CRON']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -103,6 +111,7 @@
|
|||
<p class="nav-counters">
|
||||
<?php print __('backups');?>: <? echo $panel[$user]['U_BACKUPS']?><br>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -41,8 +41,10 @@
|
|||
var valus= document.getElementById(frmname);
|
||||
if (checked==false) {
|
||||
checked=true;
|
||||
$('.data-row').addClass("selected");
|
||||
} else {
|
||||
checked = false;
|
||||
$('.data-row').removeClass("selected");
|
||||
}
|
||||
for (var i =0; i < valus.elements.length; i++) {
|
||||
valus.elements[i].checked=checked;
|
||||
|
|
@ -51,8 +53,40 @@
|
|||
</script>
|
||||
<script language="JavaScript">
|
||||
$('document').ready(function() {
|
||||
var nav = $('.top');
|
||||
var nav = $('.top');
|
||||
var lastScrollTop = 0;
|
||||
|
||||
$(window).scroll(function () {
|
||||
|
||||
var st = $(this).scrollTop();
|
||||
|
||||
if(st > 27 ){
|
||||
nav.addClass("small-logo");
|
||||
}else{
|
||||
nav.removeClass("small-logo");
|
||||
}
|
||||
|
||||
if (st > lastScrollTop){
|
||||
if ($(this).scrollTop() > 58) {
|
||||
nav.addClass("small");
|
||||
}
|
||||
} else {
|
||||
if ($(this).scrollTop() < 58) {
|
||||
nav.removeClass("small");
|
||||
}
|
||||
}
|
||||
lastScrollTop = st;
|
||||
});
|
||||
|
||||
|
||||
$('#vstobjects').bind('click', function(evt) { // observe change event on whole div#vstobjects
|
||||
var elm = evt.target; // grab element on which user clicked
|
||||
|
||||
if($(elm).hasClass('data-controls') || $(elm).parents('.data-controls')[0]){
|
||||
return;
|
||||
}
|
||||
|
||||
var parent = $(elm).hasClass('data-row') ? $(elm) : $(elm).parents('.data-row'); // check if outer element is row container and get it
|
||||
if (!$(parent).hasClass('selected')) {
|
||||
parent.addClass('selected'); // add class
|
||||
|
|
@ -65,9 +99,87 @@
|
|||
// another actions on unchecked row
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
if($('.movement.left').length){
|
||||
|
||||
refresh_timer.right = $('.movement.right');
|
||||
refresh_timer.left = $('.movement.left');
|
||||
|
||||
refresh_timer.start();
|
||||
|
||||
|
||||
$('.pause').click(function(){
|
||||
refresh_timer.stop();
|
||||
$('.pause').addClass('hidden');
|
||||
$('.play').removeClass('hidden');
|
||||
$('.refresh-timer').addClass('paused');
|
||||
});
|
||||
|
||||
$('.play').click(function(){
|
||||
refresh_timer.start();
|
||||
$('.pause').removeClass('hidden');
|
||||
$('.play').addClass('hidden');
|
||||
$('.refresh-timer').removeClass('paused');
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
refresh_timer = {
|
||||
speed: 50,
|
||||
degr: 180,
|
||||
right: 0,
|
||||
left: 0,
|
||||
periodical: 0,
|
||||
first: 1,
|
||||
|
||||
start: function(){
|
||||
this.periodical = setInterval(function(){refresh_timer.turn()}, this.speed);
|
||||
},
|
||||
|
||||
stop: function(){
|
||||
clearTimeout(this.periodical);
|
||||
},
|
||||
|
||||
turn: function(){
|
||||
this.degr += 1;
|
||||
|
||||
/// console.log(this.first + " - " + this.degr);
|
||||
|
||||
if(this.first && this.degr >= 361){
|
||||
this.first = 0;
|
||||
this.degr = 180;
|
||||
this.left.css({'-webkit-transform': 'rotate(180deg)'});
|
||||
this.left.css({'transform': 'rotate(180deg)'});
|
||||
this.left.children('.loader-half').addClass('dark');
|
||||
}
|
||||
if(!this.first && this.degr >= 360){
|
||||
this.first = 1;
|
||||
this.degr = 180;
|
||||
this.left.css({'-webkit-transform': 'rotate(0deg)'});
|
||||
this.right.css({'-webkit-transform': 'rotate(180deg)'});
|
||||
this.left.css({'transform': 'rotate(0deg)'});
|
||||
this.right.css({'transform': 'rotate(180deg)'});
|
||||
this.left.children('.loader-half').removeClass('dark');
|
||||
|
||||
this.stop();
|
||||
location.reload();
|
||||
}
|
||||
|
||||
if(this.first){
|
||||
this.right.css({'-webkit-transform': 'rotate('+this.degr+'deg)'});
|
||||
this.right.css({'transform': 'rotate('+this.degr+'deg)'});
|
||||
}else{
|
||||
this.left.css({'-webkit-transform': 'rotate('+this.degr+'deg)'});
|
||||
this.left.css({'transform': 'rotate('+this.degr+'deg)'});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/app.js"></script>
|
||||
<script type="text/javascript" src="/js/templates.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<body>
|
||||
|
|
@ -10,9 +10,11 @@
|
|||
<a class="top-logout" href="/logout/"> <?php print __('Log out') ?></a>
|
||||
</span>
|
||||
</div>
|
||||
<div style="display:block; float:left;">
|
||||
<div class="main-menu">
|
||||
<span class="nav-logo">
|
||||
<img style="margin: 30px 0 0 10px;" src="/images/logo.png">
|
||||
<div class="logo-container">
|
||||
<img src="/images/logo.png">
|
||||
</div>
|
||||
</span>
|
||||
|
||||
<a class="nav-lnk" href="/list/user/">
|
||||
|
|
@ -24,6 +26,7 @@
|
|||
<?php print __('disk');?>: <? echo humanize_usage($panel[$user]['U_DISK']) ?> <br>
|
||||
<?php print __('traffic');?>: <? echo humanize_usage($panel[$user]['U_BANDWIDTH']) ?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -37,6 +40,7 @@
|
|||
<?php print __('aliases');?>: <? echo $panel[$user]['U_WEB_ALIASES']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_WEB']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -50,6 +54,7 @@
|
|||
<?php print __('records');?>: <? echo $panel[$user]['U_DNS_RECORDS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DNS']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -63,6 +68,7 @@
|
|||
<?php print __('accounts');?>: <? echo $panel[$user]['U_MAIL_ACCOUNTS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_MAIL']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -75,6 +81,7 @@
|
|||
<?php print __('databases');?>: <? echo $panel[$user]['U_DATABASES']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DB']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -87,6 +94,7 @@
|
|||
<?php print __('jobs');?>: <? echo $panel[$user]['U_CRON_JOBS']?><br>
|
||||
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_CRON']?>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
|
|
@ -98,6 +106,7 @@
|
|||
<p class="nav-counters">
|
||||
<?php print __('backups');?>: <? echo $panel[$user]['U_BACKUPS']?><br>
|
||||
</p>
|
||||
<p class="marker"></p>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue