Commit e999e305 by 吴学德

一人一码前端UI

parent 71e9304e
node_modules/
.svn/
*.svn
*.iml
.idea/
.git/
package-lock.json
dist/
FROM nginx
LABEL maintainer="Liph <liph@gzwinsun.com>" app="gdtel-gztel-jyyy-ui"
RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.aliyun.com/g' /etc/apk/repositories \
&& apk update && apk add ca-certificates tzdata \
&& cp /usr/share/zoneinfo/Asia/Shanghai /etc/localtime \
&& echo "Asia/Shanghai" > /etc/timezone \
&& apk del tzdata
COPY dist/ /usr/share/nginx/html/
EXPOSE 80
Ant Design Jeecg Vue
====
当前最新版本: 2.0.2(发布日期:20190708)
Overview
----
基于 [Ant Design of Vue](https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn/) 实现的 Ant Design Pro Vue 版
Jeecg-boot 的前段UI框架,采用前后端分离方案,提供强大代码生成器的快速开发平台。
前端页面代码和后端功能代码一键生成,不需要写任何代码,保持jeecg一贯的强大!!
#### 前端技术
- 基础框架:[ant-design-vue](https://github.com/vueComponent/ant-design-vue) - Ant Design Of Vue 实现
- JavaScript框架:Vue
- Webpack
- node
- yarn
- eslint
- @vue/cli 3.2.1
- [vue-cropper](https://github.com/xyxiao001/vue-cropper) - 头像裁剪组件
- [@antv/g2](https://antv.alipay.com/zh-cn/index.html) - Alipay AntV 数据可视化图表
- [Viser-vue](https://viserjs.github.io/docs.html#/viser/guide/installation) - antv/g2 封装实现
项目下载和运行
----
- yarn安装
```
npm install -g yarn
-g参数是为了全局安装使用
```
- 拉取项目代码
```bash
git clone https://github.com/zhangdaiscott/jeecg-boot.git
cd jeecg-boot/ant-design-jeecg-vue
```
- 安装依赖
```
yarn install
```
- 开发模式运行
```
yarn run serve
```
- 编译项目
```
yarn run build
```
- Lints and fixes files
```
yarn run lint
```
其他说明
----
- 项目使用的 [vue-cli3](https://cli.vuejs.org/guide/), 请更新您的 cli
- 关闭 Eslint (不推荐) 移除 `package.json``eslintConfig` 整个节点代码
- 修改 Ant Design 配色,在文件 `vue.config.js` 中,其他 less 变量覆盖参考 [ant design](https://ant.design/docs/react/customize-theme-cn) 官方说明
```ecmascript 6
css: {
loaderOptions: {
less: {
modifyVars: {
/* less 变量覆盖,用于自定义 ant design 主题 */
'primary-color': '#F5222D',
'link-color': '#F5222D',
'border-radius-base': '4px',
},
javascriptEnabled: true,
}
}
}
```
附属文档
----
- [Ant Design Vue](https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn)
- [报表 viser-vue](https://viserjs.github.io/demo.html#/viser/bar/basic-bar)
- [Vue](https://cn.vuejs.org/v2/guide)
- [路由/菜单说明](https://github.com/zhangdaiscott/jeecg-boot/tree/master/ant-design-jeecg-vue/src/router/README.md)
- [ANTD 默认配置项](https://github.com/zhangdaiscott/jeecg-boot/tree/master/ant-design-jeecg-vue/src/defaultSettings.js)
- 其他待补充...
备注
----
> @vue/cli 升级后,eslint 规则更新了。由于影响到全部 .vue 文件,需要逐个验证。既暂时关闭部分原本不验证的规则,后期维护时,在逐步修正这些 rules
module.exports = {
presets: [
'@vue/app'
]
}
module.exports = {
//此项是用来告诉eslint找当前配置文件不能往父级查找
root: true,
//此项是用来指定eslint解析器的,解析器必须符合规则,babel-eslint解析器是对babel解析器的包装使其与ESLint解析
parser: 'babel-eslint',
//此项是用来指定javaScript语言类型和风格,sourceType用来指定js导入的方式,默认是script,此处设置为module,指某块导入方式
parserOptions: {
// 设置 script(默认) 或 module,如果代码是在ECMASCRIPT中的模块
sourceType: 'module',
'ecmaVersion': 6,
'ecmaFeatures': {
'jsx': true
}
},
// 此项指定环境的全局变量,下面的配置指定为浏览器环境
env: {
'browser': true,
'node': true,
'commonjs': true,
'es6': true,
'amd': true
},
// https://github.com/standard/standard/blob/master/docs/RULES-en.md
// 此项是用来配置标准的js风格,就是说写代码的时候要规范的写,如果你使用vs-code我觉得应该可以避免出错
extends: 'vue',
// 此项是用来提供插件的,插件名称省略了eslint-plugin-,下面这个配置是用来规范html的
plugins: [
'html',
'flow-vars',
'react'
],
/*
下面这些rules是用来设置从插件来的规范代码的规则,使用必须去掉前缀eslint-plugin-
主要有如下的设置规则,可以设置字符串也可以设置数字,两者效果一致
"off" -> 0 关闭规则
"warn" -> 1 开启警告规则
"error" -> 2 开启错误规则
*/
rules: {
// 不需要
'space-before-function-paren': 0, // 函数定义时括号前面要不要有空格
'eol-last': 0, // 文件以单一的换行符结束
'no-extra-semi': 0, // 可以多余的冒号
'semi': 0, // 语句可以不需要分号结尾
'eqeqeq': 0, // 必须使用全等
'one-var': 0, // 连续声明
'no-undef': 0, // 可以 有未定义的变量
// 警告
'no-extra-boolean-cast': 1, // 不必要的bool转换
'no-extra-parens': 1, // 非必要的括号
'no-empty': 1, // 块语句中的内容不能为空
'no-use-before-define': [1, 'nofunc'], // 未定义前不能使用
'complexity': [1, 10], // 循环复杂度
'no-unused-vars': 1, // 不能有声明后未被使用的变量或参数
// vue
'flow-vars/define-flow-type': 1,
'flow-vars/use-flow-type': 1,
// react
'react/jsx-uses-react': 2,
'react/jsx-uses-vars': 2,
// 错误
'comma-dangle': [2, 'never'], // 对象字面量项尾不能有逗号
'no-debugger': 2, // 禁止使用debugger
'no-constant-condition': 2, // 禁止在条件中使用常量表达式 if(true) if(1)
'no-dupe-args': 2, // 函数参数不能重复
'no-dupe-keys': 2, // 在创建对象字面量时不允许键重复 {a:1,a:1}
'no-duplicate-case': 2, // switch中的case标签不能重复
'no-empty-character-class': 2, // 正则表达式中的[]内容不能为空
'no-invalid-regexp': 2, // 禁止无效的正则表达式
'no-func-assign': 2, // 禁止重复的函数声明
'valid-typeof': 2, // 必须使用合法的typeof的值
'no-unreachable': 2, // 不能有无法执行的代码
'no-unexpected-multiline': 2, // 避免多行表达式
'no-sparse-arrays': 2, // 禁止稀疏数组, [1,,2]
'no-shadow-restricted-names': 2, // 严格模式中规定的限制标识符不能作为声明时的变量名使用
'no-cond-assign': 2, // 禁止在条件表达式中使用赋值语句
'no-native-reassign': 2, // 不能重写native对象
// 代码风格
'no-else-return': 1, // 如果if语句里面有return,后面不能跟else语句
'no-multi-spaces': 1, // 不能用多余的空格
'key-spacing': [1, { // 对象字面量中冒号的前后空格
'beforeColon': false,
'afterColon': true
}],
'block-scoped-var': 2, // 块语句中使用var
'consistent-return': 2, // return 后面是否允许省略
'accessor-pairs': 2, // 在对象中使用getter/setter
'dot-location': [2, 'property'], // 对象访问符的位置,换行的时候在行首还是行尾
'no-lone-blocks': 2, // 禁止不必要的嵌套块
'no-labels': 2, // 禁止标签声明
'no-extend-native': 2, // 禁止扩展native对象
'no-floating-decimal': 2, // 禁止省略浮点数中的0 .5 3.
'no-loop-func': 2, // 禁止在循环中使用函数(如果没有引用外部变量不形成闭包就可以)
'no-new-func': 2, // 禁止使用new Function
'no-self-compare': 2, // 不能比较自身
'no-sequences': 2, // 禁止使用逗号运算符
'no-throw-literal': 2, // 禁止抛出字面量错误 throw "error";
'no-return-assign': [2, 'always'], // return 语句中不能有赋值表达式
'no-redeclare': [2, { // 禁止重复声明变量
'builtinGlobals': true
}],
'no-unused-expressions': [2, { // 禁止无用的表达式
'allowShortCircuit': true,
'allowTernary': true
}],
'no-useless-call': 2, // 禁止不必要的call和apply
'no-useless-concat': 2,
'no-void': 2, // 禁用void操作符
'no-with': 2, // 禁用with
'space-infix-ops': 2, // 中缀操作符周围要不要有空格
'valid-jsdoc': [2, { // jsdoc规则
'requireParamDescription': true,
'requireReturnDescription': true
}],
'no-warning-comments': [2, { // 不能有警告备注
'terms': ['todo', 'fixme', 'any other term'],
'location': 'anywhere'
}],
'curly': 1, // 必须使用 if(){} 中的{}
// common js
'no-duplicate-imports': 1
}
}
//开发环境配置
const dev = {
devServer: {
port: 3000,
proxy: {
'/api': {
target: 'http://132.97.20.38:18080',
ws: false,
changeOrigin: true,
pathRewrite: {
//默认所有请求都加了api前缀,需要去掉
'^/api': '/'
}
}
}
}
}
module.exports = dev
//本地环境配置
const local = {
devServer: {
port: 3000,
proxy: {
'/api/auth': {
target: 'http://localhost:10001',
ws: false,
changeOrigin: true,
pathRewrite: {
//默认所有请求都加了api前缀,需要去掉
'^/api/auth/ciop': '/auth/ciop'
}
},
'/api/jyyy': {
target: 'http://localhost:11091',
//target: 'http://132.97.54.60:58334',
ws: false,
changeOrigin: true,
pathRewrite: {
//默认所有请求都加了api前缀,需要去掉
'^/api/jyyy': '/'
}
},
'/api/report': {
target: 'http://localhost:10003',
//target: 'http://132.97.54.60:58334',
ws: false,
changeOrigin: true,
pathRewrite: {
//默认所有请求都加了api前缀,需要去掉
'^/api/report': '/'
}
}
}
}
}
module.exports = local
//生产环境配置,这里配置为测试环境
const prod = {
devServer: {
port: 3000,
proxy: {
'/api': {
target: 'http://202.105.240.10',
ws: false,
changeOrigin: true,
pathRewrite: {
//默认所有请求都加了api前缀,需要去掉
'^/api': ''
}
}
}
}
}
module.exports = prod
'use strict'
const path = require('path')
function resolve(dir) {
return path.join(__dirname, '.', dir)
}
module.exports = {
context: path.resolve(__dirname, './'),
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'config': resolve('config'),
'@': resolve('src'),
'@views': resolve('src/views'),
'@comp': resolve('src/components'),
'@core': resolve('src/core'),
'@utils': resolve('src/utils'),
'@entry': resolve('src/entry'),
'@router': resolve('src/router'),
'@store': resolve('src/store')
}
}
}
\ No newline at end of file
{
"name": "winsun-project-ui",
"version": "1.0.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --open",
"dev": "vue-cli-service serve --mode=dev",
"local": "vue-cli-service serve --mode=local",
"prod": "vue-cli-service serve --open",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"test:unit": "vue-cli-service test:unit",
"test:e2e": "vue-cli-service test:e2e"
},
"dependencies": {
"@antv/data-set": "^0.10.2",
"@tinymce/tinymce-vue": "^2.0.0",
"ant-design-vue": "^1.4.5",
"apexcharts": "^3.10.1",
"axios": "^0.18.0",
"clipboard": "^2.0.4",
"codemirror": "^5.49.2",
"dayjs": "^1.8.17",
"echarts": "^4.5.0",
"enquire.js": "^2.1.6",
"js-cookie": "^2.2.1",
"lodash.get": "^4.4.2",
"lodash.pick": "^4.4.0",
"md5": "^2.2.1",
"nprogress": "^0.2.0",
"reqwest": "^2.0.5",
"tinymce": "^5.1.1",
"viser-vue": "^2.4.7",
"vue": "^2.6.10",
"vue-apexcharts": "^1.5.1",
"vue-class-component": "^6.0.0",
"vue-cropper": "^0.4.8",
"vue-echarts": "^4.0.4",
"vue-i18n": "^8.15.0",
"vue-loader": "^15.7.2",
"vue-ls": "^3.2.0",
"vue-photo-preview": "^1.1.3",
"vue-print-nb-jeecg": "^1.0.9",
"vue-property-decorator": "^7.3.0",
"vue-router": "^3.1.3",
"vue-splitpane": "^1.0.4",
"vuedraggable": "^2.23.2",
"vuex": "^3.1.2",
"vuex-class": "^0.3.1",
"webpack": "^4.41.2"
},
"devDependencies": {
"@babel/polyfill": "^7.7.0",
"@vue/cli-plugin-babel": "^3.12.1",
"@vue/cli-plugin-eslint": "^3.12.1",
"@vue/cli-service": "^3.12.1",
"@vue/eslint-config-standard": "^4.0.0",
"babel-eslint": "^10.0.3",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.1.0",
"html-webpack-plugin": "^3.2.0",
"less": "^3.10.3",
"less-loader": "^4.1.0",
"node-sass": "^4.13.0",
"sass-loader": "^7.3.1",
"vue-template-compiler": "^2.6.10"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/strongly-recommended",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {
"generator-star-spacing": "off",
"no-mixed-operators": 0,
"vue/max-attributes-per-line": [
2,
{
"singleline": 5,
"multiline": {
"max": 1,
"allowFirstLine": false
}
}
],
"vue/attribute-hyphenation": 0,
"vue/html-self-closing": 0,
"vue/component-name-in-template-casing": 0,
"vue/html-closing-bracket-spacing": 0,
"vue/singleline-html-element-content-newline": 0,
"vue/no-unused-components": 0,
"vue/multiline-html-element-content-newline": 0,
"vue/no-use-v-if-with-v-for": 0,
"vue/html-closing-bracket-newline": 0,
"vue/no-parsing-error": 0,
"no-console": 0,
"indent": [
"off",
2
],
"linebreak-style": [
0,
"error",
"windows"
]
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>ueditor demo</title>
</head>
<body>
<!-- 加载编辑器的容器 -->
<script id="container" name="content" type="text/plain">这里写你的初始化内容</script>
<!-- 配置文件 -->
<script type="text/javascript" src="ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="ueditor.all.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
var ue = UE.getEditor('container');
</script>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
*{color: #838383;margin: 0;padding: 0}
html,body {font-size: 12px;overflow: hidden; }
.content{padding:5px 0 0 15px;}
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
</style>
</head>
<body>
<div class="content">
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
</div>
<script type="text/javascript" src="../internal.js"></script>
<script type="text/javascript">
var anchorInput = $G('anchorName'),
node = editor.selection.getRange().getClosedNode();
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
anchorInput.value = node;
}
anchorInput.onkeydown = function(evt){
evt = evt || window.event;
if(evt.keyCode == 13){
editor.execCommand('anchor', anchorInput.value);
dialog.close();
domUtils.preventDefault(evt)
}
};
dialog.onok = function (){
editor.execCommand('anchor', anchorInput.value);
dialog.close();
};
$focus(anchorInput);
</script>
</body>
</html>
\ No newline at end of file
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ueditor图片对话框</title>
<script type="text/javascript" src="../internal.js"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
<!-- attachment dialog -->
<link rel="stylesheet" href="attachment.css" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="tabhead" class="tabhead">
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
</div>
<div id="tabbody" class="tabbody">
<!-- 上传图片 -->
<div id="upload" class="panel focus">
<div id="queueList" class="queueList">
<div class="statusBar element-invisible">
<div class="progress">
<span class="text">0%</span>
<span class="percentage"></span>
</div><div class="info"></div>
<div class="btns">
<div id="filePickerBtn"></div>
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
</div>
</div>
<div id="dndArea" class="placeholder">
<div class="filePickerContainer">
<div id="filePickerReady"></div>
</div>
</div>
<ul class="filelist element-invisible">
<li id="filePickerBlock" class="filePickerBlock"></li>
</ul>
</div>
</div>
<!-- 在线图片 -->
<div id="online" class="panel">
<div id="fileList"><var id="lang_imgLoading"></var></div>
</div>
</div>
</div>
<script type="text/javascript" src="attachment.js"></script>
</body>
</html>
\ No newline at end of file
.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
.tabbody{height:225px;}
.tabbody .panel { position: absolute;width:100%; height:100%;background: #fff; display: none;}
.tabbody .focus { display: block;}
body{font-size: 12px;color: #888;overflow: hidden;}
input,label{vertical-align:middle}
.clear{clear: both;}
.pl{padding-left: 18px;padding-left: 23px\9;}
#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
#imageList img {cursor: pointer;border: 2px solid white;}
.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
.content div{margin: 10px 0 10px 5px;}
.content .iptradio{margin: 0px 5px 5px 0px;}
.txt{width:280px;}
.wrapcolor{height: 19px;}
div.color{float: left;margin: 0;}
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
div.alignment,#custom{margin-left: 23px;margin-left: 28px\9;}
#custom input{height: 15px;min-height: 15px;width:20px;}
#repeatType{width:100px;}
/* 图片管理样式 */
#imgManager {
width: 100%;
height: 225px;
}
#imgManager #imageList{
width: 100%;
overflow-x: hidden;
overflow-y: auto;
}
#imgManager ul {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#imgManager li {
float: left;
display: block;
list-style: none;
padding: 0;
width: 113px;
height: 113px;
margin: 9px 0 0 19px;
background-color: #eee;
overflow: hidden;
cursor: pointer;
position: relative;
}
#imgManager li.clearFloat {
float: none;
clear: both;
display: block;
width:0;
height:0;
margin: 0;
padding: 0;
}
#imgManager li img {
cursor: pointer;
}
#imgManager li .icon {
cursor: pointer;
width: 113px;
height: 113px;
position: absolute;
top: 0;
left: 0;
z-index: 2;
border: 0;
background-repeat: no-repeat;
}
#imgManager li .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
}
#imgManager li.selected .icon {
background-image: url(images/success.png);
background-position: 75px 75px;
}
#imgManager li.selected .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
background-position: 72px 72px;
}
\ No newline at end of file
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="background.css">
</head>
<body>
<div id="bg_container" class="wrapper">
<div id="tabHeads" class="tabhead">
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="normal" class="panel focus">
<fieldset class="bgarea">
<legend><var id="lang_background_set"></var></legend>
<div class="content">
<div>
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
</div>
<div class="wrapcolor pl">
<div class="color">
<var id="lang_background_color"></var>:
</div>
<div id="colorPicker"></div>
<div class="clear"></div>
</div>
<div class="wrapcolor pl">
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
</div>
<div id="alignment" class="alignment">
<var id="lang_background_align"></var>:<select id="repeatType">
<option value="center"></option>
<option value="repeat-x"></option>
<option value="repeat-y"></option>
<option value="repeat"></option>
<option value="self"></option>
</select>
</div>
<div id="custom" >
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px&nbsp;&nbsp;y:<input type="text" size="1" id="y" maxlength="4" value="0">px
</div>
</div>
</fieldset>
</div>
<div id="imgManager" class="panel">
<div id="imageList" style=""></div>
</div>
</div>
</div>
<script type="text/javascript" src="background.js"></script>
</body>
</html>
/*
* 图表配置文件
* */
//不同类型的配置
var typeConfig = [
{
chart: {
type: 'line'
},
plotOptions: {
line: {
dataLabels: {
enabled: false
},
enableMouseTracking: true
}
}
}, {
chart: {
type: 'line'
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
}
}, {
chart: {
type: 'area'
}
}, {
chart: {
type: 'bar'
}
}, {
chart: {
type: 'column'
}
}, {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ ( Math.round( this.point.percentage*100 ) / 100 ) +' %';
}
}
}
}
}
];
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow-x: hidden;
}
.main {
width: 100%;
overflow: hidden;
}
.table-view {
height: 100%;
float: left;
margin: 20px;
width: 40%;
}
.table-view .table-container {
width: 100%;
margin-bottom: 50px;
overflow: scroll;
}
.table-view th {
padding: 5px 10px;
background-color: #F7F7F7;
}
.table-view td {
width: 50px;
text-align: center;
padding:0;
}
.table-container input {
width: 40px;
padding: 5px;
border: none;
outline: none;
}
.table-view caption {
font-size: 18px;
text-align: left;
}
.charts-view {
/*margin-left: 49%!important;*/
width: 50%;
margin-left: 49%;
height: 400px;
}
.charts-container {
border-left: 1px solid #c3c3c3;
}
.charts-format fieldset {
padding-left: 20px;
margin-bottom: 50px;
}
.charts-format legend {
padding-left: 10px;
padding-right: 10px;
}
.format-item-container {
padding: 20px;
}
.format-item-container label {
display: block;
margin: 10px 0;
}
.charts-format .data-item {
border: 1px solid black;
outline: none;
padding: 2px 3px;
}
/* 图表类型 */
.charts-type {
margin-top: 50px;
height: 300px;
}
.scroll-view {
border: 1px solid #c3c3c3;
border-left: none;
border-right: none;
overflow: hidden;
}
.scroll-container {
margin: 20px;
width: 100%;
overflow: hidden;
}
.scroll-bed {
width: 10000px;
_margin-top: 20px;
-webkit-transition: margin-left .5s ease;
-moz-transition: margin-left .5s ease;
transition: margin-left .5s ease;
}
.view-box {
display: inline-block;
*display: inline;
*zoom: 1;
margin-right: 20px;
border: 2px solid white;
line-height: 0;
overflow: hidden;
cursor: pointer;
}
.view-box img {
border: 1px solid #cecece;
}
.view-box.selected {
border-color: #7274A7;
}
.button-container {
margin-bottom: 20px;
text-align: center;
}
.button-container a {
display: inline-block;
width: 100px;
height: 25px;
line-height: 25px;
border: 1px solid #c2ccd1;
margin-right: 30px;
text-decoration: none;
color: black;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.button-container a:HOVER {
background: #fcfcfc;
}
.button-container a:ACTIVE {
border-top-color: #c2ccd1;
box-shadow:inset 0 5px 4px -4px rgba(49, 49, 64, 0.1);
}
.edui-charts-not-data {
height: 100px;
line-height: 100px;
text-align: center;
}
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<title>chart</title>
<meta chartset="utf-8">
<link rel="stylesheet" type="text/css" href="charts.css">
<script type="text/javascript" src="../internal.js"></script>
</head>
<body>
<div class="main">
<div class="table-view">
<h3><var id="lang_data_source"></var></h3>
<div id="tableContainer" class="table-container"></div>
<h3><var id="lang_chart_format"></var></h3>
<form name="data-form">
<div class="charts-format">
<fieldset>
<legend><var id="lang_data_align"></var></legend>
<div class="format-item-container">
<label>
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
<var id="lang_chart_align_same"></var>
</label>
<label>
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
<var id="lang_chart_align_reverse"></var>
</label>
<br>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_title"></var></legend>
<div class="format-item-container">
<label>
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
</label>
<label>
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
</label>
<label>
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
</label>
<label>
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
</label>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_tip"></var></legend>
<div class="format-item-container">
<label>
<var id="lang_cahrt_tip_prefix"></var>
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
</label>
<p><var id="lang_cahrt_tip_description"></var></p>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_data_unit"></var></legend>
<div class="format-item-container">
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
<p><var id="lang_chart_data_unit_description"></var></p>
</div>
</fieldset>
</div>
</form>
</div>
<div class="charts-view">
<div id="chartsContainer" class="charts-container"></div>
<div id="chartsType" class="charts-type">
<h3><var id="lang_chart_type"></var></h3>
<div class="scroll-view">
<div class="scroll-container">
<div id="scrollBed" class="scroll-bed"></div>
</div>
<div id="buttonContainer" class="button-container">
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
</div>
</div>
</div>
</div>
</div>
<script src="../../third-party/jquery-1.10.2.min.js"></script>
<script src="../../third-party/highcharts/highcharts.js"></script>
<script src="chart.config.js"></script>
<script src="charts.js"></script>
</body>
</html>
\ No newline at end of file
.jd img{
background:transparent url(images/jxface2.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.pp img{
background:transparent url(images/fface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:25px;height:25px;display:block;
}
.ldw img{
background:transparent url(images/wface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.tsj img{
background:transparent url(images/tface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.cat img{
background:transparent url(images/cface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.bb img{
background:transparent url(images/bface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.youa img{
background:transparent url(images/yface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.smileytable td {height: 37px;}
#tabPanel{margin-left:5px;overflow: hidden;}
#tabContent {float:left;background:#FFFFFF;}
#tabContent div{display: none;width:480px;overflow:hidden;}
#tabIconReview.show{left:17px;display:block;}
.menuFocus{background:#ACCD3C;}
.menuDefault{background:#FFFFFF;}
#tabIconReview{position:absolute;left:406px;left:398px \9;top:41px;z-index:65533;width:90px;height:76px;}
img.review{width:90px;height:76px;border:2px solid #9cb945;background:#FFFFFF;background-position:center;background-repeat:no-repeat;}
.wrapper .tabbody{position:relative;float:left;clear:both;padding:10px;width: 95%;}
.tabbody table{width: 100%;}
.tabbody td{border:1px solid #BAC498;}
.tabbody td span{display: block;zoom:1;padding:0 4px;}
\ No newline at end of file
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="robots" content="noindex, nofollow"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="emotion.css">
</head>
<body>
<div id="tabPanel" class="wrapper">
<div id="tabHeads" class="tabhead">
<span><var id="lang_input_choice"></var></span>
<span><var id="lang_input_Tuzki"></var></span>
<span><var id="lang_input_lvdouwa"></var></span>
<span><var id="lang_input_BOBO"></var></span>
<span><var id="lang_input_babyCat"></var></span>
<span><var id="lang_input_bubble"></var></span>
<span><var id="lang_input_youa"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="tab0"></div>
<div id="tab1"></div>
<div id="tab2"></div>
<div id="tab3"></div>
<div id="tab4"></div>
<div id="tab5"></div>
<div id="tab6"></div>
</div>
</div>
<div id="tabIconReview">
<img id='faceReview' class='review' src="../../themes/default/images/spacer.gif"/>
</div>
<script type="text/javascript" src="emotion.js"></script>
<script type="text/javascript">
var emotion = {
tabNum:7, //切换面板数量
SmilmgName:{ tab0:['j_00', 84], tab1:['t_00', 40], tab2:['w_00', 52], tab3:['B_00', 63], tab4:['C_00', 20], tab5:['i_f', 50], tab6:['y_00', 40] }, //图片前缀名
imageFolders:{ tab0:'jx2/', tab1:'tsj/', tab2:'ldw/', tab3:'bobo/', tab4:'babycat/', tab5:'face/', tab6:'youa/'}, //图片对应文件夹路径
imageCss:{tab0:'jd', tab1:'tsj', tab2:'ldw', tab3:'bb', tab4:'cat', tab5:'pp', tab6:'youa'}, //图片css类名
imageCssOffset:{tab0:35, tab1:35, tab2:35, tab3:35, tab4:35, tab5:25, tab6:35}, //图片偏移
SmileyInfor:{
tab0:['Kiss', 'Love', 'Yeah', '啊!', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '打酱油', '俯卧撑', '气愤', '?', '吻', '怒', '胜利', 'HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '微笑', '亲吻', '调皮', '惊恐', '耍酷', '发火', '害羞', '汗水', '大哭', '', '加油', '困', '你NB', '晕倒', '开心', '偷笑', '大哭', '滴汗', '叹气', '超赞', '??', '飞吻', '天使', '撒花', '生气', '被砸', '吓傻', '随意吐'],
tab1:['Kiss', 'Love', 'Yeah', '啊!', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '摊手', '睡觉', '瘫坐', '无聊', '星星闪', '旋转', '也不行', '郁闷', '正Music', '抓墙', '撞墙至死', '歪头', '戳眼', '飘过', '互相拍砖', '砍死你', '扔桌子', '少林寺', '什么?', '转头', '我爱牛奶', '我踢', '摇晃', '晕厥', '在笼子里', '震荡'],
tab2:['大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '我错了', 'money', '气愤', '挑逗', '吻', '怒', '胜利', '委屈', '受伤', '说啥呢?', '闭嘴', '不', '逗你玩儿', '飞吻', '眩晕', '魔法', '我来了', '睡了', '我打', '闭嘴', '打', '打晕了', '刷牙', '爆揍', '炸弹', '倒立', '刮胡子', '邪恶的笑', '不要不要', '爱恋中', '放大仔细看', '偷窥', '超高兴', '晕', '松口气', '我跑', '享受', '修养', '哭', '汗', '啊~', '热烈欢迎', '打酱油', '俯卧撑', '?'],
tab3:['HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '泪眼', '流泪', '生气', '吐舌', '喜欢', '旋转', '再见', '抓狂', '汗', '鄙视', '拜', '吐血', '嘘', '打人', '蹦跳', '变脸', '扯肉', '吃To', '吃花', '吹泡泡糖', '大变身', '飞天舞', '回眸', '可怜', '猛抽', '泡泡', '苹果', '亲', '', '骚舞', '烧香', '睡', '套娃娃', '捅捅', '舞倒', '西红柿', '爱慕', '摇', '摇摆', '杂耍', '招财', '被殴', '被球闷', '大惊', '理想', '欧打', '呕吐', '碎', '吐痰'],
tab4:['发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '顶', '幸运', '爱心', '躲', '送花', '选择'],
tab5:['微笑', '亲吻', '调皮', '惊讶', '耍酷', '发火', '害羞', '汗水', '大哭', '得意', '鄙视', '困', '夸奖', '晕倒', '疑问', '媒婆', '狂吐', '青蛙', '发愁', '亲吻', '', '爱心', '心碎', '玫瑰', '礼物', '哭', '奸笑', '可爱', '得意', '呲牙', '暴汗', '楚楚可怜', '困', '哭', '生气', '惊讶', '口水', '彩虹', '夜空', '太阳', '钱钱', '灯泡', '咖啡', '蛋糕', '音乐', '爱', '胜利', '赞', '鄙视', 'OK'],
tab6:['男兜', '女兜', '开心', '乖乖', '偷笑', '大笑', '抽泣', '大哭', '无奈', '滴汗', '叹气', '狂晕', '委屈', '超赞', '??', '疑问', '飞吻', '天使', '撒花', '生气', '被砸', '口水', '泪奔', '吓傻', '吐舌头', '点头', '随意吐', '旋转', '困困', '鄙视', '狂顶', '篮球', '再见', '欢迎光临', '恭喜发财', '稍等', '我在线', '恕不议价', '库房有货', '货在路上']
}
};
</script>
</body>
</html>
\ No newline at end of file
window.onload = function () {
editor.setOpt({
emotionLocalization:false
});
emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "http://img.baidu.com/hi/";
emotion.SmileyBox = createTabList( emotion.tabNum );
emotion.tabExist = createArr( emotion.tabNum );
initImgName();
initEvtHandler( "tabHeads" );
};
function initImgName() {
for ( var pro in emotion.SmilmgName ) {
var tempName = emotion.SmilmgName[pro],
tempBox = emotion.SmileyBox[pro],
tempStr = "";
if ( tempBox.length ) return;
for ( var i = 1; i <= tempName[1]; i++ ) {
tempStr = tempName[0];
if ( i < 10 ) tempStr = tempStr + '0';
tempStr = tempStr + i + '.gif';
tempBox.push( tempStr );
}
}
}
function initEvtHandler( conId ) {
var tabHeads = $G( conId );
for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
var tabObj = tabHeads.childNodes[i];
if ( tabObj.nodeType == 1 ) {
domUtils.on( tabObj, "click", (function ( index ) {
return function () {
switchTab( index );
};
})( j ) );
j++;
}
}
switchTab( 0 );
$G( "tabIconReview" ).style.display = 'none';
}
function InsertSmiley( url, evt ) {
var obj = {
src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
};
obj._src = obj.src;
editor.execCommand( 'insertimage', obj );
if ( !evt.ctrlKey ) {
dialog.popup.hide();
}
}
function switchTab( index ) {
autoHeight( index );
if ( emotion.tabExist[index] == 0 ) {
emotion.tabExist[index] = 1;
createTab( 'tab' + index );
}
//获取呈现元素句柄数组
var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
i = 0, L = tabHeads.length;
//隐藏所有呈现元素
for ( ; i < L; i++ ) {
tabHeads[i].className = "";
tabBodys[i].style.display = "none";
}
//显示对应呈现元素
tabHeads[index].className = "focus";
tabBodys[index].style.display = "block";
}
function autoHeight( index ) {
var iframe = dialog.getDom( "iframe" ),
parent = iframe.parentNode.parentNode;
switch ( index ) {
case 0:
iframe.style.height = "380px";
parent.style.height = "392px";
break;
case 1:
iframe.style.height = "220px";
parent.style.height = "232px";
break;
case 2:
iframe.style.height = "260px";
parent.style.height = "272px";
break;
case 3:
iframe.style.height = "300px";
parent.style.height = "312px";
break;
case 4:
iframe.style.height = "140px";
parent.style.height = "152px";
break;
case 5:
iframe.style.height = "260px";
parent.style.height = "272px";
break;
case 6:
iframe.style.height = "230px";
parent.style.height = "242px";
break;
default:
}
}
function createTab( tabName ) {
var faceVersion = "?v=1.1", //版本号
tab = $G( tabName ), //获取将要生成的Div句柄
imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
positionLine = 11 / 2, //中间数
iWidth = iHeight = 35, //图片长宽
iColWidth = 3, //表格剩余空间的显示比例
tableCss = emotion.imageCss[tabName],
cssOffset = emotion.imageCssOffset[tabName],
textHTML = ['<table class="smileytable">'],
i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
sUrl, realUrl, posflag, offset, infor;
for ( ; i < imgNum; ) {
textHTML.push( '<tr>' );
for ( var j = 0; j < imgColNum; j++, i++ ) {
faceImage = emotion.SmileyBox[tabName][i];
if ( faceImage ) {
sUrl = imagePath + faceImage + faceVersion;
realUrl = imagePath + faceImage;
posflag = j < positionLine ? 0 : 1;
offset = cssOffset * i * (-1) - 1;
infor = emotion.SmileyInfor[tabName][i];
textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
textHTML.push( '<span>' );
textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
textHTML.push( '</span>' );
} else {
textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
}
textHTML.push( '</td>' );
}
textHTML.push( '</tr>' );
}
textHTML.push( '</table>' );
textHTML = textHTML.join( "" );
tab.innerHTML = textHTML;
}
function over( td, srcPath, posFlag ) {
td.style.backgroundColor = "#ACCD3C";
$G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
$G( "tabIconReview" ).style.display = 'block';
}
function out( td ) {
td.style.backgroundColor = "transparent";
var tabIconRevew = $G( "tabIconReview" );
tabIconRevew.className = "";
tabIconRevew.style.display = 'none';
}
function createTabList( tabNum ) {
var obj = {};
for ( var i = 0; i < tabNum; i++ ) {
obj["tab" + i] = [];
}
return obj;
}
function createArr( tabNum ) {
var arr = [];
for ( var i = 0; i < tabNum; i++ ) {
arr[i] = 0;
}
return arr;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="../internal.js"></script>
<style type="text/css">
.content{width:530px; height: 350px;margin: 10px auto;}
.content table{width: 100%}
.content table td{vertical-align: middle;}
#address{width:220px;height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div class="content">
<table>
<tr>
<td><label for="address"><var id="lang_input_address"></var></label></td>
<td><input id="address" type="text" /></td>
<td><a id="doSearch" href="javascript:void(0)" class="button"><var id="lang_input_search"></var></a></td>
</tr>
</table>
<div id="container" style="width: 100%; height: 340px;margin: 5px auto; border: 1px solid gray;"></div>
</div>
<script type="text/javascript">
domUtils.on(window,"load",function(){
var map = new google.maps.Map(document.getElementById('container'), {
zoom: 3,
streetViewControl: false,
scaleControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var imgcss;
var marker = new google.maps.Marker({
map: map,
draggable: true
});
function doSearch(){
var address = document.getElementById('address').value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var bounds = results[0].geometry.viewport;
map.fitBounds(bounds);
marker.setPosition(results[0].geometry.location);
marker.setTitle(address);
} else alert(lang.searchError);
});
}
$G('address').onkeydown = function (evt){
evt = evt || event;
if (evt.keyCode == 13) {
doSearch();
}
};
$G("doSearch").onclick = doSearch;
dialog.onok = function (){
var center = map.getCenter();
var point = marker.getPosition();
var url = "http://maps.googleapis.com/maps/api/staticmap?center=" + center.lat() + ',' + center.lng() + "&zoom=" + map.zoom + "&size=520x340&maptype=" + map.getMapTypeId() + "&markers=" + point.lat() + ',' + point.lng() + "&sensor=false";
editor.execCommand('inserthtml', '<img width="520" height="340" src="' + url + '"' + (imgcss ? ' style="' + imgcss + '"' :'') + '/>');
};
function getPars(str,par){
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
return reg.exec(str)[1];
}
var img = editor.selection.getRange().getClosedNode();
if(img && img.src.indexOf("http://maps.googleapis.com/maps/api/staticmap")!=-1){
var url = img.getAttribute("src");
var centers = getPars(url,"center").split(",");
point = new google.maps.LatLng(Number(centers[0]),Number(centers[1]));
map.setCenter(point);
map.setZoom(Number(getPars(url,"zoom")));
centers = getPars(url,"markers").split(",");
marker.setPosition(new google.maps.LatLng(Number(centers[0]),Number(centers[1])));
imgcss = img.style.cssText;
}else{
setTimeout(function(){
doSearch();
},30)
}
});
</script>
</body>
</html>
\ No newline at end of file
.wrapper{width: 370px;margin: 10px auto;zoom: 1;}
.tabbody{height: 360px;}
.tabbody .panel{width:100%;height: 360px;position: absolute;background: #fff;}
.tabbody .panel h1{font-size:26px;margin: 5px 0 0 5px;}
.tabbody .panel p{font-size:12px;margin: 5px 0 0 5px;}
.tabbody table{width:90%;line-height: 20px;margin: 5px 0 0 5px;;}
.tabbody table thead{font-weight: bold;line-height: 25px;}
\ No newline at end of file
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>帮助</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="help.css">
</head>
<body>
<div class="wrapper" id="helptab">
<div id="tabHeads" class="tabhead">
<span class="focus" tabsrc="about"><var id="lang_input_about"></var></span>
<span tabsrc="shortcuts"><var id="lang_input_shortcuts"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="about" class="panel">
<h1>UEditor</h1>
<p id="version"></p>
<p><var id="lang_input_introduction"></var></p>
</div>
<div id="shortcuts" class="panel">
<table>
<thead>
<tr>
<td><var id="lang_Txt_shortcuts"></var></td>
<td><var id="lang_Txt_func"></var></td>
</tr>
</thead>
<tbody>
<tr>
<td>ctrl+b</td>
<td><var id="lang_Txt_bold"></var></td>
</tr>
<tr>
<td>ctrl+c</td>
<td><var id="lang_Txt_copy"></var></td>
</tr>
<tr>
<td>ctrl+x</td>
<td><var id="lang_Txt_cut"></var></td>
</tr>
<tr>
<td>ctrl+v</td>
<td><var id="lang_Txt_Paste"></var></td>
</tr>
<tr>
<td>ctrl+y</td>
<td><var id="lang_Txt_undo"></var></td>
</tr>
<tr>
<td>ctrl+z</td>
<td><var id="lang_Txt_redo"></var></td>
</tr>
<tr>
<td>ctrl+i</td>
<td><var id="lang_Txt_italic"></var></td>
</tr>
<tr>
<td>ctrl+u</td>
<td><var id="lang_Txt_underline"></var></td>
</tr>
<tr>
<td>ctrl+a</td>
<td><var id="lang_Txt_selectAll"></var></td>
</tr>
<tr>
<td>shift+enter</td>
<td><var id="lang_Txt_visualEnter"></var></td>
</tr>
<tr>
<td>alt+z</td>
<td><var id="lang_Txt_fullscreen"></var></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript" src="help.js"></script>
</body>
</html>
\ No newline at end of file
/**
* Created with JetBrains PhpStorm.
* User: xuheng
* Date: 12-9-26
* Time: 下午1:06
* To change this template use File | Settings | File Templates.
*/
/**
* tab点击处理事件
* @param tabHeads
* @param tabBodys
* @param obj
*/
function clickHandler( tabHeads,tabBodys,obj ) {
//head样式更改
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
tabHeads[k].className = "";
}
obj.className = "focus";
//body显隐
var tabSrc = obj.getAttribute( "tabSrc" );
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
var body = tabBodys[j],
id = body.getAttribute( "id" );
body.onclick = function(){
this.style.zoom = 1;
};
if ( id != tabSrc ) {
body.style.zIndex = 1;
} else {
body.style.zIndex = 200;
}
}
}
/**
* TAB切换
* @param tabParentId tab的父节点ID或者对象本身
*/
function switchTab( tabParentId ) {
var tabElements = $G( tabParentId ).children,
tabHeads = tabElements[0].children,
tabBodys = tabElements[1].children;
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
var head = tabHeads[i];
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
head.onclick = function () {
clickHandler(tabHeads,tabBodys,this);
}
}
}
switchTab("helptab");
document.getElementById('version').innerHTML = parent.UE.version;
\ No newline at end of file
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ueditor图片对话框</title>
<script type="text/javascript" src="../internal.js"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
<!-- image dialog -->
<link rel="stylesheet" href="image.css" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="tabhead" class="tabhead">
<span class="tab" data-content-id="remote"><var id="lang_tab_remote"></var></span>
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
<span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>
</div>
<div class="alignBar">
<label class="algnLabel"><var id="lang_input_align"></var></label>
<span id="alignIcon">
<span id="noneAlign" class="none-align focus" data-align="none"></span>
<span id="leftAlign" class="left-align" data-align="left"></span>
<span id="rightAlign" class="right-align" data-align="right"></span>
<span id="centerAlign" class="center-align" data-align="center"></span>
</span>
<input id="align" name="align" type="hidden" value="none"/>
</div>
<div id="tabbody" class="tabbody">
<!-- 远程图片 -->
<div id="remote" class="panel">
<div class="top">
<div class="row">
<label for="url"><var id="lang_input_url"></var></label>
<span><input class="text" id="url" type="text"/></span>
</div>
</div>
<div class="left">
<div class="row">
<label><var id="lang_input_size"></var></label>
<span><var id="lang_input_width">&nbsp;&nbsp;</var><input class="text" type="text" id="width"/>px </span>
<span><var id="lang_input_height">&nbsp;&nbsp;</var><input class="text" type="text" id="height"/>px </span>
<span><input id="lock" type="checkbox" disabled="disabled"><span id="lockicon"></span></span>
</div>
<div class="row">
<label><var id="lang_input_border"></var></label>
<span><input class="text" type="text" id="border"/>px </span>
</div>
<div class="row">
<label><var id="lang_input_vhspace"></var></label>
<span><input class="text" type="text" id="vhSpace"/>px </span>
</div>
<div class="row">
<label><var id="lang_input_title"></var></label>
<span><input class="text" type="text" id="title"/></span>
</div>
</div>
<div class="right"><div id="preview"></div></div>
</div>
<!-- 上传图片 -->
<div id="upload" class="panel focus">
<div id="queueList" class="queueList">
<div class="statusBar element-invisible">
<div class="progress">
<span class="text">0%</span>
<span class="percentage"></span>
</div><div class="info"></div>
<div class="btns">
<div id="filePickerBtn"></div>
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
</div>
</div>
<div id="dndArea" class="placeholder">
<div class="filePickerContainer">
<div id="filePickerReady"></div>
</div>
</div>
<ul class="filelist element-invisible">
<li id="filePickerBlock" class="filePickerBlock"></li>
</ul>
</div>
</div>
<!-- 在线图片 -->
<div id="online" class="panel">
<div id="imageList"><var id="lang_imgLoading"></var></div>
</div>
<!-- 搜索图片 -->
<div id="search" class="panel">
<div class="searchBar">
<input id="searchTxt" class="searchTxt text" type="text" />
<select id="searchType" class="searchType">
<option value="&s=4&z=0"></option>
<option value="&s=1&z=19"></option>
<option value="&s=2&z=0"></option>
<option value="&s=3&z=0"></option>
</select>
<input id="searchReset" type="button" />
<input id="searchBtn" type="button" />
</div>
<div id="searchList" class="searchList"><ul id="searchListUl"></ul></div>
</div>
</div>
</div>
<script type="text/javascript" src="image.js"></script>
</body>
</html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript" src="../internal.js"></script>
<style type="text/css">
.warp {width: 320px;height: 153px;margin-left:5px;padding: 20px 0 0 15px;position: relative;}
#url {width: 290px; margin-bottom: 2px; margin-left: -6px; margin-left: -2px\9;*margin-left:0;_margin-left:0; }
.format span{display: inline-block; width: 58px;text-align: center; zoom:1;}
table td{padding:5px 0;}
#align{width: 65px;height: 23px;line-height: 22px;}
</style>
</head>
<body>
<div class="warp">
<table width="300" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2" class="format">
<span><var id="lang_input_address"></var></span>
<input style="width:200px" id="url" type="text" value=""/>
</td>
</tr>
<tr>
<td colspan="2" class="format"><span><var id="lang_input_width"></var></span><input style="width:200px" type="text" id="width"/> px</td>
</tr>
<tr>
<td colspan="2" class="format"><span><var id="lang_input_height"></var></span><input style="width:200px" type="text" id="height"/> px</td>
</tr>
<tr>
<td><span><var id="lang_input_isScroll"></var></span><input type="checkbox" id="scroll"/> </td>
<td><span><var id="lang_input_frameborder"></var></span><input type="checkbox" id="frameborder"/> </td>
</tr>
<tr>
<td colspan="2"><span><var id="lang_input_alignMode"></var></span>
<select id="align">
<option value=""></option>
<option value="left"></option>
<option value="right"></option>
</select>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
var iframe = editor._iframe;
if(iframe){
$G("url").value = iframe.getAttribute("src")||"";
$G("width").value = iframe.getAttribute("width")||iframe.style.width.replace("px","")||"";
$G("height").value = iframe.getAttribute("height") || iframe.style.height.replace("px","") ||"";
$G("scroll").checked = (iframe.getAttribute("scrolling") == "yes") ? true : false;
$G("frameborder").checked = (iframe.getAttribute("frameborder") == "1") ? true : false;
$G("align").value = iframe.align ? iframe.align : "";
}
function queding(){
var url = $G("url").value.replace(/^\s*|\s*$/ig,""),
width = $G("width").value,
height = $G("height").value,
scroll = $G("scroll"),
frameborder = $G("frameborder"),
float = $G("align").value,
newIframe = editor.document.createElement("iframe"),
div;
if(!url){
alert(lang.enterAddress);
return false;
}
newIframe.setAttribute("src",/http:\/\/|https:\/\//ig.test(url) ? url : "http://"+url);
/^[1-9]+[.]?\d*$/g.test( width ) ? newIframe.setAttribute("width",width) : "";
/^[1-9]+[.]?\d*$/g.test( height ) ? newIframe.setAttribute("height",height) : "";
scroll.checked ? newIframe.setAttribute("scrolling","yes") : newIframe.setAttribute("scrolling","no");
frameborder.checked ? newIframe.setAttribute("frameborder","1",0) : newIframe.setAttribute("frameborder","0",0);
float ? newIframe.setAttribute("align",float) : newIframe.setAttribute("align","");
if(iframe){
iframe.parentNode.insertBefore(newIframe,iframe);
domUtils.remove(iframe);
}else{
div = editor.document.createElement("div");
div.appendChild(newIframe);
editor.execCommand("inserthtml",div.innerHTML);
}
editor._iframe = null;
dialog.close();
}
dialog.onok = queding;
$G("url").onkeydown = function(evt){
evt = evt || event;
if(evt.keyCode == 13){
queding();
}
};
$focus($G( "url" ));
</script>
</body>
</html>
\ No newline at end of file
(function () {
var parent = window.parent;
//dialog对象
dialog = parent.$EDITORUI[window.frameElement.id.replace( /_iframe$/, '' )];
//当前打开dialog的编辑器实例
editor = dialog.editor;
UE = parent.UE;
domUtils = UE.dom.domUtils;
utils = UE.utils;
browser = UE.browser;
ajax = UE.ajax;
$G = function ( id ) {
return document.getElementById( id )
};
//focus元素
$focus = function ( node ) {
setTimeout( function () {
if ( browser.ie ) {
var r = node.createTextRange();
r.collapse( false );
r.select();
} else {
node.focus()
}
}, 0 )
};
utils.loadFile(document,{
href:editor.options.themePath + editor.options.theme + "/dialogbase.css?cache="+Math.random(),
tag:"link",
type:"text/css",
rel:"stylesheet"
});
lang = editor.getLang(dialog.className.split( "-" )[2]);
if(lang){
domUtils.on(window,'load',function () {
var langImgPath = editor.options.langPath + editor.options.lang + "/images/";
//针对静态资源
for ( var i in lang["static"] ) {
var dom = $G( i );
if(!dom) continue;
var tagName = dom.tagName,
content = lang["static"][i];
if(content.src){
//clone
content = utils.extend({},content,false);
content.src = langImgPath + content.src;
}
if(content.style){
content = utils.extend({},content,false);
content.style = content.style.replace(/url\s*\(/g,"url(" + langImgPath)
}
switch ( tagName.toLowerCase() ) {
case "var":
dom.parentNode.replaceChild( document.createTextNode( content ), dom );
break;
case "select":
var ops = dom.options;
for ( var j = 0, oj; oj = ops[j]; ) {
oj.innerHTML = content.options[j++];
}
for ( var p in content ) {
p != "options" && dom.setAttribute( p, content[p] );
}
break;
default :
domUtils.setAttributes( dom, content);
}
}
} );
}
})();
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js"></script>
<style type="text/css">
*{margin:0;padding:0;color: #838383;}
table{font-size: 12px;margin: 10px;line-height: 30px}
.txt{width:300px;height:21px;line-height:21px;border:1px solid #d7d7d7;}
</style>
</head>
<body>
<table>
<tr>
<td><label for="text"> <var id="lang_input_text"></var></label></td>
<td><input class="txt" id="text" type="text" disabled="true"/></td>
</tr>
<tr>
<td><label for="href"> <var id="lang_input_url"></var></label></td>
<td><input class="txt" id="href" type="text" /></td>
</tr>
<tr>
<td><label for="title"> <var id="lang_input_title"></var></label></td>
<td><input class="txt" id="title" type="text"/></td>
</tr>
<tr>
<td colspan="2">
<label for="target"><var id="lang_input_target"></var></label>
<input id="target" type="checkbox"/>
</td>
</tr>
<tr>
<td colspan="2" id="msg"></td>
</tr>
</table>
<script type="text/javascript">
var range = editor.selection.getRange(),
link = range.collapsed ? editor.queryCommandValue( "link" ) : editor.selection.getStart(),
url,
text = $G('text'),
rangeLink = domUtils.findParentByTagName(range.getCommonAncestor(),'a',true),
orgText;
link = domUtils.findParentByTagName( link, "a", true );
if(link){
url = utils.html(link.getAttribute( '_href' ) || link.getAttribute( 'href', 2 ));
if(rangeLink === link && !link.getElementsByTagName('img').length){
text.removeAttribute('disabled');
orgText = text.value = link[browser.ie ? 'innerText':'textContent'];
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}else{
if(range.collapsed){
text.removeAttribute('disabled');
text.value = '';
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}
$G("title").value = url ? link.title : "";
$G("href").value = url ? url: '';
$G("target").checked = url && link.target == "_blank" ? true : false;
$focus($G("href"));
function handleDialogOk(){
var href =$G('href').value.replace(/^\s+|\s+$/g, '');
if(href){
if(!hrefStartWith(href,["http","/","ftp://",'#'])) {
href = "http://" + href;
}
var obj = {
'href' : href,
'target' : $G("target").checked ? "_blank" : '_self',
'title' : $G("title").value.replace(/^\s+|\s+$/g, ''),
'_href':href
};
//修改链接内容的情况太特殊了,所以先做到这里了
//todo:情况多的时候,做到command里
if(orgText && text.value != orgText){
link[browser.ie ? 'innerText' : 'textContent'] = obj.textValue = text.value;
range.selectNode(link).select()
}
if(range.collapsed){
obj.textValue = text.value;
}
editor.execCommand('link',utils.clearEmptyAttrs(obj) );
dialog.close();
}
}
dialog.onok = handleDialogOk;
$G('href').onkeydown = $G('title').onkeydown = function(evt){
evt = evt || window.event;
if (evt.keyCode == 13) {
handleDialogOk();
return false;
}
};
$G('href').onblur = function(){
if(!hrefStartWith(this.value,["http","/","ftp://",'#'])){
$G("msg").innerHTML = "<span style='color: red'>"+lang.httpPrompt+"</span>";
}else{
$G("msg").innerHTML = "";
}
};
function hrefStartWith(href,arr){
href = href.replace(/^\s+|\s+$/g, '');
for(var i=0,ai;ai=arr[i++];){
if(href.indexOf(ai)==0){
return true;
}
}
return false;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="../internal.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script>
<style type="text/css">
.content{width:530px; height: 350px;margin: 10px auto;}
.content table{width: 100%}
.content table td{vertical-align: middle;}
#city,#address{height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
#city{width:60px}
#address{width:130px}
#is_dynamic_label span{vertical-align:middle;margin: 3px 0px 3px 3px;}
#is_dynamic_label input{vertical-align:middle;margin: 3px 3px 3px 50px;}
</style>
</head>
<body>
<div class="content">
<table>
<tr>
<td><var id="lang_city"></var>:</td>
<td><input id="city" type="text" /></td>
<td><var id="lang_address"></var>:</td>
<td><input id="address" type="text" value="" /></td>
<td><a href="javascript:doSearch()" class="button"><var id="lang_search"></var></a></td>
<td><label id="is_dynamic_label" for="is_dynamic"><input id="is_dynamic" type="checkbox" name="is_dynamic" /><span><var id="lang_dynamicmap"></var></span></label></td>
</tr>
</table>
<div style="width:100%;height:340px;margin:5px auto;border:1px solid gray" id="container"></div>
</div>
<script type="text/javascript">
var map = new BMap.Map("container"),marker,point,styleStr;
map.enableScrollWheelZoom();
map.enableContinuousZoom();
function doSearch(){
if (!document.getElementById('city').value) {
alert(lang.cityMsg);
return;
}
var search = new BMap.LocalSearch(document.getElementById('city').value, {
onSearchComplete: function (results){
if (results && results.getNumPois()) {
var points = [];
for (var i=0; i<results.getCurrentNumPois(); i++) {
points.push(results.getPoi(i).point);
}
if (points.length > 1) {
map.setViewport(points);
} else {
map.centerAndZoom(points[0], 13);
}
point = map.getCenter();
marker.setPoint(point);
} else {
alert(lang.errorMsg);
}
}
});
search.search(document.getElementById('address').value || document.getElementById('city').value);
}
//获得参数
function getPars(str,par){
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
return reg.exec(str)[1];
}
function init(){
var mapNode = editor.selection.getRange().getClosedNode(),
isMapImg = mapNode && /api[.]map[.]baidu[.]com/ig.test(mapNode.getAttribute("src")),
isMapIframe = mapNode && domUtils.hasClass(mapNode, 'ueditor_baidumap');
if(isMapImg || isMapIframe){
var url, centerPos, markerPos;
if(isMapIframe) {
url = decodeURIComponent(mapNode.getAttribute("src"));
$G('is_dynamic').checked = true;
styleStr = mapNode.style.cssText;
} else {
url = mapNode.getAttribute("src");
styleStr = mapNode.style.cssText;
}
centerPos = getPars(url,"center").split(",");
markerPos = getPars(url, "markers").split(",");
point = new BMap.Point(Number(centerPos[0]),Number(centerPos[1]));
marker = new BMap.Marker(new BMap.Point(Number(markerPos[0]), Number(markerPos[1])));
map.addControl(new BMap.NavigationControl());
map.centerAndZoom(point, Number(getPars(url,"zoom")));
}else{
point = new BMap.Point(116.404, 39.915); // 创建点坐标
marker = new BMap.Marker(point);
map.addControl(new BMap.NavigationControl());
map.centerAndZoom(point, 10); // 初始化地图,设置中心点坐标和地图级别。
}
marker.enableDragging();
map.addOverlay(marker);
}
init();
document.getElementById('address').onkeydown = function (evt){
evt = evt || event;
if (evt.keyCode == 13) {
doSearch();
}
};
dialog.onok = function (){
var center = map.getCenter();
var zoom = map.zoomLevel;
var size = map.getSize();
var mapWidth = size.width;
var mapHeight = size.height;
var point = marker.getPoint();
if($G('is_dynamic').checked) {
var URL = editor.options.UEDITOR_HOME_URL,
url = [URL + (/\/$/.test(URL) ? '':'/') + "dialogs/map/show.html" +
'#center=' + center.lng + ',' + center.lat,
'&zoom=' + zoom,
'&width=' + mapWidth,
'&height=' + mapHeight,
'&markers=' + point.lng + ',' + point.lat,
'&markerStyles=' + 'l,A'].join('');
editor.execCommand('inserthtml', '<iframe class="ueditor_baidumap" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + ' frameborder="0" width="' + (mapWidth+4) + '" height="' + (mapHeight+4) + '"></iframe>');
} else {
var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat +
"&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;
editor.execCommand('inserthtml', '<img width="'+ size.width +'"height="'+ size.height +'" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + '/>');
}
};
document.getElementById("address").focus();
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<meta name="keywords" content="百度地图,百度地图API,百度地图自定义工具,百度地图所见即所得工具"/>
<meta name="description" content="百度地图API自定义地图,帮助用户在可视化操作下生成百度地图"/>
<title>百度地图API自定义地图</title>
<!--引用百度地图API-->
<style type="text/css">
html, body {
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
</head>
<body onload="initMap();">
<!--百度地图容器-->
<div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>
</body>
<script type="text/javascript">
function getParam(name) {
return location.href.match(new RegExp('[?#&]' + name + '=([^?#&]+)', 'i')) ? RegExp.$1 : '';
}
var map, marker;
var centerParam = getParam('center');
var zoomParam = getParam('zoom');
var widthParam = getParam('width');
var heightParam = getParam('height');
var markersParam = getParam('markers');
var markerStylesParam = getParam('markerStyles');
//创建和初始化地图函数:
function initMap() {
// [FF]切换模式后报错
if (!window.BMap) {
return;
}
var dituContent = document.getElementById('dituContent');
dituContent.style.width = widthParam + 'px';
dituContent.style.height = heightParam + 'px';
createMap();//创建地图
setMapEvent();//设置地图事件
addMapControl();//向地图添加控件
// 创建标注
var markersArr = markersParam.split(',');
var point = new BMap.Point(markersArr[0], markersArr[1]);
marker = new BMap.Marker(point);
marker.enableDragging();
map.addOverlay(marker); // 将标注添加到地图中
if(parent.editor && parent.document.body.contentEditable=="true") { //在编辑状态下
setMapListener();//地图改变修改外层的iframe标签src属性
}
}
//创建地图函数:
function createMap() {
map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
var centerArr = centerParam.split(',');
var point = new BMap.Point(parseFloat(centerArr[0]), parseFloat(centerArr[1]));//定义一个中心点坐标
map.centerAndZoom(point, parseInt(zoomParam));//设定地图的中心点和坐标并将地图显示在地图容器中
}
//地图事件设置函数:
function setMapEvent() {
map.enableDragging();//启用地图拖拽事件,默认启用(可不写)
map.enableScrollWheelZoom();//启用地图滚轮放大缩小
map.enableDoubleClickZoom();//启用鼠标双击放大,默认启用(可不写)
map.enableKeyboard();//启用键盘上下左右键移动地图
}
//地图控件添加函数:
function addMapControl() {
//向地图中添加缩放控件
var ctrl_nav = new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_LEFT, type: BMAP_NAVIGATION_CONTROL_LARGE});
map.addControl(ctrl_nav);
//向地图中添加缩略图控件
var ctrl_ove = new BMap.OverviewMapControl({anchor: BMAP_ANCHOR_BOTTOM_RIGHT, isOpen: 1});
map.addControl(ctrl_ove);
//向地图中添加比例尺控件
var ctrl_sca = new BMap.ScaleControl({anchor: BMAP_ANCHOR_BOTTOM_LEFT});
map.addControl(ctrl_sca);
}
function setMapListener() {
var editor = parent.editor, containerIframe,
iframes = parent.document.getElementsByTagName('iframe');
for (var key in iframes) {
if (iframes[key].contentWindow == window) {
containerIframe = iframes[key];
break;
}
}
if (containerIframe) {
map.addEventListener('moveend', mapListenerHandler);
map.addEventListener('zoomend', mapListenerHandler);
marker.addEventListener('dragend', mapListenerHandler);
}
function mapListenerHandler() {
var zoom = map.getZoom(),
center = map.getCenter(),
marker = window.marker.getPoint();
containerIframe.src = containerIframe.src.
replace(new RegExp('([?#&])center=([^?#&]+)', 'i'), '$1center=' + center.lng + ',' + center.lat).
replace(new RegExp('([?#&])markers=([^?#&]+)', 'i'), '$1markers=' + marker.lng + ',' + marker.lat).
replace(new RegExp('([?#&])zoom=([^?#&]+)', 'i'), '$1zoom=' + zoom);
editor.fireEvent('saveScene');
}
}
</script>
</html>
\ No newline at end of file
.wrapper{margin: 5px 10px;}
.searchBar{height:30px;padding:7px 0 3px;text-align:center;}
.searchBtn{font-size:13px;height:24px;}
.resultBar{width:460px;margin:5px auto;border: 1px solid #CCC;border-radius: 5px;box-shadow: 2px 2px 5px #D3D6DA;overflow: hidden;}
.listPanel{overflow: hidden;}
.panelon{display:block;}
.paneloff{display:none}
.page{width:220px;margin:20px auto;overflow: hidden;}
.pageon{float:right;width:24px;line-height:24px;height:24px;margin-right: 5px;background: none;border: none;color: #000;font-weight: bold;text-align:center}
.pageoff{float:right;width:24px;line-height:24px;height:24px;cursor:pointer;background-color: #fff;
border: 1px solid #E7ECF0;color: #2D64B3;margin-right: 5px;text-decoration: none;text-align:center;}
.m-box{width:460px;}
.m-m{float: left;line-height: 20px;height: 20px;}
.m-h{height:24px;line-height:24px;padding-left: 46px;background-color:#FAFAFA;border-bottom: 1px solid #DAD8D8;font-weight: bold;font-size: 12px;color: #333;}
.m-l{float:left;width:40px; }
.m-t{float:left;width:140px;}
.m-s{float:left;width:110px;}
.m-z{float:left;width:100px;}
.m-try-t{float: left;width: 60px;;}
.m-try{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/try_music.gif') no-repeat ;}
.m-trying{float:left;width:20px;height:20px;background:url('http://static.tieba.baidu.com/tb/editor/images/stop_music.gif') no-repeat ;}
.loading{width:95px;height:7px;font-size:7px;margin:60px auto;background:url(http://static.tieba.baidu.com/tb/editor/images/loading.gif) no-repeat}
.empty{width:300px;height:40px;padding:2px;margin:50px auto;line-height:40px; color:#006699;text-align:center;}
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>插入音乐</title>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="music.css">
</head>
<body>
<div class="wrapper">
<div class="searchBar">
<input id="J_searchName" type="text"/>
<input type="button" class="searchBtn" id="J_searchBtn">
</div>
<div class="resultBar" id="J_resultBar">
<div class="loading" style="display:none"></div>
<div class="empty"><var id="lang_input_tips"></var></div>
</div>
<div id="J_preview"></div>
</div>
<script type="text/javascript" src="music.js"></script>
<script type="text/javascript">
var music = new Music;
dialog.onok = function () {
music.exec();
};
dialog.oncancel = function () {
$G('J_preview').innerHTML = "";
};
</script>
</body>
</html>
\ No newline at end of file
function Music() {
this.init();
}
(function () {
var pages = [],
panels = [],
selectedItem = null;
Music.prototype = {
total:70,
pageSize:10,
dataUrl:"http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.search.common",
playerUrl:"http://box.baidu.com/widget/flash/bdspacesong.swf",
init:function () {
var me = this;
domUtils.on($G("J_searchName"), "keyup", function (event) {
var e = window.event || event;
if (e.keyCode == 13) {
me.dosearch();
}
});
domUtils.on($G("J_searchBtn"), "click", function () {
me.dosearch();
});
},
callback:function (data) {
var me = this;
me.data = data.song_list;
setTimeout(function () {
$G('J_resultBar').innerHTML = me._renderTemplate(data.song_list);
}, 300);
},
dosearch:function () {
var me = this;
selectedItem = null;
var key = $G('J_searchName').value;
if (utils.trim(key) == "")return false;
key = encodeURIComponent(key);
me._sent(key);
},
doselect:function (i) {
var me = this;
if (typeof i == 'object') {
selectedItem = i;
} else if (typeof i == 'number') {
selectedItem = me.data[i];
}
},
onpageclick:function (id) {
var me = this;
for (var i = 0; i < pages.length; i++) {
$G(pages[i]).className = 'pageoff';
$G(panels[i]).className = 'paneloff';
}
$G('page' + id).className = 'pageon';
$G('panel' + id).className = 'panelon';
},
listenTest:function (elem) {
var me = this,
view = $G('J_preview'),
is_play_action = (elem.className == 'm-try'),
old_trying = me._getTryingElem();
if (old_trying) {
old_trying.className = 'm-try';
view.innerHTML = '';
}
if (is_play_action) {
elem.className = 'm-trying';
view.innerHTML = me._buildMusicHtml(me._getUrl(true));
}
},
_sent:function (param) {
var me = this;
$G('J_resultBar').innerHTML = '<div class="loading"></div>';
utils.loadFile(document, {
src:me.dataUrl + '&query=' + param + '&page_size=' + me.total + '&callback=music.callback&.r=' + Math.random(),
tag:"script",
type:"text/javascript",
defer:"defer"
});
},
_removeHtml:function (str) {
var reg = /<\s*\/?\s*[^>]*\s*>/gi;
return str.replace(reg, "");
},
_getUrl:function (isTryListen) {
var me = this;
var param = 'from=tiebasongwidget&url=&name=' + encodeURIComponent(me._removeHtml(selectedItem.title)) + '&artist='
+ encodeURIComponent(me._removeHtml(selectedItem.author)) + '&extra='
+ encodeURIComponent(me._removeHtml(selectedItem.album_title))
+ '&autoPlay='+isTryListen+'' + '&loop=true';
return me.playerUrl + "?" + param;
},
_getTryingElem:function () {
var s = $G('J_listPanel').getElementsByTagName('span');
for (var i = 0; i < s.length; i++) {
if (s[i].className == 'm-trying')
return s[i];
}
return null;
},
_buildMusicHtml:function (playerUrl) {
var html = '<embed class="BDE_try_Music" allowfullscreen="false" pluginspage="http://www.macromedia.com/go/getflashplayer"';
html += ' src="' + playerUrl + '"';
html += ' width="1" height="1" style="position:absolute;left:-2000px;"';
html += ' type="application/x-shockwave-flash" wmode="transparent" play="true" loop="false"';
html += ' menu="false" allowscriptaccess="never" scale="noborder">';
return html;
},
_byteLength:function (str) {
return str.replace(/[^\u0000-\u007f]/g, "\u0061\u0061").length;
},
_getMaxText:function (s) {
var me = this;
s = me._removeHtml(s);
if (me._byteLength(s) > 12)
return s.substring(0, 5) + '...';
if (!s) s = "&nbsp;";
return s;
},
_rebuildData:function (data) {
var me = this,
newData = [],
d = me.pageSize,
itembox;
for (var i = 0; i < data.length; i++) {
if ((i + d) % d == 0) {
itembox = [];
newData.push(itembox)
}
itembox.push(data[i]);
}
return newData;
},
_renderTemplate:function (data) {
var me = this;
if (data.length == 0)return '<div class="empty">' + lang.emptyTxt + '</div>';
data = me._rebuildData(data);
var s = [], p = [], t = [];
s.push('<div id="J_listPanel" class="listPanel">');
p.push('<div class="page">');
for (var i = 0, tmpList; tmpList = data[i++];) {
panels.push('panel' + i);
pages.push('page' + i);
if (i == 1) {
s.push('<div id="panel' + i + '" class="panelon">');
if (data.length != 1) {
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageon">' + (i ) + '</div>');
}
} else {
s.push('<div id="panel' + i + '" class="paneloff">');
t.push('<div id="page' + i + '" onclick="music.onpageclick(' + i + ')" class="pageoff">' + (i ) + '</div>');
}
s.push('<div class="m-box">');
s.push('<div class="m-h"><span class="m-t">' + lang.chapter + '</span><span class="m-s">' + lang.singer
+ '</span><span class="m-z">' + lang.special + '</span><span class="m-try-t">' + lang.listenTest + '</span></div>');
for (var j = 0, tmpObj; tmpObj = tmpList[j++];) {
s.push('<label for="radio-' + i + '-' + j + '" class="m-m">');
s.push('<input type="radio" id="radio-' + i + '-' + j + '" name="musicId" class="m-l" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ')"/>');
s.push('<span class="m-t">' + me._getMaxText(tmpObj.title) + '</span>');
s.push('<span class="m-s">' + me._getMaxText(tmpObj.author) + '</span>');
s.push('<span class="m-z">' + me._getMaxText(tmpObj.album_title) + '</span>');
s.push('<span class="m-try" onclick="music.doselect(' + (me.pageSize * (i-1) + (j-1)) + ');music.listenTest(this)"></span>');
s.push('</label>');
}
s.push('</div>');
s.push('</div>');
}
t.reverse();
p.push(t.join(''));
s.push('</div>');
p.push('</div>');
return s.join('') + p.join('');
},
exec:function () {
var me = this;
if (selectedItem == null) return;
$G('J_preview').innerHTML = "";
editor.execCommand('music', {
url:me._getUrl(false),
width:400,
height:95
});
}
};
})();
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style>
html,body{
height:100%;
width:100%;
padding:0;
margin:0;
}
#preview{
width:100%;
height:100%;
padding:0;
margin:0;
}
#preview *{font-family:sans-serif;font-size:16px;}
</style>
<script type="text/javascript" src="../internal.js"></script>
<script src="../../ueditor.parse.js"></script>
<title></title>
</head>
<body class="view">
<div id="preview" style="margin:8px">
</div>
</body>
<script>
document.getElementById('preview').innerHTML = editor.getContent();
uParse('#preview',{
rootPath : '../../',
chartContainerHeight:500
})
dialog.oncancel = function(){
document.getElementById('preview').innerHTML = '';
}
</script>
</html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment