diff options
Diffstat (limited to 'js/lib/ui.js')
| -rw-r--r-- | js/lib/ui.js | 96 |
1 files changed, 70 insertions, 26 deletions
diff --git a/js/lib/ui.js b/js/lib/ui.js index 0e6634020..413078b4f 100644 --- a/js/lib/ui.js +++ b/js/lib/ui.js @@ -1,6 +1,7 @@ elgg.provide('elgg.ui'); elgg.ui.init = function () { + // add user hover menus elgg.ui.initHoverMenu(); //if the user clicks a system message, make it disappear @@ -9,26 +10,24 @@ elgg.ui.init = function () { }); $('.elgg-system-messages li').animate({opacity: 0.9}, 6000); - $('.elgg-system-messages li').fadeOut('slow'); + $('.elgg-system-messages li.elgg-state-success').fadeOut('slow'); - $('.elgg-toggler').live('click', elgg.ui.toggles); + $('[rel=toggle]').live('click', elgg.ui.toggles); - $('[rel=popup]').live('click', elgg.ui.popsUp); + $('[rel=popup]').live('click', elgg.ui.popupOpen); $('.elgg-menu-page .elgg-menu-parent').live('click', elgg.ui.toggleMenu); $('.elgg-requires-confirmation').live('click', elgg.ui.requiresConfirmation); - if ($('.elgg-input-date').length) { - $('.elgg-input-date').datepicker(); - } -} + $('.elgg-autofocus').focus(); +}; /** * Toggles an element based on clicking a separate element * - * Use .elgg-toggler on the toggler element - * Set the href to target the item you want to toggle (<a class="elgg-toggler" href="#id-of-target">) + * Use rel="toggle" on the toggler element + * Set the href to target the item you want to toggle (<a rel="toggle" href="#id-of-target">) * * @param {Object} event * @return void @@ -36,10 +35,11 @@ elgg.ui.init = function () { elgg.ui.toggles = function(event) { event.preventDefault(); + // @todo might want to switch this to elgg.getSelectorFromUrlFragment(). var target = $(this).toggleClass('elgg-state-active').attr('href'); $(target).slideToggle('medium'); -} +}; /** * Pops up an element based on clicking a separate element @@ -52,14 +52,14 @@ elgg.ui.toggles = function(event) { * targetSelector: The selector used to find the popup * target: The popup jQuery element as found by the selector * source: The jquery element whose click event initiated a popup. - * + * * The return value of the function is used as the options object to .position(). * Handles can also return false to abort the default behvior and override it with their own. * * @param {Object} event * @return void */ -elgg.ui.popsUp = function(event) { +elgg.ui.popupOpen = function(event) { event.preventDefault(); event.stopPropagation(); @@ -86,7 +86,7 @@ elgg.ui.popsUp = function(event) { if (!options) { return; } - + // hide if already open if ($target.is(':visible')) { $target.fadeOut(); @@ -101,7 +101,7 @@ elgg.ui.popsUp = function(event) { $('body') .die('click', elgg.ui.popupClose) .live('click', elgg.ui.popupClose); -} +}; /** * Catches clicks that aren't in a popup and closes all popups. @@ -119,7 +119,7 @@ elgg.ui.popupClose = function(event) { if (!$target.is(':visible')) { return; } - + // didn't click inside the target if ($eventTarget.closest(target).length > 0) { inTarget = true; @@ -139,7 +139,7 @@ elgg.ui.popupClose = function(event) { $('body').die('click', elgg.ui.popClose); } -} +}; /** * Toggles a child menu when the parent is clicked @@ -151,7 +151,7 @@ elgg.ui.toggleMenu = function(event) { $(this).siblings().slideToggle('medium'); $(this).toggleClass('elgg-menu-closed elgg-menu-opened'); event.preventDefault(); -} +}; /** * Initialize the hover menu @@ -179,7 +179,7 @@ elgg.ui.initHoverMenu = function(parent) { var $hovermenu = $(this).data('hovermenu') || null; if (!$hovermenu) { - var $hovermenu = $(this).parent().find(".elgg-menu-hover"); + $hovermenu = $(this).parent().find(".elgg-menu-hover"); $(this).data('hovermenu', $hovermenu); } @@ -211,7 +211,7 @@ elgg.ui.initHoverMenu = function(parent) { $(".elgg-menu-hover").fadeOut(); } }); -} +}; /** * Calls a confirm() and prevents default if denied. @@ -220,14 +220,14 @@ elgg.ui.initHoverMenu = function(parent) { * @return void */ elgg.ui.requiresConfirmation = function(e) { - var confirmText = $(this).attr('title') || elgg.echo('question:areyousure'); + var confirmText = $(this).attr('rel') || elgg.echo('question:areyousure'); if (!confirm(confirmText)) { e.preventDefault(); } }; /** - * Repositions the likes popup + * Repositions the login popup * * @param {String} hook 'getOptions' * @param {String} type 'ui.popup' @@ -236,14 +236,58 @@ elgg.ui.requiresConfirmation = function(e) { * * @return {Object} */ -elgg.ui.likesPopupHandler = function(hook, type, params, options) { - if (params.target.hasClass('elgg-likes-list')) { - options.my = 'right bottom'; - options.at = 'left top'; +elgg.ui.loginHandler = function(hook, type, params, options) { + if (params.target.attr('id') == 'login-dropdown-box') { + options.my = 'right top'; + options.at = 'right bottom'; return options; } return null; }; +/** + * Initialize the date picker + * + * Uses the class .elgg-input-date as the selector. + * + * If the class .elgg-input-timestamp is set on the input element, the onSelect + * method converts the date text to a unix timestamp in seconds. That value is + * stored in a hidden element indicated by the id on the input field. + * + * @return void + */ +elgg.ui.initDatePicker = function() { + var loadDatePicker = function() { + $('.elgg-input-date').datepicker({ + // ISO-8601 + dateFormat: 'yy-mm-dd', + onSelect: function(dateText) { + if ($(this).is('.elgg-input-timestamp')) { + // convert to unix timestamp + var dateParts = dateText.split("-"); + var timestamp = Date.UTC(dateParts[0], dateParts[1] - 1, dateParts[2]); + timestamp = timestamp / 1000; + + var id = $(this).attr('id'); + $('input[name="' + id + '"]').val(timestamp); + } + } + }); + }; + + if ($('.elgg-input-date').length && elgg.get_language() == 'en') { + loadDatePicker(); + } else if ($('.elgg-input-date').length) { + elgg.get({ + url: elgg.config.wwwroot + 'vendors/jquery/i18n/jquery.ui.datepicker-'+ elgg.get_language() +'.js', + dataType: "script", + cache: true, + success: loadDatePicker, + error: loadDatePicker // english language is already loaded. + }); + } +}; + elgg.register_hook_handler('init', 'system', elgg.ui.init); -elgg.register_hook_handler('getOptions', 'ui.popup', elgg.ui.likesPopupHandler);
\ No newline at end of file +elgg.register_hook_handler('init', 'system', elgg.ui.initDatePicker); +elgg.register_hook_handler('getOptions', 'ui.popup', elgg.ui.loginHandler); |
