]> gitweb.fluxo.info Git - lorea/elgg.git/commitdiff
Added "Show less" on activity stream comments.
authorbrettp <brettp@36083f99-b078-4883-b0ff-0f9b5a30f544>
Fri, 11 Jun 2010 19:31:09 +0000 (19:31 +0000)
committerbrettp <brettp@36083f99-b078-4883-b0ff-0f9b5a30f544>
Fri, 11 Jun 2010 19:31:09 +0000 (19:31 +0000)
git-svn-id: http://code.elgg.org/elgg/trunk@6459 36083f99-b078-4883-b0ff-0f9b5a30f544

mod/riverdashboard/languages/en.php
mod/riverdashboard/views/default/river/item/wrapper.php
mod/riverdashboard/views/default/riverdashboard/css.php
mod/riverdashboard/views/default/riverdashboard/js.php

index 34afe91769fa18c5e3960732e1d0c2c499ffec54..d317b8688da3d2623ff3aabfdd81a7599371f4b9 100644 (file)
@@ -40,6 +40,7 @@ $english = array(
 
        // likes and comments
        'riverdashboard:n_more_comments' => '+%s more',
+       'riverdashboard:show_less' => 'Show less',
 
        // ecml desc
        'riverdashboard:ecml:riverdashboard' => 'River Dashboard',
index 57b24111494d9dc0d9b76c25c54d072169c5f506..3583a7f5ba335c4a8580d977f4a6ffe9af989dc6 100644 (file)
@@ -25,7 +25,7 @@ if (get_context() == 'profile' && $object->getSubtype() ==  'thewire') {
 }
 
 // get last three comments display
-// want the 3 most recent comments (order by time_created desc = 3 2 1)
+// want the 3 most recent comments (order by time_created desc = 3 2 1 limit 3)
 // but will display them with the newest at the bottom (1 2 3)
 if ($comments = get_annotations($vars['item']->object_guid, "", "", 'generic_comment', "", "", 3, 0, "desc")) {
        $comments = array_reverse($comments);
@@ -76,8 +76,10 @@ if ($comments){
        echo "<div class=\"comments_container\">";
        // display appropriate comment link
        if ($more_comments_count > 0) {
-               echo "<a class=\"river_show_more_comments link\">" .
+               echo "<a class=\"river_more_comments show_more_button link\">" .
                sprintf(elgg_echo('riverdashboard:n_more_comments'), $more_comments_count) . '</a>';
+
+               echo "<a style=\"display: none\" class=\"river_more_comments show_less_button link\">" . elgg_echo('riverdashboard:show_less') . '</a>';
        }
        echo "<div class=\"comments_list\">";
        foreach ($comments as $comment) {
index 90bed39c7c23144acf47ad09ba7a7dbc2ca8eccc..24c960fbcf5ad43db1311a146169e2e69c73e5a1 100644 (file)
@@ -1,7 +1,7 @@
 <?php
 /**
  * Elgg riverdashboard CSS
- * 
+ *
  */
 ?>
 #riverdashboard_updates {
        font-weight: bold;
        padding:1px 8px 2px 24px;
        margin-top:9px;
-    cursor: pointer;
+       cursor: pointer;
        background: red url("<?php echo $vars['url']; ?>mod/riverdashboard/graphics/refresh.png") no-repeat 5px 3px;
-    -webkit-border-radius: 10px; 
-    -moz-border-radius: 10px;    
+       -webkit-border-radius: 10px;
+       -moz-border-radius: 10px;
 }
 #riverdashboard_updates a.update_link:hover {
        background: #4690D6 url("<?php echo $vars['url']; ?>mod/riverdashboard/graphics/refresh.png") no-repeat 5px -22px;
        -webkit-border-top-left-radius:5px;
        -webkit-border-top-right-radius:0;
        -webkit-border-bottom-right-radius:5px;
-       -webkit-border-bottom-left-radius:5px; 
-    background-color: #eeeeee;
+       -webkit-border-bottom-left-radius:5px;
+       background-color: #eeeeee;
 }
 .river_comment {
        padding:3px;
-       border-bottom:1px solid white;  
+       border-bottom:1px solid white;
 }
 .river_comment.penultimate {
 
@@ -95,7 +95,7 @@
 /* hidden inline comment form */
 .river_comment_form.hidden {
        padding:5px;
-       height:26px;    
+       height:26px;
 }
 .river_comment_form.hidden .input_text {
        width:560px;
 .river_item .river_comment_contents {
        margin-left:34px;
 }
-a.river_show_more_comments {
+a.river_more_comments {
        float:right;
        font-size:85%;
        padding-right:7px;
index 1c5f4ee765d9d9669397778ddc694a727d8fa8f9..dc26a7e5d751cf697625854e0f01b0e5d315201c 100644 (file)
                });
 
                // grab more comments
-               $('.river_show_more_comments').click(function() {
+               $('.river_more_comments.show_more_button').click(function() {
+                       var showLess = $(this).next('.show_less_button');
+                       var showMore = $(this);
                        var riverItem = $(this).closest('.river_item');
+
                        var guid = riverItem.attr('id').replace('river_entity_', '');
                        var commentsList = riverItem.find('.comments_list');
                        var numComments = riverItem.find('.river_comment').length;
 
                        $.post('<?php echo $vars['url'];?>mod/riverdashboard/endpoint/get_comments.php', params, function(data) {
                                commentsList.prepend(data);
-                               commentsList.prev('.river_show_more_comments').html('Show less');
-                               // @todo need a new function to collapse list back down to only show 3 comments
-                               
+
+                               showLess.toggle();
+                               showMore.toggle();
+
                        });
                });
+
+               // hide more comments
+               $('.river_more_comments.show_less_button').click(function() {
+                       var showLess = $(this);
+                       var showMore = $(this).prev('.show_more_button');
+                       var riverItem = $(this).closest('.river_item');
+                       // want to keep the latest 3 comments
+                       var comments = riverItem.find('.river_comment')
+                       comments = $.makeArray(comments).reverse();
+                       //reverse().splice(0, 3);
+
+                       len = comments.length;
+
+                       for (i=3; i<len; i++) {
+                               $(comments[i]).empty().remove();
+                       }
+
+
+                       // remove them so we can force an ajax update when clicked again.
+
+                       showLess.toggle();
+                       showMore.toggle();
+
+               });
        });
 </script>