diff options
Diffstat (limited to 'views/default')
| -rw-r--r-- | views/default/infinite_scroll/css.php | 18 | ||||
| -rw-r--r-- | views/default/infinite_scroll/initialize_js.php | 5 | ||||
| -rw-r--r-- | views/default/infinite_scroll/list.php | 83 | ||||
| -rw-r--r-- | views/default/js/infinite_scroll/automatic_pagination.php | 34 | ||||
| -rw-r--r-- | views/default/js/infinite_scroll/infinite_scroll.php | 88 | ||||
| -rw-r--r-- | views/default/js/infinite_scroll/new_items.php | 62 | ||||
| -rw-r--r-- | views/default/plugins/infinite_scroll/usersettings.php | 25 |
7 files changed, 315 insertions, 0 deletions
diff --git a/views/default/infinite_scroll/css.php b/views/default/infinite_scroll/css.php new file mode 100644 index 000000000..7a116dbba --- /dev/null +++ b/views/default/infinite_scroll/css.php @@ -0,0 +1,18 @@ +.elgg-infinite-scroll-ajax-loading { + background-image: url("/_graphics/ajax_loader.gif"); + background-position: center center; + background-repeat: no-repeat; +} + +.elgg-infinite-scroll-bottom { + color: #666; + text-align: center; + padding: 1.5em; +} + +.elgg-gallery + .elgg-infinite-scroll-bottom { + width: 100%; + margin-top: 15px; + border-top: dotted 1px #CCCCCC; + border-bottom: dotted 1px #CCCCCC; +} diff --git a/views/default/infinite_scroll/initialize_js.php b/views/default/infinite_scroll/initialize_js.php new file mode 100644 index 000000000..2d78819cf --- /dev/null +++ b/views/default/infinite_scroll/initialize_js.php @@ -0,0 +1,5 @@ +<?php +elgg_load_js('elgg.infinite_scroll'); +elgg_load_js('jquery-waypoints'); +elgg_load_js('elgg.infinite_scroll.automatic_pagination'); +elgg_load_js('elgg.infinite_scroll.new_items'); diff --git a/views/default/infinite_scroll/list.php b/views/default/infinite_scroll/list.php new file mode 100644 index 000000000..6a6ab9ec7 --- /dev/null +++ b/views/default/infinite_scroll/list.php @@ -0,0 +1,83 @@ +<?php + +$path = explode('/', $vars['path']); +array_shift($path); + +$list_type = get_input('list_type', 'list'); +set_input('list_type', 'list'); + +ob_start(); +elgg_set_viewtype('json'); + +// Check this when #4723 closed. +if (!$path[0]) { + include(elgg_get_root_path().'index.php'); +} else { + page_handler(array_shift($path), implode('/', $path)); +} + +$json = json_decode(ob_get_clean()); + +switch(get_input('items_type')){ + case 'entity': + foreach ($json as $child) foreach ($child as $grandchild) $json = $grandchild; + + /* Removing duplicates + This is unnecessary when #4504 is fixed. */ + if (version_compare(get_version(true), '1.8.7', '<')) { + $buggy = $json; + $json = array(); + $guids = array(); + foreach ($buggy as $item) { + $guids[] = $item->guid; + } + $guids = array_unique($guids); + foreach (array_keys($guids) as $i) { + $json[$i] = $buggy[$i]; + } + } + break; + case 'annotation': + foreach ($json as $child) { + $json = $child; + } + $json = elgg_get_annotations(array( + 'items' => $json->guid, + 'offset' => get_input('offset'), + 'limit' => 25, + )); + break; + case 'river': + $json = $json->activity; + break; +} + +if (!is_array($json)) { + exit(); +} + +$items = array(); +foreach($json as $item) { + switch(get_input('items_type')) { + case 'entity': + $type_class = array( + 'site' => 'ElggSite', + 'user' => 'ElggUser', + 'group' => 'ElggGroup', + 'object' => 'ElggObject' + ); + $items[] = new $type_class[$item->type]($item); + break; + case 'annotation': + $items = $json; + break; + case 'river': + $items[] = new ElggRiverItem($item); + break; + } +} + +header('Content-type: text/plain'); + +elgg_set_viewtype('default'); +echo elgg_view("page/components/$list_type", array("items" => $items)); diff --git a/views/default/js/infinite_scroll/automatic_pagination.php b/views/default/js/infinite_scroll/automatic_pagination.php new file mode 100644 index 000000000..6d296bb2d --- /dev/null +++ b/views/default/js/infinite_scroll/automatic_pagination.php @@ -0,0 +1,34 @@ +<?php +/** + * Load next page of a listing through ajax automatically + * + * @package ElggInfiniteScroll + */ +?> + +elgg.require('elgg.infinite_scroll'); +elgg.provide('elgg.infinite_scroll.automatic_pagination'); + +elgg.infinite_scroll.automatic_pagination.add_waypoint = function() { + $(this).unbind('append'); + $(this).waypoint(elgg.infinite_scroll.automatic_pagination.remove_waypoint, { + offset: '100%', + }); + +}; + +elgg.infinite_scroll.automatic_pagination.remove_waypoint = function() { + $(this).waypoint('destroy'); + $(this).click(); + $(this).bind('append', elgg.infinite_scroll.automatic_pagination.add_waypoint); +}; + +elgg.infinite_scroll.automatic_pagination.init = function() { + $('.elgg-infinite-scroll-bottom .elgg-button').waypoint( + elgg.infinite_scroll.automatic_pagination.remove_waypoint, { + offset: '100%', + } + ); +}; + +elgg.register_hook_handler('init', 'system', elgg.infinite_scroll.automatic_pagination.init); diff --git a/views/default/js/infinite_scroll/infinite_scroll.php b/views/default/js/infinite_scroll/infinite_scroll.php new file mode 100644 index 000000000..98b7fac05 --- /dev/null +++ b/views/default/js/infinite_scroll/infinite_scroll.php @@ -0,0 +1,88 @@ +<?php +/** + * Load next page of a listing through ajax when a button clicked + * + * @package ElggInfiniteScroll + */ +?> + +elgg.provide('elgg.infinite_scroll'); + +elgg.infinite_scroll.load = function($list, offset, callback) { + var $params = elgg.parse_str(elgg.parse_url(location.href).query); + $params = $.extend($params, { + path: elgg.parse_url(location.href).path, + items_type: $list.hasClass('elgg-list-entity') ? 'entity' : + $list.hasClass('elgg-gallery') ? 'entity' : + $list.hasClass('elgg-list-river') ? 'river' : + $list.hasClass('elgg-list-annotation') ? 'annotation' : false, + offset: offset, + }); + + var url = "/ajax/view/infinite_scroll/list?" + $.param($params); + elgg.get(url, callback); +} + +elgg.infinite_scroll.load_next = function(event, direction) { + var $bottom = $(this).parent(); + elgg.infinite_scroll.bottom = $bottom; + + $bottom.addClass('elgg-infinite-scroll-ajax-loading') + .find('.elgg-button').css('visibility', 'hidden'); + + var $list = $bottom.siblings('.elgg-list, .elgg-gallery'); + var offset = $list.children().length; + elgg.infinite_scroll.load($list, offset, elgg.infinite_scroll.append); + + return false; +} + +elgg.infinite_scroll.append = function(data) { + var $bottom = elgg.infinite_scroll.bottom; + $bottom.removeClass('elgg-infinite-scroll-ajax-loading'); + var $list = $bottom.siblings('.elgg-list, .elgg-gallery'); + + var more = false; + if (data) { + $list.append($(data).children()); + if ($(data).children().length == $list.data('elgg-infinite-scroll-limit')) { + $bottom.find('.elgg-button').css('visibility', 'visible'); + more = true; + } + } + if (!more) { + $bottom.html(elgg.echo('infinite_scroll:list_end')); + } + $bottom.find('.elgg-button').trigger('append', data); +} + +elgg.infinite_scroll.init = function() { + + // Select all paginated .elgg-list or .elgg-gallery witch aren't into widgets + $list = $('.elgg-pagination').siblings('.elgg-list, .elgg-gallery').filter(':not(.elgg-module *)') + + // Hide pagination + .siblings('.elgg-pagination').hide().end() + + // Set limit as HTML5 data attribute + .each(function(){ + $(this).data('elgg-infinite-scroll-limit', $(this).children().length); + }) + + // Add load more button at the final of the list + .after( + $('<div class="elgg-infinite-scroll-bottom"></div>') + .append( + $('<?php + echo elgg_view('output/url', array( + 'text' => elgg_echo('infinite_scroll:load_more'), + 'href' => '', + 'class' => 'elgg-button', + )); + ?>').click(elgg.infinite_scroll.load_next) + ) + ); + +}; + +elgg.register_hook_handler('init', 'system', elgg.infinite_scroll.init); diff --git a/views/default/js/infinite_scroll/new_items.php b/views/default/js/infinite_scroll/new_items.php new file mode 100644 index 000000000..f686b8c3f --- /dev/null +++ b/views/default/js/infinite_scroll/new_items.php @@ -0,0 +1,62 @@ +<?php +/** + * Load new items of a list through ajax when a button clicked + * + * @package ElggInfiniteScroll + */ +?> + +elgg.provide('elgg.infinite_scroll.new_items'); + +elgg.infinite_scroll.new_items.prepend = function(data) { + var $list = $('.elgg-pagination').siblings('.elgg-list, .elgg-gallery').filter(':not(.elgg-module *)'); + if (data) { + var n = $list.children(":hidden").length + $(data).children().length; + $list.prepend($(data).children().hide()); + $('.elgg-infinite-scroll-top').find('.elgg-button').text( + elgg.echo('infinite_scroll:new_items', [n]) + ).end().show(); + } + $list.trigger('prepend', data); +}; + +elgg.infinite_scroll.new_items.check = function() { + // Select all paginated .elgg-list or .elgg-gallery witch aren't into widgets + var $list = $('.elgg-pagination').siblings('.elgg-list, .elgg-gallery').filter(':not(.elgg-module *)'); + + elgg.infinite_scroll.load($list, 0, function(data){ + elgg.infinite_scroll.new_items.prepend(data); + setTimeout(elgg.infinite_scroll.new_items.check, 30000); + }); +}; + +elgg.infinite_scroll.new_items.init = function() { + + // Select all paginated .elgg-list or .elgg-gallery witch aren't into widgets + $list = $('.elgg-pagination').siblings('.elgg-list, .elgg-gallery').filter(':not(.elgg-module *)') + + // Add new items button at the begining of the list + .before( + $('<div class="elgg-infinite-scroll-top"></div>') + .append( + $('<?php + echo elgg_view('output/url', array( + 'text' => '', + 'href' => '', + 'class' => 'elgg-button', + )); + ?>').click(function(){ + $list.children().slideDown({ + duration: 700, + easing: 'easeInCubic', + }); + $(this).parent().hide(); + return false; + }) + ).hide() + ); + // Check for new items each 30s. + setTimeout(elgg.infinite_scroll.new_items.check, 0); +}; + +elgg.register_hook_handler('init', 'system', elgg.infinite_scroll.new_items.init); diff --git a/views/default/plugins/infinite_scroll/usersettings.php b/views/default/plugins/infinite_scroll/usersettings.php new file mode 100644 index 000000000..7e673f382 --- /dev/null +++ b/views/default/plugins/infinite_scroll/usersettings.php @@ -0,0 +1,25 @@ +<?php +/** + * Infinite scroll plugin settings + */ + +$logged_in_user = elgg_get_logged_in_user_guid(); + +// set default value +if (!($pagination_type = elgg_get_plugin_user_setting('pagination_type', $logged_in_user, 'infinite_scroll'))) { + $pagination_type = 'button'; +} + +echo '<div>'; +echo elgg_echo('infinite_scroll:settings:pagination_type'); +echo ' '; +echo elgg_view('input/dropdown', array( + 'name' => 'params[pagination_type]', + 'options_values' => array( + 'classic' => elgg_echo('infinite_scroll:settings:pagination:classic'), + 'button' => elgg_echo('infinite_scroll:settings:pagination:button'), + 'automatic' => elgg_echo('infinite_scroll:settings:pagination:automatic') + ), + 'value' => $pagination_type, +)); +echo '</div>'; |