apps.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. /**
  2. * ownCloud - core
  3. *
  4. * This file is licensed under the Affero General Public License version 3 or
  5. * later. See the COPYING file.
  6. *
  7. * @author Bernhard Posselt <dev@bernhard-posselt.com>
  8. * @copyright Bernhard Posselt 2014
  9. */
  10. (function (document, $, exports) {
  11. 'use strict';
  12. var dynamicSlideToggleEnabled = false;
  13. exports.Apps = {
  14. enableDynamicSlideToggle: function () {
  15. dynamicSlideToggleEnabled = true;
  16. }
  17. };
  18. /**
  19. * Shows the #app-sidebar and add .with-app-sidebar to subsequent siblings
  20. *
  21. * @param {Object} [$el] sidebar element to show, defaults to $('#app-sidebar')
  22. */
  23. exports.Apps.showAppSidebar = function($el) {
  24. var $appSidebar = $el || $('#app-sidebar');
  25. $appSidebar.removeClass('disappear');
  26. $('#app-content').addClass('with-app-sidebar').trigger(new $.Event('appresized'));
  27. };
  28. /**
  29. * Shows the #app-sidebar and removes .with-app-sidebar from subsequent
  30. * siblings
  31. *
  32. * @param {Object} [$el] sidebar element to hide, defaults to $('#app-sidebar')
  33. */
  34. exports.Apps.hideAppSidebar = function($el) {
  35. var $appSidebar = $el || $('#app-sidebar');
  36. $appSidebar.addClass('disappear');
  37. $('#app-content').removeClass('with-app-sidebar').trigger(new $.Event('appresized'));
  38. };
  39. /**
  40. * Provides a way to slide down a target area through a button and slide it
  41. * up if the user clicks somewhere else. Used for the news app settings and
  42. * add new field.
  43. *
  44. * Usage:
  45. * <button data-apps-slide-toggle=".slide-area">slide</button>
  46. * <div class=".slide-area" class="hidden">I'm sliding up</div>
  47. */
  48. var registerAppsSlideToggle = function () {
  49. var buttons = $('[data-apps-slide-toggle]');
  50. $(document).click(function (event) {
  51. if (dynamicSlideToggleEnabled) {
  52. buttons = $('[data-apps-slide-toggle]');
  53. }
  54. buttons.each(function (index, button) {
  55. var areaSelector = $(button).data('apps-slide-toggle');
  56. var area = $(areaSelector);
  57. function hideArea() {
  58. area.slideUp(OC.menuSpeed*4, function() {
  59. area.trigger(new $.Event('hide'));
  60. });
  61. }
  62. function showArea() {
  63. area.slideDown(OC.menuSpeed*4, function() {
  64. area.trigger(new $.Event('show'));
  65. });
  66. }
  67. // do nothing if the area is animated
  68. if (!area.is(':animated')) {
  69. // button toggles the area
  70. if ($(button).is($(event.target).closest('[data-apps-slide-toggle]'))) {
  71. if (area.is(':visible')) {
  72. hideArea();
  73. } else {
  74. showArea();
  75. }
  76. // all other areas that have not been clicked but are open
  77. // should be slid up
  78. } else {
  79. var closest = $(event.target).closest(areaSelector);
  80. if (area.is(':visible') && closest[0] !== area[0]) {
  81. hideArea();
  82. }
  83. }
  84. }
  85. });
  86. });
  87. };
  88. $(document).ready(function () {
  89. registerAppsSlideToggle();
  90. });
  91. }(document, jQuery, OC));