加了热点视频描述

css/lzb.css

@@ -1307,7 +1307,6 @@ ul.MenuOptions li.chosen {
     position: relative;
     display: block;
     line-height: 90px;
-    font-size: 30px;
     font-weight: 300;
     box-sizing: content-box;
 }
@@ -1379,8 +1378,10 @@ ul.MenuOptions li.chosen {
     width: 100%;
     color: #e0e0e0;
     height: 30px;
-    background: #3a3a3ab0; 
+    background: #3a3a3ab0;
     display:none;
+    z-index: 100;
+    line-height: 30px;
 }
 .edit-fun-images .mediaItem .descBtn:hover{
     color: #fff;
@@ -1397,6 +1398,7 @@ ul.MenuOptions li.chosen {
 .edit-fun-images.hasDescBtn .descBtn{
     display:block;
     cursor:pointer;
+    
 }    
   
 /* loading */

edit.html

@@ -1156,6 +1156,22 @@
                                             <span>视频</span>
                                         </div>
                                         <div class="list edit-fun-images clearfix"></div>
+                                        
+                                         
+                                        <ul class="switch clearfix thirdFontSize">
+                                            <label><input  id="addVideoDesc" class="mui-switch mui-switch-animbg" type="checkbox">
+                                                开启视频描述 
+                                            </label>
+                                        </ul>
+                                       
+                                        <div class="itemTitle thirdFontSize" name='descTitle'>
+                                            <span>描述编辑器</span>
+                                            <div class="buttons"> 
+                                                <button class="innerBtn cancel" style="font-size: 10px;">应用到所有</button>
+                                            </div>
+                                        </div> 
+                                        <textarea placeholder="<=300字" class="editText" maxlength="300" style="min-height:100px"></textarea>
+                                        
                                         <div class="upload">
                                             <div data-type='video'>
                                                 <span>手动上传</span>

js/Hot.js

@@ -601,6 +601,7 @@ window.initHot = function(model){
                 info.iframe = info.iframe || [] 
                 info.styleImg = info.styleImg || [] 
                 info.imagesDesc = info.imagesDesc || []
+                info.videosDesc = info.videosDesc || []
                 info.titleShowType = info.titleShowType || 'hover'
                 info.titlePos = info.titlePos || 'right'
                 

js/edit.js

@@ -1015,24 +1015,30 @@ Hotpoint.prototype.init = function() {
     
     
     
-    //图片简介
+    //media简介
     {
-        let textarea = this.hotpointDetail.find('li[name="photo"] textarea');
+        let textarea = this.hotpointDetail.find('li[name="photo"] textarea, li[name="video"] textarea');
         textarea.on('change',(e)=>{ 
-            if(!textarea[0].currentBtn)return
-            textarea[0].currentBtn.desc = e.target.value;
-            this.imgDescBtnUpdate(textarea[0].currentBtn ) 
+            if(!e.target.currentBtn)return
+            e.target.currentBtn.desc = e.target.value;
+            this.descBtnUpdate(e.target.currentBtn ) 
         })
         
-        //应用到所有
-        this.hotpointDetail.find('li[name="photo"] button').on('click',()=>{
-            var choice = confirm("确定将文字应用到此热点的所有图片吗？"); 
+        //应用到所有 
+        let applyAll = (type)=>{
+            var choice = confirm(`确定将文字应用到此热点的所有${type == 'photo' ? '图片' : '视频'}吗？`); 
             if (choice) { 
-                Array.from(that.hotpointDetail.find("[name=photo] .list .descBtn")).forEach(btn=>{
-                    btn.desc = textarea[0].value
-                    this.imgDescBtnUpdate(btn) 
+                Array.from(that.hotpointDetail.find(`[name=${type}] .list .descBtn`)).forEach(btn=>{
+                    btn.desc = this.hotpointDetail.find(`li[name=${type}] textarea`)[0].value
+                    this.descBtnUpdate(btn) 
                 })
             }
+        }
+        this.hotpointDetail.find('li[name="photo"] button').on('click',()=>{
+            applyAll("photo")
+        })
+        this.hotpointDetail.find('li[name="video"] button').on('click',()=>{
+            applyAll("video")
         })
     }
     
@@ -1129,6 +1135,26 @@ Hotpoint.prototype.init = function() {
             
         }
     })
+    
+    this.videoDescCheckBox = new CheckBox({dom:  this.hotpointDetail.find("#addVideoDesc"),
+        uiCallBack : (checked, name)=>{ 
+            var textarea = this.hotpointDetail.find('li[name="video"] textarea');
+            var title = this.hotpointDetail.find('li[name="video"] [name="descTitle"]')
+            if(!checked){  
+                textarea.addClass('hide'), title.addClass('hide')
+                /* textarea.val('');
+                textarea[0].currentBtn = null */
+            }else{
+                textarea.removeClass('hide'), title.removeClass('hide') 
+            }
+            var Area = this.hotpointDetail.find('li[name="video"] .edit-fun-images');
+            checked ? Area.addClass('hasDescBtn') : Area.removeClass('hasDescBtn')
+                
+        },
+        callbackWhenChose:(checked, name)=>{ 
+            that.editSpot.info.useVideoDesc = !!checked;
+        }
+    })
      
      
     //点击添加热点按钮
@@ -1636,7 +1662,8 @@ Hotpoint.prototype.editHot = function(hot, $li) {
     this.isSpriteCheckBox.updateChoseAtUI(this.editSpot.info.isSprite)
    
     this.imgDescCheckBox.updateChoseAtUI(this.editSpot.info.useImgDesc)
-   
+    this.videoDescCheckBox.updateChoseAtUI(this.editSpot.info.useVideoDesc)
+    
     this.linkTypeMenuOptions.updateChoseAtUI({name:this.editSpot.info.linkType})
      
      
@@ -1653,7 +1680,7 @@ Hotpoint.prototype.editHot = function(hot, $li) {
     }.bind(this))
 
     var imagesHTML = hot.info.images.map(function(image,index) { 
-        return '<div class="mediaItem" draggable="true" ><a class=" result success" data-type="photo"><span></span><img src="' + image + '" class="bg"></a><div class="descBtn" ></div></div>'
+        return '<div class="mediaItem" draggable="true" ><a class=" result success" data-type="photo"><span></span><img src="' + image + '" class="bg"><div class="descBtn" ></div></a></div>'
     })
 
  
@@ -1661,7 +1688,7 @@ Hotpoint.prototype.editHot = function(hot, $li) {
     var videosHTML = hot.info.video.map(function(ly) {
         var thumb = (!ly.img || ly.img === "undefined") ? '' : '<img src='+ ly.img +' class="bg"></img>'
         var thumbResult = (!ly.img || ly.img === "undefined") ? '' : 'success';
-        var dom = '<div class="mediaItem" draggable="true"><a class=" result success" data-type="video"><span></span>' + thumb + ' <img class="play-video" videoURL="' + ly.url + '" src="' + playIcon + '"></a>  <span class="upload-thum ' + thumbResult + ' result" attr-thum="' + ly.img + '">上传封面<i><input type="file" accept="image/*"></i></span></div>'
+        var dom = '<div class="mediaItem" draggable="true"><a class=" result success" data-type="video"><span></span>' + thumb + ' <img class="play-video" videoURL="' + ly.url + '" src="' + playIcon + '"><div class="descBtn" ></div></a>  <span class="upload-thum ' + thumbResult + ' result" attr-thum="' + ly.img + '">上传封面<i><input type="file" accept="image/*"></i></span></div>'
         return dom
     })
 
@@ -1672,12 +1699,18 @@ Hotpoint.prototype.editHot = function(hot, $li) {
     this.hotpointDetail.find("[name=modelSrc] .list").html(modulesHTML);
     this.hotpointDetail.find("[name=webPage] .list").html(iframesHTML);
     Array.from(this.hotpointDetail.find("[name=photo] .list .descBtn")).forEach((btn,index)=>{ 
-        this.imgDescBtnBind(btn,  this.editSpot.info.imagesDesc[index]) 
-        this.imgDescBtnUpdate(btn,index) 
+        this.descBtnBind(btn, 'photo', this.editSpot.info.imagesDesc[index]) 
+        this.descBtnUpdate(btn,index) 
+    })
+    Array.from(this.hotpointDetail.find("[name=video] .list .descBtn")).forEach((btn,index)=>{ 
+        this.descBtnBind(btn, 'video', this.editSpot.info.videosDesc[index]) 
+        this.descBtnUpdate(btn,index) 
     })
-    this.imgDescBtnChose(null)
     
     
+    this.descBtnChose(null, 'photo')
+    this.descBtnChose(null, 'video')
+    
     
     let bgName = hot.info.bgName || '热点背景音乐';
     if (hot.info.backgroundMusic) { 
@@ -3052,11 +3085,11 @@ Hotpoint.prototype.addmediaInit = function() {
                 $din.prepend($addLayout);
                 $layout.find('.edit-fun-images').append($din);
                 
-                if (type === 'photo'){
-                    var $btn = $('<div class="descBtn">添加描述</div>')
-                    $din.append($btn)
-                    that.imgDescBtnBind($btn[0])
-                }
+                 
+                var $btn = $('<div class="descBtn">添加描述</div>')
+                $addLayout.append($btn)
+                that.descBtnBind($btn[0], type)
+                 
                     
                 
                 
@@ -3129,6 +3162,7 @@ Hotpoint.prototype.addmediaInit = function() {
         }else if (tagName === 'IMG' && $tag.hasClass('play-video')) {
             $videoLayout.css('display', 'flex').find('video').attr('src', $tag.attr('videoURL'))[0].play()
         }else{// 替换
+            if($tag.hasClass('descBtn'))return
             var a = searchParent($tag[0], {
                 tagName: 'a'
             })
@@ -3152,7 +3186,7 @@ Hotpoint.prototype.addmediaInit = function() {
 }
 
 
-Hotpoint.prototype.imgDescBtnUpdate = function(btn){//图片描述按钮状态更新
+Hotpoint.prototype.descBtnUpdate = function(btn){//图片描述按钮状态更新
     var $btn = $(btn)
     /* if(index == void 0){ 
         var btns = Array.from(this.hotpointDetail.find("[name=photo] .list .descBtn")) 
@@ -3169,24 +3203,26 @@ Hotpoint.prototype.imgDescBtnUpdate = function(btn){//图片描述按钮状态
 }
 
 
-Hotpoint.prototype.imgDescBtnBind = function(btn, desc){//图片描述按钮事件
-    //console.log('imgDescBtnBind',btn)
-    var textarea = this.hotpointDetail.find('li[name="photo"] textarea');
-    var title = this.hotpointDetail.find('li[name="photo"] [name="descTitle"]')
-    btn.addEventListener('click',()=>{
-        this.hotpointDetail.find("[name=photo] .list .descBtn").removeClass('chosen')
+Hotpoint.prototype.descBtnBind = function(btn, type, desc  ){//单个图片or视频描述按钮事件
+    //console.log('descBtnBind',btn)
+    var textarea = this.hotpointDetail.find(`li[name="${type}"] textarea`);
+    var title = this.hotpointDetail.find(`li[name="${type}"] [name="descTitle"]`)
+    btn.addEventListener('click',(e)=>{
+        this.hotpointDetail.find(`[name=${type}] .list .descBtn`).removeClass('chosen')
         $(btn).addClass('chosen'); 
         textarea.removeClass('hide')
         title.removeClass('hide')
         /* textarea.val(btn.desc)
         textarea[0].currentBtn = btn  */
-        this.imgDescBtnChose(btn)
+        this.descBtnChose(btn, type)
+        e.preventDefault()
+        e.stopPropagation()
     }) 
     btn.desc = desc || '' 
 }
 
-Hotpoint.prototype.imgDescBtnChose = function(btn){
-    var textarea = this.hotpointDetail.find('li[name="photo"] textarea');
+Hotpoint.prototype.descBtnChose = function(btn, type){
+    var textarea = this.hotpointDetail.find(`li[name="${type}"] textarea`);
     textarea[0].currentBtn = btn
     textarea.val(btn ? btn.desc : ''); 
 }
@@ -3338,7 +3374,7 @@ Hotpoint.prototype.editDone = function(){
     
     this.setCameraBtn(false)
     this.imgDescCheckBox.updateChoseAtUI(false)
-    
+    this.videoDescCheckBox.updateChoseAtUI(false)
      
     $('#setPosForPano [name="dis"]').addClass('hide');
  
@@ -3563,7 +3599,7 @@ Hotpoint.prototype.saveHot = function() {
         }
         
         hot.info.imagesDesc = Array.from(that.hotpointDetail.find("[name=photo] .list .descBtn")).map(btn=>btn.desc)
-        
+        hot.info.videosDesc = Array.from(that.hotpointDetail.find("[name=video] .list .descBtn")).map(btn=>btn.desc)