init commit

public/assets/addons/wdsxh/libs/colorpicker/colorpicker.css

@@ -0,0 +1,43 @@
+.colorpicker-mask{position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px;}
+.colorpicker-base{position: inherit;z-index: 100;/*display: flex;*/box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px, rgba(0, 0, 0, 0.3) 0px 4px 8px;}
+.color-palette{/*width:200px;*/padding:10px;background: #f9f9f9;display: flex;flex-flow: row wrap;align-content: flex-start}
+.color-palette .color-palette-item{width:10%;height:20px; transition: transform 0.5s; -webkit-transition: transform 0.5s;}
+.color-palette .color-palette-item:hover{ transform: scale(1.2); -webkit-transform: scale(1.2);}
+.colorpicker-pancel{background: rgb(255, 255, 255);box-sizing: initial; width: 225px; font-family: Menlo;}
+.color-board{width: 100%; padding-bottom: 58%; position: relative; border-radius: 2px 2px 0px 0px; overflow: hidden;}
+.color-board .color-pancel{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;}
+.saturation-white{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;background: -webkit-linear-gradient(to right, #fff, rgba(255,255,255,0));background: linear-gradient(to right, #fff, rgba(255,255,255,0));}
+.saturation-white .saturation-black{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;background: -webkit-linear-gradient(to top, #000, rgba(0,0,0,0));background: linear-gradient(to top, #000, rgba(0,0,0,0));}
+.saturation-white .pickerBtn{position: absolute; top: 0%; left: 100%; cursor: default;}
+.saturation-white .pickerBtn .pickerBtn-in{width: 12px; height: 12px; border-radius: 6px; box-shadow: rgb(255, 255, 255) 0px 0px 0px 1px inset; transform: translate(-6px, -6px);}
+.color_hue{padding: 0 16px 12px;}
+.color_hue .flexbox-fix{display: flex;}
+.color_hue .flexbox-fix1{align-items: center;height: 30px; padding-top: 2px;}
+.color_hue .flexbox-fix1 .huering_l{width: 32px;}
+.color_hue .flexbox-fix1 .huering_l .color_showBox{width: 16px; height: 16px; border-radius: 8px; position: relative; overflow: hidden;background-image: url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABQAAD/4QMqaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTlBNkE1N0M0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTlBNkE1N0Q0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBOUE2QTU3QTRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBOUE2QTU3QjRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv/uAA5BZG9iZQBkwAAAAAH/2wCEAAICAgICAgICAgIDAgICAwQDAgIDBAUEBAQEBAUGBQUFBQUFBgYHBwgHBwYJCQoKCQkMDAwMDAwMDAwMDAwMDAwBAwMDBQQFCQYGCQ0LCQsNDw4ODg4PDwwMDAwMDw8MDAwMDAwPDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/AABEIAAgACAMBEQACEQEDEQH/xABVAAEAAAAAAAAAAAAAAAAAAAAJAQEAAAAAAAAAAAAAAAAAAAAAEAAAAwkAAAAAAAAAAAAAAAAREhMAQWGTFIQVZTcRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AGW6posFdK1UkpUYiLgYP//Z);}
+.color_showBox .colorpicker-showColor{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px 1px inset;z-index: 2;}
+.color_showBox .cs_mask{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMUlEQVQ4T2NkYGAQYcAP3uCTZhw1gGGYhAGBZIA/nYDCgBDAm9BGDWAAJyRCgLaBCAAgXwixzAS0pgAAAABJRU5ErkJggg==") left center;}
+.color_hue .flexbox-fix1 .huering_r{-webkit-box-flex: 1; flex: 1 1 0%;}
+.hueringBox{height: 10px; position: relative;}
+.hueringBox .hueringBox-in{position: absolute; top: 0px;right: 0px; bottom: 0px; left: 0px;}
+.hueringBox .hue-horizontal{padding: 0px 2px; position: relative; height: 100%;background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);background: -webkit-linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);}
+.hueringBox  .hue-vertical{background: linear-gradient(to top, #f00 0%, #ff0 17%, #0f0 33%,#0ff 50%, #00f 67%, #f0f 83%, #f00 100%);background: -webkit-linear-gradient(to top, #f00 0%, #ff0 17%,#0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);}
+.hue-horizontal .colorBar-color-picker{position: absolute; left: 0%;}
+.hue-horizontal .colorBar-color-picker .colorBar-colorhue-cur{width: 12px; height: 12px; border-radius: 6px; transform: translate(-6px, -1px); background-color: rgb(248, 248, 248); box-shadow: rgba(0, 0, 0, 0.37) 0px 1px 4px 0px;}
+.flexbox-fix2{ height: 20px;align-items: center;}
+.transparencyBox{padding: 0px 2px; position: relative; height: 10px; width:100%; background-image: url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABQAAD/4QMqaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTlBNkE1N0M0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTlBNkE1N0Q0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBOUE2QTU3QTRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBOUE2QTU3QjRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv/uAA5BZG9iZQBkwAAAAAH/2wCEAAICAgICAgICAgIDAgICAwQDAgIDBAUEBAQEBAUGBQUFBQUFBgYHBwgHBwYJCQoKCQkMDAwMDAwMDAwMDAwMDAwBAwMDBQQFCQYGCQ0LCQsNDw4ODg4PDwwMDAwMDw8MDAwMDAwPDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/AABEIAAgACAMBEQACEQEDEQH/xABVAAEAAAAAAAAAAAAAAAAAAAAJAQEAAAAAAAAAAAAAAAAAAAAAEAAAAwkAAAAAAAAAAAAAAAAREhMAQWGTFIQVZTcRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AGW6posFdK1UkpUYiLgYP//Z);}
+.transparencyBox .transparency-color{ position: absolute; left: 0; right: 0; top: 0; bottom: 0;background: linear-gradient(to right, rgba(255,255,255,0), #000);}
+.transparencyBox .colorBar-opacity-picker{position: absolute; left: 100%;}
+.transparencyBox .colorBar-opacity-picker .transparency-cur{width: 12px; height: 12px; border-radius: 6px; transform: translate(-6px, -1px); background-color: rgb(248, 248, 248); box-shadow: rgba(0, 0, 0, 0.37) 0px 1px 4px 0px;}
+.flexbox-fix3{padding-top: 10px;}
+.flexbox-fix3 .colorpicker-inputWrap{-webkit-box-flex: 1; flex: 1 1 0%; display: flex; margin-left: -6px;}
+.flexbox-fix3 .colorpicker-showModeBtn{width: 32px; text-align: right; position: relative;}
+.flexbox-fix3 .colorpicker-showModeBtn .showModeBtn-in{margin-right: -4px;  cursor: pointer; position: relative;}
+.colorpicker-hexBox{padding-left: 6px; width: 100%;}
+.colorpicker-hexBox .colorpicker-hexBox-in{position: relative;}
+.colorpicker-hexBox .colorpicker-hexInput{font-size: 11px; color: rgb(51, 51, 51); width: 100%; border-radius: 2px; border: none; box-shadow: rgb(218, 218, 218) 0px 0px 0px 1px inset; height: 21px; text-align: center;}
+.colorpicker-hexBox .colorpicker-hexSpan{text-transform: uppercase; font-size: 11px; line-height: 11px; color: rgb(150, 150, 150); text-align: center; display: block; margin-top: 7px;}
+.colorpicker-rgbBox{padding-left: 6px; width: 100%;}
+.colorpicker-rgbBox .colorpicker-rgbBox-in{position: relative;}
+.colorpicker-rgbBox .colorpicker-hexInput{font-size: 11px; color: rgb(51, 51, 51); width: 100%; border-radius: 2px; border: none; box-shadow: rgb(218, 218, 218) 0px 0px 0px 1px inset; height: 21px; text-align: center;}
+.colorpicker-rgbBox .colorpicker-hexSpan{text-transform: uppercase; font-size: 11px; line-height: 11px; color: rgb(150, 150, 150); text-align: center; display: block; margin-top: 7px;}

public/assets/addons/wdsxh/libs/colorpicker/colorpicker.js

@@ -0,0 +1,498 @@
+(function () {
+
+	var util = {
+		css: function (elem, obj) {
+			for (var i in obj) {
+				elem.style[i] = obj[i];
+			}
+		},
+		hasClass: function (elem, classN) {
+			var className = elem.getAttribute("class");
+			return className.indexOf(classN) != -1;
+		}
+	};
+
+	function Colorpicker(opt) {
+		if (this === window) throw `Colorpicker: Can't call a function directly`;
+		this.init(opt);
+	};
+
+	Colorpicker.prototype = {
+		init(opt) {
+			let { el, initColor = "rgb(255,0,0)", allMode = ['hex', 'rgb'], color = '' } = opt;
+			var elem = document.getElementById(el);
+			if (!(elem && elem.nodeType && elem.nodeType === 1)) {
+				throw `Colorpicker: not found  ID:${el}  HTMLElement,not ${{}.toString.call(el)}`;
+			}
+
+			this.Opt = {
+				...opt,
+				el,
+				initColor,
+				allMode,
+				color
+			}
+			
+			this.bindElem = elem; // 绑定的元素
+			this.elem_wrap = null; // 最外层容器
+			this.fixedBg = null; // 拾色器后面固定定位的透明div 用于点击隐藏拾色器
+			this.elem_colorPancel = null; // 色彩面板
+			this.elem_picker = null; // 拾色器色块按钮
+			this.elem_barPicker1 = null; // 颜色条
+			this.elem_barPicker2 = null; //透明度
+			this.elem_hexInput = null; // 显示hex的表单
+			this.elem_showColor = null; // 显示当前颜色
+			this.elem_showModeBtn = null; // 切换输入框模式按钮
+			this.elem_inputWrap = null; // 输入框外层容器
+
+			this.pancelLeft = 0;
+			this.pancelTop = 0;
+
+			this.downX = 0;
+			this.downY = 0;
+			this.moveX = 0;
+			this.moveY = 0;
+
+			this.pointLeft = 0;
+			this.pointTop = 0;
+
+			this.current_mode = 'hex'; // input框当前的模式
+
+			this.rgba = { r: 0, g: 0, b: 0, a: 1 };
+			this.hsb = { h: 0, s: 100, b: 100 };
+
+
+			var _this = this, rgb = initColor.slice(4, -1).split(",");
+
+			this.rgba.r = parseInt(rgb[0]);
+			this.rgba.g = parseInt(rgb[1]);
+			this.rgba.b = parseInt(rgb[2]);
+			color=color.length < 1?'#000000':color;
+			color=color.indexOf('#')== -1?color:this.hexToRgba(color);			
+			var rgbCur = color.slice(5, -1).split(",");
+			var rgbC = { r: 0, g: 0, b: 0 };
+			rgbC.r = parseInt(rgbCur[0]);
+			rgbC.g = parseInt(rgbCur[1]);
+			rgbC.b = parseInt(rgbCur[2]);
+			if (rgbCur[3]) {
+				this.rgba.a = rgbCur[3];
+			}
+			this.hsb = _this.rgbToHsb(rgbC);
+			color = "#" + _this.rgbToHex(rgbC);
+
+			var body = document.getElementsByTagName("body")[0],
+				div = document.createElement("div");
+
+			div.innerHTML = this.render();
+			body.appendChild(div);
+
+			this.elem_wrap = div;
+			this.fixedBg = div.children[0];
+			this.elem_colorPancel = div.getElementsByClassName("color-pancel")[0];
+			this.pancel_width = this.elem_colorPancel.offsetWidth;
+			this.pancel_height = this.elem_colorPancel.offsetHeight;
+			this.elem_picker = div.getElementsByClassName("pickerBtn")[0];
+			this.elem_colorPalette = div.getElementsByClassName("color-palette")[0];
+			this.elem_showColor = div.getElementsByClassName("colorpicker-showColor")[0];
+			this.elem_barPicker1 = div.getElementsByClassName("colorBar-color-picker")[0];
+			this.barPicker1ParentNode_width = this.elem_barPicker1.parentNode.offsetWidth;
+			this.elem_barPicker2 = div.getElementsByClassName("colorBar-opacity-picker")[0];
+			this.barPicker2ParentNode_width = this.elem_barPicker2.parentNode.offsetWidth;
+			this.elem_hexInput = div.getElementsByClassName("colorpicker-hexInput")[0];
+			this.elem_showModeBtn = div.getElementsByClassName("colorpicker-showModeBtn")[0];
+			this.elem_inputWrap = div.getElementsByClassName("colorpicker-inputWrap")[0];
+			var elem = this.bindElem;
+			var top = elem.offsetTop;
+			var left = elem.offsetLeft;
+			while (elem.offsetParent) {
+				top += elem.offsetParent.offsetTop;
+				left += elem.offsetParent.offsetLeft;
+				elem = elem.offsetParent;
+			}
+			this.pancelLeft = left;
+			this.pancelTop = top + this.bindElem.offsetHeight;
+			util.css(div, {
+				"position": "absolute",
+				"z-index": 2,
+				"display": 'none',
+				"left": left + "px",
+				"top": top + this.bindElem.offsetHeight + "px"
+			});
+			this.bindMove(this.elem_colorPancel, this.setPosition, true);
+			this.bindMove(this.elem_barPicker1.parentNode, this.setBar, false);
+		    this.bindMove(this.elem_barPicker2.parentNode,this.setBar,false);
+
+			this.bindElem.addEventListener("click", function () {
+				_this.show();
+			}, false);
+
+			this.fixedBg.addEventListener("click", function (e) {
+				_this.hide();
+			}, false)
+
+			this.elem_showModeBtn.addEventListener("click", function () {
+				_this.switch_current_mode();
+			}, false)
+
+			this.elem_wrap.addEventListener("input", function (e) {
+				var target = e.target, value = target.value;
+				_this.setColorByInput(value);
+			}, false);
+
+			this.elem_colorPalette.addEventListener("click", function (e) {
+				if (e.target.className=='color-palette-item') {
+					let colorStr = e.target.style.background;
+					let rgb = colorStr.slice(4, -1).split(",");
+					let rgba = {
+						r: parseInt(rgb[0]),
+						g: parseInt(rgb[1]),
+						b: parseInt(rgb[2])
+					}
+					switch (_this.current_mode) {
+						case "hex":
+							_this.setColorByInput("#" + _this.rgbToHex(rgba))
+							break;
+						case 'rgb':
+							let inputs = _this.elem_wrap.getElementsByTagName("input")
+							inputs[0].value = rgba.r;
+							inputs[1].value = rgba.g;
+							inputs[2].value = rgba.b;
+							_this.setColorByInput(colorStr);
+							break;
+					}
+					_this.setInputWrap();
+				}
+			}, false);
+			(color != '' && this.setColorByInput(color));
+		},
+		render: function () {
+			var tpl =
+				`<div class="colorpicker-mask"></div>
+				<div class="colorpicker-base">
+					<div class="colorpicker-pancel">
+						<div class="color-board">
+							<div class="color-pancel" style="background: rgb(${this.rgba.r},${this.rgba.g},${this.rgba.b});">
+								<div class="saturation-white">
+									<div class="saturation-black"></div>
+									<div class="pickerBtn">
+										<div class="pickerBtn-in"></div>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="color_hue">
+							<div class="flexbox-fix flexbox-fix1">
+								<div class="huering_l">
+									<div class="color_showBox">
+										<div class="colorpicker-showColor" style=" background:rgb(${this.rgba.r},${this.rgba.g},${this.rgba.b});"></div>
+									</div>
+								</div>
+								<div class="huering_r">
+								    <div class="hueringBox">
+										<div class="hueringBox-in">
+											<div class="hue-horizontal">
+												<div  class="colorBar-color-picker">
+													<div class="colorBar-colorhue-cur">
+													</div>
+												</div>
+											</div>
+										</div>
+									</div>
+								</div>
+							</div>
+							<div class="flexbox-fix flexbox-fix2">
+								<div class="transparencyBox">
+								    <div class="transparency-color">
+										<div class="colorBar-opacity-picker">
+											<div class="transparency-cur">
+											</div>
+										</div>
+								    </div>
+								</div>
+							</div>
+							<div class="flexbox-fix flexbox-fix3">
+								<div class="flexbox-fix colorpicker-inputWrap">
+										${this.getInputTpl()}
+								</div>
+								<div class="colorpicker-showModeBtn">
+									<div class="showModeBtn-in">
+										<svg viewBox="0 0 24 24" style="width: 24px; height: 24px; border: 1px solid transparent; border-radius: 5px;"><path fill="#333" d="M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z"></path><path fill="#333" d="M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15Z"></path></svg>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="color-palette">
+						${this.getPaletteColorsItem()}
+					</div>
+				</div>`;
+			return tpl;
+		},
+		getInputTpl: function () {
+			var current_mode_html = "";
+			switch (this.current_mode) {
+				case 'hex':
+					var hex = "#" + this.rgbToHex(this.HSBToRGB(this.hsb));
+					current_mode_html += `
+							<div class="colorpicker-hexBox">
+								<div class="colorpicker-hexBox-in">
+									<input class="colorpicker-hexInput" value="${hex}" spellcheck="false">
+									<span class="colorpicker-hexSpan">hex</span>
+								</div>
+							</div>`;
+					break;
+				case 'rgb':
+					for (var i = 0; i < 3; i++) {
+						current_mode_html +=
+							`<div class="colorpicker-rgbBox">
+								<div class="colorpicker-rgbBox-in">
+									<input class="colorpicker-hexInput" value="${this.rgba['rgb'[i]]}" spellcheck="false">
+									<span class="colorpicker-hexSpan">${'rgb'[i]}</span>
+								</div>
+							</div>`;
+					}
+				default:
+			}
+			return current_mode_html;
+		},
+		getPaletteColorsItem: function () {
+			let str = '';
+			let palette = ["rgb(216, 27, 67)", "rgb(142, 36, 170)", "rgb(81, 45, 168)", "rgb(48, 63, 159)", "rgb(30, 136, 229)", "rgb(0, 137, 123)",
+				"rgb(67, 160, 71)", "rgb(251, 192, 45)", "rgb(245, 124, 0)", "rgb(230, 74, 25)", "rgb(233, 30, 78)", "rgb(156, 39, 176)",
+				"rgb(94, 53, 177)", "rgb(57, 73, 171)", "rgb(33, 150, 243)", "rgb(0, 150, 136)", "rgb(76, 175, 80)", "rgb(253, 216, 53)",
+				"rgb(251, 140, 0)", "rgb(244, 81, 30)", "rgb(236, 64, 100)", "rgb(171, 71, 188)", "rgb(103, 58, 183)", "rgb(92, 107, 192)",
+				"rgb(66, 165, 245)", "rgb(38, 166, 154)", "rgb(129, 199, 132)", "rgb(255, 235, 59)", "rgb(255, 167, 38)", "rgb(255, 87, 34)",
+				"rgb(240, 98, 125)", "rgb(186, 104, 200)", "rgb(126, 87, 194)", "rgb(121, 134, 203)", "rgb(100, 181, 246)", "rgb(128, 203, 196)", "rgb(165, 214, 167)", "rgb(255, 241, 118)", "rgb(255, 183, 77)", "rgb(255, 138, 101)", "rgb(244, 143, 160)", "rgb(206, 147, 216)", "rgb(149, 117, 205)", "rgb(159, 168, 218)", "rgb(144, 202, 249)", "rgb(178, 223, 219)", "rgb(200, 230, 201)", "rgb(255, 245, 157)", "rgb(255, 204, 128)", "rgb(255, 171, 145)", "rgb(255, 255, 255)", "rgb(224, 224, 224)", "rgb(182, 182, 182)", "rgb(153, 153, 153)", "rgb(137, 137, 137)", "rgb(90, 90, 90)", "rgb(55, 55, 55)", "rgb(35, 35, 35)", "rgb(22, 22, 22)", "rgb(0, 0, 0)"]
+			palette.forEach(item => str += `<div style='background:${item};' class="color-palette-item"></div>`)
+			return str;
+		},
+		setPosition(x, y) {
+			var LEFT = parseInt(x - this.pancelLeft),
+				TOP = parseInt(y - this.pancelTop);
+
+			this.pointLeft = Math.max(0, Math.min(LEFT, this.pancel_width));
+			this.pointTop = Math.max(0, Math.min(TOP, this.pancel_height));
+
+			util.css(this.elem_picker, {
+				left: this.pointLeft + "px",
+				top: this.pointTop + "px"
+			})
+			this.hsb.s = parseInt(100 * this.pointLeft / this.pancel_width);
+			this.hsb.b = parseInt(100 * (this.pancel_height - this.pointTop) / this.pancel_height);
+
+			this.setShowColor();
+			this.setValue(this.rgba);
+
+		},
+		setBar: function (elem, x) {
+			var elem_bar = elem.getElementsByTagName("div")[0],
+				rect = elem.getBoundingClientRect(),
+				elem_width = elem.offsetWidth,
+				X = Math.max(0, Math.min(x - rect.x, elem_width));
+
+			if (elem_bar === this.elem_barPicker1) {
+				util.css(elem_bar, {
+					left: X + "px"
+				});
+				this.hsb.h = parseInt(360 * X / elem_width);
+			} else {
+				util.css(elem_bar, {
+					left: X + "px"
+				});
+				this.rgba.a = X / elem_width;
+			}
+
+			this.setPancelColor(this.hsb.h);
+			this.setShowColor();
+			this.setValue(this.rgba);
+
+		},
+		setPancelColor: function (h) {
+			var rgb = this.HSBToRGB({ h: h, s: 100, b: 100 });
+
+			util.css(this.elem_colorPancel, {
+				background: 'rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ')'
+			});
+		},
+		setShowColor: function () {
+			var rgb = this.HSBToRGB(this.hsb);
+
+			this.rgba.r = rgb.r;
+			this.rgba.g = rgb.g;
+			this.rgba.b = rgb.b;
+
+			util.css(this.elem_showColor, {
+				background: 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + this.rgba.a + ')'
+			});
+			util.css(this.elem_barPicker2.parentNode, {
+				background: 'linear-gradient(to right, rgba(255,255,255,0), rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b  + '))'
+			});
+			
+		},
+		setValue: function (rgb) {
+			this.elem_inputWrap.innerHTML = this.getInputTpl();
+			var rgba ='rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + this.rgba.a + ')'
+			this.Opt.change(this.bindElem, rgba, "#" + this.rgbToHex(rgb));
+		},
+		setColorByInput: function (value) {
+			var _this = this;
+			//var HEX_REQUIRED = [/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/];
+			//var RGB_REQUIRED = [/^(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?)$/];
+			switch (this.current_mode) {
+				case "hex":
+					value = value.slice(1);
+					if (value.length == 3) {
+						value = '#' + value[0] + value[0] + value[1] + value[1] + value[2] + value[2];
+						this.hsb = this.hexToHsb(value);
+					} else if (value.length == 6) {
+						this.hsb = this.hexToHsb(value);
+					}
+					break;
+				case 'rgb':
+					var inputs = this.elem_wrap.getElementsByTagName("input"),
+						rgb = {
+							r: inputs[0] && parseInt(inputs[0].value) >= 0 && parseInt(inputs[0].value) < 256 ? parseInt(inputs[0].value) : 0,
+							g: inputs[1] && parseInt(inputs[1].value) >= 0 && parseInt(inputs[1].value) < 256 ? parseInt(inputs[1].value) : 0,
+							b: inputs[2] && parseInt(inputs[2].value) >= 0 && parseInt(inputs[2].value) < 256 ? parseInt(inputs[2].value) : 0
+						};
+
+					this.hsb = this.rgbToHsb(rgb);
+			}
+			this.changeViewByHsb();
+		},
+		changeViewByHsb: function () {
+			this.pointLeft = parseInt(this.hsb.s * this.pancel_width / 100);
+			this.pointTop = parseInt((100 - this.hsb.b) * this.pancel_height / 100);
+			util.css(this.elem_picker, {
+				left: this.pointLeft + "px",
+				top: this.pointTop + "px"
+			});
+
+			this.setPancelColor(this.hsb.h);
+			this.setShowColor();
+			util.css(this.elem_barPicker1, {
+				left: this.hsb.h / 360 * (this.barPicker1ParentNode_width) + "px"
+			});
+			util.css(this.elem_barPicker2, {
+				left: this.rgba.a * (this.barPicker2ParentNode_width) + "px"
+			});
+			var rgb = this.HSBToRGB(this.hsb);
+			var rgba ='rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + this.rgba.a + ')'
+			this.Opt.change(this.bindElem, rgba,"#" + this.rgbToHex(rgb));
+		},
+		switch_current_mode: function () {
+			this.current_mode = this.current_mode == 'hex' ? 'rgb' : 'hex';
+			this.elem_inputWrap.innerHTML = this.getInputTpl();
+		},
+		setInputWrap: function () {
+			this.elem_inputWrap.innerHTML = this.getInputTpl();
+		},
+		bindMove: function (elem, fn, bool) {
+			var _this = this;
+
+			elem.addEventListener("mousedown", function (e) {
+				_this.downX = e.pageX;
+				_this.downY = e.pageY;
+				bool ? fn.call(_this, _this.downX, _this.downY) : fn.call(_this, elem, _this.downX, _this.downY);
+
+				document.addEventListener("mousemove", mousemove, false);
+				function mousemove(e) {
+					_this.moveX = e.pageX;
+					_this.moveY = e.pageY;
+					bool ? fn.call(_this, _this.moveX, _this.moveY) : fn.call(_this, elem, _this.moveX, _this.moveY);
+					e.preventDefault();
+				}
+				document.addEventListener("mouseup", mouseup, false);
+				function mouseup(e) {
+					document.removeEventListener("mousemove", mousemove, false)
+					document.removeEventListener("mouseup", mouseup, false)
+				}
+			}, false);
+		},
+		show: function () {
+			util.css(this.elem_wrap, {
+				"display": "block"
+			})
+		},
+		hide: function () {
+			util.css(this.elem_wrap, {
+				"display": "none"
+			})
+		},
+		HSBToRGB: function (hsb) {
+			var rgb = {};
+			var h = Math.round(hsb.h);
+			var s = Math.round(hsb.s * 255 / 100);
+			var v = Math.round(hsb.b * 255 / 100);
+
+			if (s == 0) {
+				rgb.r = rgb.g = rgb.b = v;
+			} else {
+				var t1 = v;
+				var t2 = (255 - s) * v / 255;
+				var t3 = (t1 - t2) * (h % 60) / 60;
+
+				if (h == 360) h = 0;
+
+				if (h < 60) { rgb.r = t1; rgb.b = t2; rgb.g = t2 + t3 }
+				else if (h < 120) { rgb.g = t1; rgb.b = t2; rgb.r = t1 - t3 }
+				else if (h < 180) { rgb.g = t1; rgb.r = t2; rgb.b = t2 + t3 }
+				else if (h < 240) { rgb.b = t1; rgb.r = t2; rgb.g = t1 - t3 }
+				else if (h < 300) { rgb.b = t1; rgb.g = t2; rgb.r = t2 + t3 }
+				else if (h < 360) { rgb.r = t1; rgb.g = t2; rgb.b = t1 - t3 }
+				else { rgb.r = 0; rgb.g = 0; rgb.b = 0 }
+			}
+
+			return { r: Math.round(rgb.r), g: Math.round(rgb.g), b: Math.round(rgb.b) };
+		},
+		rgbToHex: function (rgb) {
+			var hex = [
+				rgb.r.toString(16),
+				rgb.g.toString(16),
+				rgb.b.toString(16)
+			];
+			hex.map(function (str, i) {
+				if (str.length == 1) {
+					hex[i] = '0' + str;
+				}
+			});
+
+			return hex.join('');
+		},
+		hexToRgb: function (hex) {
+			var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
+			return { r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF) };
+		},
+		hexToRgba: function (hex) {
+			var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
+			return 'rgba(' +(hex >> 16)+ ',' + ((hex & 0x00FF00) >> 8)+ ',' + (hex & 0x0000FF) + ',1)';
+		},
+		hexToHsb: function (hex) {
+			return this.rgbToHsb(this.hexToRgb(hex));
+		},
+		rgbToHsb: function (rgb) {
+			var hsb = { h: 0, s: 0, b: 0 };
+			var min = Math.min(rgb.r, rgb.g, rgb.b);
+			var max = Math.max(rgb.r, rgb.g, rgb.b);
+			var delta = max - min;
+			hsb.b = max;
+			hsb.s = max != 0 ? 255 * delta / max : 0;
+			if (hsb.s != 0) {
+				if (rgb.r == max) hsb.h = (rgb.g - rgb.b) / delta;
+				else if (rgb.g == max) hsb.h = 2 + (rgb.b - rgb.r) / delta;
+				else hsb.h = 4 + (rgb.r - rgb.g) / delta;
+			} else hsb.h = -1;
+			hsb.h *= 60;
+			if (hsb.h < 0) hsb.h += 360;
+			hsb.s *= 100 / 255;
+			hsb.b *= 100 / 255;
+			return hsb;
+		}
+	}
+
+	Colorpicker.create = function (opt) {
+		return new Colorpicker(opt)
+	}
+
+	window.Colorpicker = Colorpicker;
+})()

public/assets/addons/wdsxh/libs/colorui/animation.css

@@ -0,0 +1,184 @@
+/* 
+  Animation 微动画  
+  基于ColorUI组建库的动画模块 by 文晓港 2019年3月26日19:52:28
+ */
+
+/* css 滤镜 控制黑白底色gif的 */
+.gif-black{  
+  mix-blend-mode: screen;  
+}
+.gif-white{  
+  mix-blend-mode: multiply; 
+}
+
+
+/* Animation css */
+[class*=animation-] {
+    animation-duration: .5s;
+    animation-timing-function: ease-out;
+    animation-fill-mode: both
+}
+
+.animation-fade {
+    animation-name: fade;
+    animation-duration: .8s;
+    animation-timing-function: linear
+}
+
+.animation-scale-up {
+    animation-name: scale-up
+}
+
+.animation-scale-down {
+    animation-name: scale-down
+}
+
+.animation-slide-top {
+    animation-name: slide-top
+}
+
+.animation-slide-bottom {
+    animation-name: slide-bottom
+}
+
+.animation-slide-left {
+    animation-name: slide-left
+}
+
+.animation-slide-right {
+    animation-name: slide-right
+}
+
+.animation-shake {
+    animation-name: shake
+}
+
+.animation-reverse {
+    animation-direction: reverse
+}
+
+@keyframes fade {
+    0% {
+        opacity: 0
+    }
+
+    100% {
+        opacity: 1
+    }
+}
+
+@keyframes scale-up {
+    0% {
+        opacity: 0;
+        transform: scale(.2)
+    }
+
+    100% {
+        opacity: 1;
+        transform: scale(1)
+    }
+}
+
+@keyframes scale-down {
+    0% {
+        opacity: 0;
+        transform: scale(1.8)
+    }
+
+    100% {
+        opacity: 1;
+        transform: scale(1)
+    }
+}
+
+@keyframes slide-top {
+    0% {
+        opacity: 0;
+        transform: translateY(-100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateY(0)
+    }
+}
+
+@keyframes slide-bottom {
+    0% {
+        opacity: 0;
+        transform: translateY(100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateY(0)
+    }
+}
+
+@keyframes shake {
+
+    0%,
+    100% {
+        transform: translateX(0)
+    }
+
+    10% {
+        transform: translateX(-9px)
+    }
+
+    20% {
+        transform: translateX(8px)
+    }
+
+    30% {
+        transform: translateX(-7px)
+    }
+
+    40% {
+        transform: translateX(6px)
+    }
+
+    50% {
+        transform: translateX(-5px)
+    }
+
+    60% {
+        transform: translateX(4px)
+    }
+
+    70% {
+        transform: translateX(-3px)
+    }
+
+    80% {
+        transform: translateX(2px)
+    }
+
+    90% {
+        transform: translateX(-1px)
+    }
+}
+
+@keyframes slide-left {
+    0% {
+        opacity: 0;
+        transform: translateX(-100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateX(0)
+    }
+}
+
+@keyframes slide-right {
+    0% {
+        opacity: 0;
+        transform: translateX(100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateX(0)
+    }
+}

public/assets/addons/wdsxh/libs/designer.js

@@ -0,0 +1,571 @@
+var isIE = (document.all) ? true : false;
+
+var dobj = function (id) {
+	return "string" == typeof id ? document.getElementById(id) : id;
+};
+
+var Class = {
+	create: function() {
+		return function() { this.initialize.apply(this, arguments); }
+	}
+}
+
+var Extend = function(destination, source) {
+	for (var property in source) {
+		destination[property] = source[property];
+	}
+}
+
+var Bind = function(object, fun) {
+	return function() {
+		return fun.apply(object, arguments);
+	}
+}
+var BindAsEventListener = function(object, fun) {
+	var args = Array.prototype.slice.call(arguments).slice(2);
+	return function(event) {
+		return fun.apply(object, [event || window.event].concat(args));
+	}
+}
+
+var CurrentStyle = function(element){
+	return element.currentStyle || document.defaultView.getComputedStyle(element, null);
+}
+
+function addEventHandler(oTarget, sEventType, fnHandler) {
+	if (oTarget.addEventListener) {
+		oTarget.addEventListener(sEventType, fnHandler, false);
+	} else if (oTarget.attachEvent) {
+		oTarget.attachEvent("on" + sEventType, fnHandler);
+	} else {
+		oTarget["on" + sEventType] = fnHandler;
+	}
+};
+
+function removeEventHandler(oTarget, sEventType, fnHandler) {
+    if (oTarget.removeEventListener) {
+        oTarget.removeEventListener(sEventType, fnHandler, false);
+    } else if (oTarget.detachEvent) {
+        oTarget.detachEvent("on" + sEventType, fnHandler);
+    } else { 
+        oTarget["on" + sEventType] = null;
+    }
+};
+//缩放程序
+var Resize = Class.create();
+Resize.prototype = {
+  //缩放对象
+  initialize: function(obj, options) {
+	this._obj = obj.get(0);//缩放对象
+	
+	this._styleWidth = this._styleHeight = this._styleLeft = this._styleTop = 0;//样式参数
+	this._sideRight = this._sideDown = this._sideLeft = this._sideUp = 0;//坐标参数
+	this._fixLeft = this._fixTop = 0;//定位参数
+	this._scaleLeft = this._scaleTop = 0;//定位坐标
+	
+	this._mxSet = function(){};//范围设置程序
+	this._mxRightWidth = this._mxDownHeight = this._mxUpHeight = this._mxLeftWidth = 0;//范围参数
+	this._mxScaleWidth = this._mxScaleHeight = 0;//比例范围参数
+	
+	this._fun = function(){};//缩放执行程序
+	
+	//获取边框宽度
+	var _style = CurrentStyle(this._obj);
+	this._borderX = (parseInt(_style.borderLeftWidth) || 0) + (parseInt(_style.borderRightWidth) || 0);
+	this._borderY = (parseInt(_style.borderTopWidth) || 0) + (parseInt(_style.borderBottomWidth) || 0);
+	//事件对象(用于绑定移除事件)
+	this._fR = BindAsEventListener(this, this.Resize);
+	this._fS = Bind(this, this.Stop);
+	
+	this.SetOptions(options);
+	//范围限制
+	this.Max = !!this.options.Max;
+	this._mxContainer = $(this.options.mxContainer).get(0) || null;
+	this.mxLeft = Math.round(this.options.mxLeft);
+	this.mxRight = Math.round(this.options.mxRight);
+	this.mxTop = Math.round(this.options.mxTop);
+	this.mxBottom = Math.round(this.options.mxBottom);
+	//宽高限制
+	this.Min = !!this.options.Min;
+	this.minWidth = Math.round(this.options.minWidth);
+	this.minHeight = Math.round(this.options.minHeight);
+	//按比例缩放
+	this.Scale = !!this.options.Scale;
+	this.Ratio = Math.max(this.options.Ratio, 0);
+	
+	this.onResize = this.options.onResize;
+	
+	this._obj.style.position = "absolute";
+	!this._mxContainer || CurrentStyle(this._mxContainer).position == "relative" || (this._mxContainer.style.position = "relative");
+  },
+  //设置默认属性
+  SetOptions: function(options) {
+    this.options = {//默认值
+		Max:		false,//是否设置范围限制(为true时下面mx参数有用)
+		mxContainer:"",//指定限制在容器内
+		mxLeft:		0,//左边限制
+		mxRight:	9999,//右边限制
+		mxTop:		0,//上边限制
+		mxBottom:	9999,//下边限制
+		Min:		false,//是否最小宽高限制(为true时下面min参数有用)
+		minWidth:	50,//最小宽度
+		minHeight:	50,//最小高度
+		Scale:		false,//是否按比例缩放
+		Ratio:		0,//缩放比例(宽/高)
+		onResize:	function(){}//缩放时执行
+    };
+    Extend(this.options, options || {});
+  },
+  //设置触发对象
+  Set: function(resize, side) {
+	var fun;
+	if(!resize) return; 
+	//根据方向设置
+	switch (side.toLowerCase()) {
+	case "up" :
+		fun = this.Up;
+		break;
+	case "down" :
+		fun = this.Down;
+		break;
+	case "left" :
+		fun = this.Left;
+		break;
+	case "right" :
+		fun = this.Right;
+		break;
+	case "left-up" :
+		fun = this.LeftUp;
+		break;
+	case "right-up" :
+		fun = this.RightUp;
+		break;
+	case "left-down" :
+		fun = this.LeftDown;
+		break;
+	case "right-down" :
+	default :
+		fun = this.RightDown;
+	};
+	//设置触发对象
+	addEventHandler(resize.get(0), "mousedown", BindAsEventListener(this, this.Start, fun));
+  },
+  //准备缩放
+  Start: function(e, fun, touch) {	
+ 
+	//防止冒泡(跟拖放配合时设置)
+	e.stopPropagation ? e.stopPropagation() : (e.cancelBubble = true);
+	//设置执行程序
+	this._fun = fun;
+	//样式参数值
+	this._styleWidth = this._obj.clientWidth;
+	this._styleHeight = this._obj.clientHeight;
+	this._styleLeft = this._obj.offsetLeft;
+	this._styleTop = this._obj.offsetTop;
+	//四条边定位坐标
+	this._sideLeft = e.clientX - this._styleWidth;
+	this._sideRight = e.clientX + this._styleWidth;
+	this._sideUp = e.clientY - this._styleHeight;
+	this._sideDown = e.clientY + this._styleHeight;
+	//top和left定位参数
+	this._fixLeft = this._styleLeft + this._styleWidth;
+	this._fixTop = this._styleTop + this._styleHeight;
+	//缩放比例
+	if(this.Scale){
+		//设置比例
+		this.Ratio = Math.max(this.Ratio, 0) || this._styleWidth / this._styleHeight;
+		//left和top的定位坐标
+		this._scaleLeft = this._styleLeft + this._styleWidth / 2;
+		this._scaleTop = this._styleTop + this._styleHeight / 2;
+	};
+	//范围限制
+	if(this.Max){
+		//设置范围参数
+		var mxLeft = this.mxLeft, mxRight = this.mxRight, mxTop = this.mxTop, mxBottom = this.mxBottom;
+		//如果设置了容器，再修正范围参数
+		if(!!this._mxContainer){
+			mxLeft = Math.max(mxLeft, 0);
+			mxTop = Math.max(mxTop, 0);
+			mxRight = Math.min(mxRight, this._mxContainer.clientWidth);
+			mxBottom = Math.min(mxBottom, this._mxContainer.clientHeight);
+		};
+		//根据最小值再修正
+		mxRight = Math.max(mxRight, mxLeft + (this.Min ? this.minWidth : 0) + this._borderX);
+		mxBottom = Math.max(mxBottom, mxTop + (this.Min ? this.minHeight : 0) + this._borderY);
+		//由于转向时要重新设置所以写成function形式
+		this._mxSet = function(){
+			//this._mxRightWidth = mxRight - this._styleLeft - this._borderX;
+			//this._mxDownHeight = mxBottom - this._styleTop - this._borderY;
+			this._mxRightWidth = mxRight - this._styleLeft;
+			this._mxDownHeight = mxBottom - this._styleTop;
+			this._mxUpHeight = Math.max(this._fixTop - mxTop, this.Min ? this.minHeight : 0);
+			this._mxLeftWidth = Math.max(this._fixLeft - mxLeft, this.Min ? this.minWidth : 0);
+		};
+		this._mxSet();
+		//有缩放比例下的范围限制
+		if(this.Scale){
+			this._mxScaleWidth = Math.min(this._scaleLeft - mxLeft, mxRight - this._scaleLeft - this._borderX) * 2;
+			this._mxScaleHeight = Math.min(this._scaleTop - mxTop, mxBottom - this._scaleTop - this._borderY) * 2;
+		};
+	};
+	//mousemove时缩放 mouseup时停止
+	addEventHandler(document, "mousemove", this._fR);
+	addEventHandler(document, "mouseup", this._fS);
+	if(isIE){
+		addEventHandler(this._obj, "losecapture", this._fS);
+		this._obj.setCapture();
+	}else{
+		addEventHandler(window, "blur", this._fS);
+		e.preventDefault();
+	};
+  },
+  //缩放
+  Resize: function(e) {
+	//清除选择
+	window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
+	//执行缩放程序
+	this._fun(e);
+	//设置样式，变量必须大于等于0否则ie出错
+	with(this._obj.style){
+		width = this._styleWidth + "px"; height = this._styleHeight + "px";
+		top = this._styleTop + "px"; left = this._styleLeft + "px";
+	}
+	//附加程序
+	this.onResize();
+  },
+  //缩放程序
+  //上
+  Up: function(e) {
+	this.RepairY(this._sideDown - e.clientY, this._mxUpHeight);
+	this.RepairTop();
+	this.TurnDown(this.Down);
+  },
+  //下
+  Down: function(e) {
+	this.RepairY(e.clientY - this._sideUp, this._mxDownHeight);
+	this.TurnUp(this.Up);
+  },
+  //右
+  Right: function(e) {
+	this.RepairX(e.clientX - this._sideLeft, this._mxRightWidth);
+	this.TurnLeft(this.Left);
+  },
+  //左
+  Left: function(e) {
+	this.RepairX(this._sideRight - e.clientX, this._mxLeftWidth);
+	this.RepairLeft();
+	this.TurnRight(this.Right);
+  },
+  //右下
+  RightDown: function(e) {
+	this.RepairAngle(
+		e.clientX - this._sideLeft, this._mxRightWidth,
+		e.clientY - this._sideUp, this._mxDownHeight
+	);
+	this.TurnLeft(this.LeftDown) || this.Scale || this.TurnUp(this.RightUp);
+  },
+  //右上
+  RightUp: function(e) {
+	this.RepairAngle(
+		e.clientX - this._sideLeft, this._mxRightWidth,
+		this._sideDown - e.clientY, this._mxUpHeight
+	);
+	this.RepairTop();
+	this.TurnLeft(this.LeftUp) || this.Scale || this.TurnDown(this.RightDown);
+  },
+  //左下
+  LeftDown: function(e) {
+	this.RepairAngle(
+		this._sideRight - e.clientX, this._mxLeftWidth,
+		e.clientY - this._sideUp, this._mxDownHeight
+	);
+	this.RepairLeft();
+	this.TurnRight(this.RightDown) || this.Scale || this.TurnUp(this.LeftUp);
+  },
+  //左上
+  LeftUp: function(e) {
+	this.RepairAngle(
+		this._sideRight - e.clientX, this._mxLeftWidth,
+		this._sideDown - e.clientY, this._mxUpHeight
+	);
+	this.RepairTop(); this.RepairLeft();
+	this.TurnRight(this.RightUp) || this.Scale || this.TurnDown(this.LeftDown);
+  },
+  //修正程序
+  //水平方向
+  RepairX: function(iWidth, mxWidth) {
+	iWidth = this.RepairWidth(iWidth, mxWidth);
+	if(this.Scale){
+		var iHeight = this.RepairScaleHeight(iWidth);
+		if(this.Max && iHeight > this._mxScaleHeight){
+			iHeight = this._mxScaleHeight;
+			iWidth = this.RepairScaleWidth(iHeight);
+		}else if(this.Min && iHeight < this.minHeight){
+			var tWidth = this.RepairScaleWidth(this.minHeight);
+			if(tWidth < mxWidth){ iHeight = this.minHeight; iWidth = tWidth; }
+		}
+		this._styleHeight = iHeight;
+		this._styleTop = this._scaleTop - iHeight / 2;
+	}
+	this._styleWidth = iWidth;
+  },
+  //垂直方向
+  RepairY: function(iHeight, mxHeight) {
+	iHeight = this.RepairHeight(iHeight, mxHeight);
+	if(this.Scale){
+		var iWidth = this.RepairScaleWidth(iHeight);
+		if(this.Max && iWidth > this._mxScaleWidth){
+			iWidth = this._mxScaleWidth;
+			iHeight = this.RepairScaleHeight(iWidth);
+		}else if(this.Min && iWidth < this.minWidth){
+			var tHeight = this.RepairScaleHeight(this.minWidth);
+			if(tHeight < mxHeight){ iWidth = this.minWidth; iHeight = tHeight; }
+		}
+		this._styleWidth = iWidth;
+		this._styleLeft = this._scaleLeft - iWidth / 2;
+	}
+	this._styleHeight = iHeight;
+  },
+  //对角方向
+  RepairAngle: function(iWidth, mxWidth, iHeight, mxHeight) {
+	iWidth = this.RepairWidth(iWidth, mxWidth);	
+	if(this.Scale){
+		iHeight = this.RepairScaleHeight(iWidth);
+		if(this.Max && iHeight > mxHeight){
+			iHeight = mxHeight;
+			iWidth = this.RepairScaleWidth(iHeight);
+		}else if(this.Min && iHeight < this.minHeight){
+			var tWidth = this.RepairScaleWidth(this.minHeight);
+			if(tWidth < mxWidth){ iHeight = this.minHeight; iWidth = tWidth; }
+		}
+	}else{
+		iHeight = this.RepairHeight(iHeight, mxHeight);
+	}
+	this._styleWidth = iWidth;
+	this._styleHeight = iHeight;
+  },
+  //top
+  RepairTop: function() {
+	this._styleTop = this._fixTop - this._styleHeight;
+  },
+  //left
+  RepairLeft: function() {
+	this._styleLeft = this._fixLeft - this._styleWidth;
+  },
+  //height
+  RepairHeight: function(iHeight, mxHeight) {
+	iHeight = Math.min(this.Max ? mxHeight : iHeight, iHeight);
+	iHeight = Math.max(this.Min ? this.minHeight : iHeight, iHeight, 0);
+	return iHeight;
+  },
+  //width
+  RepairWidth: function(iWidth, mxWidth) {
+	iWidth = Math.min(this.Max ? mxWidth : iWidth, iWidth);
+	iWidth = Math.max(this.Min ? this.minWidth : iWidth, iWidth, 0);
+	return iWidth;
+  },
+  //比例高度
+  RepairScaleHeight: function(iWidth) {
+	return Math.max(Math.round((iWidth + this._borderX) / this.Ratio - this._borderY), 0);
+  },
+  //比例宽度
+  RepairScaleWidth: function(iHeight) {
+	return Math.max(Math.round((iHeight + this._borderY) * this.Ratio - this._borderX), 0);
+  },
+  //转向程序
+  //转右
+  TurnRight: function(fun) {
+	if(!(this.Min || this._styleWidth)){
+		this._fun = fun;
+		this._sideLeft = this._sideRight;
+		this.Max && this._mxSet();
+		return true;
+	}
+  },
+  //转左
+  TurnLeft: function(fun) {
+	if(!(this.Min || this._styleWidth)){
+		this._fun = fun;
+		this._sideRight = this._sideLeft;
+		this._fixLeft = this._styleLeft;
+		this.Max && this._mxSet();
+		return true;
+	}
+  },
+  //转上
+  TurnUp: function(fun) {
+	if(!(this.Min || this._styleHeight)){
+		this._fun = fun;
+		this._sideDown = this._sideUp;
+		this._fixTop = this._styleTop;
+		this.Max && this._mxSet();
+		return true;
+	}
+  },
+  //转下
+  TurnDown: function(fun) {
+	if(!(this.Min || this._styleHeight)){
+		this._fun = fun;
+		this._sideUp = this._sideDown;
+		this.Max && this._mxSet();
+		return true;
+	}
+  },
+  //停止缩放
+  Stop: function() {
+	removeEventHandler(document, "mousemove", this._fR);
+	removeEventHandler(document, "mouseup", this._fS);
+	if(isIE){
+		removeEventHandler(this._obj, "losecapture", this._fS);
+		this._obj.releaseCapture();
+	}else{
+		removeEventHandler(window, "blur", this._fS);
+	}
+  }
+};
+
+//拖放程序
+var Drag = Class.create();
+Drag.prototype = {
+  //拖放对象
+  initialize: function(drag, options) {
+	this.Drag = drag.get(0);//拖放对象
+	this._x = this._y = 0;//记录鼠标相对拖放对象的位置
+	this._marginLeft = this._marginTop = 0;//记录margin
+	//事件对象(用于绑定移除事件)
+	this._fM = BindAsEventListener(this, this.Move);
+	this._fS = Bind(this, this.Stop);
+	
+	this.SetOptions(options);
+	
+	this.Limit = !!this.options.Limit;
+	this.mxLeft = parseInt(this.options.mxLeft);
+	this.mxRight = parseInt(this.options.mxRight);
+	this.mxTop = parseInt(this.options.mxTop);
+	this.mxBottom = parseInt(this.options.mxBottom);
+	
+	this.LockX = !!this.options.LockX;
+	this.LockY = !!this.options.LockY;
+	this.Lock = !!this.options.Lock;
+	
+	this.onStart = this.options.onStart;
+	this.onMove = this.options.onMove;
+	this.onStop = this.options.onStop;
+	
+	this._Handle = $(this.options.Handle).get(0) || this.Drag;
+	this._mxContainer = $(this.options.mxContainer).get(0) || null;
+	
+	this.Drag.style.position = "absolute";
+	//透明
+	if(isIE && !!this.options.Transparent){
+		//填充拖放对象
+		with(this._Handle.appendChild(document.createElement("div")).style){
+			width = height = "100%"; backgroundColor = "#fff"; filter = "alpha(opacity:0)"; fontSize = 0;
+		}
+	}
+	that=drag;
+	//修正范围
+	this.Repair();
+	addEventHandler(this._Handle, "mousedown", BindAsEventListener(this, this.Start));
+  },
+  //设置默认属性
+  SetOptions: function(options) {
+	this.options = {//默认值
+		Handle:			"",//设置触发对象（不设置则使用拖放对象）
+		Limit:			false,//是否设置范围限制(为true时下面参数有用,可以是负数)
+		mxLeft:			0,//左边限制
+		mxRight:		9999,//右边限制
+		mxTop:			0,//上边限制
+		mxBottom:		9999,//下边限制
+		mxContainer:	"",//指定限制在容器内
+		LockX:			false,//是否锁定水平方向拖放
+		LockY:			false,//是否锁定垂直方向拖放
+		Lock:			false,//是否锁定
+		Transparent:	false,//是否透明
+		onStart:		function(){},//开始移动时执行
+		onMove:			function(){},//移动时执行
+		onStop:			function(){}//结束移动时执行
+	};
+	Extend(this.options, options || {});
+  },
+  //准备拖动
+  Start: function(oEvent) {
+	if(this.Lock){ return; }
+	this.Repair();
+	//记录鼠标相对拖放对象的位置
+	this._x = oEvent.clientX - this.Drag.offsetLeft;
+	this._y = oEvent.clientY - this.Drag.offsetTop;
+	//记录margin
+	this._marginLeft = parseInt(CurrentStyle(this.Drag).marginLeft) || 0;
+	this._marginTop = parseInt(CurrentStyle(this.Drag).marginTop) || 0;
+	//mousemove时移动 mouseup时停止
+	addEventHandler(document, "mousemove", this._fM);
+	addEventHandler(document, "mouseup", this._fS);
+	if(isIE){
+		//焦点丢失
+		addEventHandler(this._Handle, "losecapture", this._fS);
+		//设置鼠标捕获
+		this._Handle.setCapture();
+	}else{
+		//焦点丢失
+		addEventHandler(window, "blur", this._fS);
+		//阻止默认动作
+		oEvent.preventDefault();
+	};
+	//附加程序
+	this.onStart();
+  },
+  //修正范围
+  Repair: function() {
+	if(this.Limit){
+		//修正错误范围参数
+		this.mxRight = Math.max(this.mxRight, this.mxLeft + this.Drag.offsetWidth);
+		this.mxBottom = Math.max(this.mxBottom, this.mxTop + this.Drag.offsetHeight);
+		//如果有容器必须设置position为relative或absolute来相对或绝对定位，并在获取offset之前设置
+		!this._mxContainer || CurrentStyle(this._mxContainer).position == "relative" || CurrentStyle(this._mxContainer).position == "absolute" || (this._mxContainer.style.position = "relative");
+	}
+  },
+  //拖动
+  Move: function(oEvent) {
+	//判断是否锁定
+	if(this.Lock){ this.Stop(); return; };
+	//清除选择
+	window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
+	//设置移动参数
+	var iLeft = oEvent.clientX - this._x, iTop = oEvent.clientY - this._y;
+	//设置范围限制
+	if(this.Limit){
+		//设置范围参数
+		var mxLeft = this.mxLeft, mxRight = this.mxRight, mxTop = this.mxTop, mxBottom = this.mxBottom;
+		//如果设置了容器，再修正范围参数
+		if(!!this._mxContainer){
+			mxLeft = Math.max(mxLeft, 0);
+			mxTop = Math.max(mxTop, 0);
+			mxRight = Math.min(mxRight, this._mxContainer.clientWidth);
+			mxBottom = Math.min(mxBottom, this._mxContainer.clientHeight);
+		};
+		//修正移动参数
+		iLeft = Math.max(Math.min(iLeft, mxRight - this.Drag.offsetWidth), mxLeft);
+		iTop = Math.max(Math.min(iTop, mxBottom - this.Drag.offsetHeight), mxTop);
+	}
+	//设置位置，并修正margin
+	if(!this.LockX){ this.Drag.style.left = iLeft - this._marginLeft + "px"; }
+	if(!this.LockY){ this.Drag.style.top = iTop - this._marginTop + "px"; }
+	//附加程序
+	this.onMove();
+  },
+  //停止拖动
+  Stop: function() {
+	//移除事件
+	removeEventHandler(document, "mousemove", this._fM);
+	removeEventHandler(document, "mouseup", this._fS);
+	if(isIE){
+		removeEventHandler(this._Handle, "losecapture", this._fS);
+		this._Handle.releaseCapture();
+	}else{
+		removeEventHandler(window, "blur", this._fS);
+	};
+	//附加程序
+	this.onStop();
+  }
+};

public/assets/addons/wdsxh/libs/jquery.contextMenu.css

@@ -0,0 +1,140 @@
+/*!
+ * jQuery contextMenu - Plugin for simple contextMenu handling
+ *
+ * Version: 1.6.6
+ *
+ * Authors: Rodney Rehm, Addy Osmani (patches for FF)
+ * Web: http://medialize.github.com/jQuery-contextMenu/
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *   GPL v3 http://opensource.org/licenses/GPL-3.0
+ *
+ */
+
+.context-menu-list {
+    margin:0; 
+    padding:0;
+    
+    min-width: 120px;
+    max-width: 250px;
+    display: inline-block;
+    position: absolute;
+    list-style-type: none;
+    border: 1px solid #DDD; 
+    background: #EEE;
+    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+       -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+        -ms-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+         -o-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+    
+    font-family: Verdana, Arial, Helvetica, sans-serif;
+    font-size: 11px;
+}
+
+.context-menu-item {
+    padding: 2px 2px 2px 24px;
+    background-color: #EEE;
+    position: relative;
+    -webkit-user-select: none;
+       -moz-user-select: -moz-none;
+        -ms-user-select: none;
+            user-select: none;
+}
+
+.context-menu-separator {
+    padding-bottom:0;
+    border-bottom: 1px solid #DDD;
+}
+
+.context-menu-item > label > input,
+.context-menu-item > label > textarea {
+    -webkit-user-select: text;
+       -moz-user-select: text;
+        -ms-user-select: text;
+            user-select: text;
+}
+
+.context-menu-item.hover {
+    cursor: pointer;
+    background-color: #39F;
+}
+
+.context-menu-item.disabled {
+    color: #666;
+}
+
+.context-menu-input.hover,
+.context-menu-item.disabled.hover {
+    cursor: default;
+    background-color: #EEE;
+}
+
+.context-menu-submenu:after {
+    content: ">";
+    color: #666;
+    position: absolute;
+    top: 0;
+    right: 3px;
+    z-index: 1;
+}
+
+/* icons
+    #protip:
+    In case you want to use sprites for icons (which I would suggest you do) have a look at
+    http://css-tricks.com/13224107-pseudo-spriting/ to get an idea of how to implement 
+    .context-menu-item.icon:before {}
+ */
+.context-menu-item.icon { min-height: 18px; background-repeat: no-repeat; background-position: 4px 2px; }
+.context-menu-item.icon-edit { background-image: url(images/page_white_edit.png); }
+.context-menu-item.icon-cut { background-image: url(images/cut.png); }
+.context-menu-item.icon-copy { background-image: url(images/page_white_copy.png); }
+.context-menu-item.icon-paste { background-image: url(images/page_white_paste.png); }
+.context-menu-item.icon-delete { background-image: url(images/page_white_delete.png); }
+.context-menu-item.icon-add { background-image: url(images/page_white_add.png); }
+.context-menu-item.icon-quit { background-image: url(images/door.png); }
+
+/* vertically align inside labels */
+.context-menu-input > label > * { vertical-align: top; }
+
+/* position checkboxes and radios as icons */
+.context-menu-input > label > input[type="checkbox"],
+.context-menu-input > label > input[type="radio"] {
+    margin-left: -17px;
+}
+.context-menu-input > label > span {
+    margin-left: 5px;
+}
+
+.context-menu-input > label,
+.context-menu-input > label > input[type="text"],
+.context-menu-input > label > textarea,
+.context-menu-input > label > select {
+    display: block;
+    width: 100%;
+    
+    -webkit-box-sizing: border-box;
+       -moz-box-sizing: border-box;
+        -ms-box-sizing: border-box;
+         -o-box-sizing: border-box;
+            box-sizing: border-box;
+}
+
+.context-menu-input > label > textarea {
+    height: 100px;
+}
+.context-menu-item > .context-menu-list {
+    display: none;
+    /* re-positioned by js */
+    right: -5px;
+    top: 5px;
+}
+
+.context-menu-item.hover > .context-menu-list {
+    display: block;
+}
+
+.context-menu-accesskey {
+    text-decoration: underline;
+}

public/assets/addons/wdsxh/libs/jquery.form.js

@@ -0,0 +1,864 @@
+/*!
+ * jQuery Form Plugin
+ * version: 2.80 (25-MAY-2011)
+ * @requires jQuery v1.3.2 or later
+ *
+ * Examples and documentation at: http://malsup.com/jquery/form/
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ */
+;(function($) {
+
+/*
+	Usage Note:
+	-----------
+	Do not use both ajaxSubmit and ajaxForm on the same form.  These
+	functions are intended to be exclusive.  Use ajaxSubmit if you want
+	to bind your own submit handler to the form.  For example,
+
+	$(document).ready(function() {
+		$('#myForm').bind('submit', function(e) {
+			e.preventDefault(); // <-- important
+			$(this).ajaxSubmit({
+				target: '#output'
+			});
+		});
+	});
+
+	Use ajaxForm when you want the plugin to manage all the event binding
+	for you.  For example,
+
+	$(document).ready(function() {
+		$('#myForm').ajaxForm({
+			target: '#output'
+		});
+	});
+
+	When using ajaxForm, the ajaxSubmit function will be invoked for you
+	at the appropriate time.
+*/
+
+/**
+ * ajaxSubmit() provides a mechanism for immediately submitting
+ * an HTML form using AJAX.
+ */
+$.fn.ajaxSubmit = function(options) {
+	// fast fail if nothing selected (http://dev.jquery.com/ticket/2752)
+	if (!this.length) {
+		log('ajaxSubmit: skipping submit process - no element selected');
+		return this;
+	}
+
+	if (typeof options == 'function') {
+		options = { success: options };
+	}
+
+	var action = this.attr('action');
+	var url = (typeof action === 'string') ? $.trim(action) : '';
+	url = url || window.location.href || '';
+	if (url) {
+		// clean url (don't include hash vaue)
+		url = (url.match(/^([^#]+)/)||[])[1];
+	}
+
+	options = $.extend(true, {
+		url:  url,
+		success: $.ajaxSettings.success,
+		type: this[0].getAttribute('method') || 'GET', // IE7 massage (see issue 57)
+		iframeSrc: /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank'
+	}, options);
+
+	// hook for manipulating the form data before it is extracted;
+	// convenient for use with rich editors like tinyMCE or FCKEditor
+	var veto = {};
+	this.trigger('form-pre-serialize', [this, options, veto]);
+	if (veto.veto) {
+		log('ajaxSubmit: submit vetoed via form-pre-serialize trigger');
+		return this;
+	}
+
+	// provide opportunity to alter form data before it is serialized
+	if (options.beforeSerialize && options.beforeSerialize(this, options) === false) {
+		log('ajaxSubmit: submit aborted via beforeSerialize callback');
+		return this;
+	}
+
+	var n,v,a = this.formToArray(options.semantic);
+	if (options.data) {
+		options.extraData = options.data;
+		for (n in options.data) {
+			if(options.data[n] instanceof Array) {
+				for (var k in options.data[n]) {
+					a.push( { name: n, value: options.data[n][k] } );
+				}
+			}
+			else {
+				v = options.data[n];
+				v = $.isFunction(v) ? v() : v; // if value is fn, invoke it
+				a.push( { name: n, value: v } );
+			}
+		}
+	}
+
+	// give pre-submit callback an opportunity to abort the submit
+	if (options.beforeSubmit && options.beforeSubmit(a, this, options) === false) {
+		log('ajaxSubmit: submit aborted via beforeSubmit callback');
+		return this;
+	}
+
+	// fire vetoable 'validate' event
+	this.trigger('form-submit-validate', [a, this, options, veto]);
+	if (veto.veto) {
+		log('ajaxSubmit: submit vetoed via form-submit-validate trigger');
+		return this;
+	}
+
+	var q = $.param(a);
+
+	if (options.type.toUpperCase() == 'GET') {
+		options.url += (options.url.indexOf('?') >= 0 ? '&' : '?') + q;
+		options.data = null;  // data is null for 'get'
+	}
+	else {
+		options.data = q; // data is the query string for 'post'
+	}
+
+	var $form = this, callbacks = [];
+	if (options.resetForm) {
+		callbacks.push(function() { $form.resetForm(); });
+	}
+	if (options.clearForm) {
+		callbacks.push(function() { $form.clearForm(); });
+	}
+
+	// perform a load on the target only if dataType is not provided
+	if (!options.dataType && options.target) {
+		var oldSuccess = options.success || function(){};
+		callbacks.push(function(data) {
+			var fn = options.replaceTarget ? 'replaceWith' : 'html';
+			$(options.target)[fn](data).each(oldSuccess, arguments);
+		});
+	}
+	else if (options.success) {
+		callbacks.push(options.success);
+	}
+
+	options.success = function(data, status, xhr) { // jQuery 1.4+ passes xhr as 3rd arg
+		var context = options.context || options;   // jQuery 1.4+ supports scope context 
+		for (var i=0, max=callbacks.length; i < max; i++) {
+			callbacks[i].apply(context, [data, status, xhr || $form, $form]);
+		}
+	};
+
+	// are there files to upload?
+	var fileInputs = $('input:file', this).length > 0;
+	var mp = 'multipart/form-data';
+	var multipart = ($form.attr('enctype') == mp || $form.attr('encoding') == mp);
+
+	// options.iframe allows user to force iframe mode
+	// 06-NOV-09: now defaulting to iframe mode if file input is detected
+   if (options.iframe !== false && (fileInputs || options.iframe || multipart)) {
+	   // hack to fix Safari hang (thanks to Tim Molendijk for this)
+	   // see:  http://groups.google.com/group/jquery-dev/browse_thread/thread/36395b7ab510dd5d
+	   if (options.closeKeepAlive) {
+		   $.get(options.closeKeepAlive, function() { fileUpload(a); });
+		}
+	   else {
+		   fileUpload(a);
+		}
+   }
+   else {
+		$.ajax(options);
+   }
+
+	// fire 'notify' event
+	this.trigger('form-submit-notify', [this, options]);
+	return this;
+
+
+	// private function for handling file uploads (hat tip to YAHOO!)
+	function fileUpload(a) {
+		var form = $form[0], i, s, g, id, $io, io, xhr, sub, n, timedOut, timeoutHandle;
+
+        if (a) {
+        	// ensure that every serialized input is still enabled
+          	for (i=0; i < a.length; i++) {
+            	$(form[a[i].name]).attr('disabled', false);
+          	}
+        }
+
+		if ($(':input[name=submit],:input[id=submit]', form).length) {
+			// if there is an input with a name or id of 'submit' then we won't be
+			// able to invoke the submit fn on the form (at least not x-browser)
+			alert('Error: Form elements must not have name or id of "submit".');
+			return;
+		}
+		
+		s = $.extend(true, {}, $.ajaxSettings, options);
+		s.context = s.context || s;
+		id = 'jqFormIO' + (new Date().getTime());
+		if (s.iframeTarget) {
+			$io = $(s.iframeTarget);
+			n = $io.attr('name');
+			if (n == null)
+			 	$io.attr('name', id);
+			else
+				id = n;
+		}
+		else {
+			$io = $('<iframe name="' + id + '" src="'+ s.iframeSrc +'" />');
+			$io.css({ position: 'absolute', top: '-1000px', left: '-1000px' });
+		}
+		io = $io[0];
+
+
+		xhr = { // mock object
+			aborted: 0,
+			responseText: null,
+			responseXML: null,
+			status: 0,
+			statusText: 'n/a',
+			getAllResponseHeaders: function() {},
+			getResponseHeader: function() {},
+			setRequestHeader: function() {},
+			abort: function(status) {
+				var e = (status === 'timeout' ? 'timeout' : 'aborted');
+				log('aborting upload... ' + e);
+				this.aborted = 1;
+				$io.attr('src', s.iframeSrc); // abort op in progress
+				xhr.error = e;
+				s.error && s.error.call(s.context, xhr, e, e);
+				g && $.event.trigger("ajaxError", [xhr, s, e]);
+				s.complete && s.complete.call(s.context, xhr, e);
+			}
+		};
+
+		g = s.global;
+		// trigger ajax global events so that activity/block indicators work like normal
+		if (g && ! $.active++) {
+			$.event.trigger("ajaxStart");
+		}
+		if (g) {
+			$.event.trigger("ajaxSend", [xhr, s]);
+		}
+
+		if (s.beforeSend && s.beforeSend.call(s.context, xhr, s) === false) {
+			if (s.global) {
+				$.active--;
+			}
+			return;
+		}
+		if (xhr.aborted) {
+			return;
+		}
+
+		// add submitting element to data if we know it
+		sub = form.clk;
+		if (sub) {
+			n = sub.name;
+			if (n && !sub.disabled) {
+				s.extraData = s.extraData || {};
+				s.extraData[n] = sub.value;
+				if (sub.type == "image") {
+					s.extraData[n+'.x'] = form.clk_x;
+					s.extraData[n+'.y'] = form.clk_y;
+				}
+			}
+		}
+
+		// take a breath so that pending repaints get some cpu time before the upload starts
+		function doSubmit() {
+			// make sure form attrs are set
+			var t = $form.attr('target'), a = $form.attr('action');
+
+			// update form attrs in IE friendly way
+			form.setAttribute('target',id);
+			if (form.getAttribute('method') != 'POST') {
+				form.setAttribute('method', 'POST');
+			}
+			if (form.getAttribute('action') != s.url) {
+				form.setAttribute('action', s.url);
+			}
+
+			// ie borks in some cases when setting encoding
+			if (! s.skipEncodingOverride) {
+				$form.attr({
+					encoding: 'multipart/form-data',
+					enctype:  'multipart/form-data'
+				});
+			}
+
+			// support timout
+			if (s.timeout) {
+				timeoutHandle = setTimeout(function() { timedOut = true; cb(true); }, s.timeout);
+			}
+
+			// add "extra" data to form if provided in options
+			var extraInputs = [];
+			try {
+				if (s.extraData) {
+					for (var n in s.extraData) {
+						extraInputs.push(
+							$('<input type="hidden" name="'+n+'" value="'+s.extraData[n]+'" />')
+								.appendTo(form)[0]);
+					}
+				}
+
+				if (!s.iframeTarget) {
+					// add iframe to doc and submit the form
+					$io.appendTo('body');
+	                io.attachEvent ? io.attachEvent('onload', cb) : io.addEventListener('load', cb, false);
+				}
+				form.submit();
+			}
+			finally {
+				// reset attrs and remove "extra" input elements
+				form.setAttribute('action',a);
+				if(t) {
+					form.setAttribute('target', t);
+				} else {
+					$form.removeAttr('target');
+				}
+				$(extraInputs).remove();
+			}
+		}
+
+		if (s.forceSync) {
+			doSubmit();
+		}
+		else {
+			setTimeout(doSubmit, 10); // this lets dom updates render
+		}
+
+		var data, doc, domCheckCount = 50, callbackProcessed;
+
+		function cb(e) {
+			if (xhr.aborted || callbackProcessed) {
+				return;
+			}
+			if (e === true && xhr) {
+				xhr.abort('timeout');
+				return;
+			}
+
+			var doc = io.contentWindow ? io.contentWindow.document : io.contentDocument ? io.contentDocument : io.document;
+			if (!doc || doc.location.href == s.iframeSrc) {
+				// response not received yet
+				if (!timedOut)
+					return;
+			}
+            io.detachEvent ? io.detachEvent('onload', cb) : io.removeEventListener('load', cb, false);
+
+			var status = 'success', errMsg;
+			try {
+				if (timedOut) {
+					throw 'timeout';
+				}
+
+				var isXml = s.dataType == 'xml' || doc.XMLDocument || $.isXMLDoc(doc);
+				log('isXml='+isXml);
+				if (!isXml && window.opera && (doc.body == null || doc.body.innerHTML == '')) {
+					if (--domCheckCount) {
+						// in some browsers (Opera) the iframe DOM is not always traversable when
+						// the onload callback fires, so we loop a bit to accommodate
+						log('requeing onLoad callback, DOM not available');
+						setTimeout(cb, 250);
+						return;
+					}
+					// let this fall through because server response could be an empty document
+					//log('Could not access iframe DOM after mutiple tries.');
+					//throw 'DOMException: not available';
+				}
+
+				//log('response detected');
+                var docRoot = doc.body ? doc.body : doc.documentElement;
+                xhr.responseText = docRoot ? docRoot.innerHTML : null;
+				xhr.responseXML = doc.XMLDocument ? doc.XMLDocument : doc;
+				if (isXml)
+					s.dataType = 'xml';
+				xhr.getResponseHeader = function(header){
+					var headers = {'content-type': s.dataType};
+					return headers[header];
+				};
+                // support for XHR 'status' & 'statusText' emulation :
+                if (docRoot) {
+                    xhr.status = Number( docRoot.getAttribute('status') ) || xhr.status;
+                    xhr.statusText = docRoot.getAttribute('statusText') || xhr.statusText;
+                }
+
+				var dt = s.dataType || '';
+				var scr = /(json|script|text)/.test(dt.toLowerCase());
+				if (scr || s.textarea) {
+					// see if user embedded response in textarea
+					var ta = doc.getElementsByTagName('textarea')[0];
+					if (ta) {
+						xhr.responseText = ta.value;
+                        // support for XHR 'status' & 'statusText' emulation :
+                        xhr.status = Number( ta.getAttribute('status') ) || xhr.status;
+                        xhr.statusText = ta.getAttribute('statusText') || xhr.statusText;
+					}
+					else if (scr) {
+						// account for browsers injecting pre around json response
+						var pre = doc.getElementsByTagName('pre')[0];
+						var b = doc.getElementsByTagName('body')[0];
+						if (pre) {
+							xhr.responseText = pre.textContent ? pre.textContent : pre.innerHTML;
+						}
+						else if (b) {
+							xhr.responseText = b.innerHTML;
+						}
+					}
+				}
+				else if (s.dataType == 'xml' && !xhr.responseXML && xhr.responseText != null) {
+					xhr.responseXML = toXml(xhr.responseText);
+				}
+
+                try {
+                    data = httpData(xhr, s.dataType, s);
+                }
+                catch (e) {
+                    status = 'parsererror';
+                    xhr.error = errMsg = (e || status);
+                }
+			}
+			catch (e) {
+				log('error caught',e);
+				status = 'error';
+                xhr.error = errMsg = (e || status);
+			}
+
+			if (xhr.aborted) {
+				log('upload aborted');
+				status = null;
+			}
+
+            if (xhr.status) { // we've set xhr.status
+                status = (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) ? 'success' : 'error';
+            }
+
+			// ordering of these callbacks/triggers is odd, but that's how $.ajax does it
+			if (status === 'success') {
+				s.success && s.success.call(s.context, data, 'success', xhr);
+				g && $.event.trigger("ajaxSuccess", [xhr, s]);
+			}
+            else if (status) {
+				if (errMsg == undefined)
+					errMsg = xhr.statusText;
+				s.error && s.error.call(s.context, xhr, status, errMsg);
+				g && $.event.trigger("ajaxError", [xhr, s, errMsg]);
+            }
+
+			g && $.event.trigger("ajaxComplete", [xhr, s]);
+
+			if (g && ! --$.active) {
+				$.event.trigger("ajaxStop");
+			}
+
+			s.complete && s.complete.call(s.context, xhr, status);
+
+			callbackProcessed = true;
+			if (s.timeout)
+				clearTimeout(timeoutHandle);
+
+			// clean up
+			setTimeout(function() {
+				if (!s.iframeTarget)
+					$io.remove();
+				xhr.responseXML = null;
+			}, 100);
+		}
+
+		var toXml = $.parseXML || function(s, doc) { // use parseXML if available (jQuery 1.5+)
+			if (window.ActiveXObject) {
+				doc = new ActiveXObject('Microsoft.XMLDOM');
+				doc.async = 'false';
+				doc.loadXML(s);
+			}
+			else {
+				doc = (new DOMParser()).parseFromString(s, 'text/xml');
+			}
+			return (doc && doc.documentElement && doc.documentElement.nodeName != 'parsererror') ? doc : null;
+		};
+		var parseJSON = $.parseJSON || function(s) {
+			return window['eval']('(' + s + ')');
+		};
+
+		var httpData = function( xhr, type, s ) { // mostly lifted from jq1.4.4
+
+			var ct = xhr.getResponseHeader('content-type') || '',
+				xml = type === 'xml' || !type && ct.indexOf('xml') >= 0,
+				data = xml ? xhr.responseXML : xhr.responseText;
+
+			if (xml && data.documentElement.nodeName === 'parsererror') {
+				$.error && $.error('parsererror');
+			}
+			if (s && s.dataFilter) {
+				data = s.dataFilter(data, type);
+			}
+			if (typeof data === 'string') {
+				if (type === 'json' || !type && ct.indexOf('json') >= 0) {
+					data = parseJSON(data);
+				} else if (type === "script" || !type && ct.indexOf("javascript") >= 0) {
+					$.globalEval(data);
+				}
+			}
+			return data;
+		};
+	}
+};
+
+/**
+ * ajaxForm() provides a mechanism for fully automating form submission.
+ *
+ * The advantages of using this method instead of ajaxSubmit() are:
+ *
+ * 1: This method will include coordinates for <input type="image" /> elements (if the element
+ *	is used to submit the form).
+ * 2. This method will include the submit element's name/value data (for the element that was
+ *	used to submit the form).
+ * 3. This method binds the submit() method to the form for you.
+ *
+ * The options argument for ajaxForm works exactly as it does for ajaxSubmit.  ajaxForm merely
+ * passes the options argument along after properly binding events for submit elements and
+ * the form itself.
+ */
+$.fn.ajaxForm = function(options) {
+	// in jQuery 1.3+ we can fix mistakes with the ready state
+	if (this.length === 0) {
+		var o = { s: this.selector, c: this.context };
+		if (!$.isReady && o.s) {
+			log('DOM not ready, queuing ajaxForm');
+			$(function() {
+				$(o.s,o.c).ajaxForm(options);
+			});
+			return this;
+		}
+		// is your DOM ready?  http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
+		log('terminating; zero elements found by selector' + ($.isReady ? '' : ' (DOM not ready)'));
+		return this;
+	}
+
+	return this.ajaxFormUnbind().bind('submit.form-plugin', function(e) {
+		if (!e.isDefaultPrevented()) { // if event has been canceled, don't proceed
+			e.preventDefault();
+			$(this).ajaxSubmit(options);
+		}
+	}).bind('click.form-plugin', function(e) {
+		var target = e.target;
+		var $el = $(target);
+		if (!($el.is(":submit,input:image"))) {
+			// is this a child element of the submit el?  (ex: a span within a button)
+			var t = $el.closest(':submit');
+			if (t.length == 0) {
+				return;
+			}
+			target = t[0];
+		}
+		var form = this;
+		form.clk = target;
+		if (target.type == 'image') {
+			if (e.offsetX != undefined) {
+				form.clk_x = e.offsetX;
+				form.clk_y = e.offsetY;
+			} else if (typeof $.fn.offset == 'function') { // try to use dimensions plugin
+				var offset = $el.offset();
+				form.clk_x = e.pageX - offset.left;
+				form.clk_y = e.pageY - offset.top;
+			} else {
+				form.clk_x = e.pageX - target.offsetLeft;
+				form.clk_y = e.pageY - target.offsetTop;
+			}
+		}
+		// clear form vars
+		setTimeout(function() { form.clk = form.clk_x = form.clk_y = null; }, 100);
+	});
+};
+
+// ajaxFormUnbind unbinds the event handlers that were bound by ajaxForm
+$.fn.ajaxFormUnbind = function() {
+	return this.unbind('submit.form-plugin click.form-plugin');
+};
+
+/**
+ * formToArray() gathers form element data into an array of objects that can
+ * be passed to any of the following ajax functions: $.get, $.post, or load.
+ * Each object in the array has both a 'name' and 'value' property.  An example of
+ * an array for a simple login form might be:
+ *
+ * [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ]
+ *
+ * It is this array that is passed to pre-submit callback functions provided to the
+ * ajaxSubmit() and ajaxForm() methods.
+ */
+$.fn.formToArray = function(semantic) {
+	var a = [];
+	if (this.length === 0) {
+		return a;
+	}
+
+	var form = this[0];
+	var els = semantic ? form.getElementsByTagName('*') : form.elements;
+	if (!els) {
+		return a;
+	}
+
+	var i,j,n,v,el,max,jmax;
+	for(i=0, max=els.length; i < max; i++) {
+		el = els[i];
+		n = el.name;
+		if (!n) {
+			continue;
+		}
+
+		if (semantic && form.clk && el.type == "image") {
+			// handle image inputs on the fly when semantic == true
+			if(!el.disabled && form.clk == el) {
+				a.push({name: n, value: $(el).val()});
+				a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y});
+			}
+			continue;
+		}
+
+		v = $.fieldValue(el, true);
+		if (v && v.constructor == Array) {
+			for(j=0, jmax=v.length; j < jmax; j++) {
+				a.push({name: n, value: v[j]});
+			}
+		}
+		else if (v !== null && typeof v != 'undefined') {
+			a.push({name: n, value: v});
+		}
+	}
+
+	if (!semantic && form.clk) {
+		// input type=='image' are not found in elements array! handle it here
+		var $input = $(form.clk), input = $input[0];
+		n = input.name;
+		if (n && !input.disabled && input.type == 'image') {
+			a.push({name: n, value: $input.val()});
+			a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y});
+		}
+	}
+	return a;
+};
+
+/**
+ * Serializes form data into a 'submittable' string. This method will return a string
+ * in the format: name1=value1&amp;name2=value2
+ */
+$.fn.formSerialize = function(semantic) {
+	//hand off to jQuery.param for proper encoding
+	return $.param(this.formToArray(semantic));
+};
+
+/**
+ * Serializes all field elements in the jQuery object into a query string.
+ * This method will return a string in the format: name1=value1&amp;name2=value2
+ */
+$.fn.fieldSerialize = function(successful) {
+	var a = [];
+	this.each(function() {
+		var n = this.name;
+		if (!n) {
+			return;
+		}
+		var v = $.fieldValue(this, successful);
+		if (v && v.constructor == Array) {
+			for (var i=0,max=v.length; i < max; i++) {
+				a.push({name: n, value: v[i]});
+			}
+		}
+		else if (v !== null && typeof v != 'undefined') {
+			a.push({name: this.name, value: v});
+		}
+	});
+	//hand off to jQuery.param for proper encoding
+	return $.param(a);
+};
+
+/**
+ * Returns the value(s) of the element in the matched set.  For example, consider the following form:
+ *
+ *  <form><fieldset>
+ *	  <input name="A" type="text" />
+ *	  <input name="A" type="text" />
+ *	  <input name="B" type="checkbox" value="B1" />
+ *	  <input name="B" type="checkbox" value="B2"/>
+ *	  <input name="C" type="radio" value="C1" />
+ *	  <input name="C" type="radio" value="C2" />
+ *  </fieldset></form>
+ *
+ *  var v = $(':text').fieldValue();
+ *  // if no values are entered into the text inputs
+ *  v == ['','']
+ *  // if values entered into the text inputs are 'foo' and 'bar'
+ *  v == ['foo','bar']
+ *
+ *  var v = $(':checkbox').fieldValue();
+ *  // if neither checkbox is checked
+ *  v === undefined
+ *  // if both checkboxes are checked
+ *  v == ['B1', 'B2']
+ *
+ *  var v = $(':radio').fieldValue();
+ *  // if neither radio is checked
+ *  v === undefined
+ *  // if first radio is checked
+ *  v == ['C1']
+ *
+ * The successful argument controls whether or not the field element must be 'successful'
+ * (per http://www.w3.org/TR/html4/interact/forms.html#successful-controls).
+ * The default value of the successful argument is true.  If this value is false the value(s)
+ * for each element is returned.
+ *
+ * Note: This method *always* returns an array.  If no valid value can be determined the
+ *	   array will be empty, otherwise it will contain one or more values.
+ */
+$.fn.fieldValue = function(successful) {
+	for (var val=[], i=0, max=this.length; i < max; i++) {
+		var el = this[i];
+		var v = $.fieldValue(el, successful);
+		if (v === null || typeof v == 'undefined' || (v.constructor == Array && !v.length)) {
+			continue;
+		}
+		v.constructor == Array ? $.merge(val, v) : val.push(v);
+	}
+	return val;
+};
+
+/**
+ * Returns the value of the field element.
+ */
+$.fieldValue = function(el, successful) {
+	var n = el.name, t = el.type, tag = el.tagName.toLowerCase();
+	if (successful === undefined) {
+		successful = true;
+	}
+
+	if (successful && (!n || el.disabled || t == 'reset' || t == 'button' ||
+		(t == 'checkbox' || t == 'radio') && !el.checked ||
+		(t == 'submit' || t == 'image') && el.form && el.form.clk != el ||
+		tag == 'select' && el.selectedIndex == -1)) {
+			return null;
+	}
+
+	if (tag == 'select') {
+		var index = el.selectedIndex;
+		if (index < 0) {
+			return null;
+		}
+		var a = [], ops = el.options;
+		var one = (t == 'select-one');
+		var max = (one ? index+1 : ops.length);
+		for(var i=(one ? index : 0); i < max; i++) {
+			var op = ops[i];
+			if (op.selected) {
+				var v = op.value;
+				if (!v) { // extra pain for IE...
+					v = (op.attributes && op.attributes['value'] && !(op.attributes['value'].specified)) ? op.text : op.value;
+				}
+				if (one) {
+					return v;
+				}
+				a.push(v);
+			}
+		}
+		return a;
+	}
+	return $(el).val();
+};
+
+/**
+ * Clears the form data.  Takes the following actions on the form's input fields:
+ *  - input text fields will have their 'value' property set to the empty string
+ *  - select elements will have their 'selectedIndex' property set to -1
+ *  - checkbox and radio inputs will have their 'checked' property set to false
+ *  - inputs of type submit, button, reset, and hidden will *not* be effected
+ *  - button elements will *not* be effected
+ */
+$.fn.clearForm = function() {
+	return this.each(function() {
+		$('input,select,textarea', this).clearFields();
+	});
+};
+
+/**
+ * Clears the selected form elements.
+ */
+$.fn.clearFields = $.fn.clearInputs = function() {
+	return this.each(function() {
+		var t = this.type, tag = this.tagName.toLowerCase();
+		if (t == 'text' || t == 'password' || tag == 'textarea') {
+			this.value = '';
+		}
+		else if (t == 'checkbox' || t == 'radio') {
+			this.checked = false;
+		}
+		else if (tag == 'select') {
+			this.selectedIndex = -1;
+		}
+	});
+};
+
+/**
+ * Resets the form data.  Causes all form elements to be reset to their original value.
+ */
+$.fn.resetForm = function() {
+	return this.each(function() {
+		// guard against an input with the name of 'reset'
+		// note that IE reports the reset function as an 'object'
+		if (typeof this.reset == 'function' || (typeof this.reset == 'object' && !this.reset.nodeType)) {
+			this.reset();
+		}
+	});
+};
+
+/**
+ * Enables or disables any matching elements.
+ */
+$.fn.enable = function(b) {
+	if (b === undefined) {
+		b = true;
+	}
+	return this.each(function() {
+		this.disabled = !b;
+	});
+};
+
+/**
+ * Checks/unchecks any matching checkboxes or radio buttons and
+ * selects/deselects and matching option elements.
+ */
+$.fn.selected = function(select) {
+	if (select === undefined) {
+		select = true;
+	}
+	return this.each(function() {
+		var t = this.type;
+		if (t == 'checkbox' || t == 'radio') {
+			this.checked = select;
+		}
+		else if (this.tagName.toLowerCase() == 'option') {
+			var $sel = $(this).parent('select');
+			if (select && $sel[0] && $sel[0].type == 'select-one') {
+				// deselect all other options
+				$sel.find('option').selected(false);
+			}
+			this.selected = select;
+		}
+	});
+};
+
+// helper fn for console logging
+function log() {
+	var msg = '[jquery.form] ' + Array.prototype.join.call(arguments,'');
+	if (window.console && window.console.log) {
+		window.console.log(msg);
+	}
+	else if (window.opera && window.opera.postError) {
+		window.opera.postError(msg);
+	}
+};
+
+})(jQuery);

public/assets/addons/wdsxh/libs/jquery.lazyload.min.js

@@ -0,0 +1,2 @@
+/*! Lazy Load 1.9.3 - MIT license - Copyright 2010-2013 Mika Tuupola */
+!function(a,b,c,d){var e=a(b);a.fn.lazyload=function(f){function g(){var b=0;i.each(function(){var c=a(this);if(!j.skip_invisible||c.is(":visible"))if(a.abovethetop(this,j)||a.leftofbegin(this,j));else if(a.belowthefold(this,j)||a.rightoffold(this,j)){if(++b>j.failure_limit)return!1}else c.trigger("appear"),b=0})}var h,i=this,j={threshold:0,failure_limit:0,event:"scroll",effect:"show",container:b,data_attribute:"original",skip_invisible:!0,appear:null,load:null,placeholder:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC"};return f&&(d!==f.failurelimit&&(f.failure_limit=f.failurelimit,delete f.failurelimit),d!==f.effectspeed&&(f.effect_speed=f.effectspeed,delete f.effectspeed),a.extend(j,f)),h=j.container===d||j.container===b?e:a(j.container),0===j.event.indexOf("scroll")&&h.bind(j.event,function(){return g()}),this.each(function(){var b=this,c=a(b);b.loaded=!1,(c.attr("src")===d||c.attr("src")===!1)&&c.is("img")&&c.attr("src",j.placeholder),c.one("appear",function(){if(!this.loaded){if(j.appear){var d=i.length;j.appear.call(b,d,j)}a("<img />").bind("load",function(){var d=c.attr("data-"+j.data_attribute);c.hide(),c.is("img")?c.attr("src",d):c.css("background-image","url('"+d+"')"),c[j.effect](j.effect_speed),b.loaded=!0;var e=a.grep(i,function(a){return!a.loaded});if(i=a(e),j.load){var f=i.length;j.load.call(b,f,j)}}).attr("src",c.attr("data-"+j.data_attribute))}}),0!==j.event.indexOf("scroll")&&c.bind(j.event,function(){b.loaded||c.trigger("appear")})}),e.bind("resize",function(){g()}),/(?:iphone|ipod|ipad).*os 5/gi.test(navigator.appVersion)&&e.bind("pageshow",function(b){b.originalEvent&&b.originalEvent.persisted&&i.each(function(){a(this).trigger("appear")})}),a(c).ready(function(){g()}),this},a.belowthefold=function(c,f){var g;return g=f.container===d||f.container===b?(b.innerHeight?b.innerHeight:e.height())+e.scrollTop():a(f.container).offset().top+a(f.container).height(),g<=a(c).offset().top-f.threshold},a.rightoffold=function(c,f){var g;return g=f.container===d||f.container===b?e.width()+e.scrollLeft():a(f.container).offset().left+a(f.container).width(),g<=a(c).offset().left-f.threshold},a.abovethetop=function(c,f){var g;return g=f.container===d||f.container===b?e.scrollTop():a(f.container).offset().top,g>=a(c).offset().top+f.threshold+a(c).height()},a.leftofbegin=function(c,f){var g;return g=f.container===d||f.container===b?e.scrollLeft():a(f.container).offset().left,g>=a(c).offset().left+f.threshold+a(c).width()},a.inviewport=function(b,c){return!(a.rightoffold(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.abovethetop(b,c))},a.extend(a.expr[":"],{"below-the-fold":function(b){return a.belowthefold(b,{threshold:0})},"above-the-top":function(b){return!a.belowthefold(b,{threshold:0})},"right-of-screen":function(b){return a.rightoffold(b,{threshold:0})},"left-of-screen":function(b){return!a.rightoffold(b,{threshold:0})},"in-viewport":function(b){return a.inviewport(b,{threshold:0})},"above-the-fold":function(b){return!a.belowthefold(b,{threshold:0})},"right-of-fold":function(b){return a.rightoffold(b,{threshold:0})},"left-of-fold":function(b){return!a.rightoffold(b,{threshold:0})}})}(jQuery,window,document);

public/assets/addons/wdsxh/libs/poster.css

@@ -0,0 +1,204 @@
+#poster {
+	width: 375px;
+	height: auto;
+	border: 1px solid #ccc;
+	position: relative;
+	box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	min-width: 375px;
+	min-height: 667px;
+	background-color: #f7f6f6;
+}
+
+#poster .bg {
+	position: relative;
+	width: 100%;
+	z-index: 0;
+	box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+}
+
+#poster .rRightDown,
+.rLeftDown,
+.rLeftUp,
+.rRightUp,
+.rRight,
+.rLeft,
+.rUp,
+.rDown {
+	position: absolute;
+	width: 7px;
+	height: 7px;
+	z-index: 1;
+	font-size: 0;
+	border-radius: 50%;
+	border: 1px solid #666;
+	background: #fff;
+	display: none;
+}
+
+#poster .drag.active {
+	border: 1px solid #4e73df;
+}
+
+#poster .active .rRightDown,
+.active .rLeftDown,
+.active .rLeftUp,
+.active .rRightUp,
+.active .rRight,
+.active .rLeft,
+.active .rUp,
+.active .rDown {
+	border-color: #4e73df;
+	display: block;
+}
+
+#poster .drag[type=img] img,
+#poster .drag[type=thumb] img {
+	width: 100%;
+	height: 100%;
+}
+
+#poster .drag {
+	position: absolute;
+	width: 80px;
+	height: 80px;
+	border: 1px dashed #000;
+	cursor: move;
+}
+
+#poster .drag[data-type="text"],
+#poster .drag[type=number] {
+	width: 80px;
+	height: 40px;
+	font-size: 16px;
+	font-family: 黑体;
+}
+
+#poster .drag[data-item="banner"] {
+	height: 40px;
+}
+
+#poster .drag img {
+	position: absolute;
+	z-index: 0;
+	width: 100%;
+}
+
+.rLeftDown {
+	left: -4px;
+	bottom: -4px;
+}
+
+.rRightUp {
+	right: -4px;
+	top: -4px;
+}
+
+.rLeftUp {
+	left: -4px;
+	top: -4px;
+}
+
+.rRight {
+	right: -4px;
+	top: 50%;
+	margin-top: -4px;
+}
+
+.rLeft {
+	left: -4px;
+	top: 50%;
+	margin-top: -4px;
+}
+
+.rUp {
+	top: -4px;
+	left: 50%;
+	margin-left: -4px;
+}
+
+.rRightDown {
+	right: -4px;
+	bottom: -4px;
+}
+
+.rLeftDown,
+.rRightUp {
+	cursor: ne-resize;
+}
+
+.rRightDown,
+.rLeftUp {
+	cursor: nw-resize;
+}
+
+.rRight,
+.rLeft {
+	cursor: e-resize;
+}
+
+.rUp,
+.rDown {
+	cursor: n-resize;
+}
+
+.rRightDown {
+	background-color: #00F;
+}
+
+.qrs {
+	display: none;
+}
+
+.rDown {
+	bottom: -4px;
+	left: 50%;
+	margin-left: -4px;
+}
+
+.context-menu-layer {
+	z-index: 9999;
+}
+
+.context-menu-list {
+	z-index: 9999;
+}
+
+.qrset {
+	display: none;
+}
+
+.form-horizontal .control-label {
+	text-align: left;
+}
+
+#styleset .control-radio-group {
+	border-radius: 4px;
+	overflow: hidden;
+}
+
+#styleset .control-radio-group .control-radio {
+	border: 1px solid #dcdfe6;
+	border-left: none;
+	padding: 9px 15px;
+	font-size: 12px;
+	line-height: 12px;
+	cursor: pointer;
+}
+
+#styleset .control-radio-group .control-radio:first-child {
+	border-left: 1px solid #dcdfe6;
+}
+
+#styleset .control-radio-group .control-radio.active {
+	color: #fff;
+	background: #409eff;
+}
+
+#styleset .control-radio-group .control-radio:hover {
+	color: #409eff;
+}
+#styleset .control-radio-group .control-radio.active:hover {
+	color: #ffffff;
+}

public/assets/addons/wdsxh/libs/poster.js

@@ -0,0 +1,365 @@
+var that, bscounter = 0, imgcounter = 0, ncounter = 0, colorpickerObj, styleset = $('#styleset'), textset = $("#textset");
+
+function dragEvent(obj) {
+  var posterIndex = obj.attr('index');
+  var posterrs = new Resize(obj, {
+    Max: true,
+    mxContainer: "#poster",
+    onResize: function () {
+      updateInfoBox();
+    }
+  });
+  posterrs.Set($(".rRightDown", obj), "right-down");
+  posterrs.Set($(".rLeftDown", obj), "left-down");
+  posterrs.Set($(".rRightUp", obj), "right-up");
+  posterrs.Set($(".rLeftUp", obj), "left-up");
+  posterrs.Set($(".rRight", obj), "right");
+  posterrs.Set($(".rLeft", obj), "left");
+  posterrs.Set($(".rUp", obj), "up");
+  posterrs.Set($(".rDown", obj), "down");
+  posterrs.Scale = true;
+
+  var type = obj.data('type');
+  if (type == 'text') {
+    posterrs.Scale = false;
+  }
+
+  var drag = new Drag(obj, {
+    Limit: true,
+    mxContainer: "#poster",
+    onMove: function () {
+      updateInfoBox();
+    }
+  });
+
+  $.contextMenu({
+    selector: '.drag[index=' + posterIndex + ']',
+    callback: function (key, options) {
+      var zindex = parseInt($(this).attr('zindex'));
+
+      if (key == 'prev') {
+        var prevdiv = $(this).prev('.drag');
+        if (prevdiv.length > 0) {
+          $(this).insertBefore(prevdiv);
+        }
+      } else if (key == 'next') {
+        var nextdiv = $(this).next('.drag');
+        if (nextdiv.length > 0) {
+          nextdiv.insertBefore($(this));
+        }
+      } else if (key == 'last') {
+        var len = $('.drag').length;
+        if (zindex >= len - 1) {
+          return;
+        }
+        var last = $('#poster .drag:last');
+        if (last.length > 0) {
+          $(this).insertAfter(last);
+        }
+      } else if (key == 'first') {
+        var zindex = $(this).index();
+        if (zindex <= 1) {
+          return;
+        }
+        var first = $('#poster .drag:first');
+        if (first.length > 0) {
+          $(this).insertBefore(first);
+        }
+      } else if (key == 'delete') {
+        that = null;
+        $(this).remove();
+        updateInfoBox();
+      }
+      var n = 1;
+      $('.drag').each(function () {
+        $(this).css("z-index", n);
+        n++;
+      })
+    },
+    items: {
+      "next": {
+        name: "移动到上一层"
+      },
+      "prev": {
+        name: "移动到下一层"
+      },
+      "last": {
+        name: "移动到最顶层"
+      },
+      "first": {
+        name: "移动到最低层"
+      },
+      "delete": {
+        name: "删除组件"
+      }
+    }
+  });
+}
+
+function deleteTimers() {
+  clearInterval(imgcounter);
+  clearInterval(ncounter);
+  clearInterval(bscounter);
+}
+
+function getUrl(val) {
+  if (val.indexOf('http://') == -1) {
+    val = attachurl + val;
+  }
+  return val;
+}
+
+function getImgInfo(url) {
+  var start_time = new Date().getTime();
+  var img_url = url + "?t=" + start_time;
+  var img = new Image();
+  img.src = img_url;
+  var check = function () {
+    if (img.width > 0 || img.height > 0) {
+      clearInterval(set);
+    }
+  };
+  var set = setInterval(check, 40);
+  img.onload = function () {
+    return { 'width': img.width, 'height': img.height };
+  };
+}
+
+function PreviewImg(imgFile) {
+  var image = new Image();
+  image.src = imgFile;
+  return image;
+}
+
+function tiger_bind(obj) {
+  that = obj;
+  updateInfoBox();
+  styleset.show();
+  textset.hide();
+  deleteTimers();
+  var type = obj.data('type');
+  if (type == 'text') {
+    textset.show();
+    var size = obj.attr('size') || "16";
+    var input = textset.find('input:first');
+    var namesize = textset.find('#namesize');
+    var textAlign = obj.attr('textAlign') || "left";
+    var fontStyle = obj.attr('fontStyle');
+    var color = obj.attr('color') || "#000";
+    input.val(color);
+    $("#previewColor").css("background-color", color);
+    namesize.val(size.replace("px", ""));
+    $("#textAlign .control-radio").removeClass("active");
+    $(`#textAlign .control-radio.${textAlign}`).addClass("active");
+    $("#fontStyle .control-radio.active").removeClass("active")
+    if (fontStyle == 2) {
+      $("#fontStyle .control-radio.italic").addClass("active")
+    } else if (fontStyle == 3) {
+      $("#fontStyle .control-radio.bold").addClass("active")
+    } else if (fontStyle == 4) {
+      $("#fontStyle .control-radio.italic").addClass("active")
+      $("#fontStyle .control-radio.bold").addClass("active")
+    }
+    //设置字体颜色
+    if (!colorpickerObj) {
+      colorpickerObj = Colorpicker.create({
+        el: "colorpicker",
+        color: $('input[name="color"]').val(),
+        allMode: 'hex',
+        change: function (elem, rgba, hex) {
+          if (that) {
+            $('#previewColor').css('backgroundColor', rgba);
+            if (hex !== undefined) {
+              $('input[name="color"]').val(hex);
+              that.attr('color', input.val()).find('.text').css('color', input.val());
+            }
+          }
+        }
+      })
+    }
+  }
+}
+
+function updateInfoBox() {
+  if (that) {
+    $("#item-top").val(parseFloat($(that).css('top')));
+    $("#item-left").val(parseFloat($(that).css('left')));
+    $("#item-width").val(parseFloat($(that).css('width')));
+    $("#item-height").val(parseFloat($(that).css('height')));
+    $(that).find(".text").css('line-height', parseFloat($(that).css('height')) + "px")
+  } else {
+    $("#item-top").val('');
+    $("#item-left").val('');
+    $("#item-width").val('');
+    $("#item-height").val('');
+  }
+}
+
+function getPosterData() {
+  var data = [];
+  $('.drag').each(function () {
+    var obj = $(this);
+    var type = obj.data('type');
+    var item = obj.data('item');
+    var left = obj.css('left'),
+      top = obj.css('top'),
+      lab = obj.data('lab');
+    var d = {
+      left: left,
+      top: top,
+      type: type,
+      item: item,
+      lab: lab,
+      width: obj.css('width'),
+      height: obj.css('height')
+    };
+    if (type == 'text') {
+      d.size = obj.attr('size');
+      d.color = obj.attr('color');
+      d.textAlign = obj.attr('textAlign');
+      d.fontStyle = obj.attr('fontStyle');
+    }
+    data.push(d);
+  });
+  var bg = {
+    'img': $('#poster .bg').attr('src'),
+    'width': $('#poster .bg').width(),
+    'height': $('#poster .bg').height()
+  }
+
+  return { 'bg': bg, 'data': data };
+}
+
+$(function () {
+  $('.drag').each(function () {
+    dragEvent($(this));
+  });
+  textset.hide(), styleset.hide();
+  $('.btn-poster').click(function () {
+    if ($('#poster .bg').attr('src').length <= 0) {
+      alert('请选择背景图片!');
+      return;
+    }
+    var type = $(this).data('type');
+    var item = $(this).data('item');
+    var lab = $(this).text();
+    var obj = "";
+    if (type == 'img' && item == 'qr') {
+      obj = '<img src="/assets/addons/wdsxh/img/qr.png" />';
+    } else if (type == 'img' && item == 'avatar') {
+      obj = '<img src="/assets/addons/wdsxh/img/avatar.png" />';
+    } else if (type == 'img' && item == 'banner') {
+      obj = '<img src="/assets/addons/wdsxh/img/image.jpg" />';
+    } else if (type == 'text') {
+      obj = '<div class="text">' + lab.replace(/^\s*|\s*$/g, "") + '</div>';
+    }
+    if (!obj) {
+      alert('组件类型错误');
+      return;
+    }
+    var index = $('#poster .drag').length + 1;
+    $(".drag").removeClass("active")
+    var html = `<div class="drag active" data-type="${type}" data-item="${item}" data-lab="${lab.replace(/^\s*|\s*$/g, "")}" index="${index}" style="z-index: ${index}; left: 0px; top: 0px; " ${(type == "text" ? "size='16px' color='#000000' textAlign='left'" : "")}>
+      ${obj}
+      <div class="rRightDown"></div>
+      <div class="rLeftDown"></div>
+      <div class="rRightUp"></div>
+      <div class="rLeftUp"></div>
+      <div class="rRight"></div>
+      <div class="rLeft"></div>
+      <div class="rUp"></div>
+      <div class="rDown"></div>
+    </div>`;
+    var obj = $(html);
+    $('#poster').append(obj);
+    dragEvent(obj);
+    tiger_bind(obj);
+  });
+  $("#poster").on("mousedown", ".drag", function () {
+    $(".drag").removeClass("active")
+    $(this).addClass("active")
+    tiger_bind($(this));
+  });
+  $("#poster").on("mousedown", ".rDown", function () {
+    $(".drag").removeClass("active")
+    $(this).addClass("active")
+    tiger_bind($(this));
+  });
+  $("#colorclean").click(function () {
+    $('input[name="color"]').val('#000000');
+    $('#previewColor').css('backgroundColor', '#000000');
+  })
+  // 设置距顶边距
+  $("#styleset").on('input', "#item-top", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('top', $(this).val() + "px").css('top', $(this).val() + "px");
+    }
+  });
+  // 设置距左边距
+  $("#styleset").on('input', "#item-left", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('left', $(this).val() + "px").css('left', $(this).val() + "px");
+    }
+  });
+  // 设置组件宽度
+  $("#styleset").on('input', "#item-width", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('width', $(this).val() + "px").css('width', $(this).val() + "px");
+    }
+  });
+  // 设置组件高度
+  $("#styleset").on('input', "#item-height", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('height', $(this).val() + "px").css('height', $(this).val() + "px");
+      $(".drag.active .text").css('line-height', $(this).val() + "px");
+    }
+  });
+  // 重置字体颜色
+  $("#styleset").on('click', "#colorclean", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('color', "#000000").find('.text').css('color', "#000000");
+    }
+  });
+  // 设置字体大小
+  $("#styleset").on('input', "#namesize", function (e) {
+    var that = $(".drag.active")
+    var namesize = textset.find('#namesize');
+    if (that) {
+      that.attr('size', namesize.val() + "px").find('.text').css('font-size', namesize.val() + "px");
+    }
+  });
+  // 设置文字位置
+  $("#textAlign").on('click', ".control-radio", function (e) {
+    var that = $(".drag.active")
+    if (that) {
+      that.attr('textAlign', $(this).attr("data-item")).find('.text').css('text-align', $(this).attr("data-item"));
+      $("#textAlign .control-radio.active").removeClass("active")
+      $(this).addClass("active")
+    }
+  });
+  // 设置文字样式
+  $("#fontStyle").on('click', ".control-radio", function (e) {
+    var that = $(".drag.active")
+    $(this).toggleClass("active")
+    let list = $("#fontStyle .control-radio.active")
+    let selected = []
+    for (let i = 0; i < list.length; i++) {
+      selected.push(list[i].getAttribute("data-item"))
+    }
+    selected = selected.join()
+    if (selected.includes("bold") && selected.includes("italic")) {
+      that.attr('fontStyle', 4).find('.text').css('font-weight', 'bold').css('font-style', 'italic');
+    } else if (selected.includes("bold")) {
+      that.attr('fontStyle', 3).find('.text').css('font-weight', 'bold').css('font-style', 'normal');
+    } else if (selected.includes("italic")) {
+      that.attr('fontStyle', 2).find('.text').css('font-weight', 'normal').css('font-style', 'italic');
+    } else {
+      that.attr('fontStyle', 1).find('.text').css('font-weight', 'normal').css('font-style', 'normal');
+    }
+  });
+});