Notification system
This commit is contained in:
1 parent
2323136221
commit
15175a0330
25 files changed
+1313
-165
No files matched your search
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 2.2 KiB |
@@ -0,0 +1,43 @@
|
||||
Block.Menu = new Class({
|
||||
|
||||
Extends: BlockBase,
|
||||
|
||||
options: {
|
||||
'class': 'menu'
|
||||
},
|
||||
|
||||
create: function(){
|
||||
var self = this;
|
||||
|
||||
self.el = new Element('div', {
|
||||
'class': 'more_menu '+self.options['class']
|
||||
}).adopt(
|
||||
self.more_option_ul = new Element('ul'),
|
||||
new Element('a.button.onlay', {
|
||||
'events': {
|
||||
'click': function(){
|
||||
self.el.toggleClass('show')
|
||||
self.fireEvent(self.el.hasClass('show') ? 'open' : 'close')
|
||||
|
||||
if(self.el.hasClass('show'))
|
||||
this.addEvent('outerClick', function(){
|
||||
self.el.removeClass('show')
|
||||
this.removeEvents('outerClick');
|
||||
})
|
||||
else
|
||||
this.removeEvents('outerClick');
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
},
|
||||
|
||||
addLink: function(tab, position){
|
||||
var self = this;
|
||||
var el = new Element('li').adopt(tab).inject(self.more_option_ul, position || 'bottom');
|
||||
return el;
|
||||
}
|
||||
|
||||
});
|
||||
@@ -1,54 +0,0 @@
|
||||
Block.More = new Class({
|
||||
|
||||
Extends: BlockBase,
|
||||
|
||||
create: function(){
|
||||
var self = this;
|
||||
|
||||
self.el = new Element('div.more_menu').adopt(
|
||||
self.more_option_ul = new Element('ul').adopt(
|
||||
new Element('li').adopt(
|
||||
new Element('a.orange', {
|
||||
'text': 'Restart',
|
||||
'events': {
|
||||
'click': App.restart.bind(App)
|
||||
}
|
||||
})
|
||||
),
|
||||
new Element('li').adopt(
|
||||
new Element('a.red', {
|
||||
'text': 'Shutdown',
|
||||
'events': {
|
||||
'click': App.shutdown.bind(App)
|
||||
}
|
||||
})
|
||||
)
|
||||
),
|
||||
new Element('a.button.onlay', {
|
||||
'events': {
|
||||
'click': function(){
|
||||
self.el.toggleClass('show')
|
||||
|
||||
if(self.el.hasClass('show'))
|
||||
this.addEvent('outerClick', function(){
|
||||
self.el.removeClass('show')
|
||||
this.removeEvents('outerClick');
|
||||
})
|
||||
else
|
||||
this.removeEvents('outerClick');
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
},
|
||||
|
||||
addLink: function(tab, position){
|
||||
var self = this
|
||||
|
||||
return new Element('li').adopt(tab).inject(self.more_option_ul, position || 'bottom')
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
@@ -43,7 +43,7 @@ var CouchPotato = new Class({
|
||||
pushState: function(e){
|
||||
var self = this;
|
||||
if((!e.meta && Browser.Platform.mac) || (!e.control && !Browser.Platform.mac)){
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
var url = e.target.get('href');
|
||||
if(History.getPath() != url)
|
||||
History.push(url);
|
||||
@@ -60,19 +60,34 @@ var CouchPotato = new Class({
|
||||
new Element('div').adopt(
|
||||
self.block.navigation = new Block.Navigation(self, {}),
|
||||
self.block.search = new Block.Search(self, {}),
|
||||
self.block.more = new Block.More(self, {})
|
||||
self.block.more = new Block.Menu(self, {})
|
||||
)
|
||||
),
|
||||
self.content = new Element('div.content'),
|
||||
self.block.footer = new Block.Footer(self, {})
|
||||
);
|
||||
|
||||
self.block.more.addLink(new Element('a', {
|
||||
[new Element('a.orange', {
|
||||
'text': 'Restart',
|
||||
'events': {
|
||||
'click': App.restart.bind(App)
|
||||
}
|
||||
}),
|
||||
new Element('a.red', {
|
||||
'text': 'Shutdown',
|
||||
'events': {
|
||||
'click': App.shutdown.bind(App)
|
||||
}
|
||||
}),
|
||||
new Element('a', {
|
||||
'text': 'Check for updates',
|
||||
'events': {
|
||||
'click': self.checkForUpdate.bind(self)
|
||||
}
|
||||
}))
|
||||
})].each(function(a){
|
||||
self.block.more.addLink(a)
|
||||
})
|
||||
|
||||
|
||||
new ScrollSpy({
|
||||
min: 10,
|
||||
@@ -207,6 +222,13 @@ var CouchPotato = new Class({
|
||||
|
||||
createUrl: function(action, params){
|
||||
return this.options.base_url + (action ? action+'/' : '') + (params ? '?'+Object.toQueryString(params) : '')
|
||||
},
|
||||
|
||||
notify: function(options){
|
||||
return this.growl.notify({
|
||||
title: "this scrolls away",
|
||||
text: "test - hello there. mouseover to pause away action"
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
File diff suppressed because it is too large.
Load diff
@@ -628,7 +628,7 @@ Option.Directory = new Class({
|
||||
self.dir_list = new Element('ul', {
|
||||
'events': {
|
||||
'click:relay(li)': function(e, el){
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
self.selectDirectory(el.get('data-value'))
|
||||
},
|
||||
'mousewheel': function(e){
|
||||
@@ -678,7 +678,7 @@ Option.Directory = new Class({
|
||||
|
||||
hideBrowser: function(e, save){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
if(save)
|
||||
self.save()
|
||||
@@ -1241,7 +1241,7 @@ Option.Combined = new Class({
|
||||
|
||||
deleteCombinedItem: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
var item = e.target.getParent();
|
||||
|
||||
|
||||
@@ -49,7 +49,7 @@ window.addEvent('domready', function(){
|
||||
|
||||
editMovie: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
if(!self.options_container){
|
||||
self.options_container = new Element('div.options').adopt(
|
||||
@@ -89,7 +89,7 @@ window.addEvent('domready', function(){
|
||||
},
|
||||
|
||||
save: function(e){
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
var self = this;
|
||||
|
||||
Api.request('movie.edit', {
|
||||
@@ -129,7 +129,7 @@ window.addEvent('domready', function(){
|
||||
|
||||
doRefresh: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
Api.request('movie.refresh', {
|
||||
'data': {
|
||||
@@ -160,7 +160,7 @@ window.addEvent('domready', function(){
|
||||
|
||||
showConfirm: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
if(!self.delete_container){
|
||||
self.delete_container = new Element('div.delete_container').adopt(
|
||||
@@ -188,13 +188,13 @@ window.addEvent('domready', function(){
|
||||
|
||||
hideConfirm: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
self.movie.slide('out');
|
||||
},
|
||||
|
||||
del: function(e){
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
var self = this;
|
||||
|
||||
var movie = $(self.movie);
|
||||
@@ -253,7 +253,7 @@ window.addEvent('domready', function(){
|
||||
|
||||
showFiles: function(e){
|
||||
var self = this;
|
||||
(e).stop();
|
||||
(e).preventDefault();
|
||||
|
||||
if(!self.options_container){
|
||||
self.options_container = new Element('div.options').adopt(
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
|
||||
@@ -1,10 +1,3 @@
|
||||
/* @override
|
||||
http://localhost:5000/static/style/main.css
|
||||
http://192.168.1.20:5000/static/style/main.css
|
||||
http://127.0.0.1:5000/static/style/main.css
|
||||
http://127.0.0.1:5000/v2/_api_/static/style/main.css
|
||||
*/
|
||||
|
||||
html {
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
@@ -184,6 +177,7 @@ body > .spinner, .mask{
|
||||
}
|
||||
.header .navigation {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 67.2%;
|
||||
}
|
||||
.header .navigation ul {
|
||||
@@ -239,8 +233,7 @@ body > .spinner, .mask{
|
||||
.header:hover .navigation .backtotop { color: #fff; }
|
||||
|
||||
.header .more_menu {
|
||||
float: right;
|
||||
margin-top: 20px;
|
||||
margin-left: 12px;
|
||||
}
|
||||
.header .more_menu ul {
|
||||
width: 150px;
|
||||
@@ -252,6 +245,51 @@ body > .spinner, .mask{
|
||||
|
||||
.header .more_menu .red { color: red; }
|
||||
.header .more_menu .orange { color: orange; }
|
||||
|
||||
.badge {
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
text-align: center;
|
||||
line-height: 14px;
|
||||
border-radius: 50%;
|
||||
font-size: 8px;
|
||||
margin: -5px 0 0 15px;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 0 3px rgba(0,0,0,.7);
|
||||
background: -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,.3)), to(rgba(255,255,255,.1)));
|
||||
background: -moz-linear-gradient(center bottom, rgba(255,255,255,.3) 0%, rgba(255,255,255,.1) 100%);
|
||||
background-color: #1b79b8;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.header .notification_menu ul {
|
||||
width: 300px;
|
||||
margin-left: -260px;
|
||||
text-align: left;
|
||||
}
|
||||
.header .notification_menu ul:before {
|
||||
left: 296px;
|
||||
}
|
||||
|
||||
.header .notification_menu > a {
|
||||
background-position: center -209px;
|
||||
}
|
||||
|
||||
.header .notification_menu li > span {
|
||||
padding: 5px;
|
||||
display: block;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.2);
|
||||
}
|
||||
.header .notification_menu li .added {
|
||||
display: block;
|
||||
font-size: 10px;
|
||||
color: #aaa;
|
||||
text-align: ;
|
||||
}
|
||||
|
||||
.header .notification_menu li .more {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.header .message.update {
|
||||
text-align: center;
|
||||
@@ -454,6 +492,10 @@ body > .spinner, .mask{
|
||||
background-color: #4c5766;
|
||||
}
|
||||
|
||||
.more_menu {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.more_menu > a {
|
||||
display: block;
|
||||
@@ -470,16 +512,30 @@ body > .spinner, .mask{
|
||||
.more_menu ul {
|
||||
display: none;
|
||||
border: 1px solid #333;
|
||||
background: rgba(0,0,0,0.8);
|
||||
background: rgba(255,255,255,0.98);
|
||||
border-radius: 3px;
|
||||
padding: 4px !important;
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
margin: 32px 0 0 -145px;
|
||||
width: 185px;
|
||||
box-shadow: 0 10px 20px -10px rgba(0,0,0,0.4);
|
||||
box-shadow: 0 10px 10px -5px rgba(0,0,0,0.4);
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
text-shadow: none;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left bottom,
|
||||
right top,
|
||||
color-stop(0, rgb(200,200,200)),
|
||||
color-stop(1, rgb(255,255,255))
|
||||
);
|
||||
background-image: -moz-linear-gradient(
|
||||
left bottom,
|
||||
rgb(200,200,200) 0%,
|
||||
rgb(255,255,255) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.more_menu ul:before {
|
||||
@@ -488,7 +544,7 @@ body > .spinner, .mask{
|
||||
position: relative;
|
||||
width: 0;
|
||||
border: 6px solid transparent;
|
||||
border-bottom-color: rgba(0,0,0,0.8);
|
||||
border-bottom-color: #fff;
|
||||
display: block;
|
||||
top: -16px;
|
||||
left: 146px;
|
||||
@@ -510,7 +566,7 @@ body > .spinner, .mask{
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
padding: 3px 0;
|
||||
color: #fff;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.more_menu ul li:first-child {
|
||||
@@ -519,8 +575,7 @@ body > .spinner, .mask{
|
||||
|
||||
.more_menu ul li:last-child a {
|
||||
border: none;
|
||||
color: #fff;
|
||||
}
|
||||
.more_menu ul li a:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
background: rgba(0,0,0,0.05);
|
||||
}
|
||||
@@ -1,9 +1,3 @@
|
||||
/* @override
|
||||
http://localhost:5000/static/style/page/settings.css
|
||||
http://192.168.1.20:5000/static/style/page/settings.css
|
||||
http://127.0.0.1:5000/static/style/page/settings.css
|
||||
*/
|
||||
|
||||
.page.settings:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
|
||||
Reference in new issue
Block a user