xzw 4 years ago
parent
commit
0904d2e856
4 changed files with 1200 additions and 505 deletions
  1. 56 47
      edit-backstage/css/lzb.css
  2. 144 58
      edit-backstage/edit.html
  3. 559 251
      edit-backstage/js/edit.js
  4. 441 149
      edit-backstage/js/main_2020_edit.js

+ 56 - 47
edit-backstage/css/lzb.css

@@ -247,12 +247,7 @@ ul li {
     color: #999;
 }
 
-.toolRight .link {
-    border-bottom: 1px solid #5d5d5d;
-    margin-bottom: 20px;
-}
-
-.toolRight .link input {
+.toolRight .link input:first-child {
     margin-bottom: 10px;
 }
 
@@ -290,9 +285,11 @@ ul.MenuOptions li.chosen {
     height: 100%;
 }
 
-.tourListWrap {
+.tourList>ul{
     height: 100%;
-    overflow: scroll;
+    overflow-y: scroll;
+    /* overflow-x: hidden; */
+    /* width: 100%; */
 }
 
 .toolRight .input, .toolRight .editText {
@@ -470,15 +467,14 @@ ul.MenuOptions li.chosen {
     color: #00b4ed;
 }
 
-.tourList {
+#tourItemList {
     padding-top: 1.4vw !important;
+    height: calc(100% - 368px); /*  减去在它上面的部分 */
 }
 
  
 
-#tourSwitchTitle {
-    margin: 0;
-}
+ 
 
 .switch {
     display: flex;
@@ -584,29 +580,30 @@ ul.MenuOptions li.chosen {
 
 
 
-.toolRight .snapTour .tourList {
+.toolRight .snapTour #tourList {
     padding-bottom: 20px;
     height: 100%;
 }
 
-.toolRight .snapTour .tourList li {
+.toolRight .snapTour .tourList li.guideItem {
     height: 75px;
     display: flex;
     margin: 16px 0;
+    cursor: pointer;
 }
 
-.toolRight .snapTour .tourList li:first-child {
+.toolRight .snapTour .tourList li.guideItem:first-child {
     margin-top: 0;
 }
 
-.toolRight .snapTour .tourList li>div:nth-child(2) {
+.toolRight .snapTour .tourList li.guideItem>div:nth-child(2) {
     /* background: #3e1313; */
     width: calc(100% - 107px);
     height: 100%;
     position: relative;
 }
 
-.toolRight .snapTour .tourList li>div:nth-child(2) span {
+.toolRight .snapTour .tourList li.guideItem>div:nth-child(2) span {
     text-align: left;
     margin: 0 10px 0 0;
     font-size: 14px;
@@ -619,10 +616,10 @@ ul.MenuOptions li.chosen {
     color: #00b4ed;
     word-wrap: break-word;
     line-height: 22px;
-    cursor: text;
+    /* cursor: text; */
 }
 
-.toolRight .snapTour .tourList li>div:first-child span {
+.toolRight .snapTour .tourList li.guideItem>div:first-child span {
     border-radius: 11px;
     background: #373939;
     width: 22px;
@@ -634,7 +631,7 @@ ul.MenuOptions li.chosen {
     margin-right: 10px;
 }
 
-.toolRight .snapTour .tourList li:last-child>div:first-child span {
+.toolRight .snapTour .tourList li.guideItem:last-child>div:first-child span {
     background: #00b4ed
 }
 
@@ -645,11 +642,11 @@ ul.MenuOptions li.chosen {
     height: 82% !important;
 }
 
-.toolRight .snapTour .tourList li>div:first-child {
+.toolRight .snapTour .tourList li.guideItem>div:first-child {
     position: relative;
 }
 
-.toolRight .snapTour .tourList li>div:first-child div.line {
+.toolRight .snapTour .tourList li.guideItem>div:first-child div.line {
     border-left: 2px solid #373939;
     height: 70px;
     position: absolute;
@@ -658,18 +655,18 @@ ul.MenuOptions li.chosen {
     z-index: 0;
 }
 
-.toolRight .snapTour .tourList li:last-child div.line {
+.toolRight .snapTour .tourList li.guideItem:last-child div.line {
     display: none;
 }
 
-.toolRight .snapTour .tourList li .preview {
+.toolRight .snapTour .tourList li.guideItem .preview {
     width: 75px;
     cursor: pointer;
     position: relative;
     overflow: hidden;
 }
 
-.toolRight .snapTour .tourList li .preview::before {
+.toolRight .snapTour .tourList li.guideItem .preview::before {
     content: '删除';
     width: 50px;
     height: 30px;
@@ -682,11 +679,11 @@ ul.MenuOptions li.chosen {
     transform: translate(-250%, -50%);
 }
 
-.toolRight .snapTour .tourList li .preview:hover::before {
+.toolRight .snapTour .tourList li.guideItem .preview:hover::before {
     transform: translate(-50%, -50%);
 }
 
-.toolRight .snapTour .tourList li .preview div {
+.toolRight .snapTour .tourList li.guideItem .preview div {
     width: 100%;
     height: 100%;
     border-radius: 3px;
@@ -703,11 +700,11 @@ ul.MenuOptions li.chosen {
     margin: 0 !important;
 }
 
-.toolRight .snapTour .tourList li .preview div:hover {
+.toolRight .snapTour .tourList li.guideItem .preview div:hover {
     opacity: 0.2;
 }
 
-.toolRight .snapTour .tourList li input {
+.toolRight .snapTour .tourList li.guideItem input {
     position: absolute;
     top: -5px;
     left: 0;
@@ -852,8 +849,12 @@ ul.MenuOptions li.chosen {
     display: block;
 }
 
-.toolRight .playBox[data-type='music']>div:first-child {
-    background-image: url("../images/soundPlay.png");
+.toolRight .playBox[data-type='music']>div:first-child { 
+    /* background-image: url("../images/soundPlay.png"); */
+    background-image: url("../images/Volume btn_on.png");
+    background-size: 50%;
+    background-repeat:no-repeat;
+    background-position:center;
 }
 
 .toolRight .playBox[data-type='music']>div:first-child.playing {
@@ -975,7 +976,7 @@ ul.MenuOptions li.chosen {
     border-radius: 5px;
     cursor: pointer;
     line-height: 105px;
-    background-size: cover;
+    background-size: 100%;
 }
 
 .toolRight .screen .shotImg.blank {
@@ -984,7 +985,7 @@ ul.MenuOptions li.chosen {
     cursor: default; 
 }
 
-.toolRight .hotpoint .spotList>ul>li,  .overlayList li {
+.toolRight .listItem{
     height: 40px;
     margin: 0 0 8px -10px;
     background: #373938;
@@ -998,28 +999,31 @@ ul.MenuOptions li.chosen {
     transition: background 0.1s;
     position: relative;
     overflow: hidden;
+    /* width: 100%; */
+}
+#tourList .listItem{
+    width: calc(100% + 12px);
 }
-
 .toolRight .hotpoint .spotList>ul>li:hover, .toolRight .hotpoint .spotList>ul>li.active {
     background: #565a5b;
 }
 
-.toolRight .hotpoint .spotList li .icon, .toolRight .editDetail .setPos li .icon , .overlayList li .icon{
-    width: 30px;
+.toolRight .listItem .icon{
+    width: 33px;
     margin-left: 10px;
     background-size: 70%;
     background-position-x: 0;
     background-repeat: no-repeat;
     background-position-y: center;
 }
-.toolRight .hotpoint .spotList li .number{
+.toolRight .hotpoint .listItem .number{
     color:#828282;
     margin-right:10px;
 }
- .overlayList li .icon{
+.overlayList li .icon{
      background-image:url(../images/edit/box_video.png);
  }
-.toolRight .hotpoint .spotList li .title, .toolRight .editDetail .setPos li .title, .overlayList li .title{
+.toolRight .listItem .title{
     width: calc(100% - 70px);
     font-size: 14px;
     text-overflow: ellipsis;
@@ -1027,7 +1031,7 @@ ul.MenuOptions li.chosen {
     white-space: nowrap;
 }
 
-.toolRight .hotpoint .spotList li .DelConfirm {
+.toolRight .listItem .DelConfirm{
     width: 82px;
     background: #00b4ed;
     border-radius: 1px;
@@ -1039,11 +1043,11 @@ ul.MenuOptions li.chosen {
     transition: right 0.3s, opacity 0.1s;
 }
 
-.toolRight .hotpoint .spotList li .DelConfirm.active {
+.toolRight .listItem .DelConfirm.active {
     right: -3px;
 }
 
-.toolRight .hotpoint .spotList li .del {
+.toolRight  .listItem .del {
     width: 40px;
     background-image: url(../images/delete.png);
     background-size: 72%;
@@ -1594,8 +1598,8 @@ ul.MenuOptions li.chosen {
 .slider .scrollBar .scroll_Track {
     width: 0px;
     height: 4px;
-    background-color: #02c8ae;
-    border: 1px solid #02c8ae;
+    background-color: #00b4ed;
+    border: 1px solid #00b4ed;
     margin: -1px 0 0 0;
 }
 
@@ -1650,14 +1654,18 @@ ul.MenuOptions li.chosen {
     /* line-height: 100px; */
     position: relative;
     color: #a0a0a0;
-					
     width: 200px;
-    background-repeat:no-repeat; 
+    background-repeat:no-repeat;
     margin:15px 0 30px 0;
     text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
     background-image:url("../images/img_videoview@2x.png");
     background-position:center 40%;
     background-size: 17%;
+    display: flex;
+    align-items: center;
+    text-align: center;
+    align-content: center;
+    justify-content: center;
 }
  
 .toolRight .hotpointDetail  .preview{
@@ -1677,8 +1685,9 @@ ul.MenuOptions li.chosen {
     transform:translate(-50%,-50%);
 }
 .preview .text{
-    line-height: 144px;
+    display:inline-block;
     color: #a7a7a7;
+    margin-top: 32px;
 }
 .preview.uploaded .text{
     display:none;

+ 144 - 58
edit-backstage/edit.html

@@ -1237,28 +1237,31 @@
                                     class="active"></li>
                                 <li style="background-image: url(images/edit/hotStyle_2.png);"
                                     data-val='{"default":"images/point2.png","higt":"images/point2_light.png"}'>
-                                </li>
-                                <!-- <ul>
-                                    <li class="addSpot customizeHotStyle">
-                                        <div class="buttons">
-                                            <button class="innerBtn" id="customizeHot">自定义样式</button>
+                                </li>  
+                                <!-- <li class="addSpot customizeHotStyle" >
+                                    <div class="list edit-fun-images clearfix"></div>
+                                    <div class="upload" id="SpotStyle">
+                                        <div data-type='photo'> 
+                                            <div class="buttons">
+                                                <button class="submit innerBtn">更改</button>
+                                            </div>
+                                            <input type="file" accept="image/*">
                                         </div>
-                                    </li>
-                                </ul> -->
+                                        <a class="del"></a>
+                                    </div>
+                                </li>  -->
                             </ul>
                         </li>
                         <li data-name="floorMarkerColor">
                             <div class="itemTitle">
-                                <span>当前位置标记/导览标记颜色</span>
+                                <span>当前位置/导览路线</span>
                             </div>
                             <ul class="clearfix hotStyle-item colorWrap">
                                 <input id="floorMarkerColorTex" class="color-text" type="text" placeholder="请输入颜色" />
                                 <input id="floorMarkerColor" type="color" />
-                            </ul>
-                        </li>
-                        <li data-name="MouseMarkerColor">
+                            </ul> 
                             <div class="itemTitle">
-                                <span>鼠标标记颜色</span>
+                                <span>鼠标标记</span>
                             </div>
                             <ul class="clearfix hotStyle-item colorWrap">
                                 <input id="mouseMarkerColorTex" class="color-text" type="text" placeholder="请输入颜色" />
@@ -1295,7 +1298,13 @@
                                     <label for="hideMouseMarker">隐藏鼠标标记 </label>
                                 </li>
                                 <li>
-                                    <input name="twoData" class="editCheckbox" type="checkbox" value="twoData"
+<!--                                     <input name="g_specialScene" class="editCheckbox" type="checkbox"
+                                        value="g_specialScene" id="g_specialScene">
+                                    <label for="g_specialScene"></label>
+                                    <label for="g_specialScene">特殊大场景 <i class="colorRed">-请慎重选择</i> </label>
+                                </li>
+                                <li>
+ -->                                    <input name="twoData" class="editCheckbox" type="checkbox" value="twoData"
                                         id="twoData">
                                     <label for="twoData"></label>
                                     <label for="twoData">启动二代数据 <i class="colorRed">-请慎重选择</i> </label>
@@ -1304,7 +1313,8 @@
                             <ul>
                                 <li>
                                     <label class="remark">注:
-                                        <br>启动二代数据:和tile贴图有关。</label>
+                                        <br>特殊大场景:一般不勾选,是对某些需要特殊处理的场景设置的。如果勾选了还需要将处理的内容写进SpecialScene.js,否则没有作用。
+                                        <br><br>启动二代数据:和tile贴图有关。</label>
                                 </li>
                             </ul>
                         </li>
@@ -1317,7 +1327,7 @@
                             <div class="itemTitle">
                                 <span>背景音乐</span>
                                 <div class="buttons">
-                                    <input type="file" accept="audio/*"  id="upload-bgm">
+                                    <input type="file" accept="audio/*" id="upload-bgm">
                                     <button class="innerBtn submit">上传</button>
                                 </div>
                             </div>
@@ -1332,88 +1342,162 @@
                     </ul>
                 </div>
 
+
+
+
+
                 <div class="snapTour content hide">
-                    <ul>
-                        <div id="tourEdit" class="secondary  editDetail  atRight">
+                    <ul> 
+                        <li class="addTour">
+                            <div class="buttons begin">
+                                <button class="innerBtn">添加导览</button>
+                                <button class="innerBtn">添加片段</button>
+                            </div>
+                        </li>
+                        <li>
+                            <div class="itemTitle">
+                                <span>选择导览过渡效果</span>
+                            </div>
+                            <ul id="tourSwitch" class="switch clearfix hotStyle-item colorWrap">
+                                <label><input class="mui-switch mui-switch-animbg" type="checkbox">
+                                    启用瞬间过渡
+                                </label>
+                            </ul>
+                        </li>
+                        
+                        
+                        <li id="tourList" class='tourList'>  <!-- 总目录-->
+                            <ul>
+
+                            </ul>
+                        </li>
+                        
+                        <!-- <li id="tourFolderList">
+                            <ul>
+
+                            </ul>
+                        </li> -->
+                        
+                        
+                        
+                        
+                        <div id="tourFolderEdit" class="secondary  editDetail  atRight">
                             <div class="itemTitle head">
                                 <span>导览编辑</span>
                                 <!-- <a class="close"></a> -->
                             </div>
                             <div class="content">
                                 <ul>
-                                    <li id="tourName" class="info">
+                                    <li class="tourName info">
                                         <div class="itemTitle" data-size="15" id="project-name1">
                                             <span>导览名称</span>
+                                        </div> 
+                                        <div class="name">
+                                            <input spellcheck="false" placeholder="最多15字" class="right" type="text" minlength="1" maxlength="15" placeholder="" data-oper=tour-input>
+                                        </div><!-- 必填,限15字 ??-->
+                                    </li>
+                                    <li class="audio mediaUpload">
+                                        <div class="itemTitle itemMargin">
+                                            <span>添加音频</span>
+                                            <div class="buttons">
+                                                <input type="file"  accept="audio/*">
+                                                <button class="innerBtn submit">上传</button>
+                                            </div>
+                                        </div>
+                                        <div class="playBox hide" data-type='music'>
+                                            <div><a target="_blank"></a></div>
+                                            <div>
+                                                <span class="title">background</span>
+                                                <span class="delete">删除</span>
+                                            </div>
                                         </div>
-                                        <!-- <span class="redPoint" id="project-name2" data-size="15">标题</span> -->
+                                    </li>
+                                    <li>
+                                        <div class="itemTitle">
+                                            <span>选择导览过渡效果</span>
+                                        </div>
+                                        <ul id="folderTourSwitch" class="switch clearfix hotStyle-item colorWrap">
+                                            <label><input class="mui-switch mui-switch-animbg" type="checkbox">
+                                                启用瞬间过渡
+                                            </label>
+                                        </ul>
+                                    </li>
+                                    <li class="snapATourView">
+                                        <div class="buttons begin">
+                                            <button class="innerBtn">添加片段</button>
+                                        </div>
+                                    </li>
+                                    
+                                    <li id="tourItemList" class='tourList'>
+                                        <ul>
+
+                                        </ul>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="buttons tail">
+                                <button class="tourSubmit submit innerBtn">完成</button> 
+                            </div> 
+                        </div>
+                    
+                    
+                    
+                        
+                    
+                    
+                    
+                    
+                    
+                        <div id="tourItemEdit" class="secondary  editDetail  atRight">
+                            <div class="itemTitle head">
+                                <span>片段编辑</span>
+                                <!-- <a class="close"></a> -->
+                            </div>
+                            <div class="content">
+                                <ul>
+                                    <li class="tourName info">
+                                        <div class="itemTitle" data-size="15" id="project-name1">
+                                            <span>片段名称</span>
+                                        </div> 
                                         <div class="name">
-                                            <input id="tourNameInput" spellcheck="false" placeholder="导览的名称"
-                                                class="right" type="text" minlength="1" maxlength="15" placeholder=""
-                                                data-oper=tour-input>
+                                            <input spellcheck="false" placeholder="导览的名称" class="right" type="text" minlength="1" maxlength="15" placeholder="" data-oper=tour-input>
                                         </div><!-- 必填,限15字 ??-->
                                     </li>
                                     <li class="audio mediaUpload">
                                         <div class="itemTitle itemMargin">
                                             <span>添加音频</span>
                                             <div class="buttons">
-                                                <input type="file" accept="audio/*" id="uploadTourBgm">
+                                                <input type="file"  accept="audio/*">
                                                 <button class="innerBtn submit">上传</button>
                                             </div>
                                         </div>
                                         <div class="playBox hide" data-type='music'>
                                             <div><a target="_blank"></a></div>
                                             <div>
-                                                <span id="tourMusicName" class="title">background</span>
+                                                <span class="title">background</span>
                                                 <span class="delete">删除</span>
                                             </div>
                                         </div>
                                     </li>
-                                    <li id="tourRenew" class="info">
-                                        <!-- <div class="itemTitle" data-size="0.94 ~ 3.18" id="project-name1">
-                                                <span></span>
-                                            </div> -->
-                                        <!-- <span class="redPoint" id="project-name2" data-size="15">标题</span> -->
+                                    <li id="tourRenew" class="info"> 
                                         <div class="name itemMargin">
                                             <div class="buttons begin">
                                                 <button id="renewTourBtn" class="innerBtn">重新录制当前导览</button>
-                                            </div>
-                                            <!-- <input spellcheck="false" placeholder=" 1" class="right" type="text"
-                                                                minlength="1" maxlength="15"> -->
+                                            </div> 
                                         </div><!-- 必填,限15字 ??-->
                                     </li>
                                 </ul>
                             </div>
                             <div class="buttons tail">
-                                <button id="tourSubmit" class="submit innerBtn">完成</button>
-                                <!-- <button class="cancel innerBtn">取消</button> -->
-                            </div>
-
-                        </div>
-                        <li class="addTour">
-                            <div class="buttons begin">
-                                <button class="innerBtn">添加导览</button>
-                            </div>
-                        </li>
-                        <li data-name="MouseMarkerColor" class="tourSelectWarp">
-                            <div class="itemTitle">
-                                <span>选择导览过渡效果</span> 
-                            </div>
-                            <ul id="tourSwitch" class="switch clearfix hotStyle-item colorWrap">
-                                <label><input class="mui-switch mui-switch-animbg" type="checkbox">
-                                    启用瞬间过渡
-                                </label>
-                            </ul>
-                        </li>
-                        <li class="tourList">
-                            <ul id="tourListWrap" class="tourListWrap">
-
-                            </ul>
-                        </li>
+                                <button class="tourSubmit submit innerBtn">完成</button> 
+                            </div> 
+                        </div> 
+                        
                     </ul>
                 </div>
                 <div class="VR content hide">
                     <ul>
-                        <li data-name="MouseMarkerColor" class="tourSelectWarp hotListSwitch">
+                        <li class="tourSelectWarp hotListSwitch">
                             <div class="itemTitle">
                                 <span>VR</span>
                             </div>
@@ -1528,12 +1612,14 @@
         // var token = "eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJhZG1pbiIsInJvbGUiOm51bGwsIm1hbmFnZXIiOm51bGwsImlkIjoxLCJ1c2VyTmFtZSI6ImFkbWluIiwiZXhwIjoxNjE2NTc1MjU5LCJpYXQiOjE2MTY0ODg4NTksImp0aSI6ImJjZGNhZmQxLTU2NGItNGVhMC1hYTE5LWY1ZWRjZThjZTM3ZiJ9.ODMw__rU7GfuGNZNKo14ll7HnOYEG-yNM3Rqh-XYqw4"
         // var ceshi = 'http://47.112.166.173:8105/';
         
+          
        //大场景: 
        var ceshi = '';
        var token = window.localStorage.token 
        if (!token) {
           window.location.href = '/backstage/#/'
        } 
+         
         /*
         //军史馆:
         var ceshi = "http://192.168.0.44:8101/"

File diff suppressed because it is too large
+ 559 - 251
edit-backstage/js/edit.js


File diff suppressed because it is too large
+ 441 - 149
edit-backstage/js/main_2020_edit.js