RubyGems - ueditor_rails - Versions diffs - 0.0.2 → 0.0.4 - Mend

@@ -0,0 +1,57 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+        "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+  <title></title>
+  <style type="text/css">
+    * {
+      color: #838383;
+      margin: 0;
+      padding: 0
+    }
+    html, body {
+      font-size: 12px;
+      overflow: hidden;
+    }
+    .content {
+      padding: 5px 0 0 15px;
+    }
+    input {
+      width: 210px;
+      height: 21px;
+      line-height: 21px;
+      margin-left: 4px;
+    }
+  </style>
+</head>
+<body>
+<div class="content">
+  <span><var id="lang_input_anchorName"></var></span><input id="anchorName" value=""/>
+</div>
+<%= javascript_include_tag 'ueditor/dialogs/internal.js' %>
+<script type="text/javascript">
+  var anchorInput = $G('anchorName'),
+          node = editor.selection.getRange().getClosedNode();
+  if (node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))) {
+    anchorInput.value = node;
+  }
+  anchorInput.onkeydown = function (evt) {
+    evt = evt || window.event;
+    if (evt.keyCode == 13) {
+      editor.execCommand('anchor', anchorInput.value);
+      dialog.close();
+      domUtils.preventDefault(evt)
+    }
+  };
+  dialog.onok = function () {
+    editor.execCommand('anchor', anchorInput.value);
+    dialog.close();
+  };
+  $focus(anchorInput);
+</script>
+</body>
+</html>

data/vendor/assets/javascripts/ueditor/dialogs/background/background.css ADDED

@@ -0,0 +1,24 @@
+.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
+.tabbody{height:225px;}
+.panel { position: absolute;width:100%; height:100%;background: #fff;}
+body{font-size: 12px;color: #888;overflow: hidden;}
+input,label{vertical-align:middle}
+.clear{clear: both;}
+.pl{padding-left: 23px;padding-left: 28px\9;}
+#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
+#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
+#imageList img {cursor: pointer;border: 2px solid white;}
+.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
+.content div{margin: 10px 0 10px 5px;}
+.content .iptradio{margin-right: 10px;}
+.txt{width:280px;}
+.wrapcolor{height: 19px;}
+div.color{float: left;margin: 0;}
+#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
+div.alignment,#custom{margin-left: 30px;margin-left: 35px\9;}
+#custom input{height: 15px;min-height: 15px;width:20px;}
+#repeatType{width:100px;}

data/vendor/assets/javascripts/ueditor/dialogs/background/background.html.erb ADDED

@@ -0,0 +1,55 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
+  <%= stylesheet_link_tag 'ueditor/dialogs/background/background.css' %>
+</head>
+<body>
+<div id="bg_container" class="wrapper">
+  <div id="tabHeads" class="tabhead">
+    <span class="focus" tabsrc="normal"><var id="lang_background_normal"></var></span>
+    <span class="" tabsrc="imgManager"><var id="lang_background_local"></var></span>
+  </div>
+  <div id="tabBodys" class="tabbody">
+    <div id="normal" class="panel">
+      <fieldset class="bgarea">
+        <legend><var id="lang_background_set"></var></legend>
+        <div class="content">
+          <div>
+            <input class="iptradio" type="radio" name="t" value="none" checked="checked" onclick="net(this)"><label><var id="lang_background_none"></var></label>
+          </div>
+          <div class="wrapcolor">
+            <div class="color">
+              <input class="iptradio" type="radio" name="t" value="color" onclick="net(this)"><label><var id="lang_background_color"></var>:</label>
+            </div>
+            <div id="colorPicker"></div>
+            <div class="clear"></div>
+          </div>
+          <div class="wrapcolor pl">
+            <label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
+          </div>
+          <div id="alignment" class="alignment">
+            <var id="lang_background_align"></var>:<select id="repeatType" onchange="selectAlign(this)">
+            <option value="center"></option>
+            <option value="repeat-x"></option>
+            <option value="repeat-y"></option>
+            <option value="repeat"></option>
+            <option value="self"></option>
+          </select>
+          </div>
+          <div id="custom">
+            <var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px&nbsp;&nbsp;y:<input type="text" size="1" id="y" maxlength="4" value="0">px
+          </div>
+        </div>
+      </fieldset>
+    </div>
+    <div id="imgManager" class="panel">
+      <div id="imageList" style=""></div>
+    </div>
+  </div>
+</div>
+<%= javascript_include_tag 'ueditor/dialogs/internal.js' %>
+<%= javascript_include_tag 'ueditor/dialogs/background/background.js' %>
+</body>
+</html>

data/vendor/assets/javascripts/ueditor/dialogs/background/background.js ADDED

@@ -0,0 +1,348 @@
+var me = editor,
+    doc = me.document,
+    bodyStyle,
+    cp = $G("colorPicker"),
+    bkbodyStyle = "",
+    bkcolor = "";
+var popup = new UE.ui.Popup({
+    content:new UE.ui.ColorPicker({
+        noColorText:me.getLang("clearColor"),
+        editor:me,
+        onpickcolor:function (t, color) {
+            domUtils.setStyle(cp, "background-color", color);
+            bkcolor = color;
+            UE.ui.Popup.postHide();
+        },
+        onpicknocolor:function (t, color) {
+            domUtils.setStyle(cp, "background-color", "transparent");
+            bkcolor = "";
+            UE.ui.Popup.postHide();
+        }
+    }),
+    editor:me,
+    onhide:function () {
+        setBody();
+    }
+});
+domUtils.on(cp, "click", function () {
+    popup.showAnchor(this);
+});
+domUtils.on(document, 'mousedown', function (evt) {
+    var el = evt.target || evt.srcElement;
+    UE.ui.Popup.postHide(el);
+});
+domUtils.on(window, 'scroll', function () {
+    UE.ui.Popup.postHide();
+});
+//获得head
+var getHead = function () {
+    return domUtils.getElementsByTagName($G("tabHeads"), "span");
+};
+//给head绑定事件
+var bindClick = function () {
+    var heads = getHead();
+    for (var i = 0, head; head = heads[i++];) {
+        head.onclick = function () {
+            var bodyid = this.getAttribute("tabsrc");
+            toggleHead(this);
+            toggleBody(bodyid);
+            if (bodyid == "imgManager") {
+                ajax.request(editor.options.imageManagerUrl, {
+                    timeout:100000,
+                    action:"get",
+                    onsuccess:function (xhr) {
+                        var tmp = utils.trim(xhr.responseText),
+                            imageUrls = !tmp ? [] : tmp.split("ue_separate_ue"),
+                            length = imageUrls.length,
+                            imgList = $G("imageList");
+                        imgList.innerHTML = !length ? "&nbsp;&nbsp;" + lang.noUploadImage : "";
+                        for (var k = 0, ci; ci = imageUrls[k++];) {
+                            var img = document.createElement("img");
+                            var div = document.createElement("div");
+                            div.appendChild(img);
+                            div.style.display = "none";
+                            imgList.appendChild(div);
+                            img.onclick = function () {
+                                var nodes = imgList.childNodes;
+                                for (var i = 0, node; node = nodes[i++];) {
+                                    node.firstChild.removeAttribute("selected");
+                                    node.firstChild.style.cssText = "filter:alpha(Opacity=100);-moz-opacity:1;opacity: 1;border: 2px solid #fff";
+                                }
+                                changeSelected(this);
+                            };
+                            img.onload = function () {
+                                this.parentNode.style.display = "";
+                                var w = this.width, h = this.height;
+                                scale(this, 95, 120, 80);
+                                this.title = lang.toggleSelect + w + "X" + h;
+                            };
+                            img.setAttribute(k < 35 ? "src" : "lazy_src", editor.options.imageManagerPath + ci.replace(/\s+|\s+/ig, ""));
+                            img.setAttribute("data_ue_src", editor.options.imageManagerPath + ci.replace(/\s+|\s+/ig, ""));
+                        }
+                    },
+                    onerror:function () {
+                        $G("imageList").innerHTML = lang.imageLoadError;
+                    }
+                });
+            } else {
+                var radios = document.getElementsByName("t");
+                for (var i = 0, r; r = radios[i++];) {
+                    if (r.checked && r.value != "none") {
+                        $G("repeatType").style.display = "";
+                        net(r);
+                    }
+                }
+            }
+        }
+    }
+};
+/**
+ * 改变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;";
+    }
+    $G("url").value = o.getAttribute("src")
+}
+/**
+ * 图片缩放
+ * @param img
+ * @param max
+ */
+function scale(img, max, oWidth, oHeight) {
+    var width = 0, height = 0, percent, ow = img.width || oWidth, oh = img.height || oHeight;
+    if (ow > max || oh > max) {
+        if (ow >= oh) {
+            if (width = ow - max) {
+                percent = (width / ow).toFixed(2);
+                img.height = oh - oh * percent;
+                img.width = max;
+            }
+        } else {
+            if (height = oh - max) {
+                percent = (height / oh).toFixed(2);
+                img.width = ow - ow * percent;
+                img.height = max;
+            }
+        }
+    }
+}
+//切换body
+var toggleBody = function (id) {
+    var bodys = ["normal", "imgManager"];
+    for (var i = 0, body; body = bodys[i++];) {
+        $G(body).style.zIndex = body == id ? 200 : 1;
+    }
+};
+//切换head
+var toggleHead = function (obj) {
+    var heads = getHead();
+    for (var i = 0, head; head = heads[i++];) {
+        domUtils.removeClasses(head, ["focus"]);
+        $G("repeatType").style.display = "none";
+    }
+    domUtils.addClass(obj, "focus");
+};
+//获得当前选中的tab
+var getCheckedTab = function () {
+    var heads = getHead();
+    for (var i = 0, head; head = heads[i++];) {
+        if (domUtils.hasClass(head, "focus")) {
+            return head;
+        }
+    }
+};
+var init = function () {
+    bindClick();
+    var el = getHead()[0],
+            bodyid = el.getAttribute("tabsrc");
+    toggleHead(el);
+    toggleBody(bodyid);
+    $G("alignment").style.display = "none";
+    $G("custom").style.display = "none";
+    //初始化颜色
+    domUtils.setStyle(cp, "background-color", domUtils.getComputedStyle(doc.body, "background-color"));
+    var color = domUtils.getComputedStyle(doc.body, "background-color");
+    if ((color && color != "#ffffff" && color != "transparent") || domUtils.getComputedStyle(doc.body, "background-image") != "none") {
+        setTimeout(function () {
+            document.getElementsByName("t")[1].click();
+        }, 200);
+    }
+    initImgUrl();
+    initSelfPos();
+    initAlign();
+};
+//初始化自定义位置
+function initSelfPos() {
+    var x, y;
+    if (browser.ie) {
+        x = domUtils.getComputedStyle(doc.body, "background-position-x").replace(/50%|%|px|center/ig, "");
+        y = domUtils.getComputedStyle(doc.body, "background-position-y").replace(/50%|%|px|center/ig, "");
+    } else {
+        var arr = domUtils.getComputedStyle(doc.body, "background-position").match(/\s?(\d*)px/ig);
+        if (arr && arr.length) {
+            x = arr[0].replace("px", "");
+            y = arr[1].replace("px", "");
+        }
+    }
+    $G("x").value = x || 0;
+    $G("y").value = y || 0;
+}
+//初始化图片地址
+function initImgUrl() {
+    var su = domUtils.getComputedStyle(doc.body, "background-image"),
+        url = "";
+    if (su.indexOf(me.options.imagePath) > 0) {
+        url = su.match(/url\("?(.*[^\)"])"?/i);
+        if (url && url.length) {
+            url = url[1].substring(url[1].indexOf(me.options.imagePath), url[1].length);
+        }
+    } else {
+        url = su != "none" ? su.replace(/url\("?|"?\)/ig, "") : "";
+    }
+    $G("url").value = url;
+}
+//初始化定位
+function initAlign() {
+    var align = domUtils.getComputedStyle(doc.body, "background-repeat"),
+        alignType = $G("repeatType");
+    if (align == "no-repeat") {
+        var pos = domUtils.getComputedStyle(doc.body, browser.ie ? "background-position-x" : "background-position");
+        alignType.value = pos && pos.match(/\s?(\d*)px/ig) ? "self" : "center";
+        if (pos == "center") {
+            alignType.value = "center";
+        }
+        $G("custom").style.display = alignType.value == "self" ? "" : "none";
+    } else {
+        alignType.value = align;
+    }
+}
+    init();
+//获得选中的类型
+function getCheckIpt() {
+    var ipts = document.getElementsByName("t");
+    for (var i = 0, ipt; ipt = ipts[i++];) {
+        if (ipt.checked) {
+            return ipt.value;
+        }
+    }
+}
+var net = function (obj) {
+    var align = $G("alignment"),
+        url = $G("url"),
+        custom = $G("custom");
+    if (obj.value == "none") {
+        align.style.display = "none";
+        custom.style.display = "none";
+        if (browser.ie) {
+            url.onpropertychange = null;
+        } else {
+            url.removeEventListener("input", setBody);
+        }
+    } else {
+        bindSelfPos();
+        $G("repeatType").style.display = "";
+        align.style.display = "";
+        if (browser.ie) {
+            url.onpropertychange = setBody;
+        } else {
+            url.addEventListener("input", setBody, false);
+        }
+    }
+    setBody();
+};
+//给自定义位置绑定事件
+var bindSelfPos = function () {
+    var x = $G("x"),
+        y = $G("y");
+    domUtils.on(x, ["propertychange", "input", "keydown"], function (evt) {
+        bindkeydown(evt, this);
+    });
+    domUtils.on(y, ["propertychange", "input", "keydown"], function (evt) {
+        bindkeydown(evt, this);
+    });
+    function bindkeydown(evt, obj) {
+        evt = evt || event;
+        if (evt.keyCode == 38 || evt.keyCode == 40) {
+            obj.value = evt.keyCode == 38 ? parseInt(obj.value) + 1 : parseInt(obj.value) - 1;
+            if (obj.value < 0) {
+                obj.value = 0;
+            }
+        } else {
+            if (evt.keyCode < 48 && evt.keyCode > 57) {
+                domUtils.preventDefault(evt);
+            }
+        }
+        setBody();
+    }
+};
+var showAlign = function () {
+    $G("alignment").style.display = "";
+};
+var selectAlign = function (obj) {
+    $G("custom").style.display = obj.value == "self" ? "" : "none";
+    setBody();
+};
+//给body增加样式和背景图片
+var setBody = function () {
+    var color = domUtils.getStyle(cp, "background-color"),
+        bgimg = $G("url").value,
+        align = $G("repeatType").value,
+        alignObj = {
+            "background-repeat":"no-repeat",
+            "background-position":"center center"
+        },
+        outstr = [];
+    if (color)
+        alignObj["background-color"] = color;
+    if (bgimg)
+        alignObj["background-image"] = 'url("' + bgimg + '")';
+    switch (align) {
+        case "repeat-x":
+            alignObj["background-repeat"] = "repeat-x;";
+            break;
+        case "repeat-y":
+            alignObj["background-repeat"] = "repeat-y;";
+            break;
+        case "repeat":
+            alignObj["background-repeat"] = "repeat;";
+            break;
+        case "self":
+            alignObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
+            break;
+    }
+    for (var name in alignObj) {
+        if (alignObj.hasOwnProperty(name)) {
+            outstr.push(name + ":" + alignObj[name]);
+        }
+    }
+    if (getCheckIpt() != "none") {
+        utils.cssRule('body','body{' + outstr.join(";") + '}',doc);
+    } else {
+        utils.cssRule('body','',doc)
+    }
+};
+dialog.onok = function () {
+    setBody();
+};
+dialog.oncancel = function () {
+    utils.cssRule('body',bkbodyStyle,doc)
+};
+bkbodyStyle = utils.cssRule('body',undefined,doc);