<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ page isELIgnored="false" %>
<!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"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="<%=request.getContextPath() %>/js/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath() %>/js/bootstrap/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/jquery/jquery-1.11.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/ueditor.all.js"> </script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/layer/layer.js"> </script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/util.js"> </script>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/js/jquery-uploadify/css/uploadify.css">
    <script src="<%=request.getContextPath() %>/js/jquery-uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="<%=request.getContextPath() %>/js/lang/zh-cn/zh-cn.js"></script>
    <style>
        .uploadify{
            position: relative;
            display: inline-block;
            color: #fff;
            margin: 0px;
        }
    </style>
</head>
<body>
<br/>
<div class="container">
    <form cssClass="form-horizontal" action="<%=request.getContextPath() %>/live/addContent.do" method="post">

        <legend>添加直播</legend>

        <div class="form-group-sm">
            <label class="control-label col-xs-2">标题:</label>
            <div class="col-xs-10">
                <input type="text" name="contentTitle" class="form-control" placeholder="10到100个字!">
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">视频地址:</label>
            <div class="col-xs-10">
                <div class="input-group">
                    <input type="text" name="videoUrl" id="videoUrl" class="form-control" readonly placeholder="视频地址">
                    <span class="input-group-addon" style="padding: 0px;border: 1px solid #555;"><div><span id="myImageVideoUrl" style="margin: 0px;"></span></div></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">视频展现图:</label>
            <div class="col-xs-10">
                <div class="input-group">
                    <input type="text" id="thumbUrl" name="thumbUrl" class="form-control" readonly placeholder="视频展现图">
                    <span class="input-group-addon" style="padding: 0px;border: 1px solid #555;"><div><span id="myImageThumbUrl" style="margin: 0px;"></span></div></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">视频缩略图:</label>
            <div class="col-xs-10">
                <div class="input-group">
                    <input type="text" id="thumbMinUrl" name="thumbMinUrl" class="form-control" readonly placeholder="视频缩略图">
                    <span class="input-group-addon" style="padding: 0px;border: 1px solid #555;"><div><span id="myImageThumbMinUrl" style="margin: 0px;"></span></div></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">开始时间:</label>
            <div class="col-xs-10">
                <div class="date form_datetime input-group" data-date-format="yyyy-mm-dd hh:ii:00">
                    <input class="form-control" name="startDate" readonly type="text" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">结束时间:</label>
            <div class="col-xs-10">
                <div class="date form_datetime input-group" data-date-format="yyyy-mm-dd hh:ii:00">
                    <input class="form-control" name="endDate" readonly type="text" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">限制人数:</label>
            <div class="col-xs-10">
                <input class="form-control" name="userCount" type="text" placeholder="100人以内！"/>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">预热时间:</label>
            <div class="col-xs-10">
                <div class="date form_datetime input-group" data-date-format="yyyy-mm-dd hh:ii:00">
                    <input class="form-control" name="preheatDate" readonly type="text"/>
                    <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">预热展现图:</label>
            <div class="col-xs-10">
                <div class="input-group">
                    <input type="text" id="preheatImg" name="preheatImg" readonly class="form-control" placeholder="预热展现图">
                    <span class="input-group-addon" style="padding: 0px;border: 1px solid #555;"><div><span id="myImagePreheatImg" style="margin: 0px;"></span></div></span>
                </div>
            </div>
        </div>
        <div class="form-group-sm">
            <label class="control-label col-xs-2">视频详细:</label>
            <input type="hidden" name="contentDetail" id="contentDetail" value="">
            <div  class="col-xs-10"><script id="editor" type="text/plain"style="height:300px;"></script></div>
        </div>
        <div class="form-group-sm text-center">
            <button type="button" class="btn btn-sm btn-default" id="back">返回</button>
            <input type="hidden" name="status" value="0">
            <button type="button" class="btn btn-sm btn-primary" onclick="tj()">提交</button>
        </div>
    </form>
</div>
<script>
    $(function(){
        $("#back").on("click",function(){
            window.history.go(-1);
        })
    })
    function tj(){
        var html = UE.getEditor('editor').getContent();
        $("#contentDetail").val(html);
        $("form").submit();
    }
    var ue = UE.getEditor('editor',{
        catchRemoteImageEnable:false,
        toolbars: [
            [
                //'anchor', //锚点
                'undo', //撤销
                'redo', //重做
                'bold', //加粗
                'indent', //首行缩进
                'snapscreen', //截图
                'italic', //斜体
                'underline', //下划线
                'strikethrough', //删除线
                'subscript', //下标
                'fontborder', //字符边框
                'superscript', //上标
                'formatmatch', //格式刷
                'source', //源代码
                'blockquote', //引用
                'pasteplain', //纯文本粘贴模式
                'selectall', //全选
                //'print', //打印
                //'preview', //预览
                'horizontal', //分隔线
                'removeformat', //清除格式
                'time', //时间
                'date', //日期
                //'unlink', //取消链接
                'insertrow', //前插入行
                'insertcol', //前插入列
                'mergeright', //右合并单元格
                'mergedown', //下合并单元格
                'deleterow', //删除行
                'deletecol', //删除列
                'splittorows', //拆分成行
                'splittocols', //拆分成列
                'splittocells', //完全拆分单元格
                'deletecaption', //删除表格标题
                'inserttitle', //插入标题
                'mergecells', //合并多个单元格
                'deletetable', //删除表格
                'cleardoc', //清空文档
                'insertparagraphbeforetable', //"表格前插入行"
                //'insertcode', //代码语言
                'fontfamily', //字体
                'fontsize', //字号
                'paragraph', //段落格式
                'simpleupload', //单图上传
                'insertimage', //多图上传
                'edittable', //表格属性
                'edittd', //单元格属性
                'link', //超链接
                //'emotion', //表情
                'spechars', //特殊字符
                'searchreplace', //查询替换
                //'map', //Baidu地图
                //'gmap', //Google地图
                //'insertvideo', //视频
                //'help', //帮助
                'justifyleft', //居左对齐
                'justifyright', //居右对齐
                'justifycenter', //居中对齐
                'justifyjustify', //两端对齐
                'forecolor', //字体颜色
                'backcolor', //背景色
                'insertorderedlist', //有序列表
                'insertunorderedlist', //无序列表
                //'fullscreen', //全屏
                'directionalityltr', //从左向右输入
                'directionalityrtl', //从右向左输入
                'rowspacingtop', //段前距
                'rowspacingbottom', //段后距
                //'pagebreak', //分页
                //'insertframe', //插入Iframe
                'imagenone', //默认
                'imageleft', //左浮动
                'imageright', //右浮动
                //'attachment', //附件
                'imagecenter', //居中
                'wordimage', //图片转存
                'lineheight', //行间距
                'edittip ', //编辑提示
                'customstyle', //自定义标题
                'autotypeset', //自动排版
                //'webapp', //百度应用
                'touppercase', //字母大写
                'tolowercase', //字母小写
                'background', //背景
                //'template', //模板
                //'scrawl', //涂鸦
                //'music', //音乐
                'inserttable', //插入表格
                //'drafts', // 从草稿箱加载
                'charts', // 图表
            ]
        ]
    });
    $('.form_datetime').datetimepicker({
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1
    });
    //上传列表展现图
    $('#myImageVideoUrl').uploadify({
        'swf'      : '<%=request.getContextPath() %>/js/jquery-uploadify/uploadify.swf',
        'uploader' : '<%=request.getContextPath() %>/publish/uploadFile.do?type=video',
        'height': 28,
        'width' :100,
        'auto'  : true,
        'fileObjName' : 'file',   //文件对象名称,用于后台获取文件对象时使用
        //'fileSizeLimit':10,
        'buttonText' : '选择',
        'buttonClass':'uploadBtn',
        'fileTypeExts' : '*.mp4; *.avi',
        'multi'    : false,
        'method'   :'post',
        'successTimeout' : 3000,
        'debug':false,
        'onInit': function () {     //载入时触发，将flash设置到最小
            //$("#myImage0").hide();
            $("#myImageVideoUrl-queue").hide();
        },
        'onUploadSuccess' : function(file, data, response) {
            var json = eval("(" + data + ")");
            if(json.rc==0){
                $("#videoUrl").val(json.items);
            }
        },
        'onUploadError' : function(file, errorCode, errorMsg, errorString) {
            alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
        }

    });
    //上传列表展现图
    $('#myImageThumbMinUrl').uploadify({
        'swf'      : '<%=request.getContextPath() %>/js/jquery-uploadify/uploadify.swf',
        'uploader' : '<%=request.getContextPath() %>/publish/uploadFile.do?type=image',
        'height': 28,
        'width' :100,
        'auto'  : true,
        'fileObjName' : 'file',   //文件对象名称,用于后台获取文件对象时使用
        //'fileSizeLimit':10,
        'buttonText' : '选择',
        'buttonClass':'uploadBtn',
        'fileTypeExts' : '*.gif; *.jpg; *.png',
        'multi'    : false,
        'method'   :'post',
        'successTimeout' : 300,
        'debug':false,
        'onInit': function () {     //载入时触发，将flash设置到最小
            //$("#myImage0").hide();
            $("#myImageThumbMinUrl-queue").hide();
        },
        'onUploadSuccess' : function(file, data, response) {
            var json = eval("(" + data + ")");
            if(json.rc==0){
                $("#thumbMinUrl").val(json.items);
            }
        },
        'onUploadError' : function(file, errorCode, errorMsg, errorString) {
            alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
        }

    })
    //上传列表展现图
    $('#myImageThumbUrl').uploadify({
        'swf'      : '<%=request.getContextPath() %>/js/jquery-uploadify/uploadify.swf',
        'uploader' : '<%=request.getContextPath() %>/publish/uploadFile.do?type=image',
        'height': 28,
        'width' :100,
        'auto'  : true,
        'fileObjName' : 'file',   //文件对象名称,用于后台获取文件对象时使用
        //'fileSizeLimit':10,
        'buttonText' : '选择',
        'buttonClass':'uploadBtn',
        'fileTypeExts' : '*.gif; *.jpg; *.png',
        'multi'    : false,
        'method'   :'post',
        'successTimeout' : 300,
        'debug':false,
        'onInit': function () {     //载入时触发，将flash设置到最小
            //$("#myImage0").hide();
            $("#myImageThumbUrl-queue").hide();
        },
        'onUploadSuccess' : function(file, data, response) {
            var json = eval("(" + data + ")");
            if(json.rc==0){
                $("#thumbUrl").val(json.items);
            }
        },
        'onUploadError' : function(file, errorCode, errorMsg, errorString) {
            alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
        }

    })
    //上传列表展现图
    $('#myImagePreheatImg').uploadify({
        'swf'      : '<%=request.getContextPath() %>/js/jquery-uploadify/uploadify.swf',
        'uploader' : '<%=request.getContextPath() %>/publish/uploadFile.do?type=image',
        'height': 28,
        'width' :100,
        'auto'  : true,
        'fileObjName' : 'file',   //文件对象名称,用于后台获取文件对象时使用
        //'fileSizeLimit':10,
        'buttonText' : '选择',
        'buttonClass':'uploadBtn',
        'fileTypeExts' : '*.gif; *.jpg; *.png',
        'multi'    : false,
        'method'   :'post',
        'successTimeout' : 300,
        'debug':false,
        'onInit': function () {     //载入时触发，将flash设置到最小
            //$("#myImage0").hide();
            $("#myImagePreheatImg-queue").hide();
        },
        'onUploadSuccess' : function(file, data, response) {
            var json = eval("(" + data + ")");
            if(json.rc==0){
                $("#preheatImg").val(json.items);
            }
        },
        'onUploadError' : function(file, errorCode, errorMsg, errorString) {
            alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
        }

    })

</script>
</body>
</html>
