From 43b6da8afc223d1eefa74d390b09b7a4381ee734 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 13:34:06 +0000 Subject: Created separate objects for receive actions --- plugins/Realtime/realtimeupdate.js | 44 +++++++++++++++++++++++++------------- 1 file changed, 29 insertions(+), 15 deletions(-) (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index d1cf1d507..6404cf896 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -36,6 +36,7 @@ RealtimeUpdate = { _updatecounter: 0, _maxnotices: 50, _windowhasfocus: true, + _documenttitle: '', init: function(userid, replyurl, favorurl, deleteurl) { @@ -44,7 +45,7 @@ RealtimeUpdate = { RealtimeUpdate._favorurl = favorurl; RealtimeUpdate._deleteurl = deleteurl; - DT = document.title; + RealtimeUpdate._documenttitle = document.title; $(window).bind('focus', function(){ RealtimeUpdate._windowhasfocus = true; }); @@ -54,7 +55,7 @@ RealtimeUpdate = { $('#notices_primary .notice:first').addClass('mark-top'); RealtimeUpdate._updatecounter = 0; - document.title = DT; + document.title = RealtimeUpdate._documenttitle; RealtimeUpdate._windowhasfocus = false; return false; @@ -70,24 +71,37 @@ RealtimeUpdate = { return; } - var noticeItem = RealtimeUpdate.makeNoticeItem(data); - $("#notices_primary .notices").prepend(noticeItem); - $("#notices_primary .notice:first").css({display:"none"}); - $("#notices_primary .notice:first").fadeIn(1000); + RealtimeUpdate.purgeLastNoticeItem(); - if ($('#notices_primary .notice').length > RealtimeUpdate._maxnotices) { - $("#notices_primary .notice:last .form_disfavor").unbind('submit'); - $("#notices_primary .notice:last .form_favor").unbind('submit'); - $("#notices_primary .notice:last .notice_reply").unbind('click'); - $("#notices_primary .notice:last").remove(); - } + RealtimeUpdate.insertNoticeItem(data); + + RealtimeUpdate.updateWindowCounter(); + + }, - SN.U.NoticeReply(); - SN.U.NoticeFavor(); + insertNoticeItem: function(data) { + var noticeItem = RealtimeUpdate.makeNoticeItem(data); + $("#notices_primary .notices").prepend(noticeItem); + $("#notices_primary .notice:first").css({display:"none"}); + $("#notices_primary .notice:first").fadeIn(1000); + + SN.U.NoticeReply(); + SN.U.NoticeFavor(); + }, + + purgeLastNoticeItem: function() { + if ($('#notices_primary .notice').length > RealtimeUpdate._maxnotices) { + $("#notices_primary .notice:last .form_disfavor").unbind('submit'); + $("#notices_primary .notice:last .form_favor").unbind('submit'); + $("#notices_primary .notice:last .notice_reply").unbind('click'); + $("#notices_primary .notice:last").remove(); + } + }, + updateWindowCounter: function() { if (RealtimeUpdate._windowhasfocus === false) { RealtimeUpdate._updatecounter += 1; - document.title = '('+RealtimeUpdate._updatecounter+') ' + DT; + document.title = '('+RealtimeUpdate._updatecounter+') ' + RealtimeUpdate._documenttitle; } }, -- cgit v1.2.3-54-g00ecf From 5014b748e486f46a8653d1609479f8f64dc24722 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 15:41:07 +0000 Subject: Added play/pause button for realtime notices. While on pause, it will store the notices and on play it will add them to the notice list --- plugins/Realtime/RealtimePlugin.php | 4 +- plugins/Realtime/icon_pause.gif | Bin 0 -> 75 bytes plugins/Realtime/icon_play.gif | Bin 0 -> 75 bytes plugins/Realtime/realtimeupdate.js | 91 +++++++++++++++++++++++++++++++++--- 4 files changed, 87 insertions(+), 8 deletions(-) create mode 100644 plugins/Realtime/icon_pause.gif create mode 100644 plugins/Realtime/icon_play.gif (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/RealtimePlugin.php b/plugins/Realtime/RealtimePlugin.php index 0c7c1240c..6d59bd1b1 100644 --- a/plugins/Realtime/RealtimePlugin.php +++ b/plugins/Realtime/RealtimePlugin.php @@ -101,8 +101,8 @@ class RealtimePlugin extends Plugin $realtimeUI = ' RealtimeUpdate.initPopupWindow();'; } else { - $iconurl = common_path('plugins/Realtime/icon_external.gif'); - $realtimeUI = ' RealtimeUpdate.addPopup("'.$url.'", "'.$timeline.'", "'. $iconurl .'");'; + $pluginPath = common_path('plugins/Realtime/'); + $realtimeUI = ' RealtimeUpdate.initActions("'.$url.'", "'.$timeline.'", "'. $pluginPath .'");'; } $action->elementStart('script', array('type' => 'text/javascript')); diff --git a/plugins/Realtime/icon_pause.gif b/plugins/Realtime/icon_pause.gif new file mode 100644 index 000000000..ced0b6440 Binary files /dev/null and b/plugins/Realtime/icon_pause.gif differ diff --git a/plugins/Realtime/icon_play.gif b/plugins/Realtime/icon_play.gif new file mode 100644 index 000000000..794ec85b6 Binary files /dev/null and b/plugins/Realtime/icon_play.gif differ diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index 6404cf896..4352b45d9 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -37,6 +37,8 @@ RealtimeUpdate = { _maxnotices: 50, _windowhasfocus: true, _documenttitle: '', + _paused:false, + _queuedNotices:[], init: function(userid, replyurl, favorurl, deleteurl) { @@ -71,12 +73,16 @@ RealtimeUpdate = { return; } - RealtimeUpdate.purgeLastNoticeItem(); + if (RealtimeUpdate._paused === false) { + RealtimeUpdate.purgeLastNoticeItem(); - RealtimeUpdate.insertNoticeItem(data); - - RealtimeUpdate.updateWindowCounter(); + RealtimeUpdate.insertNoticeItem(data); + RealtimeUpdate.updateWindowCounter(); + } + else { + RealtimeUpdate._queuedNotices.push(data); + } }, insertNoticeItem: function(data) { @@ -183,7 +189,80 @@ RealtimeUpdate = { return dl; }, - addPopup: function(url, timeline, iconurl) + initActions: function(url, timeline, path) + { + var NP = $('#notices_primary'); + NP.prepend(''); + + RealtimeUpdate._pluginPath = path; + + RealtimeUpdate.initPlayPause(); + RealtimeUpdate.initAddPopup(url, timeline, RealtimeUpdate._pluginPath); + }, + + initPlayPause: function() + { + RealtimeUpdate.showPause(); + }, + + showPause: function() + { + RT_PP = $('#realtime_pauseplay'); + RT_PP.empty(); + RT_PP.append(''); + + RT_P = $('#realtime_pause'); + $('#realtime_pause').css({ + 'background':'url('+RealtimeUpdate._pluginPath+'icon_pause.gif) no-repeat 47% 47%', + 'width':'16px', + 'height':'16px', + 'text-indent':'-9999px', + 'border':'none', + 'cursor':'pointer' + }); + RT_P.bind('click', function() { + RealtimeUpdate._paused = true; + + RealtimeUpdate.showPlay(); + return false; + }); + }, + + showPlay: function() + { + RT_PP = $('#realtime_pauseplay'); + RT_PP.empty(); + RT_PP.append(''); + + RT_P = $('#realtime_play'); + RT_P.css({ + 'background':'url('+RealtimeUpdate._pluginPath+'icon_play.gif) no-repeat 47% 47%', + 'width':'16px', + 'height':'16px', + 'text-indent':'-9999px', + 'border':'none', + 'cursor':'pointer' + }); + RT_P.bind('click', function() { + RealtimeUpdate._paused = false; + + RealtimeUpdate.showPause(); + + RealtimeUpdate.showQueuedNotices(); + + return false; + }); + }, + + showQueuedNotices: function() { + $.each(RealtimeUpdate._queuedNotices, function(i, n) { + RealtimeUpdate.insertNoticeItem(n); + }); + + RealtimeUpdate._queuedNotices = []; + }, + + initAddPopup: function(url, timeline, path) { var NP = $('#notices_primary'); NP.css({'position':'relative'}); @@ -192,7 +271,7 @@ RealtimeUpdate = { var RT = $('#realtime_timeline'); RT.css({ 'margin':'0 0 11px 0', - 'background':'transparent url('+ iconurl + ') no-repeat 0 30%', + 'background':'transparent url('+ path + 'icon_external.gif) no-repeat 0 30%', 'padding':'0 0 0 20px', 'display':'block', 'position':'absolute', -- cgit v1.2.3-54-g00ecf From 6d3d78c793594f3737718f24a461710e278f3022 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 15:57:45 +0000 Subject: Styled realtime_actions --- plugins/Realtime/realtimeupdate.js | 55 ++++++++++++++++++++++---------------- 1 file changed, 32 insertions(+), 23 deletions(-) (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index 4352b45d9..28cd59028 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -192,7 +192,20 @@ RealtimeUpdate = { initActions: function(url, timeline, path) { var NP = $('#notices_primary'); - NP.prepend('
'); + NP.prepend('
'); + + $('#realtime_actions').css({ + 'position':'absolute', + 'top':'-20px', + 'right':'0', + 'margin':'0 0 11px 0' + }); + + $('#realtime_actions li').css({ + 'margin-left':'18px', + 'list-style-type':'none', + 'float':'left' + }); RealtimeUpdate._pluginPath = path; @@ -214,11 +227,12 @@ RealtimeUpdate = { RT_P = $('#realtime_pause'); $('#realtime_pause').css({ 'background':'url('+RealtimeUpdate._pluginPath+'icon_pause.gif) no-repeat 47% 47%', - 'width':'16px', - 'height':'16px', - 'text-indent':'-9999px', + 'width':'16px', + 'height':'16px', + 'display':'block', 'border':'none', - 'cursor':'pointer' + 'cursor':'pointer', + 'text-indent':'-9999px' }); RT_P.bind('click', function() { RealtimeUpdate._paused = true; @@ -237,11 +251,12 @@ RealtimeUpdate = { RT_P = $('#realtime_play'); RT_P.css({ 'background':'url('+RealtimeUpdate._pluginPath+'icon_play.gif) no-repeat 47% 47%', - 'width':'16px', - 'height':'16px', - 'text-indent':'-9999px', + 'width':'16px', + 'height':'16px', + 'display':'block', 'border':'none', - 'cursor':'pointer' + 'cursor':'pointer', + 'text-indent':'-9999px' }); RT_P.bind('click', function() { RealtimeUpdate._paused = false; @@ -264,28 +279,22 @@ RealtimeUpdate = { initAddPopup: function(url, timeline, path) { - var NP = $('#notices_primary'); - NP.css({'position':'relative'}); - NP.prepend(''); + var NP = $('#realtime_timeline'); + NP.append(''); - var RT = $('#realtime_timeline'); - RT.css({ - 'margin':'0 0 11px 0', + var PP = $('#realtime_popup'); + PP.css({ 'background':'transparent url('+ path + 'icon_external.gif) no-repeat 0 30%', - 'padding':'0 0 0 20px', + 'width':'16px', + 'height':'16px', 'display':'block', - 'position':'absolute', - 'top':'-20px', - 'right':'0', 'border':'none', 'cursor':'pointer', - 'color':$('a').css('color'), - 'font-weight':'bold', - 'font-size':'1em' + 'text-indent':'-9999px' }); $('#showstream #notices_primary').css({'margin-top':'18px'}); - RT.bind('click', function() { + PP.bind('click', function() { window.open(url, '', 'toolbar=no,resizable=yes,scrollbars=yes,status=yes,width=500,height=550'); -- cgit v1.2.3-54-g00ecf From 4823463e3f397ddfc44e6455ff6fcdb32cbf9809 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 16:00:40 +0000 Subject: Relatively positioning notice_primary --- plugins/Realtime/realtimeupdate.js | 1 + 1 file changed, 1 insertion(+) (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index 28cd59028..e2bd8daea 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -193,6 +193,7 @@ RealtimeUpdate = { { var NP = $('#notices_primary'); NP.prepend('
'); + NP.css({'position':'relative'}); $('#realtime_actions').css({ 'position':'absolute', -- cgit v1.2.3-54-g00ecf From ef542afbe5f6aec04f7c72d71fb613265e794f95 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 17:23:04 +0000 Subject: Added counter beside the play button. When paused, it will update the counter on new received notices. Counter is removed when play is clicked --- plugins/Realtime/realtimeupdate.js | 44 +++++++++++++++++++++++++++++--------- 1 file changed, 34 insertions(+), 10 deletions(-) (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index e2bd8daea..8e3052dfc 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -77,12 +77,14 @@ RealtimeUpdate = { RealtimeUpdate.purgeLastNoticeItem(); RealtimeUpdate.insertNoticeItem(data); - - RealtimeUpdate.updateWindowCounter(); } else { RealtimeUpdate._queuedNotices.push(data); + + RealtimeUpdate.updateQueuedCounter(); } + + RealtimeUpdate.updateWindowCounter(); }, insertNoticeItem: function(data) { @@ -192,7 +194,7 @@ RealtimeUpdate = { initActions: function(url, timeline, path) { var NP = $('#notices_primary'); - NP.prepend('
'); + NP.prepend('
'); NP.css({'position':'relative'}); $('#realtime_actions').css({ @@ -221,7 +223,7 @@ RealtimeUpdate = { showPause: function() { - RT_PP = $('#realtime_pauseplay'); + RT_PP = $('#realtime_playpause'); RT_PP.empty(); RT_PP.append(''); @@ -233,7 +235,8 @@ RealtimeUpdate = { 'display':'block', 'border':'none', 'cursor':'pointer', - 'text-indent':'-9999px' + 'text-indent':'-9999px', + 'float':'left' }); RT_P.bind('click', function() { RealtimeUpdate._paused = true; @@ -245,9 +248,14 @@ RealtimeUpdate = { showPlay: function() { - RT_PP = $('#realtime_pauseplay'); + RT_PP = $('#realtime_playpause'); RT_PP.empty(); - RT_PP.append(''); + RT_PP.append(' '); + + $('#queued_counter').css({ + 'float':'left', + 'line-height':'1.2' + }); RT_P = $('#realtime_play'); RT_P.css({ @@ -257,7 +265,9 @@ RealtimeUpdate = { 'display':'block', 'border':'none', 'cursor':'pointer', - 'text-indent':'-9999px' + 'text-indent':'-9999px', + 'float':'left', + 'margin-left':'4px' }); RT_P.bind('click', function() { RealtimeUpdate._paused = false; @@ -270,12 +280,25 @@ RealtimeUpdate = { }); }, - showQueuedNotices: function() { + showQueuedNotices: function() + { $.each(RealtimeUpdate._queuedNotices, function(i, n) { RealtimeUpdate.insertNoticeItem(n); }); RealtimeUpdate._queuedNotices = []; + + RealtimeUpdate.removeQueuedCounter(); + }, + + updateQueuedCounter: function() + { + QC = $('#realtime_playpause #queued_counter').html('('+RealtimeUpdate._queuedNotices.length+')'); + }, + + removeQueuedCounter: function() + { + $('#realtime_playpause #queued_counter').empty(); }, initAddPopup: function(url, timeline, path) @@ -291,7 +314,8 @@ RealtimeUpdate = { 'display':'block', 'border':'none', 'cursor':'pointer', - 'text-indent':'-9999px' + 'text-indent':'-9999px', + 'float':'left' }); $('#showstream #notices_primary').css({'margin-top':'18px'}); -- cgit v1.2.3-54-g00ecf From c1efb8aa7fc429c6885cb6337e141e32847d34e9 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 17:59:44 +0000 Subject: Took out CSS from JS and placed it in its own file. --- plugins/Realtime/RealtimePlugin.php | 7 +++++ plugins/Realtime/realtimeupdate.css | 49 ++++++++++++++++++++++++++++++++++ plugins/Realtime/realtimeupdate.js | 52 ------------------------------------- 3 files changed, 56 insertions(+), 52 deletions(-) create mode 100644 plugins/Realtime/realtimeupdate.css (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/RealtimePlugin.php b/plugins/Realtime/RealtimePlugin.php index 6d59bd1b1..2cff03d6c 100644 --- a/plugins/Realtime/RealtimePlugin.php +++ b/plugins/Realtime/RealtimePlugin.php @@ -118,6 +118,13 @@ class RealtimePlugin extends Plugin return true; } + function onEndShowStatusNetStyles($action) + { + $action->cssLink(common_path('plugins/Realtime/realtimeupdate.css'), + null, 'screen, projection, tv'); + return true; + } + function onEndNoticeSave($notice) { $paths = array(); diff --git a/plugins/Realtime/realtimeupdate.css b/plugins/Realtime/realtimeupdate.css new file mode 100644 index 000000000..0ab5dd32b --- /dev/null +++ b/plugins/Realtime/realtimeupdate.css @@ -0,0 +1,49 @@ +#notices_primary { +position:relative; +} + +#realtime_actions { +position: absolute; +top: -20px; +right: 0; +margin: 0 0 11px 0; +} + +#realtime_actions li { +margin-left: 18px; +list-style-type: none; +float: left; +} + +#realtime_actions button { +width: 16px; +height: 16px; +display: block; +border: none; +cursor: pointer; +text-indent: -9999px; +float: left; +} + +#realtime_play { +background: url(icon_play.gif) no-repeat 47% 47%; +margin-left: 4px; +} + +#realtime_pause { +background: url(icon_pause.gif) no-repeat 47% 47%; +} + +#realtime_popup { +background: url(icon_external.gif) no-repeat 0 30%; +} + +#queued_counter { +float:left; +line-height:1.2; +} + +#showstream #notices_primary { +margin-top: 18px; +} + diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index 8e3052dfc..9030ad551 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -195,20 +195,6 @@ RealtimeUpdate = { { var NP = $('#notices_primary'); NP.prepend('
'); - NP.css({'position':'relative'}); - - $('#realtime_actions').css({ - 'position':'absolute', - 'top':'-20px', - 'right':'0', - 'margin':'0 0 11px 0' - }); - - $('#realtime_actions li').css({ - 'margin-left':'18px', - 'list-style-type':'none', - 'float':'left' - }); RealtimeUpdate._pluginPath = path; @@ -228,16 +214,6 @@ RealtimeUpdate = { RT_PP.append(''); RT_P = $('#realtime_pause'); - $('#realtime_pause').css({ - 'background':'url('+RealtimeUpdate._pluginPath+'icon_pause.gif) no-repeat 47% 47%', - 'width':'16px', - 'height':'16px', - 'display':'block', - 'border':'none', - 'cursor':'pointer', - 'text-indent':'-9999px', - 'float':'left' - }); RT_P.bind('click', function() { RealtimeUpdate._paused = true; @@ -252,23 +228,7 @@ RealtimeUpdate = { RT_PP.empty(); RT_PP.append(' '); - $('#queued_counter').css({ - 'float':'left', - 'line-height':'1.2' - }); - RT_P = $('#realtime_play'); - RT_P.css({ - 'background':'url('+RealtimeUpdate._pluginPath+'icon_play.gif) no-repeat 47% 47%', - 'width':'16px', - 'height':'16px', - 'display':'block', - 'border':'none', - 'cursor':'pointer', - 'text-indent':'-9999px', - 'float':'left', - 'margin-left':'4px' - }); RT_P.bind('click', function() { RealtimeUpdate._paused = false; @@ -307,18 +267,6 @@ RealtimeUpdate = { NP.append(''); var PP = $('#realtime_popup'); - PP.css({ - 'background':'transparent url('+ path + 'icon_external.gif) no-repeat 0 30%', - 'width':'16px', - 'height':'16px', - 'display':'block', - 'border':'none', - 'cursor':'pointer', - 'text-indent':'-9999px', - 'float':'left' - }); - $('#showstream #notices_primary').css({'margin-top':'18px'}); - PP.bind('click', function() { window.open(url, '', -- cgit v1.2.3-54-g00ecf From 63d3e07ce4b12a0a06d74730ff4c938ace519517 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 18 Nov 2009 19:15:55 +0000 Subject: Check for dupe from insertNoticeItem() --- plugins/Realtime/realtimeupdate.js | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) (limited to 'plugins/Realtime') diff --git a/plugins/Realtime/realtimeupdate.js b/plugins/Realtime/realtimeupdate.js index 9030ad551..a2c4da113 100644 --- a/plugins/Realtime/realtimeupdate.js +++ b/plugins/Realtime/realtimeupdate.js @@ -66,13 +66,6 @@ RealtimeUpdate = { receive: function(data) { - id = data.id; - - // Don't add it if it already exists - if ($("#notice-"+id).length > 0) { - return; - } - if (RealtimeUpdate._paused === false) { RealtimeUpdate.purgeLastNoticeItem(); @@ -88,6 +81,11 @@ RealtimeUpdate = { }, insertNoticeItem: function(data) { + // Don't add it if it already exists + if ($("#notice-"+data.id).length > 0) { + return; + } + var noticeItem = RealtimeUpdate.makeNoticeItem(data); $("#notices_primary .notices").prepend(noticeItem); $("#notices_primary .notice:first").css({display:"none"}); @@ -253,7 +251,7 @@ RealtimeUpdate = { updateQueuedCounter: function() { - QC = $('#realtime_playpause #queued_counter').html('('+RealtimeUpdate._queuedNotices.length+')'); + $('#realtime_playpause #queued_counter').html('('+RealtimeUpdate._queuedNotices.length+')'); }, removeQueuedCounter: function() -- cgit v1.2.3-54-g00ecf