Notification system

This commit is contained in:
Ruud committed 2012-03-14 20:33:22 +01:00
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

+43
View File
@@ -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;
}
});
-54
View File
@@ -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')
}
});
+26 -4
View File
@@ -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
+3 -3
View File
@@ -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();
+7 -7
View File
@@ -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
View File
@@ -1,4 +1,3 @@
html {
font-size: 12px;
line-height: 1.5;
+70 -15
View File
@@ -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;