dinislage/CouchPotatoServer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Styling fixes

Browse Source
This commit is contained in:
Ruud
2013-05-09 23:36:54 +02:00
parent f467d1c4f7
commit 9e3f978677
14 changed files with 387 additions and 335 deletions
Download Patch File Download Diff File Expand all files Collapse all files
couchpotato/core/plugins/log/static/log.js
-13
View File
@@ -6,19 +6,6 @@ Page.Log = new Class({
title: 'Show recent logs.',
has_tab: false,
initialize: function(options){
var self = this;
self.parent(options)
App.getBlock('more').addLink(new Element('a', {
'href': App.createUrl(self.name),
'text': self.name.capitalize(),
'title': self.title
}))
},
indexAction: function(){
var self = this;
couchpotato/core/plugins/movie/static/list.js
+89 -74
View File
@@ -48,7 +48,7 @@ var MovieList = new Class({
self.changeView('list');
else
self.changeView(self.getSavedView() || self.options.view || 'details');
self.getMovies();
App.addEvent('movie.added', self.movieAdded.bind(self))
@@ -151,66 +151,65 @@ var MovieList = new Class({
self.el.addClass('with_navigation')
self.navigation = new Element('div.alph_nav').grab(
new Element('div').adopt(
self.navigation_alpha = new Element('ul.numbers', {
self.navigation = new Element('div.alph_nav').adopt(
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', {
'events': {
'change': self.massEditToggleAll.bind(self)
}
}),
self.mass_edit_selected = new Element('span.count', {'text': 0}),
self.mass_edit_selected_label = new Element('span', {'text': 'selected'})
),
new Element('div.quality').adopt(
self.mass_edit_quality = new Element('select'),
new Element('a.button.orange', {
'text': 'Change quality',
'events': {
'click': self.changeQualitySelected.bind(self)
}
})
),
new Element('div.delete').adopt(
new Element('span[text=or]'),
new Element('a.button.red', {
'text': 'Delete',
'events': {
'click': self.deleteSelected.bind(self)
}
})
),
new Element('div.refresh').adopt(
new Element('span[text=or]'),
new Element('a.button.green', {
'text': 'Refresh',
'events': {
'click': self.refreshSelected.bind(self)
}
})
)
),
new Element('div.menus').adopt(
self.navigation_counter = new Element('span.counter[title=Total]'),
self.navigation_actions = new Element('ul.actions', {
'events': {
'click:relay(li)': function(e, el){
self.movie_list.empty()
self.activateLetter(el.get('data-letter'))
self.getMovies()
var a = 'active';
self.navigation_actions.getElements('.'+a).removeClass(a);
self.changeView(el.get('data-view'));
this.addClass(a);
el.inject(el.getParent(), 'top')
}
}
}),
self.navigation_counter = new Element('span.counter[title=Total]'),
self.navigation_actions = new Element('ul.inlay.actions.reversed'),
self.navigation_search_input = new Element('input.search.inlay', {
'title': 'Search through ' + self.options.identifier,
'placeholder': 'Search through ' + self.options.identifier,
'events': {
'keyup': self.search.bind(self),
'change': self.search.bind(self)
}
self.filter_menu = new Block.Menu(self, {
'class': 'filter'
}),
self.navigation_menu = new Block.Menu(self),
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', {
'events': {
'change': self.massEditToggleAll.bind(self)
}
}),
self.mass_edit_selected = new Element('span.count', {'text': 0}),
self.mass_edit_selected_label = new Element('span', {'text': 'selected'})
),
new Element('div.quality').adopt(
self.mass_edit_quality = new Element('select'),
new Element('a.button.orange', {
'text': 'Change quality',
'events': {
'click': self.changeQualitySelected.bind(self)
}
})
),
new Element('div.delete').adopt(
new Element('span[text=or]'),
new Element('a.button.red', {
'text': 'Delete',
'events': {
'click': self.deleteSelected.bind(self)
}
})
),
new Element('div.refresh').adopt(
new Element('span[text=or]'),
new Element('a.button.green', {
'text': 'Refresh',
'events': {
'click': self.refreshSelected.bind(self)
}
})
)
)
self.navigation_menu = new Block.Menu(self, {
'class': 'extra'
})
)
).inject(self.el, 'top');
@@ -223,20 +222,35 @@ var MovieList = new Class({
}).inject(self.mass_edit_quality)
});
self.filter_menu.addLink(
self.navigation_search_input = new Element('input', {
'title': 'Search through ' + self.options.identifier,
'placeholder': 'Search through ' + self.options.identifier,
'events': {
'keyup': self.search.bind(self),
'change': self.search.bind(self)
}
})
).addClass('search');
self.filter_menu.addLink(
self.navigation_alpha = new Element('ul.numbers', {
'events': {
'click:relay(li.available)': function(e, el){
self.activateLetter(el.get('data-letter'))
self.getMovies(true)
}
}
})
);
// Actions
['mass_edit', 'details', 'list'].each(function(view){
self.navigation_actions.adopt(
new Element('li.'+view+(self.current_view == view ? '.active' : '')+'[data-view='+view+']', {
'events': {
'click': function(e){
var a = 'active';
self.navigation_actions.getElements('.'+a).removeClass(a);
self.changeView(this.get('data-view'));
this.addClass(a);
}
}
}).adopt(new Element('span'))
)
var current = self.current_view == view;
new Element('li', {
'class': 'icon2 ' + view + (current ? ' active ' : ''),
'data-view': view
}).inject(self.navigation_actions, current ? 'top' : 'bottom');
});
// All
@@ -260,11 +274,11 @@ var MovieList = new Class({
'status': self.options.status
}, self.filter),
'onSuccess': function(json){
json.chars.split('').each(function(c){
self.letters[c.capitalize()].addClass('available')
})
}
});
@@ -448,8 +462,7 @@ var MovieList = new Class({
self.activateLetter();
self.filter.search = search_value;
self.movie_list.empty();
self.getMovies();
self.getMovies(true);
self.last_search_value = search_value;
@@ -461,11 +474,10 @@ var MovieList = new Class({
var self = this;
self.reset();
self.movie_list.empty();
self.getMovies();
self.getMovies(true);
},
getMovies: function(){
getMovies: function(reset){
var self = this;
if(self.scrollspy){
@@ -495,6 +507,9 @@ var MovieList = new Class({
'limit_offset': self.options.limit + ',' + self.offset
}, self.filter),
'onSuccess': function(json){
if(reset)
self.movie_list.empty();
if(self.loader_first){
var lf = self.loader_first;
couchpotato/core/plugins/movie/static/movie.actions.js
+8 -7
View File
@@ -100,10 +100,8 @@ MA.Release = new Class({
var self = this;
if(!self.options_container){
self.options_container = new Element('div.options').adopt(
self.release_container = new Element('div.releases.table').adopt(
self.trynext_container = new Element('div.buttons.try_container')
)
self.options_container = new Element('div.options').grab(
self.release_container = new Element('div.releases.table')
);
// Header
@@ -190,7 +188,9 @@ MA.Release = new Class({
self.release_container.getElement('#release_'+self.next_release.id).addClass('next_release');
}
if(self.next_release || self.last_release){
if(self.next_release || (self.last_release && ['ignored', 'failed'].indexOf(self.last_release.status.identifier) === false)){
self.trynext_container = new Element('div.buttons.try_container').inject(self.release_container, 'top');
self.trynext_container.adopt(
new Element('span.or', {
@@ -237,9 +237,10 @@ MA.Release = new Class({
(e).preventDefault();
self.createReleases();
self.trynext_container = new Element('div.buttons.trynext').inject(self.movie.info_container);
if(self.next_release || self.last_release){
if(self.next_release || (self.last_release && ['ignored', 'failed'].indexOf(self.last_release.status.identifier) === false)){
self.trynext_container = new Element('div.buttons.trynext').inject(self.movie.info_container);
self.trynext_container.adopt(
self.next_release ? [new Element('a.icon.readd', {
couchpotato/core/plugins/movie/static/movie.css
+181 -132
View File
@@ -78,24 +78,36 @@
.movies .movie {
position: relative;
border-radius: 4px;
margin: 10px 0;
padding-left: 20px;
overflow: hidden;
width: 100%;
height: 180px;
transition: all 0.6s cubic-bezier(0.9,0,0.1,1);
transition-property: width, height;
background: rgba(0,0,0,.2);
}
.movies.mass_edit_list .movie {
padding-left: 22px;
background: none;
}
.movies.details_list .movie {
padding-left: 120px;
}
.movies.list_list .movie:not(.details_view),
.movies.mass_edit_list .movie {
height: 32px;
height: 30px;
border-bottom: 1px solid rgba(255,255,255,.15);
}
.movies.list_list .movie:last-child,
.movies.mass_edit_list .movie:last-child {
border: none;
}
.movies.thumbs_list .movie {
width: 16.66667%;
height: auto;
@@ -103,9 +115,6 @@
margin: 0;
padding: 0;
vertical-align: top;
border-radius: 0;
box-shadow: none;
border: 0;
}
@media all and (max-width: 800px) {
@@ -124,16 +133,7 @@
.movies.list_list .movie:not(.details_view),
.movies.mass_edit_list .movie {
margin: 1px 0;
border-radius: 0;
background: no-repeat;
box-shadow: none;
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.movies.list_list .movie:hover:not(.details_view),
.movies.mass_edit_list .movie {
background: rgba(255,255,255,0.03);
margin: 0;
}
.movies .data {
@@ -141,18 +141,18 @@
height: 100%;
width: 100%;
position: relative;
right: 0;
border-radius: 0;
transition: all .6s cubic-bezier(0.9,0,0.1,1);
right: 0;
}
.movies.list_list .movie:not(.details_view) .data,
.movies.mass_edit_list .movie .data {
height: 30px;
padding: 3px 0 3px 10px;
box-shadow: none;
padding: 0 0 0 10px;
border: 0;
background: #4e5969;
}
.movies.mass_edit_list .movie .data {
padding-left: 8px;
}
.movies.thumbs_list .data {
position: absolute;
@@ -192,18 +192,16 @@
line-height: 0;
overflow: hidden;
height: 100%;
border-radius: 4px 0 0 4px;
transition: all .6s cubic-bezier(0.9,0,0.1,1);
background: rgba(0,0,0,.1);
}
.movies.thumbs_list .poster {
position: relative;
border-radius: 0;
}
.movies.list_list .movie:not(.details_view) .poster,
.movies.mass_edit_list .poster {
width: 20px;
height: 30px;
border-radius: 1px 0 0 1px;
}
.movies.mass_edit_list .poster {
display: none;
@@ -231,7 +229,6 @@
width: 100%;
top: 0;
bottom: 0;
border-radius: 0;
opacity: 0;
}
@@ -246,22 +243,27 @@
font-weight: bold;
margin-bottom: 10px;
margin-top: 2px;
left: 0;
top: 0;
width: 100%;
padding-right: 80px;
transition: all 0.2s linear;
height: 35px;
top: -5px;
position: relative;
}
.movies.list_list .info .title,
.movies.mass_edit_list .info .title {
height: 100%;
top: 0;
margin: 0;
}
.movies .info .title span {
display: block;
display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 100%;
height: 30px;
height: 100%;
line-height: 30px;
top: -5px;
position: relative;
}
.movies.thumbs_list .info .title span {
@@ -298,13 +300,14 @@
font-size: 21px;
word-wrap: break-word;
padding: 0;
height: 100%;
}
.movies .info .year {
position: absolute;
color: #bbb;
right: 0;
top: 1px;
top: 6px;
text-align: right;
transition: all 0.2s linear;
font-weight: normal;
@@ -348,6 +351,10 @@
min-height: 20px;
}
.movies.list_list .movie:hover .data .quality {
display: none;
}
@media all and (max-width: 480px) {
.movies .data .quality {
display: none;
@@ -380,12 +387,12 @@
right: 0;
margin-right: 60px;
z-index: 1;
top: 5px;
}
.movies .data .quality .available,
.movies .data .quality .snatched {
opacity: 1;
box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
cursor: pointer;
}
@@ -471,7 +478,7 @@
text-align: center;
font-size: 20px;
position: absolute;
padding: 70px 0 0;
padding: 80px 0 0;
left: 120px;
right: 0;
}
@@ -496,9 +503,9 @@
}
.movies .options .form {
margin: 70px 20px 0;
float: left;
margin: 80px 0 0;
font-size: 20px;
text-align: center;
}
.movies .options .form select {
@@ -508,6 +515,7 @@
.movies .options .table {
height: 180px;
overflow: auto;
line-height: 2em;
}
.movies .options .table .item {
border-bottom: 1px solid rgba(255,255,255,0.1);
@@ -599,7 +607,6 @@
text-align: center;
padding: 3px 10px;
background: #4e5969;
border-radius: 0 0 2px 2px;
transition: all .2s cubic-bezier(0.9,0,0.1,1) .2s;
z-index: 11;
}
@@ -635,14 +642,13 @@
.movies .movie .trynext {
display: inline;
position: absolute;
right: 135px;
right: 145px;
z-index: 2;
opacity: 0;
background: #4e5969;
min-width: 300px;
text-align: right;
height: 100%;
padding: 3px 0;
top: 0;
}
@@ -661,10 +667,9 @@
.movies.details_list .movie .trynext {
background: #47515f;
padding: 0;
padding: 2px 0;
right: 0;
bottom: 35px;
height: auto;
height: 25px;
}
.movies .movie .trynext a {
@@ -672,10 +677,14 @@
padding: 0 5px 0 25px;
margin-right: 10px;
color: #FFF;
border-radius: 2px;
height: 100%;
line-height: 30px;
}
.movies.details_list .movie .trynext a {
line-height: 23px;
}
.movies .movie .trynext a:last-child {
margin: 0;
margin: 0;
}
.movies .movie .trynext a:hover {
background-color: #369545;
@@ -692,14 +701,7 @@
}
.movies .alph_nav {
transition: box-shadow .4s linear;
position: relative;
z-index: 4;
top: 0px;
right: 0;
margin: 0 auto;
width: 100%;
padding: 10px 0;
height: 44px;
}
@media all and (max-width: 480px) {
@@ -707,13 +709,10 @@
display: none;
}
}
.movies .alph_nav > div {
position: relative;
max-width: 980px;
margin: 0 auto;
padding: 0;
min-height: 24px;
.movies .alph_nav .menus {
display: inline-block;
float: right;
}
.movies .alph_nav .numbers,
@@ -722,118 +721,150 @@
list-style: none;
padding: 0 0 1px;
margin: 0;
float: left;
user-select: none;
}
.movies .alph_nav .counter {
display: inline-block;
text-align: right;
position: absolute;
right: 270px;
background: #4e5969;
padding: 4px 10px;
padding: 0 10px;
height: 100%;
line-height: 43px;
border-right: 1px solid rgba(255,255,255,.07);
}
.movies .alph_nav .numbers li,
.movies .alph_nav .actions li {
display: inline-block;
vertical-align: top;
height: 24px;
line-height: 23px;
height: 100%;
line-height: 30px;
text-align: center;
cursor: pointer;
color: rgba(255,255,255,0.2);
border: 1px solid transparent;
transition: all 0.1s ease-in-out;
}
@media all and (max-width: 900px) {
.movies .alph_nav .numbers {
display: none;
}
}
.movies .alph_nav .numbers li {
width: auto;
padding: 0 4px;
width: 30px;
height: 30px;
opacity: 0.3;
}
.movies .alph_nav .numbers li.letter_all {
width: 60px;
}
.movies .alph_nav li.available {
color: #FFF;
font-weight: bolder;
font-weight: bold;
cursor: pointer;
opacity: 1;
}
.movies .alph_nav li.active.available,
.movies .alph_nav li.available:hover {
background: rgba(255,255,255,.1);
background: rgba(0,0,0,.1);
}
.movies .alph_nav .search {
.movies .alph_nav .search input {
padding: 6px 5px;
margin: 0 0 0 20px;
position: absolute;
right: 30px;
width: 154px;
height: 25px;
transition: all 0.6s cubic-bezier(0.9,0,0.1,1);
width: 100%;
height: 44px;
display: inline-block;
border: 0;
background: none;
color: #444;
font-size: 14px;
padding: 10px;
padding: 0 10px 0 30px;
border-bottom: 1px solid rgba(0,0,0,.08);
}
.movies .alph_nav .search input:focus {
background: rgba(0,0,0,.08);
}
.movies .alph_nav .search input::-webkit-input-placeholder {
color: #444;
opacity: .6;
}
.movies .alph_nav .search:before {
font-family: 'Elusive-Icons';
content: "\e03e";
position: absolute;
height: 100%;
line-height: 45px;
font-size: 12px;
margin: 0 0 0 10px;
opacity: .6;
color: #444;
}
.movies .alph_nav .actions {
margin: 0 6px 0 0;
-moz-user-select: none;
position: absolute;
right: 183px;
width: 44px;
height: 44px;
display: inline-block;
vertical-align: top;
z-index: 200;
position: relative;
}
.movies .alph_nav .actions:hover {
box-shadow: 0 100px 20px -10px rgba(0,0,0,0.55);
}
.movies .alph_nav .actions li {
border-radius: 1px;
width: auto;
width: 100%;
height: 45px;
line-height: 40px;
position: relative;
z-index: 20;
display: none;
cursor: pointer;
}
.movies .alph_nav .actions li.active {
background: none;
border: 1px solid transparent;
box-shadow: none;
}
.movies .alph_nav .actions li span {
display: block;
background: url('../images/sprite.png') no-repeat;
width: 25px;
height: 100%;
}
.movies .alph_nav .actions li.mass_edit span {
background-position: 3px 3px;
.movies .alph_nav .actions:hover li:not(.active) {
display: block;
background: #FFF;
color: #444;
}
.movies .alph_nav .actions li:hover:not(.active) {
background: #ccc;
}
.movies .alph_nav .actions li.active {
display: block;
}
.movies .alph_nav .actions li.list span {
background-position: 3px -95px;
.movies .alph_nav .actions li.mass_edit:before {
content: "\e070";
}
.movies .alph_nav .actions li.details span {
background-position: 3px -74px;
.movies .alph_nav .actions li.list:before {
content: "\e0d8";
}
.movies .alph_nav .actions li:first-child {
border-radius: 3px 0 0 3px;
}
.movies .alph_nav .actions li:last-child {
border-radius: 0 3px 3px 0;
}
.movies .alph_nav .actions li.details:before {
content: "\e022";
}
.movies .alph_nav .mass_edit_form {
clear: both;
text-align: center;
display: none;
overflow: hidden;
float: left;
height: 44px;
line-height: 44px;
}
.movies.mass_edit_list .mass_edit_form {
display: block;
display: inline-block;
}
.movies.mass_edit_list .mass_edit_form .select {
float: left;
margin: 5px 0 0 5px;
font-size: 14px;
display: inline-block;
}
.movies.mass_edit_list .mass_edit_form .select span {
.movies.mass_edit_list .mass_edit_form .select .check {
display: inline-block;
vertical-align: middle;
margin: -4px 0 0 5px;
}
.movies.mass_edit_list .mass_edit_form .select span {
opacity: 0.7;
}
.movies.mass_edit_list .mass_edit_form .select .count {
@@ -842,8 +873,7 @@
}
.movies .alph_nav .mass_edit_form .quality {
float: left;
padding: 8px 0 0;
display: inline-block;
margin: 0 0 0 16px;
}
.movies .alph_nav .mass_edit_form .quality select {
@@ -856,8 +886,8 @@
.movies .alph_nav .mass_edit_form .refresh,
.movies .alph_nav .mass_edit_form .delete {
float: left;
padding: 8px 0 0 8px;
display: inline-block;
margin-left: 8px;
}
.movies .alph_nav .mass_edit_form .refresh span,
@@ -865,16 +895,36 @@
margin: 0 10px 0 0;
}
.movies .alph_nav .more_menu {
right: 0;
position: absolute;
}
.movies .alph_nav .more_menu > a {
background-color: #4e5969;
background-position: center -158px;
background: none;
}
.movies .alph_nav .more_menu.extra > a:before {
content: '...';
font-size: 1.7em;
line-height: 23px;
text-align: center;
display: block;
}
.movies .alph_nav .more_menu.filter {
border: 1px solid rgba(255,255,255,.07);
border-width: 0 1px;
}
.movies .alph_nav .more_menu.filter > a:before {
content: "\e0e8";
font-family: 'Elusive-Icons';
line-height: 33px;
display: block;
text-align: center;
}
.movies .alph_nav .more_menu.filter .wrapper {
right: 45px;
width: 300px;
}
.movies .empty_wanted {
background-image: url('../images/emptylist.png');
height: 750px;
@@ -887,6 +937,7 @@
text-align: center;
font-size: 25px;
line-height: 150%;
padding: 40px 0;
}
.movies .empty_manage .after_manage {
@@ -895,7 +946,6 @@
}
.movies .progress {
border-radius: 2px;
padding: 10px;
margin: 5px 0;
text-align: left;
@@ -910,7 +960,6 @@
width: 49%;
background: rgba(255, 255, 255, 0.05);
margin: 2px 0.5%;
border-radius: 3px;
}
.movies .progress > div .folder {
couchpotato/core/plugins/movie/static/movie.js
+3 -3
View File
@@ -11,7 +11,7 @@ var Movie = new Class({
self.view = options.view || 'details';
self.list = list;
self.el = new Element('div.movie.inlay');
self.el = new Element('div.movie');
self.profile = Quality.getProfile(data.profile_id) || {};
self.parent(self, options);
@@ -149,8 +149,8 @@ var Movie = new Class({
'events': {
'click': function(e){
var releases = self.el.getElement('.actions .releases');
if(releases)
releases.fireEvent('click', [e])
if(releases.isVisible())
releases.fireEvent('click', [e])
}
}
})
couchpotato/core/plugins/movie/static/search.css
-1
View File
@@ -44,7 +44,6 @@
.search_form .input input {
border-radius: 0;
display: block;
width: 100%;
border: 0;
background: rgba(255,255,255,.08);
color: #FFF;