AccordionContainer.js
上传用户:kimgenplus
上传日期:2016-06-05
资源大小:20877k
文件大小:6k
源码类别:

OA系统

开发平台:

Java

  1. /*
  2. Copyright (c) 2004-2006, The Dojo Foundation
  3. All Rights Reserved.
  4. Licensed under the Academic Free License version 2.1 or above OR the
  5. modified BSD license. For more information on Dojo licensing, see:
  6. http://dojotoolkit.org/community/licensing.shtml
  7. */
  8. dojo.provide("dojo.widget.AccordionContainer");
  9. dojo.require("dojo.widget.*");
  10. dojo.require("dojo.html.*");
  11. dojo.require("dojo.lfx.html");
  12. dojo.require("dojo.html.selection");
  13. dojo.require("dojo.widget.html.layout");
  14. dojo.require("dojo.widget.PageContainer");
  15. dojo.widget.defineWidget("dojo.widget.AccordionContainer", dojo.widget.HtmlWidget, {isContainer:true, labelNodeClass:"label", containerNodeClass:"accBody", duration:250, fillInTemplate:function () {
  16. with (this.domNode.style) {
  17. if (position != "absolute") {
  18. position = "relative";
  19. }
  20. overflow = "hidden";
  21. }
  22. }, addChild:function (widget) {
  23. var child = this._addChild(widget);
  24. this._setSizes();
  25. return child;
  26. }, _addChild:function (widget) {
  27. if (widget.open) {
  28. dojo.deprecated("open parameter deprecated, use 'selected=true' instead will be removed in ", "0.5");
  29. dojo.debug(widget.widgetId + ": open == " + widget.open);
  30. widget.selected = true;
  31. }
  32. if (widget.widgetType != "AccordionPane") {
  33. var wrapper = dojo.widget.createWidget("AccordionPane", {label:widget.label, selected:widget.selected, labelNodeClass:this.labelNodeClass, containerNodeClass:this.containerNodeClass, allowCollapse:this.allowCollapse});
  34. wrapper.addChild(widget);
  35. this.addWidgetAsDirectChild(wrapper);
  36. this.registerChild(wrapper, this.children.length);
  37. return wrapper;
  38. } else {
  39. dojo.html.addClass(widget.containerNode, this.containerNodeClass);
  40. dojo.html.addClass(widget.labelNode, this.labelNodeClass);
  41. this.addWidgetAsDirectChild(widget);
  42. this.registerChild(widget, this.children.length);
  43. return widget;
  44. }
  45. }, postCreate:function () {
  46. var tmpChildren = this.children;
  47. this.children = [];
  48. dojo.html.removeChildren(this.domNode);
  49. dojo.lang.forEach(tmpChildren, dojo.lang.hitch(this, "_addChild"));
  50. this._setSizes();
  51. }, removeChild:function (widget) {
  52. dojo.widget.AccordionContainer.superclass.removeChild.call(this, widget);
  53. this._setSizes();
  54. }, onResized:function () {
  55. this._setSizes();
  56. }, _setSizes:function () {
  57. var totalCollapsedHeight = 0;
  58. var openIdx = 0;
  59. dojo.lang.forEach(this.children, function (child, idx) {
  60. totalCollapsedHeight += child.getLabelHeight();
  61. if (child.selected) {
  62. openIdx = idx;
  63. }
  64. });
  65. var mySize = dojo.html.getContentBox(this.domNode);
  66. var y = 0;
  67. dojo.lang.forEach(this.children, function (child, idx) {
  68. var childCollapsedHeight = child.getLabelHeight();
  69. child.resizeTo(mySize.width, mySize.height - totalCollapsedHeight + childCollapsedHeight);
  70. child.domNode.style.zIndex = idx + 1;
  71. child.domNode.style.position = "absolute";
  72. child.domNode.style.top = y + "px";
  73. y += (idx == openIdx) ? dojo.html.getBorderBox(child.domNode).height : childCollapsedHeight;
  74. });
  75. }, selectChild:function (page) {
  76. dojo.lang.forEach(this.children, function (child) {
  77. child.setSelected(child == page);
  78. });
  79. var y = 0;
  80. var anims = [];
  81. dojo.lang.forEach(this.children, function (child, idx) {
  82. if (child.domNode.style.top != (y + "px")) {
  83. anims.push(dojo.lfx.html.slideTo(child.domNode, {top:y, left:0}, this.duration));
  84. }
  85. y += child.selected ? dojo.html.getBorderBox(child.domNode).height : child.getLabelHeight();
  86. }, this);
  87. dojo.lfx.combine(anims).play();
  88. }});
  89. dojo.widget.defineWidget("dojo.widget.AccordionPane", dojo.widget.HtmlWidget, {label:"", "class":"dojoAccordionPane", labelNodeClass:"label", containerNodeClass:"accBody", selected:false, templateString:"<div dojoAttachPoint="domNode">n<div dojoAttachPoint="labelNode" dojoAttachEvent="onclick: onLabelClick" class="${this.labelNodeClass}">${this.label}</div>n<div dojoAttachPoint="containerNode" style="overflow: hidden;" class="${this.containerNodeClass}"></div>n</div>n", templateCssString:".dojoAccordionPane .label {ntcolor: #000;ntfont-weight: bold;ntbackground: url("images/soriaAccordionOff.gif") repeat-x top left #85aeec;ntborder:1px solid #d9d9d9;ntfont-size:0.9em;n}nn.dojoAccordionPane-selected .label {ntbackground: url("images/soriaAccordionSelected.gif") repeat-x top left #85aeec;ntborder:1px solid #84a3d1;n}nn.dojoAccordionPane .label:hover {ntcursor: pointer;n}nn.dojoAccordionPane .accBody {ntbackground: #fff;ntoverflow: auto;ntborder:1px solid #84a3d1;n}n", templateCssPath:dojo.uri.moduleUri("dojo.widget", "templates/AccordionPane.css"), isContainer:true, fillInTemplate:function () {
  90. dojo.html.addClass(this.domNode, this["class"]);
  91. dojo.widget.AccordionPane.superclass.fillInTemplate.call(this);
  92. dojo.html.disableSelection(this.labelNode);
  93. this.setSelected(this.selected);
  94. }, setLabel:function (label) {
  95. this.labelNode.innerHTML = label;
  96. }, resizeTo:function (width, height) {
  97. dojo.html.setMarginBox(this.domNode, {width:width, height:height});
  98. var children = [{domNode:this.labelNode, layoutAlign:"top"}, {domNode:this.containerNode, layoutAlign:"client"}];
  99. dojo.widget.html.layout(this.domNode, children);
  100. var childSize = dojo.html.getContentBox(this.containerNode);
  101. this.children[0].resizeTo(childSize.width, childSize.height);
  102. }, getLabelHeight:function () {
  103. return dojo.html.getMarginBox(this.labelNode).height;
  104. }, onLabelClick:function () {
  105. this.parent.selectChild(this);
  106. }, setSelected:function (isSelected) {
  107. this.selected = isSelected;
  108. (isSelected ? dojo.html.addClass : dojo.html.removeClass)(this.domNode, this["class"] + "-selected");
  109. var child = this.children[0];
  110. if (child) {
  111. if (isSelected) {
  112. if (!child.isShowing()) {
  113. child.show();
  114. } else {
  115. child.onShow();
  116. }
  117. } else {
  118. child.onHide();
  119. }
  120. }
  121. }});
  122. dojo.lang.extend(dojo.widget.Widget, {open:false});