123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179 |
- <include file="public@header" />
- </head>
- <body>
- <div class="wrap">
- <ul class="nav nav-tabs">
- <li ><a href="{:url('Music/index')}">背景音乐列表</a></li>
- <li class="active"><a >添加</a></li>
- </ul>
- <form method="post" class="form-horizontal js-ajax-form margin-top-20" action="{:url('Music/music_add_post')}">
- <fieldset>
-
- <div class="form-group" >
- <label for="input-classify_id" class="col-sm-2 control-label"><span class="form-required">*</span>音乐分类</label>
- <div class="col-md-6 col-sm-10">
- <select class="form-control" name="classify_id">
- <option value="0">默认分类</option>
- <volist name="classify" id="vo">
- <option value="{$vo['id']}">{$vo['title']}</option>
- </volist>
-
- </select>
- </div>
- </div>
-
- <div class="form-group" >
- <label for="input-title" class="col-sm-2 control-label"><span class="form-required">*</span>音乐名称</label>
- <div class="col-md-6 col-sm-10">
- <input type="text" class="form-control" id="input-title" name="title">
- </div>
- </div>
-
- <div class="form-group" >
- <label for="input-author" class="col-sm-2 control-label"><span class="form-required">*</span>演唱者</label>
- <div class="col-md-6 col-sm-10">
- <input type="text" class="form-control" id="input-author" name="author">
- </div>
- </div>
-
-
- <div class="form-group">
- <label for="input-user_login" class="col-sm-2 control-label"><span class="form-required">*</span>封面</label>
- <div class="col-md-6 col-sm-10">
- <input type="hidden" name="img_url" id="thumbewm" value="">
- <a href="javascript:uploadOneImage('图片上传','#thumbewm');">
- <img src="__TMPL__/public/assets/images/default-thumbnail.png" id="thumbewm-preview" style="cursor: pointer;max-width:150px;max-height:150px;"/>
- </a>
- <input type="button" class="btn btn-sm btn-cancel-thumbewm" value="取消图片">
- <p class="help-block">建议尺寸200px*200px</p>
- </div>
- </div>
-
-
- <div class="form-group" >
- <label for="input-length" class="col-sm-2 control-label"><span class="form-required">*</span>音乐长度</label>
- <div class="col-md-6 col-sm-10">
- <input type="text" class="form-control" id="length" name="length" readonly="readonly"><p class="help-block">(系统自动获取)</p>
- </div>
- </div>
-
- <div class="form-group" >
- <label for="input-use_nums" class="col-sm-2 control-label"><span class="form-required">*</span>被使用次数</label>
- <div class="col-md-6 col-sm-10">
- <input type="text" class="form-control" id="input-use_nums" name="use_nums"><p class="help-block">填写正整数</p>
- </div>
- </div>
-
- <div class="form-group" >
- <label for="input-file" class="col-sm-2 control-label"><span class="form-required">*</span>上传音乐</label>
- <div class="col-md-6 col-sm-10">
- <input type="file" name="file" id="upfile" /><p class="help-block">MP3格式</p>
- </div>
- </div>
-
-
- <div class="form-group upload_video_area" >
- <label for="input-file" class="col-sm-2 control-label"></label>
- <div class="col-md-6 col-sm-10">
- <audio id="audio" controls="" style="display: none;"></audio>
- </div>
- </div>
- </fieldset>
- <div class="form-group">
- <div class="col-sm-offset-2 col-sm-10">
- <button type="submit" class="btn btn-primary js-ajax-submit" id="submit">{:lang('ADD')}</button>
- <a class="btn btn-default" href="{:url('Music/index')}">{:lang('BACK')}</a>
- </div>
- </div>
-
- </form>
- </div>
- <script src="__STATIC__/js/admin.js"></script>
- <script type="text/javascript" src="__STATIC__/layer/layer.js"></script>
- <script type="text/javascript">
-
- $(function () {
- $("#upfile").change(function () {
- $('#submit').removeAttr("disabled");
- //获取文件类型
- var a=$("#upfile").val();
- var arr=a.split('.');
- var type=arr[arr.length-1];
- if(type.toLowerCase()!="mp3"){
- layer.msg("请上传MP3格式文件");
- $("#submit").attr("disabled","true");
- return;
- }
- var objUrl = getObjectURL(this.files[0]);
- $("#audio").attr("src", objUrl);
- $("#audio")[0].play();
- $("#audio").show();
- getTime();
- });
- });
- //获取mp3文件的时间 兼容浏览器
- function getTime() {
- setTimeout(function () {
- var duration = $("#audio")[0].duration;
- if(isNaN(duration)){
- getTime();
- }
- else{
- //console.log($("#audio")[0]);
- // console.info("该歌曲的总时间为:"+$("#audio")[0].duration+"秒");
- var length=Math.floor($("#audio")[0].duration); //获取音乐长度
- if(length<15){ //长度小于15秒
- layer.msg('音乐长度不能低于15秒');
- $("#submit").attr("disabled","true");
- }
- var len_str="00:00";
- if(length>60){
- var minute=Math.floor(length/60);
- var second=length%60;
- if(minute<10){
- minute="0"+minute;
- }
- if(second<10){
- second="0"+second;
- }
- len_str=minute+":"+second;
- }else{
- len_str="00:"+length;
- }
- //console.log(len_str);
- $("#length").val(len_str);
- }
- }, 50);
- }
- //把文件转换成可读URL
- function getObjectURL(file) {
- var url = null;
- if (window.createObjectURL != undefined) { // basic
- url = window.createObjectURL(file);
- } else if (window.URL != undefined) { // mozilla(firefox)
- url = window.URL.createObjectURL(file);
- } else if (window.webkitURL != undefined) { // webkit or chrome
- url = window.webkitURL.createObjectURL(file);
- }
- return url;
- }
- </script>
- </body>
- </html>
|