ueditor_rails4 0.0.5

data/vendor/assets/javascripts/ueditor/dialogs/template/config.js

@@ -0,0 +1,42 @@
+/**
+ * Created with JetBrains PhpStorm.
+ * User: xuheng
+ * Date: 12-8-8
+ * Time: 下午2:00
+ * To change this template use File | Settings | File Templates.
+ */
+var templates = [
+    {
+        "pre":"pre0.png",
+        'title':lang.blank,
+        'preHtml':'<p class="ue_t">&nbsp;欢迎使用UEditor！</p>',
+        "html":'<p class="ue_t">欢迎使用UEditor！</p>'
+
+    },
+    {
+        "pre":"pre1.png",
+        'title':lang.blog,
+        'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">深入理解Range</span></h1><p style="text-align:center;"><strong class=" ">UEditor二次开发</strong></p><h3><span class=" " style="font-family:幼圆">什么是Range</span></h3><p style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 </p><br /><h3><span class=" " style="font-family:幼圆">Range能干什么</span></h3><p style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。</p>',
+        "html":'<h1 class="ue_t" label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;"><span style="color:#c0504d;">[键入文档标题]</span></h1><p style="text-align:center;"><strong class="ue_t">[键入文档副标题]</strong></p><h3><span class="ue_t" style="font-family:幼圆">[标题 1]</span></h3><p class="ue_t"  style="text-indent:2em;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><h3><span class="ue_t" style="font-family:幼圆">[标题 2]</span></h3><p class="ue_t"  style="text-indent:2em;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，您可以方便地更改文档中所选文本的格式。 您还可以使用“开始”选项卡上的其他控件来直接设置文本格式。大多数控件都允许您选择是使用当前主题外观，还是使用某种直接指定的格式。 </p><h3><span class="ue_t" style="font-family:幼圆">[标题 3]</span></h3><p class="ue_t">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。 您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。 您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><p class="ue_t"><br /></p>'
+
+    },
+    {
+        "pre":"pre2.png",
+        'title':lang.resume,
+        'preHtml':'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class=" ">WEB前端开发简历</span></h1><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="100" style="text-align:center;"><p><span style="background-color:transparent;">插</span><br /></p><p>入</p><p>照</p><p>片</p></td><td><p><span style="background-color:transparent;"> 联系电话：</span><span class="ue_t" style="background-color:transparent;">[键入您的电话]</span><br /></p><p><span style="background-color:transparent;"> 电子邮件：</span><span class="ue_t" style="background-color:transparent;">[键入您的电子邮件地址]</span><br /></p><p><span style="background-color:transparent;"> 家庭住址：</span><span class="ue_t" style="background-color:transparent;">[键入您的地址]</span><br /></p></td></tr></tbody></table><h3><span style="color:#E36C09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class=" ">WEB前端研发工程师</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[起止时间]</span> <span class="ue_t">[学校名称] </span> <span class="ue_t">[所学专业]</span> <span class="ue_t">[所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><p><br /></p>',
+        "html":'<h1 label="Title left" name="tl" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;"><span style="color:#e36c09;" class="ue_t">[此处键入简历标题]</span></h1><p><span style="color:#e36c09;"><br /></span></p><table width="100%" border="1" bordercolor="#95B3D7" style="border-collapse:collapse;"><tbody><tr><td width="200" style="text-align:center;" class="ue_t">【此处插入照片】</td><td><p><br /></p><p> 联系电话：<span class="ue_t">[键入您的电话]</span></p><p><br /></p><p> 电子邮件：<span class="ue_t">[键入您的电子邮件地址]</span></p><p><br /></p><p> 家庭住址：<span class="ue_t">[键入您的地址]</span></p><p><br /></p></td></tr></tbody></table><h3><span style="color:#e36c09;font-size:20px;">目标职位</span></h3><p style="text-indent:2em;" class="ue_t">[此处键入您的期望职位]</p><h3><span style="color:#e36c09;font-size:20px;">学历</span></h3><p><span style="display:none;line-height:0px;" id="_baidu_bookmark_start_26"></span></p><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称] </span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入学校名称]</span> <span class="ue_t">[键入所学专业]</span> <span class="ue_t">[键入所获学位]</span></p></li></ol><h3><span style="color:#e36c09;font-size:20px;" class="ue_t">工作经验</span></h3><ol style="list-style-type:decimal;"><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol><li><p><span class="ue_t">[键入起止时间]</span> <span class="ue_t">[键入公司名称]</span> <span class="ue_t">[键入职位名称]</span> </p></li><ol style="list-style-type:lower-alpha;"><li><p><span class="ue_t">[键入负责项目]</span> <span class="ue_t">[键入项目简介]</span></p></li></ol></ol><p><span style="color:#e36c09;font-size:20px;">掌握技能</span></p><p style="text-indent:2em;"> &nbsp;<span class="ue_t">[这里可以键入您所掌握的技能]</span><br /></p>'
+
+    },
+    {
+        "pre":"pre3.png",
+        'title':lang.richText,
+        'preHtml':'<h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="150" height="100" border="0" hspace="0" vspace="0" style="width:150px;height:100px;float:left;" />图文混排方法</p><p>图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文</p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="100" height="100" border="0" hspace="0" vspace="0" style="width:100px;height:100px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p>',
+        "html":'<p><br /></p><h1 label="Title center" name="tc" style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;text-align:center;margin:0px 0px 20px;" class="ue_t">[此处键入文章标题]</h1><p><img src="http://img.baidu.com/hi/youa/y_0034.gif" width="300" height="200" border="0" hspace="0" vspace="0" style="width:300px;height:200px;float:left;" />图文混排方法</p><p>1. 图片居左，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居左对齐，然后即可在右边输入多行文本</p><p><br /></p><p>2. 图片居右，文字围绕图片排版</p><p>方法：在文字前面插入图片，设置居右对齐，然后即可在左边输入多行文本</p><p><br /></p><p>3. 图片居中环绕排版</p><p>方法：亲，这个真心没有办法。。。</p><p><br /></p><p><br /></p><p><img src="http://img.baidu.com/hi/youa/y_0040.gif" width="300" height="300" border="0" hspace="0" vspace="0" style="width:300px;height:300px;float:right;" /></p><p>还有没有什么其他的环绕方式呢？这里是居右环绕</p><p><br /></p><p>欢迎大家多多尝试，为UEditor提供更多高质量模板！</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p>占位</p><p><br /></p><p><br /></p>'
+    },
+    {
+        "pre":"pre4.png",
+        'title':lang.sciPapers,
+        'preHtml':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><br /></p>',
+        'html':'<h2 style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px 4px 0px 0px;margin:0px 0px 10px;text-align:center;" class="ue_t">[键入文章标题]</h2><p><strong><span style="font-size:12px;">摘要</span></strong><span style="font-size:12px;" class="ue_t">：这里可以输入很长很长很长很长很长很长很长很长很差的摘要</span></p><p style="line-height:1.5em;"><strong>标题 1</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以输入很多内容，可以图文混排，可以有列表等。</span></p><p style="line-height:1.5em;"><strong>标题 2</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个列表瞅瞅：</span></p><ol style="list-style-type:lower-alpha;"><li><p class="ue_t">列表 1</p></li><li><p class="ue_t">列表 2</p></li><ol style="list-style-type:lower-roman;"><li><p class="ue_t">多级列表 1</p></li><li><p class="ue_t">多级列表 2</p></li></ol><li><p class="ue_t">列表 3<br /></p></li></ol><p style="line-height:1.5em;"><strong>标题 3</strong></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">来个文字图文混排的</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">这里可以多行</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">右边是图片</span></p><p style="text-indent:2em;"><span style="font-size:14px;" class="ue_t">绝对没有问题的，不信你也可以试试看</span></p><p><br /></p>'
+    }
+];

data/vendor/assets/javascripts/ueditor/dialogs/template/template.css

@@ -0,0 +1,18 @@
+.wrap{ padding: 5px;font-size: 14px;}
+.left{width:425px;float: left;}
+.right{width:160px;border: 1px solid #ccc;float: right;padding: 5px;margin-right: 5px;}
+.right .pre{height: 332px;overflow-y: auto;}
+.right .preitem{border: white 1px solid;margin: 5px 0;padding: 2px 0;}
+.right .preitem:hover{background-color: lemonChiffon;cursor: pointer;border: #ccc 1px solid;}
+.right .preitem img{display: block;margin: 0 auto;width:100px;}
+.clear{clear: both;}
+.top{height:26px;line-height: 26px;padding: 5px;}
+.bottom{height:320px;width:100%;margin: 0 auto;}
+.transparent{ background: url("images/bg.gif") repeat;}
+.bottom table tr td{border:1px dashed #ccc;}
+#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;}
+.border_style1{padding:2px;border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
+p{margin: 5px 0}
+table{clear:both;margin-bottom:10px;border-collapse:collapse;word-break:break-all;}
+li{clear:both}
+ol{padding-left:40px; }

data/vendor/assets/javascripts/ueditor/dialogs/template/template.html.erb

@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+    <title></title>
+    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
+  <%= stylesheet_link_tag 'ueditor/dialogs/template/template.css' %>
+</head>
+<body>
+    <div class="wrap">
+        <div class="left">
+            <div class="top">
+                <label><var id="lang_template_clear"></var>：<input id="issave" type="checkbox"></label>
+            </div>
+            <div class="bottom border_style1" id="preview"></div>
+        </div>
+        <fieldset  class="right border_style1">
+            <legend><var id="lang_template_select"></var></legend>
+            <div class="pre" id="preitem"></div>
+        </fieldset>
+        <div class="clear"></div>
+    </div>
+    <%= javascript_include_tag 'ueditor/dialogs/internal.js' %>
+    <%= javascript_include_tag 'ueditor/dialogs/template/config.js' %>
+    <%= javascript_include_tag 'ueditor/dialogs/template/template.js' %>
+</body>
+</html>

data/vendor/assets/javascripts/ueditor/dialogs/template/template.js

@@ -0,0 +1,53 @@
+/**
+ * Created with JetBrains PhpStorm.
+ * User: xuheng
+ * Date: 12-8-8
+ * Time: 下午2:09
+ * To change this template use File | Settings | File Templates.
+ */
+(function () {
+    var me = editor,
+            preview = $G( "preview" ),
+            preitem = $G( "preitem" ),
+            tmps = templates,
+            currentTmp;
+    var initPre = function () {
+        var str = "";
+        for ( var i = 0, tmp; tmp = tmps[i++]; ) {
+            str += '<div class="preitem" onclick="pre(' + i + ')"><img src="' + "images/" + tmp.pre + '" ' + (tmp.title ? "alt=" + tmp.title + " title=" + tmp.title + "" : "") + '></div>';
+        }
+        preitem.innerHTML = str;
+    };
+    var pre = function ( n ) {
+        var tmp = tmps[n - 1];
+        currentTmp = tmp;
+        clearItem();
+        domUtils.setStyles( preitem.childNodes[n - 1], {
+            "background-color":"lemonChiffon",
+            "border":"#ccc 1px solid"
+        } );
+        preview.innerHTML = tmp.preHtml ? tmp.preHtml : "";
+    };
+    var clearItem = function () {
+        var items = preitem.children;
+        for ( var i = 0, item; item = items[i++]; ) {
+            domUtils.setStyles( item, {
+                "background-color":"",
+                "border":"white 1px solid"
+            } );
+        }
+    };
+    dialog.onok = function () {
+        if ( !$G( "issave" ).checked ){
+            me.execCommand( "cleardoc" );
+        }
+        var obj = {
+            html:currentTmp && currentTmp.html
+        };
+        me.execCommand( "template", obj );
+    };
+    initPre();
+    window.pre = pre;
+    pre(2)
+
+})();

data/vendor/assets/javascripts/ueditor/dialogs/video/video.css

@@ -0,0 +1,59 @@
+@charset "utf-8";
+.wrapper{ width: 570px;_width:575px;margin: 10px auto; zoom:1;position: relative}
+.tabbody{height:335px;}
+.panel { position: absolute;width:100%; height:100%;background: #fff;}
+.panel table td{vertical-align: middle;}
+#videoUrl {
+    width: 490px;
+    height: 21px;
+    line-height: 21px;
+    margin: 8px 5px;
+    background: #FFF;
+    border: 1px solid #d7d7d7;
+}
+#videoSearchTxt{margin-left:15px;background: #FFF;width:200px;height:21px;line-height:21px;border: 1px solid #d7d7d7;}
+#searchList{width: 570px;overflow: auto;zoom:1;height: 270px;}
+#searchList div{float: left;width: 120px;height: 135px;margin: 5px 15px;}
+#searchList img{margin: 2px 8px;cursor: pointer;border: 2px solid #fff} /*不用缩略图*/
+#searchList p{margin-left: 10px;}
+#videoType{
+    width: 65px;
+    height: 23px;
+    line-height: 22px;
+    border: 1px solid #d7d7d7;
+}
+#videoSearchBtn,#videoSearchReset{
+    /*width: 80px;*/
+    height: 25px;
+    line-height: 25px;
+    background: #eee;
+    border: 1px solid #d7d7d7;
+    cursor: pointer;
+    padding: 0 5px;
+}
+
+
+
+#preview{width: 420px; margin-left: 10px; _margin-left:5px; height: 280px;background-color: #ddd;float: left}
+#videoInfo {width: 120px;float: left;margin-left: 10px;_margin-left:7px;}
+fieldset{
+    border: 1px solid #ddd;
+    padding-left: 5px;
+    margin-bottom: 20px;
+    padding-bottom: 5px;
+    width: 115px;
+}
+fieldset legend{font-weight: bold;}
+fieldset p{line-height: 30px;}
+fieldset input.txt{
+    width: 65px;
+    height: 21px;
+    line-height: 21px;
+    margin: 8px 5px;
+    background: #FFF;
+    border: 1px solid #d7d7d7;
+}
+label.url{font-weight: bold;margin-left: 5px;color: #06c;}
+#videoFloat div{cursor:pointer;opacity: 0.5;filter: alpha(opacity = 50);margin:9px;_margin:5px;width:38px;height:36px;float:left;}
+#videoFloat .focus{opacity: 1;filter: alpha(opacity = 100)}
+span.view{display: inline-block;width: 30px;float: right;cursor: pointer;color: blue}

data/vendor/assets/javascripts/ueditor/dialogs/video/video.html.erb

@@ -0,0 +1,78 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+        "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+  <title></title>
+  <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
+  <%= stylesheet_link_tag 'ueditor/dialogs/video/video.css' %>
+</head>
+<body>
+<div class="wrapper">
+  <div id="videoTab">
+    <div id="tabHeads" class="tabhead">
+      <span tabSrc="video" class="focus"><var id="lang_tab_insertV"></var></span>
+      <span tabSrc="videoSearch"><var id="lang_tab_searchV"></var></span>
+    </div>
+    <div id="tabBodys" class="tabbody">
+      <div id="video" class="panel">
+        <table>
+          <tr>
+            <td><label for="videoUrl" class="url"><var id="lang_video_url"></var></label></td>
+            <td><input id="videoUrl" type="text"></td>
+          </tr>
+        </table>
+        <div id="preview"></div>
+        <div id="videoInfo">
+          <fieldset>
+            <legend><var id="lang_video_size"></var></legend>
+            <table>
+              <tr>
+                <td><label for="videoWidth"><var id="lang_videoW"></var></label></td>
+                <td><input class="txt" id="videoWidth" type="text"/></td>
+              </tr>
+              <tr>
+                <td><label for="videoHeight"><var id="lang_videoH"></var></label></td>
+                <td><input class="txt" id="videoHeight" type="text"/></td>
+              </tr>
+            </table>
+          </fieldset>
+          <fieldset>
+            <legend><var id="lang_alignment"></var></legend>
+            <div id="videoFloat"></div>
+          </fieldset>
+        </div>
+      </div>
+      <div id="videoSearch" class="panel" style="display: none">
+        <table style="margin-top: 5px;">
+          <tr>
+            <td><input id="videoSearchTxt" type="text"/></td>
+            <td>
+              <select id="videoType">
+                <option value="0"></option>
+                <option value="29"></option>
+                <option value="1"></option>
+                <option value="5"></option>
+                <option value="15"></option>
+                <option value="21"></option>
+                <option value="31"></option>
+              </select>
+            </td>
+            <td><input id="videoSearchBtn" type="button"/></td>
+            <td><input id="videoSearchReset" type="button"/></td>
+          </tr>
+        </table>
+        <div id="searchList"></div>
+      </div>
+    </div>
+  </div>
+</div>
+<%= javascript_include_tag 'ueditor/dialogs/internal.js' %>
+<%= javascript_include_tag 'ueditor/dialogs/video/video.js' %>
+<script type="text/javascript">
+  window.onload = function () {
+    video.init();
+    $focus($G("videoUrl"));
+  };
+</script>
+</body>
+</html>

data/vendor/assets/javascripts/ueditor/dialogs/video/video.js.erb

@@ -0,0 +1,409 @@
+/**
+ * Created by JetBrains PhpStorm.
+ * User: taoqili
+ * Date: 12-2-20
+ * Time: 上午11:19
+ * To change this template use File | Settings | File Templates.
+ */
+var video = {};
+
+(function () {
+  video.align_directions = {
+    center: "<%= asset_path 'ueditor/dialogs/video/images/center_focus.jpg' %>",
+    left: "<%= asset_path 'ueditor/dialogs/video/images/left_focus.jpg' %>",
+    none: "<%= asset_path 'ueditor/dialogs/video/images/none_focus.jpg' %>",
+    right: "<%= asset_path 'ueditor/dialogs/video/images/right_focus.jpg' %>"
+  };
+  video.init = function () {
+    switchTab("videoTab");
+    createAlignButton(["videoFloat"]);
+    addUrlChangeListener($G("videoUrl"));
+    addOkListener();
+    addSearchListener();
+
+    //编辑视频时初始化相关信息
+    (function () {
+      var img = editor.selection.getRange().getClosedNode(), url;
+      if (img && img.className == "edui-faked-video") {
+        $G("videoUrl").value = url = img.getAttribute("_url");
+        $G("videoWidth").value = img.width;
+        $G("videoHeight").value = img.height;
+        var align = domUtils.getComputedStyle(img, "float"),
+                parentAlign = domUtils.getComputedStyle(img.parentNode, "text-align");
+        updateAlignButton(parentAlign === "center" ? "center" : align);
+      }
+      createPreviewVideo(url);
+    })();
+  };
+  /**
+   * 监听确认和取消两个按钮事件，用户执行插入或者清空正在播放的视频实例操作
+   */
+  function addOkListener() {
+    dialog.onok = function () {
+      $G("preview").innerHTML = "";
+      var currentTab = findFocus("tabHeads", "tabSrc");
+      switch (currentTab) {
+        case "video":
+          return insertSingle();
+          break;
+        case "videoSearch":
+          return insertSearch("searchList");
+          break;
+      }
+    };
+    dialog.oncancel = function () {
+      $G("preview").innerHTML = "";
+    };
+  }
+
+  function selectTxt(node) {
+    if (node.select) {
+      node.select();
+    } else {
+      var r = node.createTextRange && node.createTextRange();
+      r.select();
+    }
+  }
+
+  /**
+   * 依据传入的align值更新按钮信息
+   * @param align
+   */
+  function updateAlignButton(align) {
+    var aligns = $G("videoFloat").children;
+    for (var i = 0, ci; ci = aligns[i++];) {
+      if (ci.getAttribute("name") == align) {
+        if (ci.className != "focus") {
+          ci.className = "focus";
+        }
+      } else {
+        if (ci.className == "focus") {
+          ci.className = "";
+        }
+      }
+    }
+  }
+
+  /**
+   * 将单个视频信息插入编辑器中
+   */
+  function insertSingle() {
+    var width = $G("videoWidth"),
+            height = $G("videoHeight"),
+            url = $G('videoUrl').value,
+            align = findFocus("videoFloat", "name");
+    if (!url) return false;
+    if (!checkNum([width, height])) return false;
+    editor.execCommand('insertvideo', {
+      url: convert_url(url),
+      width: width.value,
+      height: height.value,
+      align: align
+    });
+  }
+
+  /**
+   * 将元素id下的所有代表视频的图片插入编辑器中
+   * @param id
+   */
+  function insertSearch(id) {
+    var imgs = domUtils.getElementsByTagName($G(id), "img"),
+            videoObjs = [];
+    for (var i = 0, img; img = imgs[i++];) {
+      if (img.getAttribute("selected")) {
+        videoObjs.push({
+          url: img.getAttribute("ue_video_url"),
+          width: 420,
+          height: 280,
+          align: "none"
+        });
+      }
+    }
+    editor.execCommand('insertvideo', videoObjs);
+  }
+
+  /**
+   * 找到id下具有focus类的节点并返回该节点下的某个属性
+   * @param id
+   * @param returnProperty
+   */
+  function findFocus(id, returnProperty) {
+    var tabs = $G(id).children,
+            property;
+    for (var i = 0, ci; ci = tabs[i++];) {
+      if (ci.className == "focus") {
+        property = ci.getAttribute(returnProperty);
+        break;
+      }
+    }
+    return property;
+  }
+
+  function convert_url(s) {
+    return s.replace(/http:\/\/www\.tudou\.com\/programs\/view\/([\w\-]+)\/?/i, "http://www.tudou.com/v/$1")
+            .replace(/http:\/\/www\.youtube\.com\/watch\?v=([\w\-]+)/i, "http://www.youtube.com/v/$1")
+            .replace(/http:\/\/v\.youku\.com\/v_show\/id_([\w\-=]+)\.html/i, "http://player.youku.com/player.php/sid/$1")
+            .replace(/http:\/\/www\.56\.com\/u\d+\/v_([\w\-]+)\.html/i, "http://player.56.com/v_$1.swf")
+            .replace(/http:\/\/www.56.com\/w\d+\/play_album\-aid\-\d+_vid\-([^.]+)\.html/i, "http://player.56.com/v_$1.swf")
+            .replace(/http:\/\/v\.ku6\.com\/.+\/([^.]+)\.html/i, "http://player.ku6.com/refer/$1/v.swf");
+  }
+
+  /**
+   * 检测传入的所有input框中输入的长宽是否是正数
+   * @param nodes input框集合，
+   */
+  function checkNum(nodes) {
+    for (var i = 0, ci; ci = nodes[i++];) {
+      var value = ci.value;
+      if (!isNumber(value) && value) {
+        alert(lang.numError);
+        ci.value = "";
+        ci.focus();
+        return false;
+      }
+    }
+    return true;
+  }
+
+  /**
+   * 数字判断
+   * @param value
+   */
+  function isNumber(value) {
+    return /(0|^[1-9]\d*$)/.test(value);
+  }
+
+  /**
+   * tab切换
+   * @param tabParentId
+   * @param keepFocus   当此值为真时，切换按钮上会保留focus的样式
+   */
+  function switchTab(tabParentId, keepFocus) {
+    var tabElements = $G(tabParentId).children,
+            tabHeads = tabElements[0].children,
+            tabBodys = tabElements[1].children;
+    for (var i = 0, length = tabHeads.length; i < length; i++) {
+      var head = tabHeads[i];
+      domUtils.on(head, "click", function () {
+        //head样式更改
+        for (var k = 0, len = tabHeads.length; k < len; k++) {
+          if (!keepFocus)tabHeads[k].className = "";
+        }
+        this.className = "focus";
+        //body显隐
+        var tabSrc = this.getAttribute("tabSrc");
+        for (var j = 0, length = tabBodys.length; j < length; j++) {
+          var body = tabBodys[j],
+                  id = body.getAttribute("id");
+
+          if (id == tabSrc) {
+            body.style.display = "";
+            if (id == "videoSearch") {
+              selectTxt($G("videoSearchTxt"));
+            }
+            if (id == "video") {
+              selectTxt($G("videoUrl"));
+            }
+
+          } else {
+            body.style.display = "none";
+          }
+        }
+      });
+    }
+  }
+
+  /**
+   * 创建图片浮动选择按钮
+   * @param ids
+   */
+  function createAlignButton(ids) {
+    for (var i = 0, ci; ci = ids[i++];) {
+      var floatContainer = $G(ci),
+              nameMaps = {"none": lang['default'], "left": lang.floatLeft, "right": lang.floatRight, "center": lang.block};
+      for (var j in nameMaps) {
+        var div = document.createElement("div");
+        div.setAttribute("name", j);
+        if (j == "none") div.className = "focus";
+        div.style.cssText = "background:url(" + video.align_directions[j] + ");";
+        div.setAttribute("title", nameMaps[j]);
+        floatContainer.appendChild(div);
+      }
+      switchSelect(ci);
+    }
+  }
+
+  /**
+   * 选择切换
+   * @param selectParentId
+   */
+  function switchSelect(selectParentId) {
+    var selects = $G(selectParentId).children;
+    for (var i = 0, ci; ci = selects[i++];) {
+      domUtils.on(ci, "click", function () {
+        for (var j = 0, cj; cj = selects[j++];) {
+          cj.className = "";
+          cj.removeAttribute && cj.removeAttribute("class");
+        }
+        this.className = "focus";
+      })
+    }
+  }
+
+  /**
+   * 监听url改变事件
+   * @param url
+   */
+  function addUrlChangeListener(url) {
+    if (browser.ie) {
+      url.onpropertychange = function () {
+        createPreviewVideo(this.value);
+      }
+    } else {
+      url.addEventListener("input", function () {
+        createPreviewVideo(this.value);
+      }, false);
+    }
+  }
+
+  /**
+   * 根据url生成视频预览
+   * @param url
+   */
+  function createPreviewVideo(url) {
+
+    if (!url)return;
+    var matches = url.match(/youtu.be\/(\w+)$/) || url.match(/youtube\.com\/watch\?v=(\w+)/) || url.match(/youtube.com\/v\/(\w+)/),
+            youku = url.match(/youku\.com\/v_show\/id_(\w+)/),
+            youkuPlay = /player\.youku\.com/ig.test(url);
+    if (!youkuPlay) {
+      if (matches) {
+        url = "https://www.youtube.com/v/" + matches[1] + "?version=3&feature=player_embedded";
+      } else if (youku) {
+        url = "http://player.youku.com/player.php/sid/" + youku[1] + "/v.swf"
+      } else if (!endWith(url, [".swf", ".flv", ".wmv"])) {
+        $G("preview").innerHTML = lang.urlError;
+        return;
+      }
+    } else {
+      url = url.replace(/\?f=.*/, "");
+    }
+    $G("preview").innerHTML = '<embed type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"' +
+            ' src="' + url + '"' +
+            ' width="' + 420 + '"' +
+            ' height="' + 280 + '"' +
+            ' wmode="transparent" play="true" loop="false" menu="false" allowscriptaccess="never" allowfullscreen="true" ></embed>';
+  }
+
+  /**
+   * 末尾字符检测
+   * @param str
+   * @param endStrArr
+   */
+  function endWith(str, endStrArr) {
+    for (var i = 0, len = endStrArr.length; i < len; i++) {
+      var tmp = endStrArr[i];
+      if (str.length - tmp.length < 0) return false;
+
+      if (str.substring(str.length - tmp.length) == tmp) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  /**
+   * ajax获取视频信息
+   */
+  function getMovie() {
+    var keywordInput = $G("videoSearchTxt");
+    if (!keywordInput.getAttribute("hasClick") || !keywordInput.value) {
+      selectTxt(keywordInput);
+      return;
+    }
+    $G("searchList").innerHTML = lang.loading;
+    var keyword = keywordInput.value,
+            type = $G("videoType").value,
+            str = "";
+    ajax.request(editor.options.getMovieUrl, {
+      searchKey: keyword,
+      videoType: type,
+      onsuccess: function (xhr) {
+        try {
+          var info = eval("(" + xhr.responseText + ")");
+        } catch (e) {
+          return;
+        }
+
+        var videos = info.multiPageResult.results;
+        var html = ["<table width='530'>"];
+        for (var i = 0, ci; ci = videos[i++];) {
+          html.push(
+                  "<tr>" +
+                          "<td><img title='" + lang.clickToSelect + "' ue_video_url='" + ci.outerPlayerUrl + "' alt='" + ci.tags + "' width='106' height='80' src='" + ci.picUrl + "' /> </td>" +
+                          "<td>" +
+                          "<p><a target='_blank' title='" + lang.goToSource + "' href='" + ci.itemUrl + "'>" + ci.title.substr(0, 30) + "</a></p>" +
+                          "<p style='height: 62px;line-height: 20px' title='" + ci.description + "'> " + ci.description.substr(0, 95) + " </p>" +
+                          "</td>" +
+                          "</tr>"
+          );
+        }
+        html.push("</table>");
+        $G("searchList").innerHTML = str = html.length == 2 ? lang.noVideo : html.join("");
+        var imgs = domUtils.getElementsByTagName($G("searchList"), "img");
+        if (!imgs)return;
+        for (var i = 0, img; img = imgs[i++];) {
+          domUtils.on(img, "click", function () {
+            changeSelected(this);
+          })
+        }
+      }
+    });
+  }
+
+  /**
+   * 改变对象o的选中状态
+   * @param o
+   */
+  function changeSelected(o) {
+    if (o.getAttribute("selected")) {
+      o.removeAttribute("selected");
+      o.style.cssText = "filter:alpha(Opacity=100);-moz-opacity:1;opacity: 1;border: 2px solid #fff";
+    } else {
+      o.setAttribute("selected", "true");
+      o.style.cssText = "filter:alpha(Opacity=50);-moz-opacity:0.5;opacity: 0.5;border:2px solid blue;";
+    }
+  }
+
+  /**
+   * 视频搜索相关注册事件
+   */
+  function addSearchListener() {
+    domUtils.on($G("videoSearchBtn"), "click", getMovie);
+    domUtils.on($G("videoSearchTxt"), "click", function () {
+      if (this.value == lang.static.videoSearchTxt.value) {
+        this.value = "";
+      }
+      this.setAttribute("hasClick", "true");
+      selectTxt(this);
+    });
+    $G("videoSearchTxt").onkeyup = function () {
+      this.setAttribute("hasClick", "true");
+      this.onkeyup = null;
+    };
+    domUtils.on($G("videoSearchReset"), "click", function () {
+      var txt = $G("videoSearchTxt");
+      txt.value = "";
+      selectTxt(txt);
+      $G("searchList").innerHTML = "";
+    });
+    domUtils.on($G("videoType"), "change", getMovie);
+    domUtils.on($G("videoSearchTxt"), "keyup", function (evt) {
+      if (evt.keyCode == 13) {
+        getMovie();
+      }
+    })
+  }
+
+
+})();