npm - @lingxiteam/lcdp-ueditor-react - Versions diffs - 1.0.0-alpha.1 - Mend

@lingxiteam/lcdp-ueditor-react 1.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (272) hide show

package/ueditor-resource/dialogs/audio/icon/center-active.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/center.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/img.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/left-active.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/left.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/none-active.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/none.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/right-active.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/icon/right.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/bg.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/center_focus.jpg ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/file-icons.gif ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/file-icons.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/icons.gif ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/icons.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/image.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/left_focus.jpg ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/none_focus.jpg ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/progress.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/right_focus.jpg ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/success.gif ADDED Viewed

Binary file

package/ueditor-resource/dialogs/audio/images/success.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/background/background.css ADDED Viewed

@@ -0,0 +1,193 @@
+.wrapper {
+    width: 424px;
+    margin: 10px auto;
+    zoom: 1;
+    position: relative
+}
+.tabbody {
+    height: 225px;
+}
+.tabbody .panel {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    background: #fff;
+    display: none;
+}
+.tabbody .focus {
+    display: block;
+}
+body {
+    font-size: 12px;
+    color: #888;
+    overflow: hidden;
+}
+input, label {
+    vertical-align: middle
+}
+.clear {
+    clear: both;
+}
+.pl {
+    padding-left: 18px;
+    padding-left: 23px \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: 0px 5px 5px 0px;
+}
+.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: 23px;
+    margin-left: 28px \9;
+}
+#custom input {
+    height: 15px;
+    min-height: 15px;
+    width: 20px;
+}
+#repeatType {
+    width: 100px;
+}
+/* 图片管理样式 */
+#imgManager {
+    width: 100%;
+    height: 225px;
+}
+#imgManager #imageList {
+    width: 100%;
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+#imgManager ul {
+    display: block;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+#imgManager li {
+    float: left;
+    display: block;
+    list-style: none;
+    padding: 0;
+    width: 113px;
+    height: 113px;
+    margin: 9px 0 0 19px;
+    background-color: #eee;
+    overflow: hidden;
+    cursor: pointer;
+    position: relative;
+}
+#imgManager li.clearFloat {
+    float: none;
+    clear: both;
+    display: block;
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+}
+#imgManager li img {
+    cursor: pointer;
+}
+#imgManager li .icon {
+    cursor: pointer;
+    width: 113px;
+    height: 113px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 2;
+    border: 0;
+    background-repeat: no-repeat;
+}
+#imgManager li .icon:hover {
+    width: 107px;
+    height: 107px;
+    border: 3px solid #1094fa;
+}
+#imgManager li.selected .icon {
+    background-image: url(images/success.png);
+    background-position: 75px 75px;
+}
+#imgManager li.selected .icon:hover {
+    width: 107px;
+    height: 107px;
+    border: 3px solid #1094fa;
+    background-position: 72px 72px;
+}

package/ueditor-resource/dialogs/background/background.html ADDED Viewed

@@ -0,0 +1,59 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
+    <script type="text/javascript" src="../internal.js?32939b8e"></script>
+    <link rel="stylesheet" type="text/css" href="background.css?399b33ed">
+</head>
+<body>
+<div id="bg_container" class="wrapper">
+    <div id="tabHeads" class="tabhead">
+        <span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
+    </div>
+    <div id="tabBodys" class="tabbody">
+        <div id="normal" class="panel focus">
+            <fieldset class="bgarea">
+                <legend><var id="lang_background_set"></var></legend>
+                <div class="content">
+                    <div>
+                        <label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none"
+                                      checked="checked"><var id="lang_background_none"></var></label>
+                        <label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var
+                            id="lang_background_colored"></var></label>
+                    </div>
+                    <div class="wrapcolor pl">
+                        <div class="color">
+                            <var id="lang_background_color"></var>:
+                        </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">
+                        <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>
+</div>
+<script type="text/javascript" src="background.js?1ed7635f"></script>
+</body>
+</html>

package/ueditor-resource/dialogs/background/background.js ADDED Viewed

@@ -0,0 +1,370 @@
+(function () {
+    var onlineImage,
+        backupStyle = editor.queryCommandValue('background');
+    window.onload = function () {
+        initTabs();
+        initColorSelector();
+    };
+    /* 初始化tab标签 */
+    function initTabs() {
+        var tabs = $G('tabHeads').children;
+        for (var i = 0; i < tabs.length; i++) {
+            domUtils.on(tabs[i], "click", function (e) {
+                var target = e.target || e.srcElement;
+                for (var j = 0; j < tabs.length; j++) {
+                    if (tabs[j] == target) {
+                        tabs[j].className = "focus";
+                        var contentId = tabs[j].getAttribute('data-content-id');
+                        $G(contentId).style.display = "block";
+                    } else {
+                        tabs[j].className = "";
+                        $G(tabs[j].getAttribute('data-content-id')).style.display = "none";
+                    }
+                }
+            });
+        }
+    }
+    /* 初始化颜色设置 */
+    function initColorSelector() {
+        var obj = editor.queryCommandValue('background');
+        if (obj) {
+            var color = obj['background-color'],
+                repeat = obj['background-repeat'] || 'repeat',
+                image = obj['background-image'] || '',
+                position = obj['background-position'] || 'center center',
+                pos = position.split(' '),
+                x = parseInt(pos[0]) || 0,
+                y = parseInt(pos[1]) || 0;
+            if (repeat == 'no-repeat' && (x || y)) repeat = 'self';
+            image = image.match(/url[\s]*\(([^\)]*)\)/);
+            image = image ? image[1] : '';
+            updateFormState('colored', color, image, repeat, x, y);
+        } else {
+            updateFormState();
+        }
+        var updateHandler = function () {
+            updateFormState();
+            updateBackground();
+        }
+        domUtils.on($G('nocolorRadio'), 'click', updateBackground);
+        domUtils.on($G('coloredRadio'), 'click', updateHandler);
+        domUtils.on($G('url'), 'keyup', function () {
+            if ($G('url').value && $G('alignment').style.display == "none") {
+                utils.each($G('repeatType').children, function (item) {
+                    item.selected = ('repeat' == item.getAttribute('value') ? 'selected' : false);
+                });
+            }
+            updateHandler();
+        });
+        domUtils.on($G('repeatType'), 'change', updateHandler);
+        domUtils.on($G('x'), 'keyup', updateBackground);
+        domUtils.on($G('y'), 'keyup', updateBackground);
+        initColorPicker();
+    }
+    /* 初始化颜色选择器 */
+    function initColorPicker() {
+        var me = editor,
+            cp = $G("colorPicker");
+        /* 生成颜色选择器ui对象 */
+        var popup = new UE.ui.Popup({
+            content: new UE.ui.ColorPicker({
+                noColorText: me.getLang("clearColor"),
+                editor: me,
+                onpickcolor: function (t, color) {
+                    updateFormState('colored', color);
+                    updateBackground();
+                    UE.ui.Popup.postHide();
+                },
+                onpicknocolor: function (t, color) {
+                    updateFormState('colored', 'transparent');
+                    updateBackground();
+                    UE.ui.Popup.postHide();
+                }
+            }),
+            editor: me,
+            onhide: function () {
+            }
+        });
+        /* 设置颜色选择器 */
+        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();
+        });
+    }
+    /* 更新背景色设置面板 */
+    function updateFormState(radio, color, url, align, x, y) {
+        var nocolorRadio = $G('nocolorRadio'),
+            coloredRadio = $G('coloredRadio');
+        if (radio) {
+            nocolorRadio.checked = (radio == 'colored' ? false : 'checked');
+            coloredRadio.checked = (radio == 'colored' ? 'checked' : false);
+        }
+        if (color) {
+            domUtils.setStyle($G("colorPicker"), "background-color", color);
+        }
+        if (url && /^\//.test(url)) {
+            var a = document.createElement('a');
+            a.href = url;
+            browser.ie && (a.href = a.href);
+            url = browser.ie ? a.href : (a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
+        }
+        if (url || url === '') {
+            $G('url').value = url;
+        }
+        if (align) {
+            utils.each($G('repeatType').children, function (item) {
+                item.selected = (align == item.getAttribute('value') ? 'selected' : false);
+            });
+        }
+        if (x || y) {
+            $G('x').value = parseInt(x) || 0;
+            $G('y').value = parseInt(y) || 0;
+        }
+        $G('alignment').style.display = coloredRadio.checked && $G('url').value ? '' : 'none';
+        $G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '' : 'none';
+    }
+    /* 更新背景颜色 */
+    function updateBackground() {
+        if ($G('coloredRadio').checked) {
+            var color = domUtils.getStyle($G("colorPicker"), "background-color"),
+                bgimg = $G("url").value,
+                align = $G("repeatType").value,
+                backgroundObj = {
+                    "background-repeat": "no-repeat",
+                    "background-position": "center center"
+                };
+            if (color) backgroundObj["background-color"] = color;
+            if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
+            if (align == 'self') {
+                backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
+            } else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
+                backgroundObj["background-repeat"] = align;
+            }
+            editor.execCommand('background', backgroundObj);
+        } else {
+            editor.execCommand('background', null);
+        }
+    }
+    /* 在线图片 */
+    function OnlineImage(target) {
+        this.container = utils.isString(target) ? document.getElementById(target) : target;
+        this.init();
+    }
+    OnlineImage.prototype = {
+        init: function () {
+            this.reset();
+            this.initEvents();
+        },
+        /* 初始化容器 */
+        initContainer: function () {
+            this.container.innerHTML = '';
+            this.list = document.createElement('ul');
+            this.clearFloat = document.createElement('li');
+            domUtils.addClass(this.list, 'list');
+            domUtils.addClass(this.clearFloat, 'clearFloat');
+            this.list.id = 'imageListUl';
+            this.list.appendChild(this.clearFloat);
+            this.container.appendChild(this.list);
+        },
+        /* 初始化滚动事件,滚动到地步自动拉取数据 */
+        initEvents: function () {
+            var _this = this;
+            /* 滚动拉取图片 */
+            domUtils.on($G('imageList'), 'scroll', function (e) {
+                var panel = this;
+                if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
+                    _this.getImageData();
+                }
+            });
+            /* 选中图片 */
+            domUtils.on(this.container, 'click', function (e) {
+                var target = e.target || e.srcElement,
+                    li = target.parentNode,
+                    nodes = $G('imageListUl').childNodes;
+                if (li.tagName.toLowerCase() == 'li') {
+                    updateFormState('nocolor', null, '');
+                    for (var i = 0, node; node = nodes[i++];) {
+                        if (node == li && !domUtils.hasClass(node, 'selected')) {
+                            domUtils.addClass(node, 'selected');
+                            updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
+                        } else {
+                            domUtils.removeClasses(node, 'selected');
+                        }
+                    }
+                    updateBackground();
+                }
+            });
+        },
+        /* 初始化第一次的数据 */
+        initData: function () {
+            /* 拉取数据需要使用的值 */
+            this.state = 0;
+            this.listSize = editor.getOpt('imageManagerListSize');
+            this.listIndex = 0;
+            this.listEnd = false;
+            /* 第一次拉取数据 */
+            this.getImageData();
+        },
+        /* 重置界面 */
+        reset: function () {
+            this.initContainer();
+            this.initData();
+        },
+        /* 向后台拉取图片列表数据 */
+        getImageData: function () {
+            var _this = this;
+            if (!_this.listEnd && !this.isLoadingData) {
+                this.isLoadingData = true;
+                var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
+                    isJsonp = utils.isCrossDomainUrl(url);
+                ajax.request(url, {
+                    'timeout': 100000,
+                    'dataType': isJsonp ? 'jsonp' : '',
+                    'data': utils.extend({
+                        start: this.listIndex,
+                        size: this.listSize
+                    }, editor.queryCommandValue('serverparam')),
+                    'headers': editor.options.serverHeaders || {},
+                    'method': 'get',
+                    'onsuccess': function (r) {
+                        try {
+                            var json = isJsonp ? r : eval('(' + r.responseText + ')');
+                            if (json.state == 'SUCCESS') {
+                                _this.pushData(json.list);
+                                _this.listIndex = parseInt(json.start) + parseInt(json.list.length);
+                                if (_this.listIndex >= json.total) {
+                                    _this.listEnd = true;
+                                }
+                                _this.isLoadingData = false;
+                            }
+                        } catch (e) {
+                            if (r.responseText.indexOf('ue_separate_ue') != -1) {
+                                var list = r.responseText.split(r.responseText);
+                                _this.pushData(list);
+                                _this.listIndex = parseInt(list.length);
+                                _this.listEnd = true;
+                                _this.isLoadingData = false;
+                            }
+                        }
+                    },
+                    'onerror': function () {
+                        _this.isLoadingData = false;
+                    }
+                });
+            }
+        },
+        /* 添加图片到列表界面上 */
+        pushData: function (list) {
+            var i, item, img, icon, _this = this,
+                urlPrefix = editor.getOpt('imageManagerUrlPrefix');
+            for (i = 0; i < list.length; i++) {
+                if (list[i] && list[i].url) {
+                    item = document.createElement('li');
+                    img = document.createElement('img');
+                    icon = document.createElement('span');
+                    domUtils.on(img, 'load', (function (image) {
+                        return function () {
+                            _this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
+                        }
+                    })(img));
+                    img.width = 113;
+                    img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=' : '&noCache=') + (+new Date()).toString(36));
+                    img.setAttribute('_src', urlPrefix + list[i].url);
+                    domUtils.addClass(icon, 'icon');
+                    item.appendChild(img);
+                    item.appendChild(icon);
+                    this.list.insertBefore(item, this.clearFloat);
+                }
+            }
+        },
+        /* 改变图片大小 */
+        scale: function (img, w, h, type) {
+            var ow = img.width,
+                oh = img.height;
+            if (type == 'justify') {
+                if (ow >= oh) {
+                    img.width = w;
+                    img.height = h * oh / ow;
+                    img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
+                } else {
+                    img.width = w * ow / oh;
+                    img.height = h;
+                    img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
+                }
+            } else {
+                if (ow >= oh) {
+                    img.width = w * ow / oh;
+                    img.height = h;
+                    img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
+                } else {
+                    img.width = w;
+                    img.height = h * oh / ow;
+                    img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
+                }
+            }
+        },
+        getInsertList: function () {
+            var i, lis = this.list.children, list = [], align = getAlign();
+            for (i = 0; i < lis.length; i++) {
+                if (domUtils.hasClass(lis[i], 'selected')) {
+                    var img = lis[i].firstChild,
+                        src = img.getAttribute('_src');
+                    list.push({
+                        src: src,
+                        _src: src,
+                        floatStyle: align
+                    });
+                }
+            }
+            return list;
+        }
+    };
+    dialog.onok = function () {
+        updateBackground();
+        editor.fireEvent('saveScene');
+    };
+    dialog.oncancel = function () {
+        editor.execCommand('background', backupStyle);
+    };
+})();

package/ueditor-resource/dialogs/background/images/bg.png ADDED Viewed

Binary file

package/ueditor-resource/dialogs/background/images/success.png ADDED Viewed

Binary file