1 /** 2 * video dialog 3 * @author yiminghe@gmail.com 4 */ 5 KISSY.add("editor/plugin/video/dialog", function (S, Editor, FlashDialog, MenuButton) { 6 var CLS_VIDEO = "ke_video", 7 TYPE_VIDEO = "video", 8 DTIP = "自动", 9 MIDDLE = "vertical-align:middle;", 10 MARGIN_DEFAULT = 0, 11 bodyHtml = "<div style='padding:20px 20px 0 20px'>" + 12 "<p>" + 13 "<label>" + 14 "链接: " + 15 "" + 16 "<input " + 17 "class='ks-editor-video-url ks-editor-input' style='width:410px;" + 18 MIDDLE + "'/>" + 19 "</label>" + 20 "</p>" + 21 "<table " + 22 "style='margin:10px 0 5px 40px;width:400px;'>" + 23 "<tr><td>" + 24 "<label>宽度: " + 25 " " + 26 "<input " + 27 " data-verify='^(" + DTIP + "|((?!0$)\\d+))?$' " + 28 " data-warning='宽度请输入正整数' " + 29 "class='ks-editor-video-width ks-editor-input' " + 30 "style='width:60px;margin-left:2px;" + 31 MIDDLE + "' " + 32 "/> 像素" + 33 "</label>" + 34 "</td>" + 35 "<td>" + 36 "<label> 高度: " + 37 "" + 38 " <input " + 39 " data-verify='^(" + DTIP + "|((?!0$)\\d+))?$' " + 40 " data-warning='高度请输入正整数' " + 41 "class='ks-editor-video-height ks-editor-input' style='width:60px;" + 42 MIDDLE + 43 "'/> 像素" + 44 "</label>" + 45 "</td></tr>" + 46 "<tr>" + 47 "<td>" + 48 "<label>对齐: " + 49 "<select class='ks-editor-video-align' title='对齐'>" + 50 "<option value='none'>无</option>" + 51 "<option value='left'>左对齐</option>" + 52 "<option value='right'>右对齐</option>" + 53 "</select>" + 54 "</td>" + 55 "<td>" + 56 "<label>间距: " + 57 "<input " + 58 "" + 59 " data-verify='^\\d+$' " + 60 " data-warning='间距请输入非负整数' " + 61 "class='ks-editor-video-margin ks-editor-input' style='width:60px;" + 62 MIDDLE + "' value='" 63 + MARGIN_DEFAULT + "'/> 像素" + 64 "</label>" + 65 "</td></tr>" + 66 "</table>" + 67 "</div>", 68 footHtml = "<div style='padding:5px 20px 20px;'><a " + 69 "class='ks-editor-video-ok ks-editor-button ks-inline-block' " + 70 "style='margin-left:40px;margin-right:20px;'>确定</button> " + 71 "<a class='ks-editor-video-cancel ks-editor-button ks-inline-block'>取消</a></div>"; 72 73 function VideoDialog() { 74 VideoDialog.superclass.constructor.apply(this, arguments); 75 } 76 77 S.extend(VideoDialog, FlashDialog, { 78 _config:function () { 79 var self = this, 80 cfg = self.config; 81 self._cls = CLS_VIDEO; 82 self._type = TYPE_VIDEO; 83 self._title = "视频";//属性"; 84 self._bodyHtml = bodyHtml; 85 self._footHtml = footHtml; 86 self.urlCfg = cfg["video"] && 87 cfg["video"].urlCfg; 88 self._urlTip = (cfg["video"] && 89 cfg["video"]['urlTip']) || "请输入视频播放链接..."; 90 }, 91 _initD:function () { 92 var self = this, 93 d = self.dialog, 94 el = d.get("el"); 95 self.dUrl = el.one(".ks-editor-video-url"); 96 self.dAlign = MenuButton.Select.decorate(el.one(".ks-editor-video-align"), { 97 prefixCls:'ks-editor-big-', 98 elAttrs:{ 99 hideFocus:"hideFocus" 100 }, 101 width:80, 102 menuCfg:{ 103 prefixCls:'ks-editor-', 104 render:el 105 } 106 }); 107 self.dMargin = el.one(".ks-editor-video-margin"); 108 self.dWidth = el.one(".ks-editor-video-width"); 109 self.dHeight = el.one(".ks-editor-video-height"); 110 var action = el.one(".ks-editor-video-ok"), 111 cancel = el.one(".ks-editor-video-cancel"); 112 action.on("click", self._gen, self); 113 cancel.on("click", function (ev) { 114 d.hide(); 115 ev.halt(); 116 }); 117 Editor.Utils.placeholder(self.dUrl, self._urlTip); 118 Editor.Utils.placeholder(self.dWidth, DTIP); 119 Editor.Utils.placeholder(self.dHeight, DTIP); 120 self.addRes(self.dAlign); 121 }, 122 123 _getDInfo:function () { 124 var self = this, 125 url = self.dUrl.val(); 126 var videoCfg = self.config, 127 p = videoCfg.getProvider(url); 128 if (!p) { 129 alert("不支持该链接来源!"); 130 } else { 131 var re = p['detect'](url); 132 if (!re) { 133 alert("不支持该链接,请直接输入该视频提供的分享链接"); 134 return; 135 } 136 return { 137 url:re, 138 attrs:{ 139 height:parseInt(self.dHeight.val()) || p.height, 140 width:parseInt(self.dWidth.val()) || p.width, 141 style:"margin:" + (parseInt(self.dMargin.val()) || 0) + "px;" + 142 "float:" + self.dAlign.get("value") + ";" 143 } 144 }; 145 } 146 }, 147 148 _gen:function (ev) { 149 var self = this, 150 url = self.dUrl.val(), 151 urlCfg = self.urlCfg; 152 if (urlCfg) { 153 for (var i = 0; i < urlCfg.length; i++) { 154 var c = urlCfg[i]; 155 if (c['reg'].test(url)) { 156 self.dialog.loading(); 157 158 var data = {}; 159 160 data[c['paramName'] || "url"] = url; 161 162 S.io({ 163 url:c.url, 164 data:data, 165 dataType:'jsonp', 166 success:function (data) { 167 self._dynamicUrlPrepare(data[1]); 168 } 169 }); 170 171 return; 172 } 173 } 174 } 175 VideoDialog.superclass._gen.call(self); 176 ev && ev.halt(); 177 }, 178 179 _dynamicUrlPrepare:function (re) { 180 var self = this; 181 self.dUrl.val(re); 182 self.dialog.unloading(); 183 VideoDialog.superclass._gen.call(self); 184 }, 185 186 _updateD:function () { 187 var self = this, 188 editor = self.editor, 189 f = self.selectedFlash; 190 if (f) { 191 var r = editor.restoreRealElement(f); 192 Editor.Utils.valInput(self.dUrl, self._getFlashUrl(r)); 193 self.dAlign.set("value", f.css("float")); 194 self.dMargin.val(parseInt(r.style("margin")) || 0); 195 Editor.Utils.valInput(self.dWidth, parseInt(f.css("width"))); 196 Editor.Utils.valInput(self.dHeight, parseInt(f.css("height"))); 197 } else { 198 Editor.Utils.resetInput(self.dUrl); 199 self.dAlign.set("value", "none"); 200 self.dMargin.val(MARGIN_DEFAULT); 201 Editor.Utils.resetInput(self.dWidth); 202 Editor.Utils.resetInput(self.dHeight); 203 } 204 } 205 }); 206 207 return VideoDialog; 208 }, { 209 requires:['editor', '../flash/dialog', '../menubutton/'] 210 });