diff options
| -rw-r--r-- | demos/accordion/custom-icons.html | 16 | ||||
| -rw-r--r-- | tests/unit/accordion/accordion_options.js | 17 | ||||
| -rw-r--r-- | themes/base/ui.accordion.css | 3 | ||||
| -rw-r--r-- | ui/ui.accordion.js | 33 |
4 files changed, 59 insertions, 10 deletions
diff --git a/demos/accordion/custom-icons.html b/demos/accordion/custom-icons.html index 777fa5288..914ba32cd 100644 --- a/demos/accordion/custom-icons.html +++ b/demos/accordion/custom-icons.html @@ -9,11 +9,17 @@ <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> $(function() { + var icons = { + header: "ui-icon-circle-arrow-e", + headerSelected: "ui-icon-circle-arrow-s" + }; $("#accordion").accordion({ - icons: { - header: "ui-icon-circle-arrow-e", - headerSelected: "ui-icon-circle-arrow-s" - } + icons: icons + }); + $("#toggle").toggle(function() { + $("#accordion").accordion("option", "icons", false); + }, function() { + $("#accordion").accordion("option", "icons", icons); }); }); </script> @@ -46,6 +52,8 @@ </div> </div> +<button id="toggle">Toggle icons</button> + </div><!-- End demo --> diff --git a/tests/unit/accordion/accordion_options.js b/tests/unit/accordion/accordion_options.js index 61d27ee3e..1ef6542a3 100644 --- a/tests/unit/accordion/accordion_options.js +++ b/tests/unit/accordion/accordion_options.js @@ -119,6 +119,23 @@ test("{ icons: { 'header': 'ui-icon-foo', 'headerSelected': 'ui-icon-bar' } }", ok(false, 'missing test - untested code is broken code'); }); +test("{ icons: false }", function() { + function icons(on) { + same($("#list1 span.ui-icon:visible").length, on ? 3 : 0); + same( $("#list1").hasClass("ui-accordion-icons"), on ); + } + $("#list1").accordion(); + icons(true); + $("#list1").accordion("destroy").accordion({ + icons: false + }); + icons(false); + $("#list1").accordion("option", "icons", $.ui.accordion.defaults.icons); + icons(true); + $("#list1").accordion("option", "icons", false); + icons(false); +}); + test("{ navigation: false }, default", function() { ok(false, 'missing test - untested code is broken code'); }); diff --git a/themes/base/ui.accordion.css b/themes/base/ui.accordion.css index ee1b1b640..dec58193e 100644 --- a/themes/base/ui.accordion.css +++ b/themes/base/ui.accordion.css @@ -3,7 +3,8 @@ .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } .ui-accordion .ui-accordion-li-fix { display: inline; } .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } -.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em 2.2em; } +.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } +.ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; } .ui-accordion .ui-accordion-content-active { display: block; }
\ No newline at end of file diff --git a/ui/ui.accordion.js b/ui/ui.accordion.js index baf6e9f9b..5fb6b501a 100644 --- a/ui/ui.accordion.js +++ b/ui/ui.accordion.js @@ -60,8 +60,7 @@ $.widget("ui.accordion", { this.active.next().addClass('ui-accordion-content-active'); //Append icon elements - $("<span/>").addClass("ui-icon " + o.icons.header).prependTo(this.headers); - this.active.find(".ui-icon").toggleClass(o.icons.header).toggleClass(o.icons.headerSelected); + this._createIcons(); // IE7-/Win - Extra vertical space in lists fixed if ($.browser.msie) { @@ -104,6 +103,20 @@ $.widget("ui.accordion", { } }, + + _createIcons: function() { + var o = this.options; + if (o.icons) { + $("<span/>").addClass("ui-icon " + o.icons.header).prependTo(this.headers); + this.active.find(".ui-icon").toggleClass(o.icons.header).toggleClass(o.icons.headerSelected); + this.element.addClass("ui-accordion-icons"); + } + }, + + _destroyIcons: function() { + this.headers.children(".ui-icon").remove(); + this.element.removeClass("ui-accordion-icons"); + }, destroy: function() { var o = this.options; @@ -120,7 +133,7 @@ $.widget("ui.accordion", { .removeAttr("role").removeAttr("aria-expanded").removeAttr("tabindex"); this.headers.find("a").removeAttr("tabindex"); - this.headers.children(".ui-icon").remove(); + this._destroyIcons(); var contents = this.headers.next().css("display", "").removeAttr("role").removeClass("ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content ui-accordion-content-active"); if (o.autoHeight || o.fillHeight) { contents.css("height", ""); @@ -130,8 +143,18 @@ $.widget("ui.accordion", { }, _setData: function(key, value) { - if(key == 'alwaysOpen') { key = 'collapsible'; value = !value; } - $.widget.prototype._setData.apply(this, arguments); + // alwaysOpen is deprecated + if(key == 'alwaysOpen'){ key = 'collapsible'; value = !value; } + + $.widget.prototype._setData.apply(this, arguments); + + if (key == "icons") { + this._destroyIcons(); + if (value) { + this._createIcons(); + } + } + }, _keydown: function(event) { |