Dialog.js 35 KB

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