Extra manage options
This commit is contained in:
@@ -4,7 +4,8 @@ var MovieList = new Class({
|
||||
|
||||
options: {
|
||||
navigation: true,
|
||||
limit: 50
|
||||
limit: 50,
|
||||
menu: []
|
||||
},
|
||||
|
||||
movies: [],
|
||||
@@ -115,6 +116,25 @@ var MovieList = new Class({
|
||||
'change': self.search.bind(self)
|
||||
}
|
||||
}),
|
||||
self.navigation_menu = new Element('div.menu').adopt(
|
||||
self.navigation_menu_ul = new Element('ul'),
|
||||
self.navigation_menu_toggle = new Element('a.button.onlay', {
|
||||
'events': {
|
||||
'click': function(){
|
||||
self.navigation_menu_ul.toggleClass('show')
|
||||
|
||||
if(self.navigation_menu_ul.hasClass('show'))
|
||||
this.addEvent('outerClick', function(){
|
||||
self.navigation_menu_ul.removeClass('show')
|
||||
this.removeEvents('outerClick');
|
||||
})
|
||||
else
|
||||
this.removeEvents('outerClick');
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
),
|
||||
self.mass_edit_form = new Element('div.mass_edit_form').adopt(
|
||||
new Element('span.select').adopt(
|
||||
self.mass_edit_select = new Element('input[type=checkbox].inlay', {
|
||||
@@ -198,6 +218,14 @@ var MovieList = new Class({
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
// Add menu or hide
|
||||
if (self.options.menu.length > 0)
|
||||
self.options.menu.each(function(menu_item){
|
||||
self.navigation_menu_ul.adopt(new Element('li').adopt(menu_item));
|
||||
})
|
||||
else
|
||||
self.navigation_menu.hide()
|
||||
|
||||
self.nav_scrollspy = new ScrollSpy({
|
||||
min: 10,
|
||||
|
||||
@@ -310,7 +310,6 @@
|
||||
}
|
||||
|
||||
.movies .alph_nav {
|
||||
overflow: hidden;
|
||||
transition: box-shadow .4s linear;
|
||||
position: fixed;
|
||||
z-index: 2;
|
||||
@@ -359,15 +358,14 @@
|
||||
|
||||
.movies .alph_nav input {
|
||||
padding: 6px 5px;
|
||||
margin: 0;
|
||||
float: right;
|
||||
margin: 0 0 0 6px;
|
||||
float: left;
|
||||
width: 155px;
|
||||
height: 25px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.movies .alph_nav .actions {
|
||||
margin: 0 32px 0 0;
|
||||
margin: 0 6px 0 0;
|
||||
-moz-user-select: none;
|
||||
}
|
||||
.movies .alph_nav .actions li {
|
||||
@@ -448,4 +446,64 @@
|
||||
.movies .alph_nav .mass_edit_form .delete span {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
|
||||
.movies .alph_nav .menu {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.movies .alph_nav .menu > a {
|
||||
display: block;
|
||||
background: url('../images/sprite.png') no-repeat center -137px;
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
border: 1px solid rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.movies .alph_nav .menu ul:before {
|
||||
content: ' ';
|
||||
height: 0;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
border: 6px solid transparent;
|
||||
border-bottom-color: rgba(0,0,0,0.8);
|
||||
margin: -16px 0 0 147px;
|
||||
}
|
||||
|
||||
.movies .alph_nav .menu ul {
|
||||
display: none;
|
||||
border: 1px solid #333;
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 3px;
|
||||
padding: 4px;
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
margin: 32px 0 0 -145px;
|
||||
width: 185px;
|
||||
box-shadow: 0 10px 20px -10px rgba(0,0,0,0.4);
|
||||
}
|
||||
.movies .alph_nav .menu ul.show {
|
||||
display: block;
|
||||
}
|
||||
.movies .alph_nav .menu ul li {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.movies .alph_nav .menu ul li a {
|
||||
display: block;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.2);
|
||||
padding: 0 10px;
|
||||
box-shadow: none;
|
||||
font-weight: normal;
|
||||
font-size: 11px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.movies .alph_nav .menu ul li:last-child a {
|
||||
border: none;
|
||||
color: #fff;
|
||||
}
|
||||
.movies .alph_nav .menu ul li a:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.8 KiB |
@@ -35,7 +35,7 @@ Block.Navigation = new Class({
|
||||
addTab: function(tab){
|
||||
var self = this
|
||||
|
||||
return new Element('li').adopt(
|
||||
return new Element('li.tab_'+(tab.text.toLowerCase() || 'unknown')).adopt(
|
||||
new Element('a', tab)
|
||||
).inject(self.nav)
|
||||
|
||||
|
||||
@@ -9,27 +9,42 @@ Page.Manage = new Class({
|
||||
var self = this;
|
||||
|
||||
if(!self.list){
|
||||
self.refresh_button = new Element('a.icon.refresh', {
|
||||
'text': 'Refresh',
|
||||
self.refresh_button = new Element('a', {
|
||||
'title': 'Rescan your library for new movies',
|
||||
'text': 'Full library refresh',
|
||||
'events':{
|
||||
'click': self.refresh.bind(self)
|
||||
'click': self.refresh.bind(self, true)
|
||||
}
|
||||
}).inject(self.el);
|
||||
});
|
||||
|
||||
self.refresh_quick = new Element('a', {
|
||||
'title': 'Just scan for recently changed',
|
||||
'text': 'Quick library scan',
|
||||
'events':{
|
||||
'click': self.refresh.bind(self, false)
|
||||
}
|
||||
});
|
||||
|
||||
self.list = new MovieList({
|
||||
'identifier': 'manage',
|
||||
'status': 'done',
|
||||
'actions': MovieActions
|
||||
'actions': MovieActions,
|
||||
'menu': [self.refresh_button, self.refresh_quick]
|
||||
});
|
||||
$(self.list).inject(self.el);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
refresh: function(){
|
||||
refresh: function(full){
|
||||
var self = this;
|
||||
p(full)
|
||||
|
||||
Api.request('manage.update')
|
||||
Api.request('manage.update', {
|
||||
'data': {
|
||||
'full': full ? 1 : null
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -307,13 +307,24 @@ body > .spinner, .mask{
|
||||
overflow: hidden;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.select .list:before {
|
||||
content: ' ';
|
||||
height: 0;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
border: 6px solid transparent;
|
||||
border-bottom-color: #282d34;
|
||||
margin: -11px 0 0 70px;
|
||||
}
|
||||
|
||||
.select .list {
|
||||
display: none;
|
||||
background: #282d34;
|
||||
border: 1px solid #1f242b;
|
||||
position: absolute;
|
||||
margin: 25px 0 0 0;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,0.4);
|
||||
margin: 30px 0 0 0;
|
||||
box-shadow: 0 20px 20px -10px rgba(0,0,0,0.4);
|
||||
border-radius:3px;
|
||||
z-index: 3;
|
||||
}
|
||||
@@ -374,6 +385,12 @@ body > .spinner, .mask{
|
||||
rgb(73,83,98) 100%
|
||||
);
|
||||
}
|
||||
.onlay:active, .inlay.reversed > li:active {
|
||||
color: #fff;
|
||||
border: 1px solid transparent;
|
||||
background-color: #282d34;
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.25), 0 1px 0px rgba(255,255,255,0.25);
|
||||
}
|
||||
|
||||
.question {
|
||||
display: block;
|
||||
|
||||
Reference in New Issue
Block a user