Dialog.js 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886
  1. o2.require("MWF.widget.Dialog", null, false);
  2. o2.xDesktop.Dialog = o2.DDL = new Class({
  3. Extends: o2.widget.Dialog,
  4. options : {
  5. maxHeightPercent : "98%"
  6. },
  7. // _markShow: function(){
  8. //
  9. // if (this.options.mark){
  10. // if (!this.markNode){
  11. //
  12. // this.markNode = new Element("div", {
  13. // styles: this.css.mark
  14. // }).inject($(document.body));
  15. //
  16. // }
  17. //// if (this.options.markNode){
  18. //// var size = this.options.markNode.getComputedSize();
  19. //// var position = this.options.markNode.getPosition();
  20. //// alert(size.totalHeight);
  21. //// this.markNode.set("styles", {
  22. //// "height": size.totalHeight+"px",
  23. //// "width": size.totalWidth+"px",
  24. //// "top": position.y,
  25. //// "height": position.x
  26. //// });
  27. ////
  28. //// }else{
  29. // var size = MWF.getMarkSize();
  30. // this.markNode.set("styles", {
  31. // "height": size.y,
  32. // "width": size.x,
  33. // "top": "0xp",
  34. // "height": "0px"
  35. // });
  36. //// }
  37. //
  38. // this.markNode.setStyle("display", "block");
  39. // }
  40. // },
  41. _markShow: function(){
  42. if (this.options.mark){
  43. if (!this.markNode){
  44. var size = MWF.getMarkSize(this.options.maskNode);
  45. var topNode = this.options.container || $(document.body);
  46. this.markNode = new Element("iframe", {
  47. styles: this.css.mark
  48. }).inject(topNode);
  49. this.markNode.set("styles", {
  50. "height": size.y,
  51. "width": size.x
  52. });
  53. if (!this.markNode_up) this.markNode_up = new Element("div", { styles: this.css.mark }).inject(topNode);
  54. this.markNode_up.set("styles", {
  55. "height": size.y,
  56. "width": size.x
  57. });
  58. }
  59. this.markNode.setStyle("display", "block");
  60. }
  61. },
  62. getDialogNode: function(){
  63. this.width = this.options.width;
  64. this.height = this.options.height;
  65. this.node.set("styles", this.css.from);
  66. var topNode = this.options.container || $(document.body);
  67. this.node.inject(topNode);
  68. // this.node.addEvent("selectstart", function(e){
  69. // // e.preventDefault();
  70. // });
  71. this.title = this.node.getElement(".MWF_dialod_title");
  72. this.titleCenter = this.node.getElement(".MWF_dialod_title_center");
  73. this.titleText = this.node.getElement(".MWF_dialod_title_text");
  74. this.titleAction = this.node.getElement(".MWF_dialod_title_action");
  75. this.content = this.node.getElement(".MWF_dialod_content");
  76. this.bottom = this.node.getElement(".MWF_dialod_bottom");
  77. this.resizeNode = this.node.getElement(".MWF_dialod_bottom_resize");
  78. this.button = this.node.getElement(".MWF_dialod_button");
  79. if( (!this.options.buttonList || this.options.buttonList.length === 0) && ( !this.options.buttons ) ){
  80. this.button.setStyle("display","none");
  81. this.buttonDisable = true;
  82. }else{
  83. this.okButton = this.node.getElement(".MWF_dialod_ok_button");
  84. this.cancelButton = this.node.getElement(".MWF_dialod_cancel_button");
  85. }
  86. this.backAction = this.node.getElement(".MWF_dialod_Action_back");
  87. if (!this.options.isTitle) {
  88. this.title.destroy();
  89. this.title = null;
  90. this.titleCenter = null;
  91. this.titleRefresh = null;
  92. this.titleText = null;
  93. this.titleAction = null;
  94. }
  95. if (this.title) this.setTitleEvent();
  96. // if (this.titleText) this.getTitle();
  97. if (this.content) this.getContent();
  98. if (this.titleAction) this.getAction();
  99. if (this.resizeNode) this.setResizeNode();
  100. // if (this.button) this.getButton();
  101. if (this.content) this.setContentSize();
  102. if (this.backAction)this.backAction.addEvent("click", this.close.bind(this))
  103. },
  104. getButton: function(){
  105. for (i in this.options.buttons){
  106. var button = new Element("input", {
  107. "type": "button",
  108. "value": i,
  109. "styles": this.css.button,
  110. "class": "mainColor_bg",
  111. "events": {
  112. "click": this.options.buttons[i].bind(this)
  113. }
  114. }).inject(this.button);
  115. }
  116. if (this.options.buttonList){
  117. this.options.buttonList.each(function(bt){
  118. var styles = this.css.button;
  119. if( bt.type === "ok" && this.css.okButton )styles = this.css.okButton;
  120. if( bt.type === "cancel" && this.css.cancelButton )styles = this.css.cancelButton;
  121. if( bt.styles )styles = bt.styles;
  122. var button;
  123. if( bt.type === "ok" && this.okButton ){
  124. button = this.okButton;
  125. button.show();
  126. }else if( bt.type === "cancel" && this.cancelButton ){
  127. button = this.cancelButton;
  128. button.show();
  129. }else{
  130. button = new Element("input", {
  131. "type": "button"
  132. }).inject(this.button);
  133. }
  134. button.set({
  135. "value": bt.text,
  136. "title": bt.title,
  137. "styles": styles,
  138. "class": (bt.type!=="cancel") ? "mainColor_bg" : "",
  139. "events": {
  140. "click": function(e){bt.action.call(this, this, e)}.bind(this)
  141. }
  142. })
  143. }.bind(this));
  144. }
  145. },
  146. setTitleEvent: function(){
  147. var content;
  148. if( this.options.isMove ){
  149. if (layout.app) content = layout.app.content;
  150. if (layout.desktop.currentApp) content = layout.desktop.currentApp.content;
  151. this.containerDrag = new Drag.Move(this.node, {
  152. "handle": this.title,
  153. "container": this.options.container || this.markNode || content,
  154. "snap": 5
  155. });
  156. }
  157. },
  158. getAction: function(){
  159. //未完成................................
  160. if (this.options.isClose){
  161. this.closeAction = new Element("div", {"styles": this.css.closeAction}).inject(this.titleAction);
  162. this.closeAction.addEvent("click", this.close.bind(this));
  163. }
  164. if (this.options.isMax){
  165. this.maxAction = new Element("div", {"styles": this.css.maxAction}).inject(this.titleAction);
  166. this.maxAction.addEvent("click", this.maxSize.bind(this));
  167. this.restoreAction = new Element("div", {"styles": this.css.restoreAction}).inject(this.titleAction);
  168. this.restoreAction.hide();
  169. this.restoreAction.addEvent("click", this.restoreSize.bind(this));
  170. if (this.title){
  171. this.title.addEvent("dblclick", function(){
  172. this.switchMax();
  173. }.bind(this));
  174. }
  175. }
  176. },
  177. switchMax : function(){
  178. if( !this.isMax ){
  179. this.maxSize();
  180. }else{
  181. this.restoreSize();
  182. }
  183. },
  184. maxSize: function(){
  185. //if(!this.oldCoordinate)this.oldCoordinate = {
  186. // height : this.options.height,
  187. // width : this.options.width,
  188. // top : this.options.top,
  189. // left : this.options.left,
  190. // fromTop : this.options.fromTop,
  191. // fromLeft : this.options.fromLeft,
  192. // contentHeight : this.options.contentHeight,
  193. // contentWidth : this.options.contentWidth,
  194. // maxHeightPercent : this.options.maxHeightPercent,
  195. // maxHeight : this.options.maxHeight,
  196. // maxWidth : this.options.maxWidth
  197. //};
  198. //if( !this.oldSize ){
  199. // this.oldSize = {
  200. // "width" : this.width,
  201. // "height" : this.height
  202. // }
  203. //}
  204. if( !this.oldNodeSize ){
  205. this.oldNodeSize = {
  206. "width" : this.nodeWidth,
  207. "height" : this.nodeHeight
  208. }
  209. }
  210. if( !this.oldContentSize ){
  211. this.oldContentSize = {
  212. "width" : this.contentWidth,
  213. "height" : this.contentHeight
  214. }
  215. }
  216. var container = $(document.body);
  217. if (layout.desktop.currentApp){
  218. container = layout.desktop.currentApp.content;
  219. }else if (this.options.container){
  220. if (this.options.container.getSize().y<$(document.body).getSize().y){
  221. container = this.options.container;
  222. }
  223. }
  224. var containerSize = container.getSize();
  225. this.options.width = containerSize.x;
  226. this.options.height = containerSize.y;
  227. this.setContentSize( containerSize.y, containerSize.x );
  228. this.node.setStyles({
  229. width : containerSize.x + "px",
  230. height : containerSize.y + "px",
  231. top : "0px",
  232. left : "0px"
  233. });
  234. this.maxAction.setStyle("display","none");
  235. this.restoreAction.setStyle("display","");
  236. this.isMax = true;
  237. this.fireEvent("max");
  238. },
  239. restoreSize : function(){
  240. this.contentHeight = this.oldContentSize.height;
  241. this.contentWidth = this.oldContentSize.width;
  242. this.nodeHeight = this.oldNodeSize.height;
  243. this.nodeWidth = this.oldNodeSize.width;
  244. this.content.setStyles( this.oldContentSize );
  245. this.node.setStyles( this.oldNodeSize );
  246. this.reCenter();
  247. this.maxAction.setStyle("display","");
  248. this.restoreAction.setStyle("display","none");
  249. this.isMax = false;
  250. this.fireEvent("restore");
  251. },
  252. reCenter: function(){
  253. var size = this.node.getSize();
  254. if( this.options.positionWidth ){
  255. size.x = parseInt(this.options.positionWidth);
  256. }
  257. if( this.options.positionHeight ){
  258. size.y = parseInt(this.options.positionHeight);
  259. }
  260. var container = $(document.body);
  261. if( this.options.positionNode && this.options.positionNode.getSize().y<$(document.body).getSize().y ){
  262. container = this.options.positionNode;
  263. }else if (layout.desktop.currentApp){
  264. container = layout.desktop.currentApp.content;
  265. }else{
  266. if (this.options.container){
  267. if (this.options.container.getSize().y<$(document.body).getSize().y){
  268. container = this.options.container;
  269. }
  270. }
  271. }
  272. var p = o2.getCenter(size, container, container);
  273. if (p.y< ( this.options.minTop || 0 ) ) p.y = this.options.minTop || 0;
  274. this.options.top = p.y;
  275. this.options.left = p.x;
  276. this.css.to.top = this.options.top+"px";
  277. this.css.to.left = this.options.left+"px";
  278. this.node.setStyles({
  279. "top": this.css.to.top,
  280. "left": this.css.to.left
  281. });
  282. },
  283. getOffsetY : function(node){
  284. return (node.getStyle("margin-top").toInt() || 0 ) +
  285. (node.getStyle("margin-bottom").toInt() || 0 ) +
  286. (node.getStyle("padding-top").toInt() || 0 ) +
  287. (node.getStyle("padding-bottom").toInt() || 0 )+
  288. (node.getStyle("border-top-width").toInt() || 0 ) +
  289. (node.getStyle("border-bottom-width").toInt() || 0 );
  290. },
  291. getOffsetX : function(node){
  292. return (node.getStyle("margin-left").toInt() || 0 ) +
  293. (node.getStyle("margin-right").toInt() || 0 ) +
  294. (node.getStyle("padding-left").toInt() || 0 ) +
  295. (node.getStyle("padding-right").toInt() || 0 )+
  296. (node.getStyle("border-left-width").toInt() || 0 ) +
  297. (node.getStyle("border-right-width").toInt() || 0 );
  298. },
  299. getMarginY : function(node){
  300. return (node.getStyle("margin-top").toInt() || 0 ) +
  301. (node.getStyle("margin-bottom").toInt() || 0 );
  302. },
  303. getMarginX : function(node){
  304. return (node.getStyle("margin-left").toInt() || 0 ) +
  305. (node.getStyle("margin-right").toInt() || 0 );
  306. },
  307. setContentHeightAuto : function(){
  308. var maxHeight = this.getMaxHeight();
  309. var offsetY = 0;
  310. var y = 0;
  311. //y = y + getOffsetY( this.title ) + this.title.getSize().y; //this.titleNode.getStyle("height").toInt();
  312. if( this.title )offsetY = offsetY + this.getOffsetY( this.title ) + this.title.getSize().y;
  313. if( this.bottom )offsetY = offsetY + this.getOffsetY( this.bottom ) + this.bottom.getSize().y;
  314. if( this.button && !this.buttonDisable )offsetY = offsetY + this.getOffsetY( this.button ) + this.button.getSize().y;
  315. if( this.content ){
  316. offsetY = offsetY + this.getMarginY( this.content );
  317. y = offsetY + this.content.getSize().y;
  318. }else{
  319. y = offsetY;
  320. }
  321. if ( typeOf(maxHeight) === "number" && y > maxHeight) {
  322. this.options.height = maxHeight;
  323. this.options.contentHeight = null;
  324. this.options.fromTop = this.options.fromTop.toFloat() - offsetY / 2;
  325. this.options.top = this.options.top.toFloat() - offsetY / 2;
  326. this.css.to.height = maxHeight + "px";
  327. this.css.to.top = this.options.top + "px";
  328. this.css.from.top = this.options.fromTop + "px";
  329. this.node.setStyles({
  330. "height": maxHeight
  331. });
  332. this.contentHeight = maxHeight - offsetY;
  333. if (this.content) {
  334. this.content.setStyles({
  335. "height" : maxHeight - offsetY,
  336. "overflow-y": "auto"
  337. })
  338. }
  339. }else{
  340. this.options.height = y;
  341. this.options.contentHeight = null;
  342. this.options.fromTop = this.options.fromTop.toFloat() - offsetY / 2;
  343. this.options.top = this.options.top.toFloat() - offsetY / 2;
  344. this.css.to.height = y + "px";
  345. this.css.to.top = this.options.top + "px";
  346. this.css.from.top = this.options.fromTop + "px";
  347. this.node.setStyles({
  348. "height": y
  349. });
  350. this.contentHeight = y - offsetY;
  351. if (this.content) {
  352. this.content.setStyles({
  353. "height" : y - offsetY,
  354. "overflow-y": "hidden"
  355. })
  356. }
  357. }
  358. },
  359. getMaxHeight : function(){
  360. var maxHeightPercent;
  361. if( this.options.maxHeightPercent ){
  362. maxHeightPercent = this.options.maxHeightPercent;
  363. if( typeOf(maxHeightPercent) === "string" && maxHeightPercent.substr(maxHeightPercent.length - 1, 1) === "%" ) {
  364. var containerHeight = ( this.options.positionNode || this.options.container || $(document.body)).getSize().y;
  365. maxHeightPercent = parseInt(containerHeight * parseInt(maxHeightPercent) / 100);
  366. if( maxHeightPercent + (this.options.minTop || 0) > containerHeight ){
  367. maxHeightPercent = containerHeight - (this.options.minTop)
  368. }
  369. }
  370. }
  371. var maxHeight;
  372. if( this.options.maxHeight && parseFloat( this.options.maxHeight ).toString() !== "NaN" ){
  373. maxHeight = parseFloat( this.options.maxHeight );
  374. if( typeOf(maxHeightPercent) === "number" ){
  375. maxHeight = Math.min( maxHeight, maxHeightPercent )
  376. }
  377. }else if( typeOf(maxHeightPercent) === "number" ){
  378. maxHeight = maxHeightPercent;
  379. }
  380. return maxHeight;
  381. },
  382. getNodeSize: function(){
  383. return {
  384. "height": this.nodeHeight+"px",
  385. "width": this.nodeWidth+"px"
  386. };
  387. },
  388. getContentSize: function(height, width){
  389. var nodeHeight, nodeWidth;
  390. if (!height){
  391. if (this.options.contentHeight){
  392. nodeHeight = height = this.options.contentHeight.toFloat();
  393. this.contentHeight = height;
  394. }else{
  395. height = this.options.height.toFloat();
  396. var maxHeight = this.getMaxHeight();
  397. if( typeOf(maxHeight) === "number" && maxHeight < height ){
  398. height = maxHeight;
  399. }
  400. this.nodeHeight = height;
  401. }
  402. }else{
  403. this.nodeHeight = height;
  404. }
  405. if (!width){
  406. if (this.options.contentWidth){
  407. nodeWidth = width = this.options.contentWidth.toFloat();
  408. this.contentWidth = width;
  409. }else{
  410. width = this.options.width.toFloat();
  411. this.nodeWidth = width;
  412. }
  413. }else{
  414. this.nodeWidth = width;
  415. }
  416. var offsetHeight = 0;
  417. var offsetWidth = 0;
  418. if (this.title){
  419. var h1 = this.title.getSize().y;
  420. var ptop1 = this.title.getStyle("padding-top").toFloat();
  421. var pbottom1 = this.title.getStyle("padding-bottom").toFloat();
  422. var mtop1 = this.title.getStyle("margin-top").toFloat();
  423. var mbottom1 = this.title.getStyle("margin-bottom").toFloat();
  424. offsetHeight += h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  425. }
  426. if (this.bottom){
  427. var h2 = this.bottom.getSize().y;
  428. var ptop2 = this.bottom.getStyle("padding-top").toFloat();
  429. var pbottom2 = this.bottom.getStyle("padding-bottom").toFloat();
  430. var mtop2 = this.bottom.getStyle("margin-top").toFloat();
  431. var mbottom2 = this.bottom.getStyle("margin-bottom").toFloat();
  432. offsetHeight += h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  433. }
  434. if (this.button && !this.buttonDisable){
  435. var h3 = this.button.getSize().y;
  436. var ptop3 = this.button.getStyle("padding-top").toFloat();
  437. var pbottom3 = this.button.getStyle("padding-bottom").toFloat();
  438. var mtop3 = this.button.getStyle("margin-top").toFloat();
  439. var mbottom3 = this.button.getStyle("margin-bottom").toFloat();
  440. offsetHeight += h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  441. }
  442. var ptop4 = this.content.getStyle("padding-top").toFloat();
  443. var pbottom4 = this.content.getStyle("padding-bottom").toFloat();
  444. var mtop4 = this.content.getStyle("margin-top").toFloat();
  445. var mbottom4 = this.content.getStyle("margin-bottom").toFloat();
  446. offsetHeight += ptop4 + pbottom4 + mtop4 + mbottom4;
  447. if (nodeHeight){
  448. nodeHeight = nodeHeight + offsetHeight+2;
  449. }else {
  450. height = height - offsetHeight;
  451. }
  452. //if (this.content.getParent().getStyle("overflow-x")!="hidden" ) height = height-18;
  453. var pleft = this.content.getStyle("padding-left").toFloat();
  454. var pright = this.content.getStyle("padding-right").toFloat();
  455. var mleft = this.content.getStyle("margin-left").toFloat();
  456. var mright = this.content.getStyle("margin-right").toFloat();
  457. offsetWidth = pleft+pright+mleft+mright;
  458. //width = width-pleft-pright-mleft-mright;
  459. //if (this.content.getParent().getStyle("overflow-y")!="hidden" ) width = width-18;
  460. if (nodeWidth){
  461. nodeWidth = nodeWidth+offsetWidth;
  462. }else{
  463. width = width-offsetWidth;
  464. }
  465. if (nodeHeight) {
  466. this.nodeHeight = nodeHeight;
  467. this.options.height = nodeHeight;
  468. this.options.contentHeight = null;
  469. this.options.fromTop = this.options.fromTop.toFloat()-offsetHeight/2;
  470. this.options.top = this.options.top.toFloat()-offsetHeight/2;
  471. this.css.to.height = nodeHeight+"px";
  472. this.css.to.top = this.options.top+"px";
  473. this.css.from.top = this.options.fromTop+"px";
  474. }else{
  475. this.contentHeight = height;
  476. }
  477. if (nodeWidth){
  478. this.nodeWidth = nodeWidth;
  479. this.options.width = nodeWidth;
  480. this.options.contentWidth = null;
  481. this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  482. this.options.left = this.options.left.toFloat()-offsetWidth/2;
  483. this.css.to.width = nodeWidth+"px";
  484. this.css.to.left = this.options.left+"px";
  485. this.css.from.left = this.options.fromLeft+"px";
  486. }else{
  487. this.contentWidth = width;
  488. }
  489. if (!height || height<0){
  490. this.content.setStyles({"overflow": "hidden", "height": "auto", "width": ""+width+"px"});
  491. height = this.content.getSize().y;
  492. var h = height + h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  493. h = h + h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  494. h = h + h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  495. h = h + ptop4 + pbottom4 + mtop4 + mbottom4;
  496. this.css.to.height = h;
  497. }
  498. // var ptop5 = this.node.getStyle("padding-top").toFloat();
  499. // var pbottom5 = this.node.getStyle("padding-bottom").toFloat();
  500. // height = height - ptop5 - pbottom5;
  501. return {"height": height+"px", "width": width+"px"};
  502. },
  503. setContentHeight: function(height){
  504. var nodeHeight;
  505. if (!height){
  506. if (this.options.contentHeight){
  507. nodeHeight = height = this.options.contentHeight.toFloat();
  508. this.contentHeight = height;
  509. }else{
  510. height = this.options.height.toFloat();
  511. var maxHeight = this.getMaxHeight();
  512. if( typeOf(maxHeight) === "number" && maxHeight < height ){
  513. height = maxHeight;
  514. }
  515. this.nodeHeight = height;
  516. }
  517. }else{
  518. this.nodeHeight = height;
  519. }
  520. var offsetHeight = 0;
  521. if (this.title){
  522. var h1 = this.title.getSize().y;
  523. //offsetHeight += h1 + this.getOffsetY(this.title);
  524. var ptop1 = this.title.getStyle("padding-top").toFloat();
  525. var pbottom1 = this.title.getStyle("padding-bottom").toFloat();
  526. var mtop1 = this.title.getStyle("margin-top").toFloat();
  527. var mbottom1 = this.title.getStyle("margin-bottom").toFloat();
  528. offsetHeight += h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  529. }
  530. if (this.bottom){
  531. var h2 = this.bottom.getSize().y;
  532. //offsetHeight += h2 + this.getOffsetY(this.bottom);
  533. var ptop2 = this.bottom.getStyle("padding-top").toFloat();
  534. var pbottom2 = this.bottom.getStyle("padding-bottom").toFloat();
  535. var mtop2 = this.bottom.getStyle("margin-top").toFloat();
  536. var mbottom2 = this.bottom.getStyle("margin-bottom").toFloat();
  537. offsetHeight += h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  538. }
  539. if (this.button && !this.buttonDisable){
  540. var h3 = this.button.getSize().y;
  541. //offsetHeight += h3 + this.getOffsetY(this.button);
  542. var ptop3 = this.button.getStyle("padding-top").toFloat();
  543. var pbottom3 = this.button.getStyle("padding-bottom").toFloat();
  544. var mtop3 = this.button.getStyle("margin-top").toFloat();
  545. var mbottom3 = this.button.getStyle("margin-bottom").toFloat();
  546. offsetHeight += h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  547. }
  548. //offsetHeight += this.getOffsetY(this.content);
  549. var ptop4 = this.content.getStyle("padding-top").toFloat();
  550. var pbottom4 = this.content.getStyle("padding-bottom").toFloat();
  551. var mtop4 = this.content.getStyle("margin-top").toFloat();
  552. var mbottom4 = this.content.getStyle("margin-bottom").toFloat();
  553. offsetHeight += ptop4 + pbottom4 + mtop4 + mbottom4;
  554. if (nodeHeight){
  555. nodeHeight = nodeHeight + offsetHeight+2;
  556. }else {
  557. height = height - offsetHeight;
  558. }
  559. if (nodeHeight) {
  560. this.nodeHeight = nodeHeight;
  561. this.options.height = nodeHeight;
  562. this.options.contentHeight = null;
  563. this.options.fromTop = this.options.fromTop.toFloat()-offsetHeight/2;
  564. this.options.top = this.options.top.toFloat()-offsetHeight/2;
  565. this.css.to.height = nodeHeight+"px";
  566. this.css.to.top = this.options.top+"px";
  567. this.css.from.top = this.options.fromTop+"px";
  568. }else{
  569. this.contentHeight = height;
  570. }
  571. //if (nodeWidth){
  572. // this.nodeWidth = nodeWidth;
  573. // this.options.width = nodeWidth;
  574. // this.options.contentWidth = null;
  575. // this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  576. // this.options.left = this.options.left.toFloat()-offsetWidth/2;
  577. // this.css.to.width = nodeWidth+"px";
  578. // this.css.to.left = this.options.left+"px";
  579. // this.css.from.left = this.options.fromLeft+"px";
  580. //}else{
  581. // this.contentWidth = width;
  582. //}
  583. if (!height || height<0){
  584. this.content.setStyles({"overflow": "hidden", "height": "auto"});
  585. height = this.content.getSize().y;
  586. var h = height + h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  587. h = h + h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  588. h = h + h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  589. h = h + ptop4 + pbottom4 + mtop4 + mbottom4;
  590. this.css.to.height = h;
  591. }else{
  592. this.content.setStyles( {"height" : height} )
  593. }
  594. },
  595. setContentWidthAuto : function(){
  596. var maxWidth = this.options.maxWidth || "100%";
  597. if( typeOf(maxWidth) === "string" && maxWidth.substr(maxWidth.length - 1, 1) === "%" ) {
  598. var containerWidth = ( this.options.positionNode || this.options.container || $(document.body)).getSize().x;
  599. maxWidth = parseInt(containerWidth * parseInt(maxWidth) / 100);
  600. }
  601. var offsetX = 0;
  602. var x = 0;
  603. if( this.content ){
  604. offsetX = offsetX + this.getMarginX( this.content );
  605. x = offsetX + this.content.getSize().x;
  606. }else{
  607. x = offsetX;
  608. }
  609. if ( x > maxWidth) {
  610. this.nodeWidth = maxWidth;
  611. this.options.width = maxWidth;
  612. this.options.contentWidth = null;
  613. this.options.fromLeft = this.options.fromLeft.toFloat() - offsetX / 2;
  614. this.options.left = this.options.left.toFloat() - offsetX / 2;
  615. this.css.to.width = maxWidth + "px";
  616. this.css.to.left = this.options.left + "px";
  617. this.css.from.left = this.options.fromLeft + "px";
  618. this.node.setStyles({
  619. "width": maxWidth
  620. });
  621. this.contentWidth = maxWidth - this.getOffsetX(this.content);
  622. if (this.content) {
  623. this.content.setStyles({
  624. "width" : this.contentWidth,
  625. "overflow-x": "auto"
  626. })
  627. }
  628. }else{
  629. this.nodeWidth = x;
  630. this.options.width = x;
  631. this.options.contentHeight = null;
  632. this.options.fromLeft = this.options.fromLeft.toFloat() - offsetX / 2;
  633. this.options.left = this.options.left.toFloat() - offsetX / 2;
  634. this.css.to.width = x + "px";
  635. this.css.to.left = this.options.left + "px";
  636. this.css.from.left = this.options.fromLeft + "px";
  637. this.node.setStyles({
  638. "width": x
  639. });
  640. this.contentWidth = x - this.getOffsetX(this.content);
  641. if (this.content) {
  642. this.content.setStyles({
  643. "width" : this.contentWidth,
  644. "overflow-x": "hidden"
  645. })
  646. }
  647. }
  648. },
  649. setContentWidth: function(width){
  650. var nodeWidth;
  651. if (!width){
  652. if (this.options.contentWidth){
  653. nodeWidth = width = this.options.contentWidth.toFloat();
  654. this.contentWidth = width;
  655. }else{
  656. width = this.options.width.toFloat();
  657. this.nodeWidth = width;
  658. }
  659. }else{
  660. this.nodeWidth = width;
  661. }
  662. var offsetWidth = 0;
  663. //if (this.content.getParent().getStyle("overflow-x")!="hidden" ) height = height-18;
  664. var pleft = this.content.getStyle("padding-left").toFloat();
  665. var pright = this.content.getStyle("padding-right").toFloat();
  666. var mleft = this.content.getStyle("margin-left").toFloat();
  667. var mright = this.content.getStyle("margin-right").toFloat();
  668. offsetWidth = pleft+pright+mleft+mright;
  669. //width = width-pleft-pright-mleft-mright;
  670. //if (this.content.getParent().getStyle("overflow-y")!="hidden" ) width = width-18;
  671. if (nodeWidth){
  672. nodeWidth = nodeWidth+offsetWidth;
  673. }else{
  674. var x = width;
  675. width = width-offsetWidth;
  676. }
  677. if (nodeWidth){
  678. this.nodeWidth = nodeWidth;
  679. this.options.width = nodeWidth;
  680. this.options.contentWidth = null;
  681. this.css.to.left = this.options.left+"px";
  682. this.css.from.left = this.options.fromLeft+"px";
  683. this.css.to.width = nodeWidth+"px";
  684. this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  685. this.options.left = this.options.left.toFloat()-offsetWidth/2;
  686. this.node.setStyle("width", nodeWidth )
  687. }else{
  688. this.contentWidth = width;
  689. this.node.setStyle("width", x )
  690. }
  691. this.content.setStyles( {"width" : width} )
  692. },
  693. setContentSize: function(height, width){
  694. debugger;
  695. //this.content.setStyle("height", this.getContentSize(height));
  696. // if (!this.options.height && !height){
  697. // this.content.setStyle("height", "auto");
  698. // this.content.setStyle("overflow", "hidden");
  699. // this.content.setStyle("width", "auto");
  700. // }else{
  701. var y = height;
  702. if (!y){
  703. if (this.options.contentHeight){
  704. y = this.options.contentHeight;
  705. }else{
  706. y = this.height;
  707. }
  708. }
  709. var x = width;
  710. if (!x){
  711. if (this.options.contentWidth){
  712. x = this.options.contentWidth;
  713. }else{
  714. x = this.width;
  715. }
  716. }
  717. if( y === "auto" || x === "auto" ){
  718. if( y === "auto" ){
  719. this.setContentHeightAuto();
  720. }else{
  721. this.setContentHeight( height );
  722. }
  723. if( x === "auto" ){
  724. this.setContentWidthAuto();
  725. }else{
  726. this.setContentWidth( width );
  727. }
  728. }else{
  729. this.content.setStyles(this.getContentSize(height, width));
  730. this.content.setStyle("width", "auto");
  731. }
  732. }
  733. });
  734. o2.DL.open = function(options){
  735. debugger;
  736. if (!options) options = {};
  737. if (!options.style) options.style = "user";
  738. //if (!options.transition) options.transition = Fx.Transitions.Back.easeOut;
  739. if (!options.duration) options.duration = 200;
  740. if (options.isClose!==false) options.isClose = true;
  741. var size;
  742. if ((!options.width || options.width=="auto") && !options.contentWidth){
  743. if (options.content){
  744. options.content.show();
  745. size = options.content.getComputedSize();
  746. options.contentWidth = size.totalWidth.toFloat();
  747. }
  748. }
  749. if ((!options.height || options.height=="auto") && !options.contentHeight){
  750. if (options.content){
  751. if (!size){
  752. options.content.show();
  753. size = options.content.getComputedSize();
  754. }
  755. options.contentHeight = size.totalHeight.toFloat()+2;
  756. }
  757. }
  758. if (!options.width && !options.contentWidth) options.width = 300;
  759. if (!options.height && !options.contentHeight) options.height = 150;
  760. if (!options.container && layout){
  761. if (layout.desktop.currentApp){
  762. options.container = layout.desktop.currentApp.content;
  763. }
  764. }
  765. var container = (options.positionNode || options.container || $(document.body));
  766. if( options.width !== "auto" && options.height !== "auto" ){
  767. //如果是百分比
  768. if( "string" == typeOf(options.width) && (1 < options.width.length && "%" == options.width.substr(options.width.length - 1, 1)) ){
  769. options.width = parseInt( container.getSize().x * parseInt(options.width, 10) / 100, 10);
  770. }
  771. if( "string" == typeOf(options.height) && (1 < options.height.length && "%" == options.height.substr(options.height.length - 1, 1)) ){
  772. options.height = parseInt( container.getSize().y * parseInt(options.height, 10) / 100, 10);
  773. }
  774. if ((options.top===undefined ) && (options.left===undefined)){
  775. var p = o2.getCenter({"x":(options.width || options.contentWidth), "y": (options.height || options.contentHeight+120)}, container, container);
  776. options.top = (p.y<0) ? 0 : p.y;
  777. options.left = (p.x<0) ? 0 : p.x;
  778. }
  779. if ((options.fromTop===undefined ) && (options.fromLeft===undefined)){
  780. var p = o2.getCenter({"x":(options.width || options.contentWidth)*0, "y": (options.height || options.contentHeight+120)*0}, container, container);
  781. options.fromTop = (p.y<0) ? 0 : p.y;
  782. options.fromLeft = (p.x<0) ? 0 : p.x;
  783. }
  784. if (options.offset){
  785. if (options.offset.y){
  786. options.top = options.top+options.offset.y.toInt();
  787. options.fromTop = options.fromTop+options.offset.y.toInt();
  788. }
  789. if (options.offset.x){
  790. options.left = options.left+options.offset.x.toInt();
  791. options.fromLeft = options.fromLeft+options.offset.x.toInt();
  792. }
  793. }
  794. if (options.top<0) options.top = 0;
  795. if (options.left<0) options.left = 0;
  796. if (options.fromTop<0) options.fromTop = 0;
  797. if (options.fromLeft<0) options.fromLeft = 0;
  798. }else{
  799. if(options.top===undefined )options.top = 0;
  800. if(options.left===undefined)options.left = 0;
  801. if(options.fromTop===undefined)options.fromTop = 0;
  802. if(options.fromLeft===undefined)options.fromLeft = 0;
  803. }
  804. options.mark = !(options.mask===false);
  805. var dlg = new o2.DDL(options);
  806. if( options.width === "auto" || options.height === "auto" ){
  807. dlg.reCenter();
  808. }
  809. dlg.show();
  810. return dlg;
  811. };