1 /**
  2  * flash dialog
  3  * @author yiminghe@gmail.com
  4  */
  5 KISSY.add("editor/plugin/flash/dialog", function (S, Editor, flashUtils, Overlay4E, MenuButton) {
  6     var CLS_FLASH = 'ke_flash',
  7         TYPE_FLASH = 'flash',
  8         Dialog = Overlay4E.Dialog,
  9         TIP = "请输入如 http://www.xxx.com/xxx.swf",
 10         MIDDLE = "vertical-align:middle",
 11         bodyHtml = "<div style='padding:20px 20px 0 20px'>" +
 12             "<p>" +
 13             "<label>网址: " +
 14             "<input " +
 15             " data-verify='^https?://[^\\s]+$' " +
 16             " data-warning='网址格式为:http://' " +
 17             "class='ks-editor-flash-url ks-editor-input' style='width:300px;" +
 18             MIDDLE + "' />" +
 19             "</label>" +
 20             "</p>" +
 21             "<table style='margin:10px 0 5px  40px;width:300px;'>" +
 22             "<tr>" +
 23             "<td>" +
 24             "<label>宽度: " +
 25             "<input " +
 26             " data-verify='^(?!0$)\\d+$' " +
 27             " data-warning='宽度请输入正整数' " +
 28             "class='ks-editor-flash-width ks-editor-input' style='width:60px;" +
 29             "margin-left:2px;" +
 30             MIDDLE + "' /> 像素 </label>" +
 31             "</td>" +
 32             "<td>" +
 33             "<label>高度:<input " +
 34             " data-verify='^(?!0$)\\d+$' " +
 35             " data-warning='高度请输入正整数' " +
 36             "class='ks-editor-flash-height ks-editor-input' " +
 37             "style='width:60px;" +
 38             MIDDLE + "' /> 像素 </label></td>" +
 39             "</tr>" +
 40             "<tr>" +
 41             "<td>" +
 42             "<label>对齐: " +
 43             "<select class='ks-editor-flash-align' title='对齐'>" +
 44             "<option value='none'>无</option>" +
 45             "<option value='left'>左对齐</option>" +
 46             "<option value='right'>右对齐</option>" +
 47             "</select>" +
 48             "</td>" +
 49             "<td>" +
 50             "<label>间距:" +
 51             "<input " +
 52             " data-verify='^\\d+$' " +
 53             " data-warning='间距请输入非负整数' "
 54             + "class='ks-editor-flash-margin ks-editor-input' " +
 55             "style='width:60px;" +
 56             MIDDLE + "' value='"
 57             + 5 + "'/> 像素" +
 58             "</label>" +
 59             "</td></tr>" +
 60             "</table>" +
 61             "</div>",
 62         footHtml = "<div style='padding:5px 20px 20px;'><a " +
 63             "class='ks-editor-flash-ok ks-editor-button ks-inline-block' " +
 64             "style='margin-left:40px;margin-right:20px;'>确定</a> " +
 65             "<a class='ks-editor-flash-cancel ks-editor-button ks-inline-block'>取消</a></div>";
 66 
 67 
 68     function FlashDialog(editor, config) {
 69         var self = this;
 70         self.editor = editor;
 71         self.config = config || {};
 72         Editor.Utils.lazyRun(self, "_prepareShow", "_realShow");
 73         self._config();
 74     }
 75 
 76     S.augment(FlashDialog, {
 77         addRes:Editor.Utils.addRes,
 78         destroyRes:Editor.Utils.destroyRes,
 79         _config:function () {
 80             var self = this;
 81             self._urlTip = TIP;
 82             self._type = TYPE_FLASH;
 83             self._cls = CLS_FLASH;
 84             self._config_dwidth = "400px";
 85             self._title = "Flash";//属性";
 86             self._bodyHtml = bodyHtml;
 87             self._footHtml = footHtml;
 88         },
 89         //建立弹出窗口
 90         _prepareShow:function () {
 91             var self = this;
 92             self.dialog = new Dialog({
 93                 autoRender:true,
 94                 headerContent:self._title,
 95                 bodyContent:self._bodyHtml,
 96                 footerContent:self._footHtml,
 97                 width:self._config_dwidth || "500px",
 98                 mask:true
 99             });
100             self.addRes(self.dialog);
101             self._initD();
102         },
103         _realShow:function () {
104             //显示前就要内容搞好
105             this._updateD();
106             this.dialog.show();
107         },
108         /**
109          * 子类覆盖,如何从flash url得到合适的应用表示地址
110          * @override
111          * @param r flash 元素
112          */
113         _getFlashUrl:function (r) {
114             return flashUtils.getUrl(r);
115         },
116         /**
117          * 触发前初始化窗口 field,子类覆盖
118          * @override
119          */
120         _updateD:function () {
121             var self = this,
122                 editor = self.editor,
123                 cfg = self.config,
124                 f = self.selectedFlash;
125             if (f) {
126                 var r = editor.restoreRealElement(f);
127                 if (!r) {
128                     return;
129                 }
130                 if (f.css("width")) {
131                     self.dWidth.val(parseInt(f.css("width")));
132                 }
133                 if (f.css("height")) {
134                     self.dHeight.val(parseInt(f.css("height")));
135                 }
136                 self.dAlign.set("value", f.css("float"));
137                 Editor.Utils.valInput(self.dUrl, self._getFlashUrl(r));
138                 self.dMargin.val(parseInt(r.style("margin")) || 0);
139             } else {
140                 Editor.Utils.resetInput(self.dUrl);
141                 self.dWidth.val(cfg['defaultWidth'] || "");
142                 self.dHeight.val(cfg['defaultHeight'] || "");
143                 self.dAlign.set("value", "none");
144                 self.dMargin.val("5");
145             }
146         },
147         show:function (_selectedEl) {
148             var self = this;
149             self.selectedFlash = _selectedEl;
150             self._prepareShow();
151         },
152 
153 
154         /**
155          * 映射窗口field,子类覆盖
156          * @override
157          */
158         _initD:function () {
159             var self = this,
160                 d = self.dialog,
161                 el = d.get("el");
162             self.dHeight = el.one(".ks-editor-flash-height");
163             self.dWidth = el.one(".ks-editor-flash-width");
164             self.dUrl = el.one(".ks-editor-flash-url");
165             self.dAlign = MenuButton.Select.decorate(el.one(".ks-editor-flash-align"), {
166                 prefixCls:'ks-editor-big-',
167                 elAttrs:{
168                     hideFocus:"hideFocus"
169                 },
170                 width:80,
171                 menuCfg:{
172                     prefixCls:'ks-editor-',
173                     render:el
174                 }
175             });
176             self.dMargin = el.one(".ks-editor-flash-margin");
177             var action = el.one(".ks-editor-flash-ok"),
178                 cancel = el.one(".ks-editor-flash-cancel");
179             action.on("click", self._gen, self);
180             cancel.on("click", function (ev) {
181                 d.hide();
182                 ev && ev.halt();
183             });
184 
185             Editor.Utils.placeholder(self.dUrl, self._urlTip);
186             self.addRes(self.dAlign);
187         },
188 
189         /**
190          * 应用子类覆盖,提供 flash 元素的相关信息
191          * @override
192          */
193         _getDInfo:function () {
194             var self = this;
195             return {
196                 url:self.dUrl.val(),
197                 attrs:{
198                     width:self.dWidth.val(),
199                     height:self.dHeight.val(),
200                     style:"margin:" +
201                         (parseInt(self.dMargin.val()) || 0) +
202                         "px;" +
203                         "float:" + self.dAlign.get("value") + ";"
204                 }
205             };
206         },
207 
208         /**
209          * 真正产生 flash 元素
210          */
211         _gen:function (ev) {
212             ev && ev.halt();
213             var self = this,
214                 editor = self.editor,
215                 dinfo = self._getDInfo(),
216                 url = dinfo && S.trim(dinfo.url),
217                 attrs = dinfo && dinfo.attrs;
218             if (!dinfo) {
219                 return;
220             }
221             var re = Editor.Utils.verifyInputs(self.dialog.get("el").all("input"));
222             if (!re) {
223                 return;
224             }
225             self.dialog.hide();
226             var substitute = flashUtils.insertFlash(editor, url, attrs, self._cls, self._type);
227             //如果是修改,就再选中
228             if (self.selectedFlash) {
229                 editor.getSelection()
230                     .selectElement(substitute);
231             }
232             editor.notifySelectionChange();
233         },
234 
235         destroy:function () {
236             this.destroyRes();
237         }
238     });
239 
240     return FlashDialog;
241 }, {
242     requires:['editor', '../flashCommon/utils', '../overlay/', '../menubutton/']
243 });