【前言】
前一段时间，大约两个月前，本人仿照q+及网上同类程序开发了一个 类似于webos的程序，现在来谈谈开发过程中的难题及心得。
首先上一幅剧照：
【详细解析】
一、关于窗口尺寸变化的问题。
由于每个app的logo及背景图片及左侧工具栏都是用绝对定位的，所以每一次窗口发生变化就必须重新计算位置，但是，在传统的resize事件的响应上会有一个bug，每个浏览器都不止响应一次，，为了解决这个bug，可以用一个timer延迟resize事件的执行，只有在最后一次resize事件才开始执行重新计算位置的操作。
二、关于弹窗插件的痛苦选择及挣扎
来看看弹窗插件。
一开始我用的是lhgdialog，但是用着用着发现很多bug，然后我用了areowindow，效果是绚丽，但是也是非常不顺手，最后我自己用了lhgdialog的外表，aerowindow的逻辑，然后再改写了部分逻辑，添加上了二维数组的支持（原本我采用的是单个数组记录每一个弹窗的id，假如要关闭或者删除某个弹窗的话只需要知道这个id就ok了，但是后来由于需要支持多个屏幕的显示，而转到某个屏幕后该屏幕的弹窗完全显示出来，其他屏幕的弹窗必须隐藏，所以单个数组的id记录方式不可用，故我将一维数组改成了二维数组），当然，这个组件的尺寸计算我采用了最笨的方式，给定一个宽度及高度，组件自动计算各个部件的位置及高度宽度（譬如：标题栏的位置，左侧窗体边缘，右侧窗体边缘的高度等等，九宫格的部件都给我计算了）。
拖曳及resize事件也是支持的，但是由于弹窗用的是iframe，我发现在拖曳及resize经过iframe窗口内容时会出现卡的现象，这个问题在lhgdialog里面也出现，我后来试着拖曳的时候屏蔽掉iframe（用一个div放在上面），拖曳结束才重新显示iframe，结果卡，顿问题解决，下面是拖曳的效果示意图：
附带我在编写插件时候编写的解释：
openWindow:function(Options){var defaults = {WindowTitle:null,WindowPositionTop: 60,/* Posible are pixels or ‘center’ */WindowPositionLeft: 10,/* Posible are pixels or ‘center’ */WindowWidth:300,/* Only pixels */WindowHeight:300,/* Only pixels */WindowMinWidth:250,/* Only pixels */WindowMinHeight:0,/* Only pixels */WindowResizable:true,/* true, false*/WindowMaximize:true,/* true, false*/WindowMinimize:true,/* true, false*/WindowClosable:true,/* true, false*/WindowDraggable:true,/* true, false*/WindowStatus:’regular’,/* ‘regular’, ‘maximized’, ‘minimized’ */WindowAnimationSpeed: 500,beforeMinimize:function(){return true;},/*注意，这个是最小化之前的操作，假如返回的是true，那么就继续执行，否则，终止操作*/afterMinimize:function(){},/*最小化之后的操作*/beforeMaximize:function(){return true}, /*注意，这个是最大化之前的操作，假如返回的是true，那么就继续执行，否则，终止操作*/afterMaximize:function(){},/*最大化之后的操作*/beforeClose:function(){return true},/*注意，这个是关闭之前的操作，假如返回的是true，那么就继续执行，否则，终止操作*/afterClose:function(){},/*关闭之后的操作*/beforeRegular:function(){ return true;},/*恢复窗口之前，假如是false，则中断操作*/afterRegular:function(){},/*恢复窗口之后的后续操作*/WindowAnimation:’easeOutElastic’,/*见下面的解释*//*下面就是为了MGR而特定添加的参数*/WindowID:”,//–每一个WIndow的唯一ID。WindowCategory:"default",/*该window的分类，默认为default*/contentType:"html",/*显示的内容类型，有： html,dom,iframe,默认为html，假如是dom， 那么就会将dom复制一份然后显示出来，假如是iframe，那么就会自动生成iframe*/content:"",/*根据showType不同而不一样，假如是html，那么就直接是html了，假如是dom，那么就是$("xx")或者选择符号形式，假如是iframe，那么就是url形式了。*/appendToElement:$(‘body’),/*这里设定将新建的窗体原始对象添加到什么地方，默认是body，但是当需要用到多种屏幕多个窗体的时候，就必须设置为当前屏幕对象。*/screenElement:$(window)/*这里设定作为参考的屏幕元素，通常以 window为屏幕标准。*/};/*———————————————————————–
假如您对这个插件的编写有兴趣的话，可以参考我的系列博文：
前端插件】弹窗插件的编写【一】—编写一个窗体蓝本
【前端插件】弹窗插件的编写【二】—根据蓝本编写插件
三、右键菜单问题：
请看下面的右键菜单：
上面的右键菜单是来自iteye兄弟#comments
的一个组件，上面的分别为右击桌面及右击程序图标出现的右键菜单。我改了这个插件，让它可以生成多个不同的右键菜单，平时只显示特定id的菜单。
将来靠自己双掌;愿你用双掌开拓出美好的梦想。
