Window.js 37 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144
  1. MWF.require("MWF.widget.Dialog", null, false);
  2. MWF.xDesktop.Window = new Class({
  3. Extends: MWF.widget.Dialog,
  4. Implements: [Options, Events],
  5. options: {
  6. "style": "default",
  7. "title": "window",
  8. "width": "800",
  9. "height": "600",
  10. "top": "10",
  11. "left": "10",
  12. "fromTop": "0",
  13. "fromLeft": "0",
  14. "mark": false,
  15. "html": "",
  16. "text": "",
  17. "url": "",
  18. "content": null,
  19. "isMax": true,
  20. "isClose": true,
  21. "isResize": true,
  22. "isMove": true,
  23. "buttons": null,
  24. "buttonList": null
  25. },
  26. initialize: function(app, options){
  27. var position = layout.desktop.desktopNode.getPosition();
  28. // var size = layout.desktop.desktopNode.getSize();
  29. this.options.top = parseFloat(this.options.top)+position.y;
  30. this.options.fromTop = parseFloat(this.options.fromTop)+position.y;
  31. this.app = app;
  32. debugger;
  33. this.parent(options);
  34. this.isHide = false;
  35. this.isMax = false;
  36. },
  37. // _loadCss: function(){
  38. // if (this.app.windowCss){
  39. // this.css = this.app.windowCss;
  40. // }else{
  41. // var key = encodeURIComponent(this.cssPath);
  42. // if (!reload && MWF.widget.css[key]){
  43. // this.css = MWF.widget.css[key];
  44. // }else{
  45. // this.cssPath = (this.cssPath.indexOf("?")!=-1) ? this.cssPath+"&v="+COMMON.version : this.cssPath+"?v="+COMMON.version;
  46. // var r = new Request.JSON({
  47. // url: this.cssPath,
  48. // secure: false,
  49. // async: false,
  50. // method: "get",
  51. // noCache: false,
  52. // onSuccess: function(responseJSON, responseText){
  53. // this.css = responseJSON;
  54. // MWF.widget.css[key] = responseJSON;
  55. // }.bind(this),
  56. // onError: function(text, error){
  57. // alert(error + text);
  58. // }
  59. // });
  60. // }
  61. // }
  62. // },
  63. changeStyle: function(){
  64. var obj = this.getNodeStyleStatus();
  65. this.cssPath = MWF.defaultPath+"/widget/$Dialog/"+this.options.style+"/css.wcss";
  66. this._loadCss();
  67. this.getContentUrl();
  68. var request = new Request.HTML({
  69. url: this.contentUrl,
  70. method: "GET",
  71. async: false,
  72. onSuccess: function(responseTree){
  73. var node = responseTree[0];
  74. var title = node.getElement(".MWF_dialod_title");
  75. var titleCenter = node.getElement(".MWF_dialod_title_center");
  76. var titleRefresh = node.getElement(".MWF_dialod_title_refresh");
  77. var titleText = node.getElement(".MWF_dialod_title_text");
  78. var titleAction = node.getElement(".MWF_dialod_title_action");
  79. var under = node.getElement(".MWF_dialod_under");
  80. var content = node.getElement(".MWF_dialod_content");
  81. var bottom = node.getElement(".MWF_dialod_bottom");
  82. var resizeNode = node.getElement(".MWF_dialod_bottom_resize");
  83. var button = node.getElement(".MWF_dialod_button");
  84. if (this.title && title){
  85. this.title.clearStyles();
  86. this.title.set("style", title.get("style"));
  87. }
  88. if (this.titleCenter && titleCenter){
  89. this.titleCenter.clearStyles();
  90. this.titleCenter.set("style", titleCenter.get("style"));
  91. }
  92. if (this.titleRefresh && titleRefresh){
  93. this.titleRefresh.clearStyles();
  94. this.titleRefresh.set("style", titleRefresh.get("style"));
  95. }
  96. if (this.titleText && titleText){
  97. this.titleText.clearStyles();
  98. this.titleText.set("style", titleText.get("style"));
  99. }
  100. if (this.titleAction && titleAction){
  101. this.titleAction.clearStyles();
  102. this.titleAction.set("style", titleAction.get("style"));
  103. }
  104. if (this.under && under){
  105. this.under.clearStyles();
  106. this.under.set("style", under.get("style"));
  107. }
  108. if (this.content && content){
  109. this.content.clearStyles();
  110. this.content.set("style", content.get("style"));
  111. }
  112. if (this.bottom && bottom){
  113. this.bottom.clearStyles();
  114. this.bottom.set("style", bottom.get("style"));
  115. }
  116. if (this.resizeNode && resizeNode){
  117. this.resizeNode.clearStyles();
  118. this.resizeNode.set("style", resizeNode.get("style"));
  119. }
  120. if (this.button && button){
  121. this.button.clearStyles();
  122. this.button.set("style", button.get("style"));
  123. }
  124. this.setNodeStyleStatus(obj);
  125. this.node.setStyles(this.css.to);
  126. this.spacer.setStyles(this.css.spacerTo);
  127. if (this.closeActionNode) this.closeActionNode.setStyles(this.css.closeActionNode);
  128. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.maxActionNode);
  129. if (this.minActionNode) this.minActionNode.setStyles(this.css.minActionNode);
  130. if (this.restoreActionNode) this.restoreActionNode.setStyles(this.css.restoreActionNode);
  131. if (this.app == this.app.desktop.currentApp){
  132. this.node.setStyles(this.css.current);
  133. this.spacer.setStyles(this.css.spacerCurrent);
  134. }else{
  135. this.node.setStyles(this.css.uncurrent);
  136. this.spacer.setStyles(this.css.spacerUncurrent);
  137. }
  138. this.setContentSize();
  139. }.bind(this)
  140. });
  141. request.send();
  142. },
  143. setNodeStyleStatus: function(obj){
  144. this.css.to.height = obj.nodeTo.height;
  145. this.css.to.width = obj.nodeTo.width;
  146. this.css.to.top = obj.nodeTo.top;
  147. this.css.to.left = obj.nodeTo.left;
  148. this.css.to["z-index"] = obj.nodeTo["z-index"];
  149. this.css.from.top = obj.nodeFrom.top;
  150. this.css.from.left = obj.nodeFrom.left;
  151. this.css.from["z-index"] = obj.nodeFrom["z-index"];
  152. this.css.spacerTo.height = obj.spacerTo.height;
  153. this.css.spacerTo.width = obj.spacerTo.width;
  154. this.css.spacerTo.top = obj.spacerTo.top;
  155. this.css.spacerTo.left = obj.spacerTo.left;
  156. this.css.spacerTo["z-index"] = obj.spacerTo["z-index"];
  157. this.css.spacerFrom.top = obj.spacerFrom.top;
  158. this.css.spacerFrom.left = obj.spacerFrom.left;
  159. this.css.spacerFrom["z-index"] = obj.spacerFrom["z-index"];
  160. },
  161. getNodeStyleStatus: function(){
  162. return {
  163. "nodeTo": {
  164. "height": this.css.to.height,
  165. "width": this.css.to.width,
  166. "top": this.css.to.top,
  167. "left": this.css.to.left,
  168. "z-index": this.css.to["z-index"]
  169. },
  170. "nodeFrom": {
  171. "top": this.css.from.top,
  172. "left": this.css.from.left,
  173. "z-index": this.css.from["z-index"]
  174. },
  175. "spacerTo": {
  176. "height": this.css.spacerTo.height,
  177. "width": this.css.spacerTo.width,
  178. "top": this.css.spacerTo.top,
  179. "left": this.css.spacerTo.left,
  180. "z-index": this.css.spacerTo["z-index"]
  181. },
  182. "spacerFrom": {
  183. "top": this.css.spacerFrom.top,
  184. "left": this.css.spacerFrom.left,
  185. "z-index": this.css.spacerFrom["z-index"]
  186. }
  187. };
  188. },
  189. reStyle: function(options){
  190. if (options) this.setOptions(options);
  191. var index = null;
  192. if (MWF.xDesktop.zIndexPool) index = MWF.xDesktop.zIndexPool.applyZindex();
  193. this.css.to.height = this.options.height+"px";
  194. this.css.to.width = this.options.width+"px";
  195. this.css.to.top = this.options.top+"px";
  196. this.css.to.left = this.options.left+"px";
  197. // this.css.to.top = this.options.top+"px";
  198. this.css.from.top = this.options.fromTop+"px";
  199. this.css.from.left = this.options.fromLeft+"px";
  200. if (index){
  201. this.css.from["z-index"] = index+1;
  202. this.css.to["z-index"] = index+1;
  203. }
  204. if (this.node) this.node.set("styles", this.css.from);
  205. this.css.spacerTo.height = this.options.height+"px";
  206. this.css.spacerTo.width = this.options.width+"px";
  207. this.css.spacerTo.top = this.options.top+"px";
  208. this.css.spacerTo.left = this.options.left+"px";
  209. // this.css.spacerTo.top = this.options.top+"px";
  210. this.css.spacerFrom.top = this.options.fromTop+"px";
  211. this.css.spacerFrom.left = this.options.fromLeft+"px";
  212. if (index){
  213. this.css.spacerFrom["z-index"] = index;
  214. this.css.spacerTo["z-index"] = index;
  215. }
  216. if (this.spacer) this.spacer.set("styles", this.css.spacerFrom);
  217. },
  218. setCurrent: function(){
  219. if (MWF.xDesktop.zIndexPool){
  220. var index = this.node.getStyle("z-index").toFloat()+1;
  221. if (index < MWF.xDesktop.zIndexPool.zIndex){
  222. var newIndex = MWF.xDesktop.zIndexPool.applyZindex();
  223. this.css.spacerTo["z-index"] = newIndex;
  224. this.css.spacerFrom["z-index"] = newIndex;
  225. // if(this.spacerMorph){
  226. // if (this.spacerMorph.isRunning()){
  227. // this.spacerMorph.chain(function(){
  228. // if (this.spacer) this.spacer.setStyle("z-index", newIndex);
  229. // }.bind(this));
  230. // }else{
  231. if (this.spacer) this.spacer.setStyle("z-index", newIndex);
  232. // }
  233. // }
  234. this.css.to["z-index"] = newIndex+1;
  235. this.css.from["z-index"] = newIndex+1;
  236. // if(this.morph){
  237. // if (this.morph.isRunning()){
  238. // this.morph.chain(function(){
  239. // this.node.setStyle("z-index", newIndex+1);
  240. // }.bind(this));
  241. // }else{
  242. this.node.setStyle("z-index", newIndex+1);
  243. // }
  244. // }
  245. }
  246. }
  247. this.node.setStyles(this.css.current);
  248. if (this.spacer) this.spacer.setStyles(this.css.spacerCurrent);
  249. },
  250. setUncurrent: function(){
  251. this.node.setStyles(this.css.uncurrent);
  252. if (this.spacer) this.spacer.setStyles(this.css.spacerUncurrent);
  253. },
  254. setTitleEvent: function(){
  255. this.node.addEvent("mousedown", function(){
  256. this.app.setCurrent();
  257. }.bind(this));
  258. this.containerDrag = new Drag(this.title, {
  259. "handle": this.title,
  260. "onStart": function(el, e){
  261. this.containerDrag.stop();
  262. var div = this.node.clone(false).inject($(document.body));
  263. var size = this.node.getSize();
  264. div.setStyles({
  265. "opacity": 0.7,
  266. "border": "2px dashed #999",
  267. "z-index": this.node.getStyle("z-index"),
  268. "width": size.x,
  269. "height": size.y,
  270. "background-color": "#CCC",
  271. "position": "absolute"
  272. });
  273. div.position({
  274. relativeTo: this.node,
  275. position: 'upperLeft',
  276. edge: 'upperLeft'
  277. });
  278. var drag = new Drag.Move(div, {
  279. "onStart": function(){
  280. //this.node.setStyle("display", "none");
  281. this.node.fade("out");
  282. this.spacer.fade("out");
  283. }.bind(this),
  284. "onDrop": function(dragging, inObj, e){
  285. this.node.fade("in");
  286. this.spacer.fade(this.css.spacerTo.opacity);
  287. this.node.position({
  288. relativeTo: dragging,
  289. position: 'upperLeft',
  290. edge: 'upperLeft'
  291. });
  292. var p = this.node.getPosition();
  293. this.spacer.setStyles({
  294. "top": p.y,
  295. "left": p.x
  296. });
  297. this.css.spacerTo.left = p.x;
  298. this.css.spacerTo.top = p.y;
  299. this.css.to.left = p.x;
  300. this.css.to.top = p.y;
  301. dragging.destroy();
  302. this.fireEvent("moveDrop", [e]);
  303. }.bind(this),
  304. "onCancel": function(dragging){
  305. dragging.destroy();
  306. drag = null;
  307. }
  308. });
  309. drag.start(e);
  310. }.bind(this)
  311. });
  312. //this.title.addEvent("mousedown", function(e){
  313. //}.bind(this));
  314. //this.containerDrag = new Drag.Move(this.node, {
  315. // "limit": {"x": [null, null], "y": [0, null]},
  316. // "handle": this.title,
  317. // "onDrag": function(){
  318. // var p = this.node.getPosition();
  319. // if (this.spacer){
  320. // this.spacer.setStyles({
  321. // "top": p.y,
  322. // "left": p.x
  323. // });
  324. // this.css.spacerTo.left = p.x;
  325. // this.css.spacerTo.top = p.y;
  326. // };
  327. // this.css.to.left = p.x;
  328. // this.css.to.top = p.y;
  329. // }.bind(this)
  330. //});
  331. if (this.options.isResize){
  332. this.node.makeResizable({
  333. "handle": this.resizeNode || this.bottom,
  334. "limit": {x:[200, null], y:[200, null]},
  335. "onDrag": function(){
  336. var size = this.node.getComputedSize();
  337. if (this.spacer){
  338. this.spacer.setStyles({
  339. "width": size.width,
  340. "height": size.height
  341. });
  342. this.css.spacerTo.width = size.width;
  343. this.css.spacerTo.height = size.height;
  344. }
  345. this.css.to.width = size.width;
  346. this.css.to.height = size.height;
  347. this.setContentSize(size.height, size.width);
  348. this.fireEvent("resize");
  349. }.bind(this),
  350. "onComplete": function(){
  351. this.fireEvent("resizeCompleted");
  352. }.bind(this)
  353. });
  354. }
  355. },
  356. getContentUrl: function(){
  357. if (layout.desktop.windowCss){
  358. this.contentUrl = MWF.defaultPath+"/xDesktop/$Window/desktop_default/dialog.html";
  359. }else{
  360. this.contentUrl = MWF.defaultPath+"/xDesktop/$Window/"+this.options.style+"/dialog.html";
  361. }
  362. },
  363. _loadCss: function(){
  364. if (this.app.desktop.windowCss){
  365. this.css = this.app.desktop.windowCss;
  366. }else{
  367. this.path = MWF.defaultPath+"/xDesktop/$Window/";
  368. this.cssPath = MWF.defaultPath+"/xDesktop/$Window/"+this.options.style+"/css.wcss";
  369. var r = new Request.JSON({
  370. url: this.cssPath,
  371. secure: false,
  372. async: false,
  373. method: "get",
  374. noCache: true,
  375. onSuccess: function(responseJSON, responseText){
  376. this.css = responseJSON;
  377. }.bind(this),
  378. onError: function(text, error){
  379. alert(text);
  380. }
  381. });
  382. r.send();
  383. }
  384. },
  385. getSpacer: function(){
  386. if (!this.spacer){
  387. this.spacer = new Element("div", {
  388. styles: this.css.spacerFrom
  389. }).inject(this.options.container || $(document.body));
  390. }
  391. },
  392. showNoAnimation: function(max, hide){
  393. if (max){
  394. this.showMaxIm();
  395. }else if (hide){
  396. this.showIm();
  397. this.hideIm();
  398. }else{
  399. this.showIm();
  400. }
  401. },
  402. showMaxIm: function(callback){
  403. this.querySetMaxStyle();
  404. this.getSpacer();
  405. this.spacer.setStyle("display", "block");
  406. this.node.setStyle("display", "block");
  407. var size = this.getMaxSize();
  408. var spacerTo = Object.clone(this.css.spacerTo);
  409. var to = Object.clone(this.css.to);
  410. var contentTo = {};
  411. spacerTo.top = size.position.y;
  412. spacerTo.left = size.position.x;
  413. spacerTo.width = size.spacer.x;
  414. spacerTo.height = size.spacer.y;
  415. to.top = size.position.y;
  416. to.left = size.position.x;
  417. to.width = size.node.x;
  418. to.height = size.node.y;
  419. contentTo = size.contentSize;
  420. if (this.fireEvent("queryShow")){
  421. this.fireEvent("queryMax");
  422. this.node.setStyles(to);
  423. this.spacer.setStyles(spacerTo);
  424. this.content.setStyles(contentTo);
  425. if (this.titleText) this.getTitle();
  426. this.isMax = true;
  427. this.isHide = false;
  428. if (this.containerDrag) this.containerDrag.detach();
  429. this.postSetMaxStyle();
  430. if (callback) callback();
  431. this.fireEvent("postShow");
  432. this.fireEvent("postMax");
  433. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.restoreActionNode);
  434. }
  435. },
  436. showIm: function(){
  437. if (this.options.mark) this._markShow();
  438. this.getSpacer();
  439. this.spacer.setStyle("display", "block");
  440. this.node.setStyle("display", "block");
  441. var contentSize = this.getContentSize(this.css.to.height.toFloat(), this.css.to.width.toFloat());
  442. if (this.fireEvent("queryShow")){
  443. this.spacer.setStyles(this.css.spacerTo);
  444. if (this.app.desktop.currentApp!=this.app) this.spacer.setStyles(this.css.spacerUncurrent);
  445. this.content.setStyles(contentSize);
  446. this.node.setStyles(this.css.to);
  447. if (this.titleText) this.getTitle();
  448. this.isHide = false;
  449. if (this.containerDrag) this.containerDrag.attach();
  450. this.fireEvent("postShow");
  451. }
  452. },
  453. show: function(){
  454. if (this.options.mark) this._markShow();
  455. if (!this.morph){
  456. this.morph = new Fx.Morph(this.node, {duration: 100, link: "chain"});
  457. }
  458. this.morph.setOptions({duration: 50});
  459. this.getSpacer();
  460. if (!this.spacerMorph){
  461. this.spacerMorph = new Fx.Morph(this.spacer, {duration: 100, link: "chain"});
  462. }
  463. this.spacerMorph.setOptions({duration: 50});
  464. if (!this.contentMorph){
  465. this.contentMorph = new Fx.Morph(this.content, {duration: 50, link: "chain"});
  466. }
  467. this.contentMorph.setOptions({duration: 50});
  468. this.spacer.setStyle("display", "block");
  469. this.node.setStyle("display", "block");
  470. var contentSize = this.getContentSize(this.css.to.height.toFloat(), this.css.to.width.toFloat());
  471. if (this.fireEvent("queryShow")){
  472. var nodeFinish = false;
  473. var spacerFinish = false;
  474. var contentFinish = false;
  475. this.spacerMorph.start(this.css.spacerTo).chain(function(){
  476. if (this.app.desktop.currentApp!=this.app) this.spacer.setStyles(this.css.spacerUncurrent);
  477. spacerFinish = true;
  478. firePost();
  479. }.bind(this));
  480. this.contentMorph.start(contentSize).chain(function(){
  481. contentFinish = true;
  482. firePost();
  483. }.bind(this));
  484. this.morph.start(this.css.to).chain(function(){
  485. nodeFinish = true;
  486. firePost();
  487. }.bind(this));
  488. var firePost = function(){
  489. if (nodeFinish && spacerFinish && contentFinish){
  490. if (this.titleText) this.getTitle();
  491. this.isHide = false;
  492. if (this.containerDrag) this.containerDrag.attach();
  493. this.fireEvent("postShow");
  494. // if (this.isMax){
  495. // this.isMax = false;
  496. // this.app.maxSize();
  497. // }
  498. }
  499. }.bind(this);
  500. }
  501. },
  502. restore: function(callback){
  503. this.querySetRestoreStyle();
  504. if (this.options.mark) this._markShow();
  505. if (!this.morph){
  506. this.morph = new Fx.Morph(this.node, {duration: 100, link: "chain"});
  507. }
  508. this.morph.setOptions({duration: 50});
  509. this.getSpacer();
  510. if (!this.spacerMorph){
  511. this.spacerMorph = new Fx.Morph(this.spacer, {duration: 100, link: "chain"});
  512. }
  513. this.spacerMorph.setOptions({duration: 50});
  514. if (!this.contentMorph){
  515. this.contentMorph = new Fx.Morph(this.content, {duration: 50, link: "chain"});
  516. }
  517. this.contentMorph.setOptions({duration: 50});
  518. this.spacer.setStyle("display", "block");
  519. this.node.setStyle("display", "block");
  520. var contentSize = this.getContentSize(this.css.to.height.toFloat(), this.css.to.width.toFloat());
  521. if (this.fireEvent("queryRestore")){
  522. var nodeFinish = false;
  523. var spacerFinish = false;
  524. var contentFinish = false;
  525. this.spacerMorph.start(this.css.spacerTo).chain(function(){
  526. if (this.app.desktop.currentApp!=this.app) this.spacer.setStyles(this.css.spacerUncurrent);
  527. spacerFinish = true;
  528. firePost();
  529. }.bind(this));
  530. this.contentMorph.start(contentSize).chain(function(){
  531. contentFinish = true;
  532. firePost();
  533. }.bind(this));
  534. this.morph.start(this.css.to).chain(function(){
  535. if (this.app.desktop.currentApp!=this.app) this.node.setStyles(this.css.uncurrent);
  536. nodeFinish = true;
  537. firePost();
  538. }.bind(this));
  539. var firePost = function(){
  540. if (nodeFinish && spacerFinish && contentFinish){
  541. if (this.titleText) this.getTitle();
  542. this.isHide = false;
  543. this.isMax = false;
  544. if (this.containerDrag) this.containerDrag.attach();
  545. this.postSetRestoreStyle();
  546. if (callback) callback();
  547. this.fireEvent("resize");
  548. this.fireEvent("postRestore");
  549. }
  550. }.bind(this);
  551. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.maxActionNode);
  552. }
  553. },
  554. querySetRestoreStyle: function(){
  555. if (this.css.windowTitleRestore) this.title.setStyles(this.css.windowTitleRestore);
  556. if (this.css.titleRefresh) this.titleRefresh.setStyles(this.css.titleRefresh);
  557. if (this.css.windowTitleTextRestore) this.titleText.setStyles(this.css.windowTitleTextRestore);
  558. if (this.css.windowTitleActionRestore) this.titleAction.setStyles(this.css.windowTitleActionRestore);
  559. if (this.closeActionNode){
  560. if (this.css.closeActionNode) this.closeActionNode.setStyles(this.css.closeActionNode);
  561. }
  562. if (this.maxActionNode){
  563. if (this.css.maxActionNode) this.maxActionNode.setStyles(this.css.maxActionNode);
  564. }
  565. if (this.minActionNode){
  566. if (this.css.minActionNode) this.minActionNode.setStyles(this.css.minActionNode);
  567. }
  568. },
  569. postSetRestoreStyle: function(){
  570. if (this.css.windowNodeRestore) this.node.setStyles(this.css.windowNodeRestore);
  571. },
  572. restoreIm: function(callback){
  573. this.querySetRestoreStyle();
  574. this.getSpacer();
  575. this.spacer.setStyle("display", "block");
  576. this.node.setStyle("display", "block");
  577. var contentSize = this.getContentSize(this.css.to.height.toFloat(), this.css.to.width.toFloat());
  578. if (this.fireEvent("queryRestore")){
  579. this.node.setStyles(this.css.to);
  580. this.spacer.setStyles(this.css.spacerTo);
  581. this.content.setStyles(contentSize);
  582. if (this.titleText) this.getTitle();
  583. this.isHide = false;
  584. this.isMax = false;
  585. if (this.containerDrag) this.containerDrag.attach();
  586. this.postSetRestoreStyle();
  587. if (callback) callback();
  588. this.fireEvent("resize");
  589. this.fireEvent("postRestore");
  590. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.maxActionNode);
  591. }
  592. },
  593. hideIm: function(x, y, callback) {
  594. this.getSpacer();
  595. if (x){
  596. this.css.from.left = x;
  597. this.css.spacerFrom.left = x;
  598. }
  599. if (y){
  600. this.css.from.top = y;
  601. this.css.spacerFrom.top = y;
  602. }
  603. if (this.fireEvent("queryHide")){
  604. if (this.titleText) this.titleText.set("text", "");
  605. if (this.button) this.button.set("html", "");
  606. this.spacer.setStyles(this.css.spacerFrom);
  607. this.node.setStyles(this.css.from);
  608. this._markHide();
  609. this.isHide = true;
  610. this.node.setStyle("display", "none");
  611. this.spacer.setStyle("display", "none");
  612. if (callback) callback();
  613. this.fireEvent("postHide");
  614. }
  615. },
  616. hide: function(x, y, callback) {
  617. if (!this.morph){
  618. this.morph = new Fx.Morph(this.node, {duration: 100, link: "chain"});
  619. }
  620. this.morph.setOptions({duration: 100});
  621. this.getSpacer();
  622. if (!this.spacerMorph){
  623. this.spacerMorph = new Fx.Morph(this.spacer, {duration: 100, link: "chain"});
  624. }
  625. this.spacerMorph.setOptions({duration: 100});
  626. if (x){
  627. this.css.from.left = x;
  628. this.css.spacerFrom.left = x;
  629. }
  630. if (y){
  631. this.css.from.top = y;
  632. this.css.spacerFrom.top = y;
  633. }
  634. if (this.fireEvent("queryHide")){
  635. if (this.titleText) this.titleText.set("text", "");
  636. if (this.button) this.button.set("html", "");
  637. var nodeFinish = false;
  638. var spacerFinish = false;
  639. this.spacerMorph.start(this.css.spacerFrom).chain(function(){
  640. spacerFinish = true;
  641. firePost();
  642. }.bind(this));
  643. this.morph.start(this.css.from).chain(function(){
  644. nodeFinish = true;
  645. firePost();
  646. }.bind(this));
  647. var firePost = function(){
  648. if (nodeFinish && spacerFinish){
  649. this._markHide();
  650. this.isHide = true;
  651. this.node.setStyle("display", "none");
  652. this.spacer.setStyle("display", "none");
  653. if (callback) callback();
  654. this.fireEvent("postHide");
  655. }
  656. }.bind(this);
  657. }
  658. },
  659. _hideIm: function(){
  660. this.node.setStyle("display", "none");
  661. this.spacer.setStyle("display", "none");
  662. },
  663. _showIm: function(){
  664. this.node.setStyle("display", "block");
  665. this.spacer.setStyle("display", "block");
  666. },
  667. _fadeOut: function(){
  668. this.node.fade("out");
  669. this.spacer.fade("out");
  670. },
  671. _fadeIn: function(){
  672. this.node.fade("in");
  673. this.spacer.fade("in");
  674. },
  675. close: function(callback){
  676. if (!this.morph){
  677. this.morph = new Fx.Morph(this.node, {duration: 100, link: "chain"});
  678. }
  679. this.morph.setOptions({duration: 100});
  680. this.getSpacer();
  681. if (!this.spacerMorph){
  682. this.spacerMorph = new Fx.Morph(this.spacer, {duration: 100, link: "chain"});
  683. }
  684. this.spacerMorph.setOptions({duration: 100});
  685. if (this.fireEvent("queryClose")){
  686. //this.spacerMorph.start(this.css.spacerFrom).chain(function(){
  687. // this.spacer.destroy();
  688. // this.spacer = null;
  689. //}.bind(this));
  690. //
  691. //this.morph.start(this.css.from).chain(function(){
  692. // this._markHide();
  693. // this.node.destroy();
  694. // this.node = null;
  695. // if (callback) callback();
  696. // this.fireEvent("postClose");
  697. //}.bind(this));
  698. this.spacer.destroy();
  699. this.spacer = null;
  700. this._markHide();
  701. this.node.destroy();
  702. this.node = null;
  703. if (callback) callback();
  704. this.fireEvent("postClose");
  705. }
  706. },
  707. getAction: function(){
  708. this.titleAction.setStyles(this.css.titleAction);
  709. var _self = this;
  710. this.closeActionNode = new Element("div", {
  711. "styles": this.css.closeActionNode,
  712. "events": {
  713. "mouseover": function(e){this.setStyles(_self.css.titleActionOver);e.stopPropagation();},
  714. "mouseout": function(e){this.setStyles(_self.css.titleActionOut);e.stopPropagation();},
  715. "mousedown": function(e){this.setStyles(_self.css.titleActionDown);e.stopPropagation();},
  716. "mouseup": function(e){this.setStyles(_self.css.titleActionOver);e.stopPropagation();},
  717. "click": function(e){
  718. this.app.close();
  719. e.stopPropagation();
  720. }.bind(this)
  721. }
  722. }).inject(this.titleAction);
  723. if (this.options.isMax!=false){
  724. this.maxActionNode = new Element("div", {
  725. "styles": this.css.maxActionNode,
  726. "events": {
  727. "mouseover": function(){this.setStyles(_self.css.titleActionOver);},
  728. "mouseout": function(){this.setStyles(_self.css.titleActionOut);},
  729. "mousedown": function(){this.setStyles(_self.css.titleActionDown);},
  730. "mouseup": function(){this.setStyles(_self.css.titleActionOver);},
  731. "click": function(){
  732. this.app.maxOrRestoreSize();
  733. }.bind(this)
  734. }
  735. }).inject(this.titleAction);
  736. }
  737. if (this.options.isResize){
  738. this.title.addEvent("dblclick", this.app.maxOrRestoreSize.bind(this.app));
  739. }
  740. this.minActionNode = new Element("div", {
  741. "styles": this.css.minActionNode,
  742. "events": {
  743. "mouseover": function(){this.setStyles(_self.css.titleActionOver);},
  744. "mouseout": function(){this.setStyles(_self.css.titleActionOut);},
  745. "mousedown": function(){this.setStyles(_self.css.titleActionDown);},
  746. "mouseup": function(){this.setStyles(_self.css.titleActionOver);},
  747. "click": function(){
  748. this.app.minSize();
  749. }.bind(this)
  750. }
  751. }).inject(this.titleAction);
  752. if (this.options.isRefresh!=false){
  753. this.titleRefresh.addEvents({
  754. "mouseover": function(){this.setStyles(_self.css.titleActionOver);},
  755. "mouseout": function(){this.setStyles(_self.css.titleActionOut);},
  756. "mousedown": function(){this.setStyles(_self.css.titleActionDown);},
  757. "mouseup": function(){this.setStyles(_self.css.titleActionOver);},
  758. "click": function(e){
  759. this.app.refresh();
  760. }.bind(this),
  761. "dblclick": function(e){
  762. e.stopPropagation();
  763. }.bind(this)
  764. });
  765. }
  766. },
  767. maxOrRestoreSize: function(callback){
  768. if (this.isMax){
  769. this.restoreSize(callback);
  770. }else{
  771. this.maxSize(callback);
  772. }
  773. },
  774. restoreSize: function(callback){
  775. this.restore(callback);
  776. },
  777. maxSize: function(callback){
  778. this.querySetMaxStyle();
  779. if (!this.morph){
  780. this.morph = new Fx.Morph(this.node, {duration: 50, link: "chain"});
  781. }
  782. this.morph.setOptions({duration: 50});
  783. this.getSpacer();
  784. if (!this.spacerMorph){
  785. this.spacerMorph = new Fx.Morph(this.spacer, {duration: 50, link: "chain"});
  786. }
  787. this.spacerMorph.setOptions({duration: 50});
  788. if (!this.contentMorph){
  789. this.contentMorph = new Fx.Morph(this.content, {duration: 50, link: "chain"});
  790. }
  791. this.contentMorph.setOptions({duration: 50});
  792. this.spacer.setStyle("display", "block");
  793. this.node.setStyle("display", "block");
  794. var size = this.getMaxSize();
  795. var spacerTo = Object.clone(this.css.spacerTo);
  796. var to = Object.clone(this.css.to);
  797. var contentTo = {};
  798. spacerTo.top = size.position.y;
  799. spacerTo.left = size.position.x;
  800. spacerTo.width = size.spacer.x;
  801. spacerTo.height = size.spacer.y;
  802. to.top = size.position.y;
  803. to.left = size.position.x;
  804. to.width = size.node.x;
  805. to.height = size.node.y;
  806. contentTo = size.contentSize;
  807. if (this.fireEvent("queryMax")){
  808. var nodeFinish = false;
  809. var spacerFinish = false;
  810. var contentFinish = false;
  811. this.spacerMorph.start(spacerTo).chain(function(){
  812. if (this.app.desktop.currentApp!=this.app) this.spacer.setStyles(this.css.spacerUncurrent);
  813. spacerFinish = true;
  814. firePost();
  815. }.bind(this));
  816. this.contentMorph.start(contentTo).chain(function(){
  817. contentFinish = true;
  818. firePost();
  819. }.bind(this));
  820. this.morph.start(to).chain(function(){
  821. if (this.app.desktop.currentApp!=this.app) this.node.setStyles(this.css.uncurrent);
  822. nodeFinish = true;
  823. firePost();
  824. }.bind(this));
  825. var firePost = function(){
  826. if (nodeFinish && spacerFinish && contentFinish){
  827. if (this.titleText) this.getTitle();
  828. this.isMax = true;
  829. this.isHide = false;
  830. if (this.containerDrag) this.containerDrag.detach();
  831. this.postSetMaxStyle();
  832. if (callback) callback();
  833. this.fireEvent("resize");
  834. this.fireEvent("postMax");
  835. }
  836. }.bind(this);
  837. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.restoreActionNode);
  838. }
  839. },
  840. querySetMaxStyle: function(){
  841. if (this.css.windowTitleMax) this.title.setStyles(this.css.windowTitleMax);
  842. if (this.css.windowTitleRefreshMax) this.titleRefresh.setStyles(this.css.windowTitleRefreshMax);
  843. if (this.css.windowTitleTextMax) this.titleText.setStyles(this.css.windowTitleTextMax);
  844. if (this.css.windowTitleActionMax) this.titleAction.setStyles(this.css.windowTitleActionMax);
  845. if (this.closeActionNode){
  846. if (this.css.windowActionNodeMax) this.closeActionNode.setStyles(this.css.windowActionNodeMax);
  847. }
  848. if (this.maxActionNode){
  849. if (this.css.windowActionNodeMax) this.maxActionNode.setStyles(this.css.windowActionNodeMax);
  850. }
  851. if (this.minActionNode){
  852. if (this.css.windowActionNodeMax) this.minActionNode.setStyles(this.css.windowActionNodeMax);
  853. }
  854. },
  855. postSetMaxStyle: function(){
  856. if (this.css.windowNodeMax) this.node.setStyles(this.css.windowNodeMax);
  857. },
  858. maxSizeIm: function(callback){
  859. this.querySetMaxStyle();
  860. this.getSpacer();
  861. this.spacer.setStyle("display", "block");
  862. this.node.setStyle("display", "block");
  863. var size = this.getMaxSize();
  864. var spacerTo = Object.clone(this.css.spacerTo);
  865. var to = Object.clone(this.css.to);
  866. var contentTo = {};
  867. spacerTo.top = size.position.y;
  868. spacerTo.left = size.position.x;
  869. spacerTo.width = size.spacer.x;
  870. spacerTo.height = size.spacer.y;
  871. to.top = size.position.y;
  872. to.left = size.position.x;
  873. to.width = size.node.x;
  874. to.height = size.node.y;
  875. contentTo = size.contentSize;
  876. if (this.fireEvent("queryMax")){
  877. this.node.setStyles(to);
  878. this.spacer.setStyles(spacerTo);
  879. this.content.setStyles(contentTo);
  880. if (this.titleText) this.getTitle();
  881. this.isMax = true;
  882. this.isHide = false;
  883. if (this.containerDrag) this.containerDrag.detach();
  884. this.postSetMaxStyle();
  885. if (callback) callback();
  886. this.fireEvent("resize");
  887. this.fireEvent("postMax");
  888. if (this.maxActionNode) this.maxActionNode.setStyles(this.css.restoreActionNode);
  889. }
  890. },
  891. getMaxSize: function(){
  892. debugger;
  893. var size = layout.desktop.desktopNode.getSize();
  894. var position = layout.desktop.desktopNode.getPosition();
  895. var pt = this.spacer.getStyle("padding-top").toFloat();
  896. var pb = this.spacer.getStyle("padding-bottom").toFloat();
  897. var pl = this.spacer.getStyle("padding-left").toFloat();
  898. var pr = this.spacer.getStyle("padding-right").toFloat();
  899. spacerHeight = size.y-pt-pb;
  900. spacerWidth = size.x-pl-pr;
  901. pt = this.node.getStyle("padding-top").toFloat();
  902. pb = this.node.getStyle("padding-bottom").toFloat();
  903. pl = this.node.getStyle("padding-left").toFloat();
  904. pr = this.node.getStyle("padding-right").toFloat();
  905. nodeHeight = size.y-pt-pb;
  906. nodeWidth = size.x-pl-pr;
  907. var contentSize = this.getContentSize(nodeHeight, nodeWidth);
  908. return {"node": {"x": nodeWidth, "y": nodeHeight}, "spacer": {"x": spacerWidth, "y": spacerHeight}, "position": {"x": position.x, "y": position.y}, "contentSize": contentSize};
  909. }
  910. });
  911. MWF.xDesktop.WindowTransparent = new Class({
  912. Implements: [Options, Events],
  913. options: {
  914. "style": "default"
  915. },
  916. initialize: function(app, options){
  917. this.setOptions(options);
  918. var position = layout.desktop.desktopNode.getPosition();
  919. this.app = app;
  920. this.fireEvent("queryLoad");
  921. this.isMax = false;
  922. this.isHide = false;
  923. this.css = {
  924. "to": {"width": "0", "height": "0", "left": "0", "top": "0"}
  925. };
  926. var index = null;
  927. if (MWF.xDesktop.zIndexPool) index = MWF.xDesktop.zIndexPool.applyZindex();
  928. this.node = new Element("div", {
  929. "styles":{
  930. "width": "0px",
  931. "height": "0px",
  932. "top": "0px",
  933. "left": "0px",
  934. "position": "absolute",
  935. "z-index": (index)? index : 100
  936. }
  937. }).inject(this.options.container || $(document.body));
  938. this.content = new Element("div", {
  939. "styles": {"width": "100%", "height": "100%"}
  940. }).inject(this.node);
  941. this.fireEvent("postLoad");
  942. },
  943. show: function(){
  944. this.fireEvent("queryShow");
  945. this.node.setStyle("display", "block");
  946. this.isHide = false;
  947. this.fireEvent("postShow");
  948. },
  949. hide: function(){
  950. this.fireEvent("queryHide");
  951. this.node.setStyle("display", "none");
  952. this.isHide = true;
  953. this.fireEvent("postHide");
  954. },
  955. restore: function(callback) {
  956. this.fireEvent("queryRestore");
  957. this.node.setStyle("display", "block");
  958. this.isHide = false;
  959. this.fireEvent("postRestore");
  960. if (callback) callback();
  961. },
  962. restoreSize: function(callback){
  963. this.restore(callback);
  964. },
  965. close: function(callback){
  966. this.fireEvent("queryClose");
  967. this.node.destroy();
  968. this.node = null;
  969. this.content = null;
  970. delete this;
  971. if (callback) callback();
  972. this.fireEvent("postClose");
  973. },
  974. maxOrRestoreSize: function(callback){
  975. if (this.isMax){
  976. this.restoreSize(callback);
  977. }else{
  978. this.maxSize(callback);
  979. }
  980. },
  981. maxSize: function(callback){
  982. this.fireEvent("queryMax");
  983. this.node.setStyle("display", "block");
  984. this.isHide = false;
  985. this.fireEvent("resize");
  986. this.fireEvent("postMax");
  987. if (callback) callback();
  988. },
  989. restoreIm: function(){
  990. this.restore();
  991. },
  992. maxSizeIm: function(){
  993. this.maxSize();
  994. },
  995. setCurrent: function(){
  996. if (MWF.xDesktop.zIndexPool){
  997. var index = this.node.getStyle("z-index").toFloat()+1;
  998. if (index < MWF.xDesktop.zIndexPool.zIndex){
  999. var newIndex = MWF.xDesktop.zIndexPool.applyZindex();
  1000. this.node.setStyle("z-index", newIndex);
  1001. }
  1002. }
  1003. },
  1004. _fadeOut: function(){
  1005. this.node.fade("out");
  1006. if (this.spacer) this.spacer.fade("out");
  1007. },
  1008. _fadeIn: function(){
  1009. this.node.fade("in");
  1010. if (this.spacer) this.spacer.fade("in");
  1011. },
  1012. setUncurrent: function(){},
  1013. reStyle: function(){},
  1014. changeStyle: function(){}
  1015. });