dockeruser
/
CouchPotatoServer
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Actions

pull/5180/head
Ruud 10 years ago
parent
8391656af9
commit
f406d850e8
7 changed files with 94 additions and 55 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 9
      couchpotato/core/media/movie/_base/static/movie.actions.js
  2. 14
      couchpotato/core/media/movie/_base/static/movie.js
  3. 70
      couchpotato/core/media/movie/_base/static/movie.scss
  4. 9
      couchpotato/static/scripts/page/home.js
  5. 36
      couchpotato/static/style/combined.min.css
  6. 2
      couchpotato/static/style/main.scss
  7. 9
      couchpotato/static/style/settings.scss

9
couchpotato/core/media/movie/_base/static/movie.actions.js
View File

@ -23,8 +23,13 @@ var MovieAction = new Class({
})
self.button.inject(wrapper);
if(self.icon)
new Element('span.icon.icon-'+self.icon).inject(self.button);
//if(self.icon){
// var label = self.button.get('text');
// self.button.addClass('with-icon').empty().adopt(
// new Element('span.inner').set('text', label),
// new Element('span.icon.icon-'+self.icon).inject(self.button)
// );
//}
self.button = wrapper;
}

14
couchpotato/core/media/movie/_base/static/movie.js
View File

@ -240,6 +240,13 @@ var Movie = new Class({
}
}),
self.thumbnail = thumbnail,
self.actions_el = new Element('div.actions', {
'events': {
'click': function(e){
(e).stopPropagation();
}
}
}),
self.data_container = new Element('div.data.light').adopt(
self.info_container = new Element('div.info').adopt(
new Element('div.title').adopt(
@ -248,13 +255,6 @@ var Movie = new Class({
}),
self.year = new Element('div.year', {
'text': self.data.info.year || 'n/a'
}),
self.actions_el = new Element('div.actions', {
'events': {
'click': function(e){
(e).stopPropagation();
}
}
})
),
self.eta = eta_date && (now+8035200 > eta) ? new Element('div.eta', {

70
couchpotato/core/media/movie/_base/static/movie.scss
View File

@ -52,11 +52,22 @@
}
}
&.status_suggested {
.quality {
display: none;
}
}
}
.list_list, .thumb_list {
.movies {
position: relative;
.no_movies {
text-align: center;
padding: $padding;
}
> .description {
position: absolute;
top: 0;
@ -170,6 +181,10 @@
bottom: 0;
display: none;
.action {
display: inline-block;
}
a {
height: 100%;
display: block;
@ -186,6 +201,10 @@
&:hover {
color: $primary_color;
}
.icon {
display: none;
}
}
}
@ -202,7 +221,10 @@
.thumb_list {
font-size: 12px;
padding: 0 $padding/2;
> div:last-child {
padding: 0 $padding/2;
}
@include media-tablet {
padding: 0 $padding/4;
@ -261,7 +283,6 @@
clear: both;
.info {
height: 44px;
.title {
display: flex;
@ -294,43 +315,46 @@
}
.actions {
background-image: linear-gradient(25deg, rgba($primary_color,0) 0%, rgba($primary_color,.9) 100%);
transition: all 250ms;
opacity: 0;
position: absolute;
top: $padding / 2;
right: $padding / 2;
top: 0;
right: 0;
bottom: 24px;
left: 0;
text-align: right;
border-radius: $border_radius;
.action {
position: relative;
display: block;
margin-bottom: 1px;
width: auto;
margin-right: $padding/2;
&:first-child {
margin-top: $padding/2;
}
a {
transition: all 150ms $cubic;
display: inline-block;
width: auto;
background: $background_color;
padding: $padding / 3;
opacity: 0;
}
.icon {
color: #FFF;
position: absolute;
height: 100%;
width: 33px;
top: 0;
bottom: 0;
right: 0;
font-size: 20px;
text-align: center;
border-radius: $border_radius - 1px;
&:hover {
background: #FFF;
color: $primary_color;
}
}
}
}
&:hover .actions {
display: block;
opacity: 1;
@include media-phablet {
display: none;
@ -366,7 +390,7 @@
right: 0;
left: $header_width;
background: rgba(0,0,0,.6);
border-radius: 3px 0 0 3px;
border-radius: $border_radius 0 0 $border_radius;
opacity: 0;
transition: opacity 800ms;
@ -399,7 +423,7 @@
right: 0;
left: $header_width + $gab-width;
background: $background_color;
border-radius: 3px 0 0 3px;
border-radius: $border_radius 0 0 $border_radius;
overflow-y: auto;
transform: translateX(100%);
transition: transform 250ms $cubic;

9
couchpotato/static/scripts/page/home.js
View File

@ -45,11 +45,12 @@ Page.Home = new Class({
'description': 'These movies have been snatched or have finished downloading',
'on_empty_element': new Element('div').adopt(
new Element('h2', {'text': 'Snatched & Available'}),
new Element('span', {
'html': 'No snatched movies or anything!? Damn.. <a>Maybe add a movie.</a>',
new Element('span.no_movies', {
'html': 'No snatched movies or anything!? Damn.. <a href="#">Maybe add a movie.</a>',
'events': {
'click': function(){
$(document.body).getElement('.search_form input').focus();
'click': function(e){
(e).preventDefault();
$(document.body).getElement('.search_form .icon-search').click();
}
}
})

36
couchpotato/static/style/combined.min.css
View File

@ -45,12 +45,14 @@
.movie .quality span.available{background:#2f8199}
.movie .quality span.snatched{background:#41997f}
.movie .quality span.downloaded{background:#54994a}
.list_list,.thumb_list{position:relative}
.list_list>.description,.thumb_list>.description{position:absolute;top:0;right:20px;width:auto;line-height:80px}
@media (max-width:768px){.list_list>.description,.thumb_list>.description{display:none}}
.list_list>.loading,.thumb_list>.loading{background:#FFF}
.list_list>.loading .message,.thumb_list>.loading .message{color:#000}
.list_list>.loading .spinner,.thumb_list>.loading .spinner{background-color:#000}
.movie.status_suggested .quality{display:none}
.movies{position:relative}
.movies .no_movies{text-align:center;padding:20px}
.movies>.description{position:absolute;top:0;right:20px;width:auto;line-height:80px}
@media (max-width:768px){.movies>.description{display:none}}
.movies>.loading{background:#FFF}
.movies>.loading .message{color:#000}
.movies>.loading .spinner{background-color:#000}
.list_list{font-weight:300}
.list_list .poster{display:none}
.list_list .movie{display:block;border-bottom:1px solid #eaeaea;position:relative;cursor:pointer}
@ -69,12 +71,15 @@
.list_list .movie .data .info .quality span{float:left;font-size:.7em;margin:2px 0 0 2px}
@media (max-width:480px){.list_list .movie .data .info .quality span{margin:2px 2px 0 0}}
.list_list .movie .actions{position:absolute;right:10px;top:0;bottom:0;display:none}
.list_list .movie .actions .action{display:inline-block}
.list_list .movie .actions a{height:100%;display:block;background:#FFF;padding:10px;width:auto;float:right;color:#000}
.list_list .movie .actions a:before{display:none}
.list_list .movie .actions a:hover{color:#ac0000}
.list_list .movie .actions a .icon{display:none}
.list_list .movie:hover .actions{display:block}
@media (max-width:480px){.list_list .movie:hover .actions{display:none}}
.thumb_list{font-size:12px;padding:0 10px}
.thumb_list{font-size:12px}
.thumb_list>div:last-child{padding:0 10px}
@media (max-width:768px){.thumb_list{padding:0 5px}}
@media (max-width:480px){.thumb_list{padding:0 3.33px}}
.thumb_list>div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-align:stretch;-webkit-align-items:stretch;-moz-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}
@ -85,17 +90,17 @@
@media (max-width:480px){.thumb_list .movie{max-width:50%;border-width:0 4px}}
.thumb_list .movie .poster{-webkit-border-radius:3px;border-radius:3px;background:center/cover no-repeat #eaeaea;-webkit-background-size:cover;overflow:hidden;width:100%;padding-bottom:150%}
.thumb_list .movie .data{clear:both}
.thumb_list .movie .data .info{height:44px}
.thumb_list .movie .data .info .title{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;padding:3px 0}
.thumb_list .movie .data .info .title span{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thumb_list .movie .data .info .title .year{display:inline-block;margin-left:5px;opacity:.5}
.thumb_list .movie .data .info .quality{white-space:nowrap;overflow:hidden}
.thumb_list .movie .data .info .quality span{font-size:.8em;margin-right:2px}
.thumb_list .movie .actions{position:absolute;top:10px;right:10px;text-align:right}
.thumb_list .movie .actions .action{position:relative;display:block;margin-bottom:1px;width:auto}
.thumb_list .movie .actions .action a{display:inline-block;width:auto;background:#FFF;padding:6.67px;opacity:0}
.thumb_list .movie .actions .action .icon{color:#FFF;position:absolute;height:100%;width:33px;top:0;bottom:0;right:0;font-size:20px;text-align:center}
.thumb_list .movie:hover .actions{display:block}
.thumb_list .movie .actions{background-image:-webkit-linear-gradient(65deg,rgba(172,0,0,0) 0,rgba(172,0,0,.9) 100%);background-image:linear-gradient(25deg,rgba(172,0,0,0) 0,rgba(172,0,0,.9) 100%);-webkit-transition:all 250ms;transition:all 250ms;opacity:0;position:absolute;top:0;right:0;bottom:24px;left:0;text-align:right;-webkit-border-radius:3px;border-radius:3px}
.thumb_list .movie .actions .action{position:relative;display:block;margin-bottom:1px;width:auto;margin-right:10px}
.thumb_list .movie .actions .action:first-child{margin-top:10px}
.thumb_list .movie .actions .action a{-webkit-transition:all 150ms cubic-bezier(0.9,0,.1,1);transition:all 150ms cubic-bezier(0.9,0,.1,1);display:inline-block;width:auto;padding:6.67px;color:#FFF;-webkit-border-radius:2px;border-radius:2px}
.thumb_list .movie .actions .action a:hover{background:#FFF;color:#ac0000}
.thumb_list .movie:hover .actions{opacity:1}
@media (max-width:480px){.thumb_list .movie:hover .actions{display:none}}
.thumb_list .movie .mask{bottom:44px;-webkit-border-radius:3px;border-radius:3px;-webkit-transition:opacity 30ms;transition:opacity 30ms}
.eta{display:none}
@ -500,7 +505,7 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F
.more_menu .button{font-size:24px;cursor:pointer;display:inline-block}
.more_menu .button:before{position:relative}
.more_menu .wrapper{display:none;position:absolute;right:0;background:#ac0000;z-index:5000;-webkit-box-shadow:0 0 15px 2px rgba(0,0,0,.15);box-shadow:0 0 15px 2px rgba(0,0,0,.15);-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px}
.more_menu .wrapper:before{-webkit-transform:rotate(45deg) translateY(-60%);-ms-transform:rotate(45deg) translateY(-60%);transform:rotate(45deg) translateY(-60%);content:'';display:block;position:absolute;background:#ac0000;height:10px;width:10px;left:-9px;bottom:11px;z-index:1;opacity:0;-webkit-border-radius:2px;border-radius:2px}
.more_menu .wrapper:before{-webkit-transform:rotate(45deg) translateY(-60%);-ms-transform:rotate(45deg) translateY(-60%);transform:rotate(45deg) translateY(-60%);content:'';display:block;position:absolute;background:#ac0000;height:10px;width:10px;left:-9px;bottom:11px;z-index:1;opacity:0;-webkit-border-radius:3px;border-radius:3px}
.more_menu .wrapper ul{-webkit-transform:translateZ(0);transform:translateZ(0);background:#FFF;position:relative;z-index:2;overflow:hidden;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px}
.more_menu .wrapper ul li{display:block;line-height:1em;border-top:1px solid #eaeaea}
.more_menu .wrapper ul li:first-child{border-top:0}
@ -540,7 +545,8 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F
.table .item:last-child{border-bottom:none}
.table .item span{padding:1px 2px}
.table .item span:first-child{padding-left:0}
.table .item span:last-child{padding-right:0}.page.settings{top:80px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}
.table .item span:last-child{padding-right:0}.page.settings{top:80px}
.page.settings.active{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}
@media (max-width:480px){.page.settings{display:block}}
.page.settings .navigation{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.page.settings .navigation .advanced_toggle{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;margin-right:20px}

2
couchpotato/static/style/main.scss
View File

@ -442,7 +442,7 @@ input, textarea, select {
bottom: 11px;
z-index: 1;
opacity: 0;
border-radius: 2px;
border-radius: $border_radius;
// border: 8px solid $primary_color;
// border-color: transparent $primary_color transparent transparent;
}

9
couchpotato/static/style/settings.scss
View File

@ -2,7 +2,10 @@
.page.settings {
top: $header_height;
display: flex;
&.active {
display: flex;
}
@include media-phablet {
display: block;
@ -227,7 +230,7 @@
padding: 2px;
transition: all 250ms;
cursor: pointer;
border-radius: 3px;
border-radius: $border_radius;
input {
display: none;
@ -239,7 +242,7 @@
width: 40%;
transition: transform 250ms;
transform: translateX(150%);
border-radius: 2px;
border-radius: $border_radius - 1px;
}
}

Write Preview
Loading…
Cancel
Save