Skip to content

Commit ff9cb08

Browse files
committed
scrollable top panel
1 parent 6718bdd commit ff9cb08

File tree

3 files changed

+137
-7
lines changed

3 files changed

+137
-7
lines changed

web/templates/admin/panel.html

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,11 @@
1515
<a class="top-logout" href="/logout/"> <?php print __('Log out') ?> </a>
1616
</span>
1717
</div>
18-
<div style="display:block; float:left;">
18+
<div class="main-menu">
1919
<span class="nav-logo">
20-
<img style="margin: 30px 0 0 10px;" src="/images/logo.png">
20+
<div class="logo-container">
21+
<img src="/images/logo.png">
22+
</div>
2123
</span>
2224

2325
<a class="nav-lnk" href="/list/user/">
@@ -29,9 +31,10 @@
2931
<?php print __('users');?>: <? echo $panel[$user]['U_USERS'] ?><br>
3032
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_USERS']?>
3133
</p>
34+
<p class="marker"></p>
3235
</span>
33-
3436
</a>
37+
3538
<a class="nav-lnk" href="/list/web/">
3639
<span class="nav-<?php if($TAB == 'WEB' ) echo 'selected-' ?>block">
3740
<p class="nav-<?php if($TAB == 'WEB' ) echo 'selected-' ?>header">
@@ -42,6 +45,7 @@
4245
<?php print __('aliases');?>: <? echo $panel[$user]['U_WEB_ALIASES']?><br>
4346
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_WEB']?>
4447
</p>
48+
<p class="marker"></p>
4549
</span>
4650
</a>
4751

@@ -55,6 +59,7 @@
5559
<?php print __('records');?>: <? echo $panel[$user]['U_DNS_RECORDS']?><br>
5660
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DNS']?>
5761
</p>
62+
<p class="marker"></p>
5863
</span>
5964
</a>
6065

@@ -68,6 +73,7 @@
6873
<?php print __('accounts');?>: <? echo $panel[$user]['U_MAIL_ACCOUNTS']?><br>
6974
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_MAIL']?>
7075
</p>
76+
<p class="marker"></p>
7177
</span>
7278
</a>
7379

@@ -80,6 +86,7 @@
8086
<?php print __('databases');?>: <? echo $panel[$user]['U_DATABASES']?><br>
8187
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DB']?>
8288
</p>
89+
<p class="marker"></p>
8390
</span>
8491
</a>
8592

@@ -92,6 +99,7 @@
9299
<?php print __('jobs');?>: <? echo $panel[$user]['U_CRON_JOBS']?><br>
93100
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_CRON']?>
94101
</p>
102+
<p class="marker"></p>
95103
</span>
96104
</a>
97105

@@ -103,6 +111,7 @@
103111
<p class="nav-counters">
104112
<?php print __('backups');?>: <? echo $panel[$user]['U_BACKUPS']?><br>
105113
</p>
114+
<p class="marker"></p>
106115
</span>
107116
</a>
108117
</div>

web/templates/header.html

Lines changed: 113 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,10 @@
4141
var valus= document.getElementById(frmname);
4242
if (checked==false) {
4343
checked=true;
44+
$('.data-row').addClass("selected");
4445
} else {
4546
checked = false;
47+
$('.data-row').removeClass("selected");
4648
}
4749
for (var i =0; i < valus.elements.length; i++) {
4850
valus.elements[i].checked=checked;
@@ -51,8 +53,40 @@
5153
</script>
5254
<script language="JavaScript">
5355
$('document').ready(function() {
56+
var nav = $('.top');
57+
var nav = $('.top');
58+
var lastScrollTop = 0;
59+
60+
$(window).scroll(function () {
61+
62+
var st = $(this).scrollTop();
63+
64+
if(st > 27 ){
65+
nav.addClass("small-logo");
66+
}else{
67+
nav.removeClass("small-logo");
68+
}
69+
70+
if (st > lastScrollTop){
71+
if ($(this).scrollTop() > 58) {
72+
nav.addClass("small");
73+
}
74+
} else {
75+
if ($(this).scrollTop() < 58) {
76+
nav.removeClass("small");
77+
}
78+
}
79+
lastScrollTop = st;
80+
});
81+
82+
5483
$('#vstobjects').bind('click', function(evt) { // observe change event on whole div#vstobjects
5584
var elm = evt.target; // grab element on which user clicked
85+
86+
if($(elm).hasClass('data-controls') || $(elm).parents('.data-controls')[0]){
87+
return;
88+
}
89+
5690
var parent = $(elm).hasClass('data-row') ? $(elm) : $(elm).parents('.data-row'); // check if outer element is row container and get it
5791
if (!$(parent).hasClass('selected')) {
5892
parent.addClass('selected'); // add class
@@ -65,9 +99,87 @@
6599
// another actions on unchecked row
66100
}
67101
});
102+
103+
104+
if($('.movement.left').length){
105+
106+
refresh_timer.right = $('.movement.right');
107+
refresh_timer.left = $('.movement.left');
108+
109+
refresh_timer.start();
110+
111+
112+
$('.pause').click(function(){
113+
refresh_timer.stop();
114+
$('.pause').addClass('hidden');
115+
$('.play').removeClass('hidden');
116+
$('.refresh-timer').addClass('paused');
117+
});
118+
119+
$('.play').click(function(){
120+
refresh_timer.start();
121+
$('.pause').removeClass('hidden');
122+
$('.play').addClass('hidden');
123+
$('.refresh-timer').removeClass('paused');
124+
});
125+
}
68126
});
127+
128+
129+
130+
refresh_timer = {
131+
speed: 50,
132+
degr: 180,
133+
right: 0,
134+
left: 0,
135+
periodical: 0,
136+
first: 1,
137+
138+
start: function(){
139+
this.periodical = setInterval(function(){refresh_timer.turn()}, this.speed);
140+
},
141+
142+
stop: function(){
143+
clearTimeout(this.periodical);
144+
},
145+
146+
turn: function(){
147+
this.degr += 1;
148+
149+
/// console.log(this.first + " - " + this.degr);
150+
151+
if(this.first && this.degr >= 361){
152+
this.first = 0;
153+
this.degr = 180;
154+
this.left.css({'-webkit-transform': 'rotate(180deg)'});
155+
this.left.css({'transform': 'rotate(180deg)'});
156+
this.left.children('.loader-half').addClass('dark');
157+
}
158+
if(!this.first && this.degr >= 360){
159+
this.first = 1;
160+
this.degr = 180;
161+
this.left.css({'-webkit-transform': 'rotate(0deg)'});
162+
this.right.css({'-webkit-transform': 'rotate(180deg)'});
163+
this.left.css({'transform': 'rotate(0deg)'});
164+
this.right.css({'transform': 'rotate(180deg)'});
165+
this.left.children('.loader-half').removeClass('dark');
166+
167+
this.stop();
168+
location.reload();
169+
}
170+
171+
if(this.first){
172+
this.right.css({'-webkit-transform': 'rotate('+this.degr+'deg)'});
173+
this.right.css({'transform': 'rotate('+this.degr+'deg)'});
174+
}else{
175+
this.left.css({'-webkit-transform': 'rotate('+this.degr+'deg)'});
176+
this.left.css({'transform': 'rotate('+this.degr+'deg)'});
177+
}
178+
}
179+
}
180+
69181
</script>
70182
<script type="text/javascript" src="/js/app.js"></script>
71183
<script type="text/javascript" src="/js/templates.js"></script>
72184
</head>
73-
<body>
185+
<body>

web/templates/user/panel.html

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@
1010
<a class="top-logout" href="/logout/"> <?php print __('Log out') ?></a>
1111
</span>
1212
</div>
13-
<div style="display:block; float:left;">
13+
<div class="main-menu">
1414
<span class="nav-logo">
15-
<img style="margin: 30px 0 0 10px;" src="/images/logo.png">
15+
<div class="logo-container">
16+
<img src="/images/logo.png">
17+
</div>
1618
</span>
1719

1820
<a class="nav-lnk" href="/list/user/">
@@ -24,6 +26,7 @@
2426
<?php print __('disk');?>: <? echo humanize_usage($panel[$user]['U_DISK']) ?> <br>
2527
<?php print __('traffic');?>: <? echo humanize_usage($panel[$user]['U_BANDWIDTH']) ?>
2628
</p>
29+
<p class="marker"></p>
2730
</span>
2831
</a>
2932

@@ -37,6 +40,7 @@
3740
<?php print __('aliases');?>: <? echo $panel[$user]['U_WEB_ALIASES']?><br>
3841
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_WEB']?>
3942
</p>
43+
<p class="marker"></p>
4044
</span>
4145
</a>
4246

@@ -50,6 +54,7 @@
5054
<?php print __('records');?>: <? echo $panel[$user]['U_DNS_RECORDS']?><br>
5155
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DNS']?>
5256
</p>
57+
<p class="marker"></p>
5358
</span>
5459
</a>
5560

@@ -63,6 +68,7 @@
6368
<?php print __('accounts');?>: <? echo $panel[$user]['U_MAIL_ACCOUNTS']?><br>
6469
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_MAIL']?>
6570
</p>
71+
<p class="marker"></p>
6672
</span>
6773
</a>
6874

@@ -75,6 +81,7 @@
7581
<?php print __('databases');?>: <? echo $panel[$user]['U_DATABASES']?><br>
7682
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_DB']?>
7783
</p>
84+
<p class="marker"></p>
7885
</span>
7986
</a>
8087

@@ -87,6 +94,7 @@
8794
<?php print __('jobs');?>: <? echo $panel[$user]['U_CRON_JOBS']?><br>
8895
<?php print __('spnd');?>: <? echo $panel[$user]['SUSPENDED_CRON']?>
8996
</p>
97+
<p class="marker"></p>
9098
</span>
9199
</a>
92100

@@ -98,6 +106,7 @@
98106
<p class="nav-counters">
99107
<?php print __('backups');?>: <? echo $panel[$user]['U_BACKUPS']?><br>
100108
</p>
109+
<p class="marker"></p>
101110
</span>
102111
</a>
103-
</div>
112+
</div>

0 commit comments

Comments
 (0)