Home Explore Help
Register Sign In
chenzimin2
/
yapianbowuguan
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

init

aamin 1 year ago
commit
b8f6c1b5b1
44 changed files with 29823 additions and 0 deletions
Split View Show Diff Stats
  1. 902 0
      index.html
  2. BIN
      searchGuide/img/icon/close.png
  3. BIN
      searchGuide/img/icon/search.png
  4. BIN
      searchGuide/img/yb/yb.png
  5. 917 0
      searchGuide/index.html
  6. 3 0
      searchGuide/js/axios.min.js
  7. 43 0
      searchGuide/js/flexible.js
  8. 11 0
      searchGuide/js/vue.min.js
  9. 440 0
      searchGuide/searchGuide.html
  10. 52 0
      searchGuide/test.html
  11. 51 0
      test.html
  12. 3 0
      定制化热点/.browserslistrc
  13. 17 0
      定制化热点/.eslintrc.js
  14. 23 0
      定制化热点/.gitignore
  15. 24 0
      定制化热点/README.md
  16. 5 0
      定制化热点/babel.config.js
  17. 26499 0
      定制化热点/package-lock.json
  18. 32 0
      定制化热点/package.json
  19. 16 0
      定制化热点/public/index.html
  20. 22 0
      定制化热点/src/App.vue
  21. 34 0
      定制化热点/src/assets/base.css
  22. BIN
      定制化热点/src/assets/images/IMGerror.png
  23. BIN
      定制化热点/src/assets/images/loading.gif
  24. BIN
      定制化热点/src/assets/images/pc/audio.png
  25. BIN
      定制化热点/src/assets/images/pc/audioAc.png
  26. BIN
      定制化热点/src/assets/images/pc/icon-left.png
  27. BIN
      定制化热点/src/assets/images/pc/icon-right.png
  28. BIN
      定制化热点/src/assets/images/pc/icon1.png
  29. BIN
      定制化热点/src/assets/images/pc/icon1Ac.png
  30. BIN
      定制化热点/src/assets/images/pc/icon2.png
  31. BIN
      定制化热点/src/assets/images/pc/icon2Ac.png
  32. BIN
      定制化热点/src/assets/images/pc/icon3.png
  33. BIN
      定制化热点/src/assets/images/pc/icon3Ac.png
  34. BIN
      定制化热点/src/assets/images/pc/left.png
  35. BIN
      定制化热点/src/assets/images/pc/right.png
  36. BIN
      定制化热点/src/assets/logo.png
  37. 59 0
      定制化热点/src/components/HelloWorld.vue
  38. 23 0
      定制化热点/src/main.js
  39. 27 0
      定制化热点/src/router/index.js
  40. 29 0
      定制化热点/src/utils/browser.js
  41. 0 0
      定制化热点/src/utils/http.js
  42. 5 0
      定制化热点/src/views/About.vue
  43. 583 0
      定制化热点/src/views/Home.vue
  44. 3 0
      定制化热点/vue.config.js

+ 902 - 0
index.html
View File 

@@ -0,0 +1,902 @@
 
+<!doctype html>
 
+<html>
 
+
 
+<head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 
+    <title></title>
 
+    <meta name="description" content="四维时代">
 
+    <meta property="og:title" content="四维时代">
 
+    <meta property="og:description" content="四维时代">
 
+    <meta property="og:image:type" content="image/jpg">
 
+    <link rel="icon" type="image/png" sizes="32x32" href="images/icons/favicon.png" class="keep">
 
+    <link rel="stylesheet" href="css/oldVer/main0.css">
 
+    <link rel="stylesheet" href="css/main.css?v=2.25">
 
+    <!-- <link rel="stylesheet" href="/CAD/cad.css?v=2.25"> -->
 
+    <script>
 
+        var number = window.location.href.substring(window.location.href.indexOf("=") + 1);
 
+        if (number.indexOf("&") != -1) {
 
+            number = number.substring(0, number.indexOf("&"));
 
+        }
 
+        if (number.indexOf("#") != -1) {
 
+            number = number.substring(0, number.indexOf("#"));
 
+        } 
+    </script>
 
+    <script>
 
+        var _hmt = _hmt || [];
 
+        (function() {
 
+          var hm = document.createElement("script");
 
+          hm.src = "https://hm.baidu.com/hm.js?73402bb08ff95cb21b7f1673250c532d";
 
+          var s = document.getElementsByTagName("script")[0]; 
+          s.parentNode.insertBefore(hm, s);
 
+        })();
 
+    </script>
 
+    <script class="build keep">
 
+        if (window.performance) {
 
+            window.navigationStart = window.performance.timing.navigationStart;
 
+        } else {
 
+            window.navigationStart = Date.now() + 300;
 
+        } 
+        
+    </script>
 
+
 
+
 
+    <style>
 
+        #consoleLog{ 
+          width: 200px;
 
+          height: 250px;
 
+          position: absolute;
 
+          right: 0px;
 
+          bottom: 100px;
 
+          z-index: 999999;
 
+          color: black;
 
+          opacity: 0.9;
 
+            font-size: 10px;
 
+        }
 
+
 
+        iframe {
 
+            position: absolute;
 
+            bottom: 100px;
 
+            right: 10px;
 
+            z-index: 1000;
 
+        }
 
+    
+    </style>
 
+</head>
 
+
 
+<body>
 
+    <!-- 小人指引搜索 -->
 
+    <iframe
 
+        src="./searchGuide/searchGuide.html"
 
+        frameborder="0"
 
+        id="myifr"
 
+        width="10%"
 
+        height="30%"
 
+    ></iframe>
 
+    <div id="hot"> </div>
 
+    <div class='widgets-doll-labels'> </div> 
+    <div id="popup">
 
+        <div class="popup-content">
 
+
 
+        </div>
 
+        <div id="closepop">close</div>
 
+    </div>
 
+    <div class="sidecontent" style="width:35%">
 
+        <h1><span class="side-client-close">关闭</span></h1>
 
+        <image id="sideimg" style="width:90%" /></br>
 
+        <p id="text">
 
+        </p>
 
+    </div>
 
+    <div id="gui-thumb" style="display: none;"></div>
 
+    <div id="player" style="display: none;"></div>
 
+    <div id="gui-parent">
 
+        <div id="memory-info"
 
+            style="display:none; position:fixed; right:10px; top:10px; background-color:#eeeeee; color:#222222; padding:3px 10px 3px 10px; font-size:100%;">
 
+            GPU memory used: <span id="memory-gpu"></span>
 
+        </div>
 
+        <div id="gui-loading" class="message-outer darkGlass" style="display: none;">
 
+            <h2 class="model-title"></h2>
 
+            <div class="message-inner">
 
+                <div class="loadingLogo"> 
+                    <div class="img"> 
+                    </div> 
+                </div> 
+                <div class="progressbar" data-perc="100">
 
+                    <div class="label">
 
+                        <div class="perc">0%</div>
 
+                    </div>
 
+                    <div class="bar"><span></span></div>
 
+                </div>
 
+                <div id="loaderCoBrand">
 
+                    <div class="vert-align">
 
+                    </div>
 
+                </div>
 
+                <div class="bottom-logo">
 
+                    <div class="img"></div>
 
+                </div>
 
+                <div class="specialPower">
 
+                    <span class="powered-by">{[{ POWERED_BY }]}</span>
 
+                    &#xA0;<div class="img"></div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="gui" style="display: none;">
 
+            <div id="vrOff">
 
+                <img id="vrOffImg" src="images/vrOffImg.png" alt="">
 
+            </div>
 
+            <div id="hotListWrap">
 
+                <div id="hotListTitle">
 
+                    <div>
 
+                        <span id="hotListText">热点列表</span>
 
+                        <img id="hotListIcon" src="images/hotlist.png" alt="">
 
+                    </div>
 
+
 
+                </div>
 
+                <div id="hotListContent">
 
+                    <ul>
 
+                    </ul>
 
+                </div>
 
+                <div id="hotListBottom">
 
+                    <img id="hotListClose" src="images/hotListClose.png" alt="">
 
+                </div>
 
+            </div>
 
+            <div class="pinTop left">
 
+                <div id="model-title">
 
+                    <div class="title-row">
 
+                        <div id="title-toggle">
 
+                            <a>
 
+                                <i class="icon icon-dpad-left"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="title-container-wrapper" rel="tooltip" data-placement="bottom" data-html="true">
 
+                            <div class="title-container  meta-toggle">
 
+                                <div class="co-brand">
 
+                                    {[{ PRESENTED_BY }]}<span class="title" id="cobrandTitle"></span>
 
+                                </div>
 
+                                <div id="title-logo">
 
+                                    <i></i>
 
+                                </div>
 
+                                <div id="gui-name" class="titleText"></div>
 
+                                <a id="more-hint"><i class="icon icon-dpad-down"></i></a>
 
+                                <a id="less-hint"><i class="icon icon-dpad-up"></i></a>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div id="meta-info-wrapper">
 
+                    <div id="meta-info" class="darkGlass">
 
+                        <div id="meta-description"></div>
 
+                        <div class="contact-info">
 
+                            <i class="icon icon-user pull-left"></i>
 
+                            &#xA0;<div id="contact-data"></div>
 
+                        </div>
 
+                        <div class="address">
 
+                            <i class="icon icon-pin"></i>
 
+                            <span id="addressTxt"></span>
 
+                        </div>
 
+                        <div id="tag-toggles" class="menu-toggles hidden">
 
+                            <span>{[{ MATTERTAG_CONTENT }]}</span>
 
+                            <div id="tag-inputs" class="menu-radios">
 
+                                <div id="show-tag" class="menu-radio-show">
 
+                                    <input id="radio-tag-show" type="radio" name="tags" value="show">
 
+                                    <label for="radio-tag-show">{[{ SHOW }]}</label>
 
+                                </div>
 
+                                <div id="hide-tag" class="menu-radio-hide">
 
+                                    <input id="radio-tag-hide" type="radio" name="tags" value="hide">
 
+                                    <label for="radio-tag-hide">{[{ HIDE }]}</label>
 
+                                </div>
 
+                            </div>
 
+                        </div>
 
+                        <div id="labels-toggles" class="menu-toggles hidden">
 
+                            <span>Labels</span>
 
+                            <div id="labels-inputs" class="menu-radios">
 
+                                <div id="show-label" class="menu-radio-show">
 
+                                    <input id="radio-labels-show" type="radio" name="labels" value="show">
 
+                                    <label for="radio-labels-show">Show</label>
 
+                                </div>
 
+                                <div id="hide-label" class="menu-radio-hide">
 
+                                    <input id="radio-labels-hide" type="radio" name="labels" value="hide">
 
+                                    <label for="radio-labels-hide">Hide</label>
 
+                                </div>
 
+                            </div>
 
+                        </div>
 
+                        <div id="share-origin" class="hidden">
 
+                            <hr>
 
+                            <div>
 
+                                <i class="icon icon-ext-link"></i>
 
+                                <div id="share-link-wrapper"></div>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="pinBottom-container">
 
+                <div class="pinBottom center">
 
+                    <div id="view-controllers">
 
+                        <!-- <div id="gui-modes-dollhouse" class="darkGlass">
 
+                                <span class="mode">{[{ DOLLHOUSE }]}</span>
 
+                            </div> -->
 
+                        <!-- <div id="gui-modes-floorplan" class="darkGlass">
 
+                                <span class="mode">{[{ FLOOR_PLAN }]}</span>
 
+                            </div> -->
 
+                    </div>
 
+                </div>
 
+                <!-- <div class="pinBottom zoomPanel">
 
+                        <div id="gui-zoomin" class="buttonZoom buttonZoomIn buttonZoomEnabled" data-placement="top">
 
+                            <div class="buttonZoomContent">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ ZOOM_IN }]}" class="icon icon-plus"></i>
 
+                                </a>
 
+                            </div>
 
+                        </div>
 
+                        <div id="gui-zoomout" class="buttonZoom buttonZoomOut buttonZoomEnabled" data-placement="top">
 
+                            <div class="buttonZoomContent">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ ZOOM_OUT }]}" class="icon icon-minus"></i>
 
+                                </a>
 
+                            </div>
 
+                        </div>
 
+                    </div> -->
 
+                <div class="pinBottom left">
 
+                    <div class="viewContainer">
 
+                        <!-- <div id="pullTab" class="ui-icon darkGlass">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ OPEN_HIGHLIGHTS }]}" class="icon icon-dpad-up"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <div id="previous" class="previous desktop-only ui-icon" style="display: none;">
 
+                            <a>
 
+                                <img rel="tooltip" src="images/play.png" width="24" height="24"
 
+                                    data-original-title="播放">
 
+                            </a>
 
+                        </div>
 
+                        <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放" >
 
+                            <a>
 
+                                <img   src="images/play.png" width="24" height="24" >
 
+                            </a>
 
+                        </div>
 
+                        <div id="pause" class="ui-icon" style="display: none;"  >
 
+                            <a>
 
+                                <img rel="tooltip" title="暂停" src="images/pause.png" width="24" height="24"  >
 
+                            </a>
 
+                        </div>
 
+                        <div id="next" class="next desktop-only ui-icon wide" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="" class="icon icon-dpad-right" data-original-title="下一个"></i>
 
+                            </a>
 
+                        </div>
 
+                        <!-- <div id="gui-modes-inside" class="ui-icon">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ EXPLORE_3D_SPACE }]}" class="icon icon-inside"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <!-- <div id="gui-modes-outside" class="ui-icon">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ VIEW_DOLLHOUSE }]}" class="icon icon-dollhouse"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <div id="gui-modes-map" class="ui-icon double active">
 
+                            <div data-original-title="导览" id="pullTab" rel="tooltip" title="">
 
+                                <img class="icon icon-inside" src="images/auto.png" title="导览" />
 
+                            </div>
 
+                            <div data-original-title="热点列表" id="hotList" rel="tooltip" title="" style="display: none">
 
+                                <img class="icon icon-inside" src="images/hotlist.png" title="热点列表" />
 
+                            </div>
 
+                            <div data-original-title="全景漫游" id="gui-modes-inside" rel="tooltip" title="" class="">
 
+                                <img class="icon icon-inside" src="images/inside.png" title="全景漫游" />
 
+                            </div>
 
+                            <div data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip" title="" class="">
 
+                                <img class="icon icon-inside" src="images/dollhouse.png" title="迷你模型" />
 
+                            </div>
 
+                            <div data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="">
 
+                                <img class="icon icon-inside" src="images/floor.png" title="俯视图" />
 
+                            </div>
 
+                            <div data-original-title="VR" id="vr" rel="tooltip" title="" style="display: none;">
 
+                                <img class="icon icon-inside" src="images/VR.png" title="VR" />
 
+                            </div>
 
+                            <div data-original-title="消除外壳" id="gui-remove-face" rel="tooltip" title=""
 
+                                style="display: none; float: left;">
 
+                                <img class="icon icon-inside" src="images/face.jpg"  />
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div class="pinBottom right hideTarget">
 
+                    <div class="rightViewContainer clearfix">
 
+                        <div class="gui-floor">
 
+                            <div class="gui-floor-title"></div>
 
+                            <div class="gui-floor-icon"><span class="gui-floor-number"></span></div>
 
+                            <!-- <i class="icon icon-dpad-up"></i> -->
 
+                            <div class="container"></div>
 
+                        </div>
 
+                        <div id="volume" class="ui-icon wide">
 
+                            <a>
 
+                                <img src="images/Volume btn_on.png" width="24" height="24">
 
+                            </a>
 
+                        </div>
 
+                        <div id="vr" class="ui-icon wide hidden" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="{[{ VIEW_IN_VR }]}" class="icon icon-webvr"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="sharing" class="ui-icon wide hidden" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="{[{ SOCIAL_SHARING }]}" class="icon icon-share"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="gui-fullscreen" class="ui-icon wide" data-placement="top" rel="tooltip"
 
+                            title="{[{ VIEW_FULLSCREEN }]}">
 
+                            <a>
 
+                                <i class="icon icon-fullscreen"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="gui-fullscreen-exit" class="ui-icon wide" data-placement="top" rel="tooltip"
 
+                            title="{[{ EXIT_FULLSCREEN }]}" style="display: none;">
 
+                            <a>
 
+                                <i class="icon icon-fullscreen-exit"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div class="pull-right terms terms2">
 
+                            <a>{[{ TERMS }]}</a>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="drawer-container">
 
+                <div id="drawer" class="fullWidth">
 
+                    <div class="frame-container darkGlass">
 
+                        <div id="scrollFrame" class="frame">
 
+                            <ul id="thumb-container" class="slidee"></ul>
 
+                        </div>
 
+                        <div class="scrollbar" id="scroller">
 
+                            <div class="handle"></div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div id="playHead">
 
+                    <div id="status">
 
+                        <span class="curIdx">1</span>
 
+                        of <span class="totalSteps"></span>
 
+                    </div>
 
+                    <div id="progressBar"></div>
 
+                </div>
 
+            </div>
 
+            <div id="myCompany" >
 
+                <img src="./images/btm_logo.png" alt="">
 
+                <span>提供技术支持</span>
 
+            </div>
 
+        </div>
 
+        <div class="webvr-popup" style="display:none">
 
+            <div class="messaging">
 
+                <div class="page p1">
 
+                    <div class="title">{[{ WEBVR_FOR_DAYDREAM }]}</div>
 
+                    <img class="image device-headset-side">
 
+                    <div class="enter-button">{[{ WEBVR_ENTER_WEBVR }]}</div>
 
+                    <span class="hrule"></span>
 
+                    <div class="alt-help">
 
+                        <span class="open-with-app">{[{ VR_APP_OPEN }]}</span>
 
+                    </div>
 
+                </div>
 
+                <div class="page p2 hidden">
 
+                    <div class="title">{[{ VR_WHAT_YOU_NEED }]}</div>
 
+                    <ul class="tabs">
 
+                        <li class="tabbutton" id="tabcardboard">{[{ VR_GOOGLE_CARDBOARD }]}</li>
 
+                        <li class="tabbutton" id="tabdaydream">{[{ VR_GOOGLE_DAYDREAM }]}</li>
 
+                        <li class="tabbutton" id="tabnative">{[{ VR_APP }]}</li>
 
+                    </ul>
 
+                    <div class="tab-content webvr">
 
+                        <img class="image device-headset">
 
+                        <span class="detail headset">
 
+                            <u>{[{ VR_GOOGLE_CARDBOARD }]}</u>
 
+                        </span>
 
+                        <img class="image device-phone">
 
+                        <span class="detail phone">
 
+                            <p>
 
+                                <b>
 
+                                    <u>{[{ VR_COMPATIBLE_ANDROID }]}</u>
 
+                                </b>
 
+                            </p>
 
+                            <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                        </span>
 
+                        <div class="detail daydream-label">{[{ VR_NEED_DAYDREAM }]}</div>
 
+                    </div>
 
+                    <div class="tab-content native hidden">
 
+                        <div class="badge-label">{[{ VR_APP_FOR_ANDROID }]}</div>
 
+                        <span>
 
+                            <img class="image badge-cardboard">
 
+                            <img class="image badge-oculus">
 
+                        </span>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+            <div class="footer">
 
+                <div class="help">
 
+                    <a>{[{ HELP }]}</a>
 
+                </div>
 
+                <div>|</div>
 
+                <div class="terms">
 
+                    <a>{[{ MATTERPORT_TERMS }]}</a>
 
+                </div>
 
+                <!-- <img src="images/glyph.svg"> -->
 
+            </div>
 
+        </div>
 
+        <div id="gui-spinner" style="display: none;">
 
+            <div class="gui-spinner-icon"></div>
 
+        </div>
 
+        <div id="gui-message" class="message-outer darkGlass" style="display: none;">
 
+            <h2 class="model-title"></h2>
 
+            <div class="message-inner">
 
+                <div class="message-content">
 
+                    <a id="button-play">
 
+                        <i class="icon icon-play"></i>
 
+                    </a>
 
+                    <div class="explore">{[{ EXPLORE_3D_SPACE }]}</div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="share-modal" style="display: none;">
 
+            <div class="title">{[{ SOCIAL_SHARING }]}</div>
 
+            <div id="share-outer">
 
+                <div class="share-to">{[{ SHARE_TO }]}</div>
 
+                <div class="share-images">
 
+                    <a id="facebook-share">
 
+                        <div class="share-button">
 
+                            <span class="faceBookLink">
 
+                                <i class="icon icon-facebook"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                    <a id="twitter-share">
 
+                        <div class="share-button">
 
+                            <span class="twitterLink">
 
+                                <i class="icon icon-twitter"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                    <a id="mail-share">
 
+                        <div class="share-button">
 
+                            <span class="mailLink">
 
+                                <i class="icon icon-email"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                </div>
 
+                <div class="direct-link">{[{ SHARE_LINK }]}</div>
 
+                <div id="share-url">
 
+                    <span id="share-url-text"></span>
 
+                </div>
 
+                <div id="copy-success" class="hidden">
 
+                    <span id="copy-success-text">{[{ SHARE_COPIED }]}</span>
 
+                </div>
 
+            </div>
 
+            <div id="share-close" class="close">
 
+                <i class="icon icon-close"></i>
 
+            </div>
 
+        </div>
 
+        <div id="terms-modal" class="fadeOut" style="display: none;">
 
+            <div id="terms-text"></div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+        </div>
 
+        <div class="gui-error message-outer" style="display: none;">
 
+            <div class="message-inner">
 
+                <div class="message-content">
 
+                    <div class="error-problem-text"></div>
 
+                    <div class="error-solution-text"></div>
 
+                    <div class="error-explanation"></div>
 
+                    <div class="error-actions"></div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="help-dialog" class="nav-help-dialog" style="display: none;">
 
+            <div class="nav-help-elements">
 
+                <div class="help-tabs">
 
+                    <div class="navigation-tab">
 
+                        <span>{[{ HELP_NAVIGATION_TAB }]}</span>
 
+                    </div>
 
+                    <div class="more-help-tab">
 
+                        <span>{[{ HELP_MORE_HELP_TAB }]}</span>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="navigation-help-wrapper">
 
+                <div id="navigation-help" class="help outer">
 
+                    <div class="interactions left">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                    <div class="interactions middle">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                    <div class="interactions right">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="more-help-wrapper">
 
+                <div id="more-help">
 
+                    <div class="ui-instructions more-help-hlr">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-tour">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-dollhouse">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-inside">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-360">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-floors">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-tag">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-vr">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-fullscreen">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-zoom">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+        </div>
 
+        <div id="vr-modal" class="vr-popup" style="display: none;">
 
+            <div class="title">{[{ VR_VIEW_SPACE }]}</div>
 
+            <div class="outer">
 
+                <div class="inner">
 
+                    <h3 class="vr-popup-title">
 
+                        <span class="show-supported p1">
 
+                            <p class="center">{[{ VR_SHOW_SUPPORTED }]}</p>
 
+                        </span>
 
+                        <span class="show-unsupported p1">{[{ VR_SHOW_UNSUPPORTED }]}</span>
 
+                        <span class="show-ios p1">
 
+                            {[{ VR_SHOW_IOS_1 }]}<br>
 
+                            <br>
 
+                        </span>
 
+                        <span class="show-ios p2">{[{ VR_WHAT_YOU_NEED }]}</span>
 
+                    </h3>
 
+                    <div class="vr-images">
 
+                        <div class="img-container cardboard first">
 
+                            <img class="vr-sm-image first">
 
+                            <div class="vr-img-caption first">
 
+                                <span class="show-supported show-desktop show-ios p1">
 
+                                    <b class="cardboard">{[{ VR_GOOGLE_CARDBOARD }]}</b>
 
+                                    <b class="gearvr hidden">{[{ VR_SAMSUNG_GEAR_VR }]}</b>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported show-desktop p2">{[{ VR_NEED_CARDBOARD
 
+                                    }]}</span>
 
+                                <span class="show-supported show-unsupported show-desktop p3">{[{ VR_NEED_SAMSUNG
 
+                                    }]}</span>
 
+                                <span class="show-ios p2">
 
+                                    <b>{[{ VR_GOOGLE_CARDBOARD }]}</b>
 
+                                    <br>
 
+                                    <br>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                        <div class="front-close">
 
+                            <span class="front-close-x">&#x2715;</span>
 
+                        </div>
 
+                        <div class="img-container gearvr second">
 
+                            <img class="vr-sm-image second">
 
+                            <div class="vr-img-caption second">
 
+                                <span class="show-supported show-desktop p1">
 
+                                    <b>{[{ VR_SAMSUNG_GEAR_VR }]}</b>
 
+                                </span>
 
+                                <span class="show-supported p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_ANDROID }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-desktop p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_IPHONES_1 }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_COMPATIBLE_IPHONES_2 }]}</p>
 
+                                </span>
 
+                                <span class="show-ios p2">
 
+                                    <p>
 
+                                        <b b id="vr-compatible-iphones-3">{[{ VR_COMPATIBLE_IPHONES_3 }]}</b>
 
+                                    </p>
 
+                                    <p id="vr-compatible-iphones-2b">{[{ VR_COMPATIBLE_IPHONES_2 }]}</p>
 
+                                </span>
 
+                                <span class="show-unsupported p1 p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_ANDROID }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported show-desktop p3">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_SAMSUNG }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_SAMSUNG_DETAIL }]}</p>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                        <div class="img-container third">
 
+                            <img class="vr-sm-image third">
 
+                            <div class="vr-img-caption third">
 
+                                <span class="show-supported show-unsupported show-ios p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_APP_FOR_CARDBOARD }]}</b>
 
+                                    </p>
 
+                                    <p>
 
+                                        <a class="cardboardLink">{[{ VR_DOWNLOAD_HERE }]}</a>
 
+                                    </p>
 
+                                </span>
 
+                                <span class="show-desktop p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_ANDROID_DVICES }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported p3">
 
+                                    <p>
 
+                                        <b>{[{ VR_APP_FOR_SAMSUNG }]}</b>
 
+                                    </p>
 
+                                    <p>
 
+                                        <a class="gearLink">{[{ VR_DOWNLOAD_HERE }]}</a>
 
+                                    </p>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                    <div class="vr-popup-body">
 
+                        <span class="show-supported p1">
 
+                            <p>
 
+                                <i>{[{ VR_REQUIRE_HEADSET }]}</i>
 
+                            </p>
 
+                            <br>
 
+                            <p>
 
+                                <i>{[{ VR_REDIRECT_TO_STORE }]}</i>
 
+                            </p>
 
+                            <br>
 
+                            <p class="improper-embed hidden">
 
+                                <i>{[{ VR_IMPROPER_EMBED }]}</i>
 
+                            </p>
 
+                        </span>
 
+                        <span class="show-ios p1">
 
+                            <p>
 
+                                <i id="show-ios-2">{[{ VR_SHOW_IOS_2 }]}</i>
 
+                            </p>
 
+                        </span>
 
+                        <span class="show-desktop p1">
 
+                            <p></p>
 
+                            <h3>{[{ VR_OPEN_ANDROID_LINK }]}</h3>
 
+                            <p>
 
+                                <br>
 
+                            </p>
 
+                            <p class="logo-button">
 
+                                <span class="modelLink"></span>
 
+                            </p>
 
+                            <br>
 
+                            <br>
 
+                            <p></p>
 
+                            <h3>{[{ VR_ANDROID_OPTIONS }]}</h3>
 
+                            <p></p>
 
+                        </span>
 
+                    </div>
 
+                </div>
 
+                <div class="vr-buttons">
 
+                    <div class="next-button"></div>
 
+                    <div class="prev-button">{[{ VR_PREVIOUS_CAPS }]}</div>
 
+                    <div class="vr-arrows prev-container">
 
+                        <!-- <img class="prev-arrow" src="images/arrow.png"> -->
 
+                    </div>
 
+                    <div class="vr-arrows next-container">
 
+                        <!-- <img class="next-arrow" src="images/arrow.png"> -->
 
+                    </div>
 
+                </div>
 
+                <div class="vr-page"></div>
 
+                <div class="close">
 
+                    <a>
 
+                        <i class="icon icon-close"></i>
 
+                    </a>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="quick-blackout" class="quick" style="display: none;"></div>
 
+        <div id="quick-logo" class="quick-brand" style="display: none;">
 
+            <!-- <img src="images/powered-by-4dage.svg"> -->
 
+        </div>
 
+        <div id="hover-top" class="hover-row" style="display: none;"></div>
 
+        <div id="hover-bottom" class="hover-row" style="display: none;"></div>
 
+        <div id="call-to-action">
 
+            <div id="pause-overlay" style="display: none;">
 
+                <div id="pause-icon">
 
+                    <a>
 
+                        <i class="icon icon-pause"></i>
 
+                    </a>
 
+                </div>
 
+            </div>
 
+            <div id="interaction-modal">
 
+                <div id="interaction-modal-inner">
 
+                    <!-- <div class="tour-title">
 
+                            <span class="desktop-title">{[{ DESKTOP_SHORT_CTA }]}</span>
 
+                            <span class="mobile-title">{[{ MOBILE_SHORT_CTA }]}</span>
 
+                        </div>
 
+                        <div class="interaction left">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div>
 
+                        <div class="interaction middle">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div>
 
+                        <div class="interaction right">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div> -->
 
+                    <div class="nav-icon">
 
+                        <img src="images/pc_step1.png" class="icon" title="导览" data-page="1">
 
+                        <div class="nav-help-button">
 
+                            <div class="next-button nav-help-page" data-id="plus"></div>
 
+                            <div class="prev-button nav-help-page"></div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="tag-billboards" style="display: none;"></div>
 
+
 
+        <div class="cad">
 
+            <div id="cad"></div>
 
+        </div>
 
+        
+    </div>
 
+
 
+    <script>
 
+        
+        var iframe = document.getElementById("myifr");
 
+        if (window.innerWidth < 700) {
 
+            iframe.height = '20%';
 
+            iframe.width = '20%';
 
+        }
 
+        window.addEventListener("message", function (msg) {
 
+            iframe.width = msg.data + "%";
 
+        });
 
+    </script>
 
+   
+    <script>
 
+     
+        var changeLog = ()=>{
 
+
 
+            let logLevel = 1
 
+        
+           if((number == "TEST" || browser.valueFromHash('test')) && browser.isMobile()){
 
+                var textarea = document.createElement('textarea');
 
+                  textarea.id = "consoleLog";
 
+
 
+                  document.getElementsByTagName("body")[0].appendChild(textarea);
 
+                  var list = ["log", "error", "warn", "debug", "info", "time", "timeEnd"]
 
+                  var exchange = function (o) {
 
+                    console["old" + o] = console[o];
 
+                    console[o] = function (str ) {
 
+                        console["old" + o].apply(this, arguments)
 
+                        if(logLevel){
 
+                            if(o != 'error' && logLevel != str.level){
 
+                                return  
+                            }
 
+                            if(str.str) str = str.str
 
+                        }
 
+                        
+                        var args = Array.from(arguments)
 
+                       
+                        var str = ''
 
+                        args.forEach(a=>{
 
+                            str += a + ','
 
+                        })
 
+                        textarea.innerHTML = str + "\n\n" + textarea.innerHTML;
 
+                    
+                      /*console["old" + o](str);
 
+                      var t = document.getElementById("consoleLog").innerHTML;
 
+                      document.getElementById("consoleLog").innerHTML = str + "\n\n" + t;*/
 
+                    }
 
+                  }
 
+
 
+                  for (var i = 0; i < list.length; i++) {
 
+                    exchange(list[i])
 
+                  } 
+           
+            }   
+        }
 
+    </script>
 
+    
+
 
+   
+   
+   
+   
+   
+    <script src="js/lib/jquery-2.1.1.min.js" class="build keep"></script>
 
+    <script src="js/lib/player-0.0.12.min.js" class="build keep"></script>
 
+   
+    <!-- <script src="js/lib/video.min.js" class="build keep"></script> -->
 
+    <script src="js/lib/Tween.js"></script>
 
+    <!-- <script src="js/app-preheater.js?v=2.25.6-0-gd87e5b1"></script> --> 
+    <script src="js/SpecialScene.js"></script>
 
+    
+    
+    <script src="js/manage.js"></script> 
+    <!-- <script src="js/lib/stats.min.js"></script> -->
 
+    <script src="js/Hot.js?m=1"></script>  
+    <script src="js/main_2020_show.js"></script>
 
+    <script src="js/lib/OBJLoader.js"></script>
 
+    <script src="/CAD/bundle.js"></script> 
+    <script src="js/loadCAD.js"></script>
 
+    <script id='flvJs' type='text/javascript' ></script>
 
+    <script>
 
+         /*if(window.browser.detectAndroidMobile()){
 
+            let scriptdom = document.querySelector('#flvJs')
 
+            //scriptdom.setAttribute('src','js/lib/flv.min.js')
 
+            scriptdom.setAttribute('type','text/javascript')
 
+            scriptdom.src = 'js/lib/flv.min.js'
 
+         }*/
 
+          
+    
+    </script>
 
+</body>
 
+
 
+</html>

BIN
searchGuide/img/icon/close.png
View File


BIN
searchGuide/img/icon/search.png
View File


BIN
searchGuide/img/yb/yb.png
View File


+ 917 - 0
searchGuide/index.html
View File 

@@ -0,0 +1,917 @@
 
+<!doctype html>
 
+<html>
 
+
 
+<head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 
+    <title></title>
 
+    <meta name="description" content="四维时代">
 
+    <meta property="og:title" content="四维时代">
 
+    <meta property="og:description" content="四维时代">
 
+    <meta property="og:image:type" content="image/jpg">
 
+    <link rel="icon" type="image/png" sizes="32x32" href="images/icons/favicon.png" class="keep">
 
+    <link rel="stylesheet" href="css/oldVer/main0.css">
 
+    <link rel="stylesheet" href="css/main.css?v=2.25">
 
+    <!-- <link rel="stylesheet" href="/CAD/cad.css?v=2.25"> -->
 
+    <script>
 
+        var number = window.location.href.substring(window.location.href.indexOf("=") + 1);
 
+        if (number.indexOf("&") != -1) {
 
+            number = number.substring(0, number.indexOf("&"));
 
+        }
 
+        if (number.indexOf("#") != -1) {
 
+            number = number.substring(0, number.indexOf("#"));
 
+        } 
+    </script>
 
+    <script>
 
+        var _hmt = _hmt || [];
 
+        (function() {
 
+          var hm = document.createElement("script");
 
+          hm.src = "https://hm.baidu.com/hm.js?73402bb08ff95cb21b7f1673250c532d";
 
+          var s = document.getElementsByTagName("script")[0]; 
+          s.parentNode.insertBefore(hm, s);
 
+        })();
 
+    </script>
 
+    <script class="build keep">
 
+        if (window.performance) {
 
+            window.navigationStart = window.performance.timing.navigationStart;
 
+        } else {
 
+            window.navigationStart = Date.now() + 300;
 
+        } 
+        
+    </script>
 
+
 
+
 
+    <style>
 
+        #consoleLog{ 
+          width: 200px;
 
+          height: 250px;
 
+          position: absolute;
 
+          right: 0px;
 
+          bottom: 100px;
 
+          z-index: 999999;
 
+          color: black;
 
+          opacity: 0.9;
 
+            font-size: 10px;
 
+        }
 
+
 
+        iframe {
 
+            position: absolute;
 
+            bottom: 100px;
 
+            right: 10px;
 
+            z-index: 1000;
 
+        }
 
+        @media screen and (max-width: 700px) {
 
+            iframe {
 
+                right: 0px;
 
+            }
 
+        }
 
+    
+    </style>
 
+</head>
 
+
 
+<body>
 
+    <!-- 小人指引搜索 -->
 
+    <iframe
 
+        src="./searchGuide/searchGuide.html"
 
+        frameborder="0"
 
+        id="myifr"
 
+        width="10%"
 
+        height="30%"
 
+    ></iframe>
 
+    <div id="hot"> </div>
 
+    <div class='widgets-doll-labels'> </div> 
+    <div id="popup">
 
+        <div class="popup-content">
 
+
 
+        </div>
 
+        <div id="closepop">close</div>
 
+    </div>
 
+    <div class="sidecontent" style="width:35%">
 
+        <h1><span class="side-client-close">关闭</span></h1>
 
+        <image id="sideimg" style="width:90%" /></br>
 
+        <p id="text">
 
+        </p>
 
+    </div>
 
+    <div id="gui-thumb" style="display: none;"></div>
 
+    <div id="player" style="display: none;"></div>
 
+    <div id="gui-parent">
 
+        <div id="memory-info"
 
+            style="display:none; position:fixed; right:10px; top:10px; background-color:#eeeeee; color:#222222; padding:3px 10px 3px 10px; font-size:100%;">
 
+            GPU memory used: <span id="memory-gpu"></span>
 
+        </div>
 
+        <div id="gui-loading" class="message-outer darkGlass" style="display: none;">
 
+            <h2 class="model-title"></h2>
 
+            <div class="message-inner">
 
+                <div class="loadingLogo"> 
+                    <div class="img"> 
+                    </div> 
+                </div> 
+                <div class="progressbar" data-perc="100">
 
+                    <div class="label">
 
+                        <div class="perc">0%</div>
 
+                    </div>
 
+                    <div class="bar"><span></span></div>
 
+                </div>
 
+                <div id="loaderCoBrand">
 
+                    <div class="vert-align">
 
+                    </div>
 
+                </div>
 
+                <div class="bottom-logo">
 
+                    <div class="img"></div>
 
+                </div>
 
+                <div class="specialPower">
 
+                    <span class="powered-by">{[{ POWERED_BY }]}</span>
 
+                    &#xA0;<div class="img"></div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="gui" style="display: none;">
 
+            <div id="vrOff">
 
+                <img id="vrOffImg" src="images/vrOffImg.png" alt="">
 
+            </div>
 
+            <div id="hotListWrap">
 
+                <div id="hotListTitle">
 
+                    <div>
 
+                        <span id="hotListText">热点列表</span>
 
+                        <img id="hotListIcon" src="images/hotlist.png" alt="">
 
+                    </div>
 
+
 
+                </div>
 
+                <div id="hotListContent">
 
+                    <ul>
 
+                    </ul>
 
+                </div>
 
+                <div id="hotListBottom">
 
+                    <img id="hotListClose" src="images/hotListClose.png" alt="">
 
+                </div>
 
+            </div>
 
+            <div class="pinTop left">
 
+                <div id="model-title">
 
+                    <div class="title-row">
 
+                        <div id="title-toggle">
 
+                            <a>
 
+                                <i class="icon icon-dpad-left"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="title-container-wrapper" rel="tooltip" data-placement="bottom" data-html="true">
 
+                            <div class="title-container  meta-toggle">
 
+                                <div class="co-brand">
 
+                                    {[{ PRESENTED_BY }]}<span class="title" id="cobrandTitle"></span>
 
+                                </div>
 
+                                <div id="title-logo">
 
+                                    <i></i>
 
+                                </div>
 
+                                <div id="gui-name" class="titleText"></div>
 
+                                <a id="more-hint"><i class="icon icon-dpad-down"></i></a>
 
+                                <a id="less-hint"><i class="icon icon-dpad-up"></i></a>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div id="meta-info-wrapper">
 
+                    <div id="meta-info" class="darkGlass">
 
+                        <div id="meta-description"></div>
 
+                        <div class="contact-info">
 
+                            <i class="icon icon-user pull-left"></i>
 
+                            &#xA0;<div id="contact-data"></div>
 
+                        </div>
 
+                        <div class="address">
 
+                            <i class="icon icon-pin"></i>
 
+                            <span id="addressTxt"></span>
 
+                        </div>
 
+                        <div id="tag-toggles" class="menu-toggles hidden">
 
+                            <span>{[{ MATTERTAG_CONTENT }]}</span>
 
+                            <div id="tag-inputs" class="menu-radios">
 
+                                <div id="show-tag" class="menu-radio-show">
 
+                                    <input id="radio-tag-show" type="radio" name="tags" value="show">
 
+                                    <label for="radio-tag-show">{[{ SHOW }]}</label>
 
+                                </div>
 
+                                <div id="hide-tag" class="menu-radio-hide">
 
+                                    <input id="radio-tag-hide" type="radio" name="tags" value="hide">
 
+                                    <label for="radio-tag-hide">{[{ HIDE }]}</label>
 
+                                </div>
 
+                            </div>
 
+                        </div>
 
+                        <div id="labels-toggles" class="menu-toggles hidden">
 
+                            <span>Labels</span>
 
+                            <div id="labels-inputs" class="menu-radios">
 
+                                <div id="show-label" class="menu-radio-show">
 
+                                    <input id="radio-labels-show" type="radio" name="labels" value="show">
 
+                                    <label for="radio-labels-show">Show</label>
 
+                                </div>
 
+                                <div id="hide-label" class="menu-radio-hide">
 
+                                    <input id="radio-labels-hide" type="radio" name="labels" value="hide">
 
+                                    <label for="radio-labels-hide">Hide</label>
 
+                                </div>
 
+                            </div>
 
+                        </div>
 
+                        <div id="share-origin" class="hidden">
 
+                            <hr>
 
+                            <div>
 
+                                <i class="icon icon-ext-link"></i>
 
+                                <div id="share-link-wrapper"></div>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="pinBottom-container">
 
+                <div class="pinBottom center">
 
+                    <div id="view-controllers">
 
+                        <!-- <div id="gui-modes-dollhouse" class="darkGlass">
 
+                                <span class="mode">{[{ DOLLHOUSE }]}</span>
 
+                            </div> -->
 
+                        <!-- <div id="gui-modes-floorplan" class="darkGlass">
 
+                                <span class="mode">{[{ FLOOR_PLAN }]}</span>
 
+                            </div> -->
 
+                    </div>
 
+                </div>
 
+                <!-- <div class="pinBottom zoomPanel">
 
+                        <div id="gui-zoomin" class="buttonZoom buttonZoomIn buttonZoomEnabled" data-placement="top">
 
+                            <div class="buttonZoomContent">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ ZOOM_IN }]}" class="icon icon-plus"></i>
 
+                                </a>
 
+                            </div>
 
+                        </div>
 
+                        <div id="gui-zoomout" class="buttonZoom buttonZoomOut buttonZoomEnabled" data-placement="top">
 
+                            <div class="buttonZoomContent">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ ZOOM_OUT }]}" class="icon icon-minus"></i>
 
+                                </a>
 
+                            </div>
 
+                        </div>
 
+                    </div> -->
 
+                <div class="pinBottom left">
 
+                    <div class="viewContainer">
 
+                        <!-- <div id="pullTab" class="ui-icon darkGlass">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ OPEN_HIGHLIGHTS }]}" class="icon icon-dpad-up"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <div id="previous" class="previous desktop-only ui-icon" style="display: none;">
 
+                            <a>
 
+                                <img rel="tooltip" src="images/play.png" width="24" height="24"
 
+                                    data-original-title="播放">
 
+                            </a>
 
+                        </div>
 
+                        <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放" >
 
+                            <a>
 
+                                <img   src="images/play.png" width="24" height="24" >
 
+                            </a>
 
+                        </div>
 
+                        <div id="pause" class="ui-icon" style="display: none;"  >
 
+                            <a>
 
+                                <img rel="tooltip" title="暂停" src="images/pause.png" width="24" height="24"  >
 
+                            </a>
 
+                        </div>
 
+                        <div id="next" class="next desktop-only ui-icon wide" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="" class="icon icon-dpad-right" data-original-title="下一个"></i>
 
+                            </a>
 
+                        </div>
 
+                        <!-- <div id="gui-modes-inside" class="ui-icon">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ EXPLORE_3D_SPACE }]}" class="icon icon-inside"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <!-- <div id="gui-modes-outside" class="ui-icon">
 
+                                <a>
 
+                                    <i rel="tooltip" title="{[{ VIEW_DOLLHOUSE }]}" class="icon icon-dollhouse"></i>
 
+                                </a>
 
+                            </div> -->
 
+                        <div id="gui-modes-map" class="ui-icon double active">
 
+                            <div data-original-title="导览" id="pullTab" rel="tooltip" title="">
 
+                                <img class="icon icon-inside" src="images/auto.png" title="导览" />
 
+                            </div>
 
+                            <div data-original-title="热点列表" id="hotList" rel="tooltip" title="" style="display: none">
 
+                                <img class="icon icon-inside" src="images/hotlist.png" title="热点列表" />
 
+                            </div>
 
+                            <div data-original-title="全景漫游" id="gui-modes-inside" rel="tooltip" title="" class="">
 
+                                <img class="icon icon-inside" src="images/inside.png" title="全景漫游" />
 
+                            </div>
 
+                            <div data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip" title="" class="">
 
+                                <img class="icon icon-inside" src="images/dollhouse.png" title="迷你模型" />
 
+                            </div>
 
+                            <div data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="">
 
+                                <img class="icon icon-inside" src="images/floor.png" title="俯视图" />
 
+                            </div>
 
+                            <div data-original-title="VR" id="vr" rel="tooltip" title="" style="display: none;">
 
+                                <img class="icon icon-inside" src="images/VR.png" title="VR" />
 
+                            </div>
 
+                            <div data-original-title="消除外壳" id="gui-remove-face" rel="tooltip" title=""
 
+                                style="display: none; float: left;">
 
+                                <img class="icon icon-inside" src="images/face.jpg"  />
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div class="pinBottom right hideTarget">
 
+                    <div class="rightViewContainer clearfix">
 
+                        <div class="gui-floor">
 
+                            <div class="gui-floor-title"></div>
 
+                            <div class="gui-floor-icon"><span class="gui-floor-number"></span></div>
 
+                            <!-- <i class="icon icon-dpad-up"></i> -->
 
+                            <div class="container"></div>
 
+                        </div>
 
+                        <div id="volume" class="ui-icon wide">
 
+                            <a>
 
+                                <img src="images/Volume btn_on.png" width="24" height="24">
 
+                            </a>
 
+                        </div>
 
+                        <div id="vr" class="ui-icon wide hidden" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="{[{ VIEW_IN_VR }]}" class="icon icon-webvr"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="sharing" class="ui-icon wide hidden" style="display: none;">
 
+                            <a>
 
+                                <i rel="tooltip" title="{[{ SOCIAL_SHARING }]}" class="icon icon-share"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="gui-fullscreen" class="ui-icon wide" data-placement="top" rel="tooltip"
 
+                            title="{[{ VIEW_FULLSCREEN }]}">
 
+                            <a>
 
+                                <i class="icon icon-fullscreen"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div id="gui-fullscreen-exit" class="ui-icon wide" data-placement="top" rel="tooltip"
 
+                            title="{[{ EXIT_FULLSCREEN }]}" style="display: none;">
 
+                            <a>
 
+                                <i class="icon icon-fullscreen-exit"></i>
 
+                            </a>
 
+                        </div>
 
+                        <div class="pull-right terms terms2">
 
+                            <a>{[{ TERMS }]}</a>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="drawer-container">
 
+                <div id="drawer" class="fullWidth">
 
+                    <div class="frame-container darkGlass">
 
+                        <div id="scrollFrame" class="frame">
 
+                            <ul id="thumb-container" class="slidee"></ul>
 
+                        </div>
 
+                        <div class="scrollbar" id="scroller">
 
+                            <div class="handle"></div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div id="playHead">
 
+                    <div id="status">
 
+                        <span class="curIdx">1</span>
 
+                        of <span class="totalSteps"></span>
 
+                    </div>
 
+                    <div id="progressBar"></div>
 
+                </div>
 
+            </div>
 
+            <div id="myCompany" >
 
+                <img src="./images/btm_logo.png" alt="">
 
+                <span>提供技术支持</span>
 
+            </div>
 
+        </div>
 
+        <div class="webvr-popup" style="display:none">
 
+            <div class="messaging">
 
+                <div class="page p1">
 
+                    <div class="title">{[{ WEBVR_FOR_DAYDREAM }]}</div>
 
+                    <img class="image device-headset-side">
 
+                    <div class="enter-button">{[{ WEBVR_ENTER_WEBVR }]}</div>
 
+                    <span class="hrule"></span>
 
+                    <div class="alt-help">
 
+                        <span class="open-with-app">{[{ VR_APP_OPEN }]}</span>
 
+                    </div>
 
+                </div>
 
+                <div class="page p2 hidden">
 
+                    <div class="title">{[{ VR_WHAT_YOU_NEED }]}</div>
 
+                    <ul class="tabs">
 
+                        <li class="tabbutton" id="tabcardboard">{[{ VR_GOOGLE_CARDBOARD }]}</li>
 
+                        <li class="tabbutton" id="tabdaydream">{[{ VR_GOOGLE_DAYDREAM }]}</li>
 
+                        <li class="tabbutton" id="tabnative">{[{ VR_APP }]}</li>
 
+                    </ul>
 
+                    <div class="tab-content webvr">
 
+                        <img class="image device-headset">
 
+                        <span class="detail headset">
 
+                            <u>{[{ VR_GOOGLE_CARDBOARD }]}</u>
 
+                        </span>
 
+                        <img class="image device-phone">
 
+                        <span class="detail phone">
 
+                            <p>
 
+                                <b>
 
+                                    <u>{[{ VR_COMPATIBLE_ANDROID }]}</u>
 
+                                </b>
 
+                            </p>
 
+                            <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                        </span>
 
+                        <div class="detail daydream-label">{[{ VR_NEED_DAYDREAM }]}</div>
 
+                    </div>
 
+                    <div class="tab-content native hidden">
 
+                        <div class="badge-label">{[{ VR_APP_FOR_ANDROID }]}</div>
 
+                        <span>
 
+                            <img class="image badge-cardboard">
 
+                            <img class="image badge-oculus">
 
+                        </span>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+            <div class="footer">
 
+                <div class="help">
 
+                    <a>{[{ HELP }]}</a>
 
+                </div>
 
+                <div>|</div>
 
+                <div class="terms">
 
+                    <a>{[{ MATTERPORT_TERMS }]}</a>
 
+                </div>
 
+                <!-- <img src="images/glyph.svg"> -->
 
+            </div>
 
+        </div>
 
+        <div id="gui-spinner" style="display: none;">
 
+            <div class="gui-spinner-icon"></div>
 
+        </div>
 
+        <div id="gui-message" class="message-outer darkGlass" style="display: none;">
 
+            <h2 class="model-title"></h2>
 
+            <div class="message-inner">
 
+                <div class="message-content">
 
+                    <a id="button-play">
 
+                        <i class="icon icon-play"></i>
 
+                    </a>
 
+                    <div class="explore">{[{ EXPLORE_3D_SPACE }]}</div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="share-modal" style="display: none;">
 
+            <div class="title">{[{ SOCIAL_SHARING }]}</div>
 
+            <div id="share-outer">
 
+                <div class="share-to">{[{ SHARE_TO }]}</div>
 
+                <div class="share-images">
 
+                    <a id="facebook-share">
 
+                        <div class="share-button">
 
+                            <span class="faceBookLink">
 
+                                <i class="icon icon-facebook"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                    <a id="twitter-share">
 
+                        <div class="share-button">
 
+                            <span class="twitterLink">
 
+                                <i class="icon icon-twitter"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                    <a id="mail-share">
 
+                        <div class="share-button">
 
+                            <span class="mailLink">
 
+                                <i class="icon icon-email"></i>
 
+                            </span>
 
+                        </div>
 
+                    </a>
 
+                </div>
 
+                <div class="direct-link">{[{ SHARE_LINK }]}</div>
 
+                <div id="share-url">
 
+                    <span id="share-url-text"></span>
 
+                </div>
 
+                <div id="copy-success" class="hidden">
 
+                    <span id="copy-success-text">{[{ SHARE_COPIED }]}</span>
 
+                </div>
 
+            </div>
 
+            <div id="share-close" class="close">
 
+                <i class="icon icon-close"></i>
 
+            </div>
 
+        </div>
 
+        <div id="terms-modal" class="fadeOut" style="display: none;">
 
+            <div id="terms-text"></div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+        </div>
 
+        <div class="gui-error message-outer" style="display: none;">
 
+            <div class="message-inner">
 
+                <div class="message-content">
 
+                    <div class="error-problem-text"></div>
 
+                    <div class="error-solution-text"></div>
 
+                    <div class="error-explanation"></div>
 
+                    <div class="error-actions"></div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="help-dialog" class="nav-help-dialog" style="display: none;">
 
+            <div class="nav-help-elements">
 
+                <div class="help-tabs">
 
+                    <div class="navigation-tab">
 
+                        <span>{[{ HELP_NAVIGATION_TAB }]}</span>
 
+                    </div>
 
+                    <div class="more-help-tab">
 
+                        <span>{[{ HELP_MORE_HELP_TAB }]}</span>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="navigation-help-wrapper">
 
+                <div id="navigation-help" class="help outer">
 
+                    <div class="interactions left">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                    <div class="interactions middle">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                    <div class="interactions right">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <hr>
 
+                        <div class="bottom-info"></div>
 
+                        <img class="keyboard">
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div id="more-help-wrapper">
 
+                <div id="more-help">
 
+                    <div class="ui-instructions more-help-hlr">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-tour">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-dollhouse">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-inside">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-360">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-floors">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-tag">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-vr">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-fullscreen">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                    <div class="ui-instructions more-help-zoom">
 
+                        <h2 class="top-info"></h2>
 
+                        <img class="big-image">
 
+                        <div class="bottom-info"></div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+            <div class="close">
 
+                <a>
 
+                    <i class="icon icon-close"></i>
 
+                </a>
 
+            </div>
 
+        </div>
 
+        <div id="vr-modal" class="vr-popup" style="display: none;">
 
+            <div class="title">{[{ VR_VIEW_SPACE }]}</div>
 
+            <div class="outer">
 
+                <div class="inner">
 
+                    <h3 class="vr-popup-title">
 
+                        <span class="show-supported p1">
 
+                            <p class="center">{[{ VR_SHOW_SUPPORTED }]}</p>
 
+                        </span>
 
+                        <span class="show-unsupported p1">{[{ VR_SHOW_UNSUPPORTED }]}</span>
 
+                        <span class="show-ios p1">
 
+                            {[{ VR_SHOW_IOS_1 }]}<br>
 
+                            <br>
 
+                        </span>
 
+                        <span class="show-ios p2">{[{ VR_WHAT_YOU_NEED }]}</span>
 
+                    </h3>
 
+                    <div class="vr-images">
 
+                        <div class="img-container cardboard first">
 
+                            <img class="vr-sm-image first">
 
+                            <div class="vr-img-caption first">
 
+                                <span class="show-supported show-desktop show-ios p1">
 
+                                    <b class="cardboard">{[{ VR_GOOGLE_CARDBOARD }]}</b>
 
+                                    <b class="gearvr hidden">{[{ VR_SAMSUNG_GEAR_VR }]}</b>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported show-desktop p2">{[{ VR_NEED_CARDBOARD
 
+                                    }]}</span>
 
+                                <span class="show-supported show-unsupported show-desktop p3">{[{ VR_NEED_SAMSUNG
 
+                                    }]}</span>
 
+                                <span class="show-ios p2">
 
+                                    <b>{[{ VR_GOOGLE_CARDBOARD }]}</b>
 
+                                    <br>
 
+                                    <br>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                        <div class="front-close">
 
+                            <span class="front-close-x">&#x2715;</span>
 
+                        </div>
 
+                        <div class="img-container gearvr second">
 
+                            <img class="vr-sm-image second">
 
+                            <div class="vr-img-caption second">
 
+                                <span class="show-supported show-desktop p1">
 
+                                    <b>{[{ VR_SAMSUNG_GEAR_VR }]}</b>
 
+                                </span>
 
+                                <span class="show-supported p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_ANDROID }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-desktop p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_IPHONES_1 }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_COMPATIBLE_IPHONES_2 }]}</p>
 
+                                </span>
 
+                                <span class="show-ios p2">
 
+                                    <p>
 
+                                        <b b id="vr-compatible-iphones-3">{[{ VR_COMPATIBLE_IPHONES_3 }]}</b>
 
+                                    </p>
 
+                                    <p id="vr-compatible-iphones-2b">{[{ VR_COMPATIBLE_IPHONES_2 }]}</p>
 
+                                </span>
 
+                                <span class="show-unsupported p1 p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_ANDROID }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported show-desktop p3">
 
+                                    <p>
 
+                                        <b>{[{ VR_COMPATIBLE_SAMSUNG }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_SAMSUNG_DETAIL }]}</p>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                        <div class="img-container third">
 
+                            <img class="vr-sm-image third">
 
+                            <div class="vr-img-caption third">
 
+                                <span class="show-supported show-unsupported show-ios p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_APP_FOR_CARDBOARD }]}</b>
 
+                                    </p>
 
+                                    <p>
 
+                                        <a class="cardboardLink">{[{ VR_DOWNLOAD_HERE }]}</a>
 
+                                    </p>
 
+                                </span>
 
+                                <span class="show-desktop p2">
 
+                                    <p>
 
+                                        <b>{[{ VR_ANDROID_DVICES }]}</b>
 
+                                    </p>
 
+                                    <p>{[{ VR_ANDROID_DETAIL }]}</p>
 
+                                </span>
 
+                                <span class="show-supported show-unsupported p3">
 
+                                    <p>
 
+                                        <b>{[{ VR_APP_FOR_SAMSUNG }]}</b>
 
+                                    </p>
 
+                                    <p>
 
+                                        <a class="gearLink">{[{ VR_DOWNLOAD_HERE }]}</a>
 
+                                    </p>
 
+                                </span>
 
+                            </div>
 
+                        </div>
 
+                    </div>
 
+                    <div class="vr-popup-body">
 
+                        <span class="show-supported p1">
 
+                            <p>
 
+                                <i>{[{ VR_REQUIRE_HEADSET }]}</i>
 
+                            </p>
 
+                            <br>
 
+                            <p>
 
+                                <i>{[{ VR_REDIRECT_TO_STORE }]}</i>
 
+                            </p>
 
+                            <br>
 
+                            <p class="improper-embed hidden">
 
+                                <i>{[{ VR_IMPROPER_EMBED }]}</i>
 
+                            </p>
 
+                        </span>
 
+                        <span class="show-ios p1">
 
+                            <p>
 
+                                <i id="show-ios-2">{[{ VR_SHOW_IOS_2 }]}</i>
 
+                            </p>
 
+                        </span>
 
+                        <span class="show-desktop p1">
 
+                            <p></p>
 
+                            <h3>{[{ VR_OPEN_ANDROID_LINK }]}</h3>
 
+                            <p>
 
+                                <br>
 
+                            </p>
 
+                            <p class="logo-button">
 
+                                <span class="modelLink"></span>
 
+                            </p>
 
+                            <br>
 
+                            <br>
 
+                            <p></p>
 
+                            <h3>{[{ VR_ANDROID_OPTIONS }]}</h3>
 
+                            <p></p>
 
+                        </span>
 
+                    </div>
 
+                </div>
 
+                <div class="vr-buttons">
 
+                    <div class="next-button"></div>
 
+                    <div class="prev-button">{[{ VR_PREVIOUS_CAPS }]}</div>
 
+                    <div class="vr-arrows prev-container">
 
+                        <!-- <img class="prev-arrow" src="images/arrow.png"> -->
 
+                    </div>
 
+                    <div class="vr-arrows next-container">
 
+                        <!-- <img class="next-arrow" src="images/arrow.png"> -->
 
+                    </div>
 
+                </div>
 
+                <div class="vr-page"></div>
 
+                <div class="close">
 
+                    <a>
 
+                        <i class="icon icon-close"></i>
 
+                    </a>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="quick-blackout" class="quick" style="display: none;"></div>
 
+        <div id="quick-logo" class="quick-brand" style="display: none;">
 
+            <!-- <img src="images/powered-by-4dage.svg"> -->
 
+        </div>
 
+        <div id="hover-top" class="hover-row" style="display: none;"></div>
 
+        <div id="hover-bottom" class="hover-row" style="display: none;"></div>
 
+        <div id="call-to-action">
 
+            <div id="pause-overlay" style="display: none;">
 
+                <div id="pause-icon">
 
+                    <a>
 
+                        <i class="icon icon-pause"></i>
 
+                    </a>
 
+                </div>
 
+            </div>
 
+            <div id="interaction-modal">
 
+                <div id="interaction-modal-inner">
 
+                    <!-- <div class="tour-title">
 
+                            <span class="desktop-title">{[{ DESKTOP_SHORT_CTA }]}</span>
 
+                            <span class="mobile-title">{[{ MOBILE_SHORT_CTA }]}</span>
 
+                        </div>
 
+                        <div class="interaction left">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div>
 
+                        <div class="interaction middle">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div>
 
+                        <div class="interaction right">
 
+                            <h2 class="top-info"></h2>
 
+                            <img class="big-image">
 
+                            <hr>
 
+                            <img class="keyboard">
 
+                        </div> -->
 
+                    <div class="nav-icon">
 
+                        <img src="images/pc_step1.png" class="icon" title="导览" data-page="1">
 
+                        <div class="nav-help-button">
 
+                            <div class="next-button nav-help-page" data-id="plus"></div>
 
+                            <div class="prev-button nav-help-page"></div>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+        <div id="tag-billboards" style="display: none;"></div>
 
+
 
+        <div class="cad">
 
+            <div id="cad"></div>
 
+        </div>
 
+        
+    </div>
 
+
 
+    <script>
 
+    
+        var iframe = document.getElementById("myifr");
 
+        window.onresize = () => {
 
+            return (() => {
 
+                if (window.innerWidth < 700) {
 
+                    iframe.height = "20%";
 
+                    iframe.width = "20%";
 
+                }else {
 
+                    iframe.height = "30%";
 
+                    iframe.width = "10%";
 
+                }
 
+            })()
 
+        }
 
+        window.addEventListener("message", function (msg) {
 
+            console.log(msg.data)
 
+            if (msg.data.params) {
 
+                iframe.width = msg.data.params.num + "%";
 
+            }
 
+        });
 
+    </script>
 
+   
+    <script>
 
+     
+        var changeLog = ()=>{
 
+
 
+            let logLevel = 1
 
+        
+           if((number == "TEST" || browser.valueFromHash('test')) && browser.isMobile()){
 
+                var textarea = document.createElement('textarea');
 
+                  textarea.id = "consoleLog";
 
+
 
+                  document.getElementsByTagName("body")[0].appendChild(textarea);
 
+                  var list = ["log", "error", "warn", "debug", "info", "time", "timeEnd"]
 
+                  var exchange = function (o) {
 
+                    console["old" + o] = console[o];
 
+                    console[o] = function (str ) {
 
+                        console["old" + o].apply(this, arguments)
 
+                        if(logLevel){
 
+                            if(o != 'error' && logLevel != str.level){
 
+                                return  
+                            }
 
+                            if(str.str) str = str.str
 
+                        }
 
+                        
+                        var args = Array.from(arguments)
 
+                       
+                        var str = ''
 
+                        args.forEach(a=>{
 
+                            str += a + ','
 
+                        })
 
+                        textarea.innerHTML = str + "\n\n" + textarea.innerHTML;
 
+                    
+                      /*console["old" + o](str);
 
+                      var t = document.getElementById("consoleLog").innerHTML;
 
+                      document.getElementById("consoleLog").innerHTML = str + "\n\n" + t;*/
 
+                    }
 
+                  }
 
+
 
+                  for (var i = 0; i < list.length; i++) {
 
+                    exchange(list[i])
 
+                  } 
+           
+            }   
+        }
 
+    </script>
 
+    
+
 
+   
+   
+   
+   
+   
+    <script src="js/lib/jquery-2.1.1.min.js" class="build keep"></script>
 
+    <script src="js/lib/player-0.0.12.min.js" class="build keep"></script>
 
+   
+    <!-- <script src="js/lib/video.min.js" class="build keep"></script> -->
 
+    <script src="js/lib/Tween.js"></script>
 
+    <!-- <script src="js/app-preheater.js?v=2.25.6-0-gd87e5b1"></script> --> 
+    <script src="js/SpecialScene.js"></script>
 
+    
+    
+    <script src="js/manage.js"></script> 
+    <!-- <script src="js/lib/stats.min.js"></script> -->
 
+    <script src="js/Hot.js?m=1"></script>  
+    <script src="js/main_2020_show.js"></script>
 
+    <script src="js/lib/OBJLoader.js"></script>
 
+    <script src="/CAD/bundle.js"></script> 
+    <script src="js/loadCAD.js"></script>
 
+    <script id='flvJs' type='text/javascript' ></script>
 
+    <script>
 
+         /*if(window.browser.detectAndroidMobile()){
 
+            let scriptdom = document.querySelector('#flvJs')
 
+            //scriptdom.setAttribute('src','js/lib/flv.min.js')
 
+            scriptdom.setAttribute('type','text/javascript')
 
+            scriptdom.src = 'js/lib/flv.min.js'
 
+         }*/
 
+          
+    
+    </script>
 
+</body>
 
+
 
+</html>

File diff suppressed because it is too large
+ 3 - 0
searchGuide/js/axios.min.js


+ 43 - 0
searchGuide/js/flexible.js
View File 

@@ -0,0 +1,43 @@
 
+(function flexible(window, document) {
 
+  var docEl = document.documentElement;
 
+  var dpr = window.devicePixelRatio || 1;
 
+
 
+  // adjust body font size
 
+  function setBodyFontSize() {
 
+    if (document.body) {
 
+      document.body.style.fontSize = 12 * dpr + "px";
 
+    } else {
 
+      document.addEventListener("DOMContentLoaded", setBodyFontSize);
 
+    }
 
+  }
 
+  setBodyFontSize();
 
+
 
+  // set 1rem = viewWidth / 10
 
+  function setRemUnit() {
 
+    var rem = docEl.clientWidth / 24;
 
+    docEl.style.fontSize = rem + "px";
 
+  }
 
+
 
+  setRemUnit();
 
+
 
+  // reset rem unit on page resize
 
+  window.addEventListener("resize", setRemUnit);
 
+  window.addEventListener("pageshow", function (e) {
 
+    if (e.persisted) {
 
+      setRemUnit();
 
+    }
 
+  });
 
+
 
+  // detect 0.5px supports
 
+  if (dpr >= 2) {
 
+    var fakeBody = document.createElement("body");
 
+    var testElement = document.createElement("div");
 
+    testElement.style.border = ".5px solid transparent";
 
+    fakeBody.appendChild(testElement);
 
+    docEl.appendChild(fakeBody);
 
+    if (testElement.offsetHeight === 1) {
 
+      docEl.classList.add("hairlines");
 
+    }
 
+    docEl.removeChild(fakeBody);
 
+  }
 
+})(window, document);

File diff suppressed because it is too large
+ 11 - 0
searchGuide/js/vue.min.js


+ 440 - 0
searchGuide/searchGuide.html
View File 

@@ -0,0 +1,440 @@
 
+<!DOCTYPE html>
 
+<html>
 
+  <head>
 
+    <meta charset="utf-8" />
 
+    <meta
 
+      name="viewport"
 
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
 
+    />
 
+    <title></title>
 
+    <script src="./js/vue.min.js"></script>
 
+    <script src="./js/axios.min.js"></script>
 
+    <style>
 
+      body {
 
+        margin: 0;
 
+      }
 
+      div {
 
+        box-sizing: border-box;
 
+      }
 
+
 
+      ::-webkit-scrollbar {
 
+        /*滚动条整体样式*/
 
+        width: 3px;
 
+        /*高宽分别对应横竖滚动条的尺寸*/
 
+        height: 1px;
 
+      }
 
+
 
+      ::-webkit-scrollbar-thumb {
 
+        /*滚动条里面小方块*/
 
+        border-radius: 10px;
 
+        -webkit-box-shadow: inset 0 0 5px transparent;
 
+        background: #f0d89c;
 
+      }
 
+
 
+      ::-webkit-scrollbar-track {
 
+        /*滚动条里面轨道*/
 
+        -webkit-box-shadow: inset 0 0 5px transparent;
 
+        border-radius: 10px;
 
+        background: transparent;
 
+      }
 
+
 
+      #app {
 
+        width: 100vw;
 
+        height: 100vh;
 
+        box-sizing: border-box;
 
+        overflow: hidden;
 
+        display: flex;
 
+        justify-content: flex-end;
 
+      }
 
+
 
+      .search {
 
+        width: 60%;
 
+        height: 100%;
 
+        background: linear-gradient(
 
+          89deg,
 
+          rgba(158, 135, 90, 0.35) 22%,
 
+          rgba(141, 127, 100, 0.56) 80%,
 
+          rgba(141, 127, 100, 0.56) 100%
 
+        );
 
+        backdrop-filter: blur(20px);
 
+        padding: 15px 15px;
 
+        border-radius: 10px;
 
+        position: relative;
 
+      }
 
+
 
+      .close-box {
 
+        width: 25px;
 
+        height: 25px;
 
+        position: absolute;
 
+        top: 2px;
 
+        right: 2px;
 
+        cursor: pointer;
 
+      }
 
+
 
+      .search-box {
 
+        width: 100%;
 
+        height: 30px;
 
+        border-radius: 5px;
 
+        background: #ffffff47;
 
+        padding: 5px 10px;
 
+        display: flex;
 
+        justify-content: space-between;
 
+        align-items: center;
 
+      }
 
+
 
+      .tips {
 
+        width: 100%;
 
+        display: flex;
 
+        justify-content: left;
 
+        margin-top: 5px;
 
+      }
 
+
 
+      .tips-item {
 
+        margin-left: 10px;
 
+        font-size: 12px;
 
+        color: #ffffff80;
 
+      }
 
+
 
+      .welcome-title {
 
+        font-size: 18px;
 
+        color: #ffffff;
 
+        font-weight: bold;
 
+        margin-top: 10px;
 
+      }
 
+
 
+      .search-content {
 
+        border: none;
 
+        width: 75%;
 
+        height: 100%;
 
+        background: none;
 
+        line-height: 45px;
 
+        font-size: 14px;
 
+        color: white;
 
+      }
 
+      input:focus {
 
+        outline: none;
 
+      }
 
+      input::placeholder {
 
+        color: rgb(201, 201, 201);
 
+      }
 
+
 
+      .content-right {
 
+        display: flex;
 
+        justify-content: center;
 
+        align-items: center;
 
+      }
 
+
 
+      .line {
 
+        height: 25px;
 
+        width: 2px;
 
+        background: linear-gradient(transparent, white, transparent);
 
+        margin-right: 10px;
 
+      }
 
+
 
+      .search-icon {
 
+        height: 20px;
 
+        width: 20px;
 
+      }
 
+
 
+      .options {
 
+        width: 100%;
 
+        display: flex;
 
+        margin-top: 5px;
 
+        justify-content: space-around;
 
+      }
 
+
 
+      .options-item {
 
+        color: white;
 
+        font-size: 15px;
 
+        line-height: 1.5rem;
 
+        cursor: pointer;
 
+      }
 
+
 
+      .list-box {
 
+        width: 100%;
 
+        height: 80%;
 
+        overflow: auto;
 
+      }
 
+      .list-box-item {
 
+        width: 100%;
 
+        height: 40px;
 
+        display: flex;
 
+        justify-content: space-between;
 
+        align-items: center;
 
+        cursor: pointer;
 
+      }
 
+
 
+      .item-title {
 
+        font-size: 16px;
 
+        font-weight: bold;
 
+        color: white;
 
+        overflow: hidden;
 
+        white-space: nowrap;
 
+        text-overflow: ellipsis;
 
+      }
 
+
 
+      .item-disc {
 
+        font-size: 13px;
 
+        color: #ffffff75;
 
+        min-width: 20%;
 
+      }
 
+
 
+      .dialog {
 
+        /* width: 5%;
 
+        height: 20%;
 
+        position: relative; */
 
+      }
 
+      /* //制作尖角原理：把容器的长和宽都设置为零，然后利用其border制作小三角，两个三角形重叠，一个与背景颜色相同，另一个与边框颜色相同，即可展示出尖角的效果 */
 
+      .dialog:before {
 
+        content: "";
 
+        width: 0;
 
+        height: 0;
 
+        border-bottom: 40px solid rgba(141, 127, 100, 0.56);
 
+        border-right: 30px solid #fff0;
 
+        backdrop-filter: blur(20px);
 
+      }
 
+      /* .dialog:after {
 
+        content: "";
 
+        width: 0;
 
+        height: 0;
 
+        position: absolute;
 
+        top: 4.3em;
 
+        left: 0;
 
+        border-bottom: 2rem solid #fff;
 
+        border-right: 5rem solid #fff0;
 
+      } */
 
+
 
+      img {
 
+        height: 100%;
 
+      }
 
+    </style>
 
+    <style></style>
 
+  </head>
 
+
 
+  <body>
 
+    <div id="app">
 
+      <!-- 搜索框 -->
 
+      <div
 
+        class="search"
 
+        v-if="isShow"
 
+        :style="{padding: clientWidth < 700 ? '10px 10px':''}"
 
+      >
 
+        <!-- <div class="close-box" @click="() => {isShow = false}">
 
+          <img src="./img/icon/close.png" alt="" />
 
+        </div> -->
 
+        <!-- 搜索框 -->
 
+        <div
 
+          class="search-box"
 
+          :style="{height: clientWidth < 700 ? '25px':''}"
 
+        >
 
+          <input
 
+            class="search-content"
 
+            type="text"
 
+            placeholder="请输入关键字"
 
+            :value="searchKey"
 
+            v-model="searchKey"
 
+            @input="searchFu"
 
+          />
 
+          <!-- <input class="search-content">{{searchKey}}</input> -->
 
+          <div class="content-right">
 
+            <div class="line"></div>
 
+            <img
 
+              class="search-icon"
 
+              src="./img/icon/close.png"
 
+              alt=""
 
+              @click="() => {isShow = false}"
 
+            />
 
+          </div>
 
+        </div>
 
+        <!-- 文物 知识选择 -->
 
+        <div class="options" :style="{marginTop: clientWidth < 700 ? '2px':''}">
 
+          <div
 
+            class="options-item"
 
+            @click="()=>{optionValue = '文物'}"
 
+            :style="{color: optionValue == '文物' ? '#f0d89c' : '#fff',fontSize: clientWidth < 700 ? '13px':''}"
 
+          >
 
+            文物
 
+          </div>
 
+          <div
 
+            class="options-item"
 
+            @click="()=>{optionValue = '知识'}"
 
+            :style="{color: optionValue == '文物' ? '#f0d89c' : '#fff',fontSize: clientWidth < 700 ? '13px':''}"
 
+          >
 
+            知识
 
+          </div>
 
+        </div>
 
+        <div class="list-box">
 
+          <div
 
+            class="list-box-item"
 
+            v-for="(item, index) in showList"
 
+            :style="{borderBottom: index != showList.length - 1? '1px #ffffff75 dashed': '',height: clientWidth < 700 ?'25px':''}"
 
+            @click="goDetail(optionValue == '知识' ? item.channelId : item.id)"
 
+          >
 
+            <span
 
+              class="item-title"
 
+              :title="item.name"
 
+              :style="{fontSize: clientWidth < 700 ? '12px':''}"
 
+              >{{item.name}}</span
 
+            >
 
+            <!-- <div class="item-disc">{{`[${optionValue}]`}}</div> -->
 
+          </div>
 
+        </div>
 
+      </div>
 
+      <div class="dialog" v-if="isShow"></div>
 
+      <div class="figure-box">
 
+        <img src="./img/yb/yb.png" alt="" @click="() => {isShow = !isShow}" />
 
+      </div>
 
+    </div>
 
+
 
+    <script>
 
+      var app = new Vue({
 
+        el: "#app",
 
+        data() {
 
+          return {
 
+            title: "导向",
 
+            isShow: false,
 
+            searchKey: "",
 
+            optionValue: "文物",
 
+            culturalsList: [],
 
+            showList: [],
 
+            timer: null,
 
+            isFocus: true,
 
+            keyTips: ["海战博物馆", "虎门硝烟", "鸦片战争"],
 
+            clientWidth: 0,
 
+          };
 
+        },
 
+        mounted() {
 
+          console.log(
 
+            "父窗口宽度",
 
+            window.parent.document.documentElement.clientWidth
 
+          );
 
+          window.onresize = () => {
 
+            return (() => {
 
+              this.clientWidth =
 
+                window.parent.document.documentElement.clientWidth;
 
+            })();
 
+          };
 
+        },
 
+        beforCreat() {},
 
+        created() {
 
+          this.getCulturalRelics();
 
+        },
 
+        watch: {
 
+          optionValue(newValue, oldValue) {
 
+            if (newValue == "文物") {
 
+              this.getCulturalRelics(this.searchKey);
 
+            } else if (newValue == "知识") {
 
+              this.getKnows(this.searchKey);
 
+            }
 
+          },
 
+          isShow(newValue, oldValue) {
 
+            var appbox = document.getElementById("app");
 
+            if (newValue) {
 
+              // pc端
 
+              if (this.clientWidth > 700) {
 
+                window.parent.postMessage(
 
+                  {
 
+                    params: {
 
+                      num: "26",
 
+                    },
 
+                  },
 
+                  "*"
 
+                );
 
+              } else {
 
+                window.parent.postMessage(
 
+                  {
 
+                    params: {
 
+                      num: "80",
 
+                    },
 
+                  },
 
+                  "*"
 
+                );
 
+              }
 
+            } else {
 
+              if (this.clientWidth > 700) {
 
+                window.parent.postMessage(
 
+                  {
 
+                    params: {
 
+                      num: "10",
 
+                    },
 
+                  },
 
+                  "*"
 
+                );
 
+              } else {
 
+                window.parent.postMessage(
 
+                  {
 
+                    params: {
 
+                      num: "20",
 
+                    },
 
+                  },
 
+                  "*"
 
+                );
 
+              }
 
+            }
 
+          },
 
+        },
 
+        methods: {
 
+          // 进入详情链接
 
+          goDetail(id) {
 
+            console.log(id);
 
+            window.open(
 
+              `/pc/#/${this.optionValue == "文物" ? "goods" : "know"}?id=${id}`
 
+            );
 
+          },
 
+          // 搜索防抖计时器清除
 
+          clearTimer() {
 
+            if (this.timer) {
 
+              clearTimeout(this.timer);
 
+            }
 
+          },
 
+          // 进行搜索
 
+          searchFu() {
 
+            this.clearTimer();
 
+            this.isFocus = true;
 
+            this.timer = setTimeout(() => {
 
+              if (this.optionValue == "文物") {
 
+                this.getCulturalRelics(this.searchKey);
 
+              } else if (this.optionValue == "知识") {
 
+                this.getKnows(this.searchKey);
 
+              }
 
+            }, 500);
 
+          },
 
+          // 获取文物链接
 
+          getCulturalRelics(searchKey) {
 
+            let _this = this;
 
+            _this.showList = [];
 
+            const data = {
 
+              dictAge: "",
 
+              dictTexture: "",
 
+              pageNum: 0,
 
+              pageSize: 10000000,
 
+              searchKey: searchKey,
 
+              type: "",
 
+            };
 
+            axios
 
+              .post(`https://ypbwg.4dage.com/api/show/goods/pageList`, data)
 
+              .then(function (resp) {
 
+                _this.showList = resp.data.data.records;
 
+              });
 
+          },
 
+          // 获取知识链接
 
+          getKnows(searchKey) {
 
+            let _this = this;
 
+            _this.showList = [];
 
+            const data = {
 
+              pageNum: 0,
 
+              pageSize: 10000000,
 
+              searchKey: searchKey,
 
+              tagType: "",
 
+            };
 
+            axios
 
+              .post(`https://ypbwg.4dage.com/api/show/getKnowledge`, data)
 
+              .then(function (resp) {
 
+                _this.showList = resp.data.data.records;
 
+              });
 
+          },
 
+        },
 
+      });
 
+    </script>
 
+  </body>
 
+</html>

+ 52 - 0
searchGuide/test.html
View File 

@@ -0,0 +1,52 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>Document</title>
 
+    <style>
 
+      body {
 
+        width: 100vw;
 
+        height: 100vh;
 
+        background: gray;
 
+      }
 
+      * {
 
+        margin: 0;
 
+        padding: 0;
 
+        box-sizing: border-box;
 
+      }
 
+      iframe {
 
+        position: absolute;
 
+        bottom: 100px;
 
+        right: 10px;
 
+        z-index: 1000;
 
+      }
 
+    </style>
 
+  </head>
 
+  <body>
 
+    <iframe
 
+      src="file:///D:/code/%E5%9B%9B%E7%BB%B4/%E9%B8%A6%E7%89%87%E6%88%98%E4%BA%89%E5%8D%9A%E7%89%A9%E9%A6%86/%E5%9C%BA%E6%99%AF/searchGuide/searchGuide.html"
 
+      frameborder="0"
 
+      id="myifr"
 
+      width="10%"
 
+      height="30%"
 
+    ></iframe>
 
+
 
+    <script>
 
+      var iframe = document.getElementById("myifr");
 
+      // iframe.width = iframe.contentWindow.document.body.scrollWidth;
 
+      // iframe.height = iframe.contentWindow.document.body.scrollHeight;
 
+      // console.log(iframe.contentWindow.document.body.scrollWidth);
 
+      if (window.innerWidth < 700) {
 
+        iframe.height = 20 + "%";
 
+        iframe.width = 20 + "%";
 
+      }
 
+
 
+      window.addEventListener("message", function (msg) {
 
+        if (msg.data.params.num) {
 
+          iframe.width = msg.data.params.num + "%";
 
+        }
 
+      });
 
+    </script>
 
+  </body>
 
+</html>

+ 51 - 0
test.html
View File 

@@ -0,0 +1,51 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>Document</title>
 
+    <style>
 
+      body {
 
+        width: 100vw;
 
+        height: 100vh;
 
+        background: gray;
 
+      }
 
+      * {
 
+        margin: 0;
 
+        padding: 0;
 
+        box-sizing: border-box;
 
+      }
 
+      iframe {
 
+        position: absolute;
 
+        bottom: 100px;
 
+        right: 10px;
 
+        z-index: 1000;
 
+      }
 
+    </style>
 
+  </head>
 
+  <body>
 
+    <iframe
 
+      src="file:///D:/code/%E5%9B%9B%E7%BB%B4/%E9%B8%A6%E7%89%87%E6%88%98%E4%BA%89%E5%8D%9A%E7%89%A9%E9%A6%86/%E5%9C%BA%E6%99%AF/searchGuide/searchGuide.html"
 
+      frameborder="0"
 
+      id="myifr"
 
+      width="10%"
 
+      height="30%"
 
+    ></iframe>
 
+
 
+    <script>
 
+      var iframe = document.getElementById("myifr");
 
+      // iframe.width = iframe.contentWindow.document.body.scrollWidth;
 
+      // iframe.height = iframe.contentWindow.document.body.scrollHeight;
 
+      // console.log(iframe.contentWindow.document.body.scrollWidth);
 
+
 
+      window.addEventListener("message", function (msg) {
 
+        if (msg.data == "10") {
 
+          iframe.width = "10%";
 
+        } else if (msg.data == "26") {
 
+          iframe.width = "26%";
 
+        }
 
+        console.log(msg.data, iframe.width);
 
+      });
 
+    </script>
 
+  </body>
 
+</html>

+ 3 - 0
定制化热点/.browserslistrc
View File 

@@ -0,0 +1,3 @@
 
+> 1%
 
+last 2 versions
 
+not dead

+ 17 - 0
定制化热点/.eslintrc.js
View File 

@@ -0,0 +1,17 @@
 
+module.exports = {
 
+  root: true,
 
+  env: {
 
+    node: true
 
+  },
 
+  'extends': [
 
+    'plugin:vue/essential',
 
+    'eslint:recommended'
 
+  ],
 
+  parserOptions: {
 
+    parser: 'babel-eslint'
 
+  },
 
+  rules: {
 
+    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
 
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
 
+  }
 
+}

+ 23 - 0
定制化热点/.gitignore
View File 

@@ -0,0 +1,23 @@
 
+.DS_Store
 
+node_modules
 
+/dist
 
+
 
+
 
+# local env files
 
+.env.local
 
+.env.*.local
 
+
 
+# Log files
 
+npm-debug.log*
 
+yarn-debug.log*
 
+yarn-error.log*
 
+pnpm-debug.log*
 
+
 
+# Editor directories and files
 
+.idea
 
+.vscode
 
+*.suo
 
+*.ntvs*
 
+*.njsproj
 
+*.sln
 
+*.sw?

+ 24 - 0
定制化热点/README.md
View File 

@@ -0,0 +1,24 @@
 
+# hotspot
 
+
 
+## Project setup
 
+```
 
+npm install
 
+```
 
+
 
+### Compiles and hot-reloads for development
 
+```
 
+npm run serve
 
+```
 
+
 
+### Compiles and minifies for production
 
+```
 
+npm run build
 
+```
 
+
 
+### Lints and fixes files
 
+```
 
+npm run lint
 
+```
 
+
 
+### Customize configuration
 
+See [Configuration Reference](https://cli.vuejs.org/config/).

+ 5 - 0
定制化热点/babel.config.js
View File 

@@ -0,0 +1,5 @@
 
+module.exports = {
 
+  presets: [
 
+    '@vue/cli-plugin-babel/preset'
 
+  ]
 
+}

File diff suppressed because it is too large
+ 26499 - 0
定制化热点/package-lock.json


+ 32 - 0
定制化热点/package.json
View File 

@@ -0,0 +1,32 @@
 
+{
 
+  "name": "hotspot",
 
+  "version": "0.1.0",
 
+  "private": true,
 
+  "scripts": {
 
+    "serve": "vue-cli-service serve",
 
+    "build": "vue-cli-service build",
 
+    "lint": "vue-cli-service lint"
 
+  },
 
+  "dependencies": {
 
+    "axios": "^0.20.0",
 
+    "core-js": "^3.6.5",
 
+    "swiper": "^5.4.5",
 
+    "v-viewer": "^1.5.1",
 
+    "vue": "^2.6.11",
 
+    "vue-awesome-swiper": "^4.1.1",
 
+    "vue-lazyload": "^1.3.3",
 
+    "vue-router": "^3.2.0"
 
+  },
 
+  "devDependencies": {
 
+    "@vue/cli-plugin-babel": "~4.5.0",
 
+    "@vue/cli-plugin-eslint": "~4.5.0",
 
+    "@vue/cli-plugin-router": "~4.5.0",
 
+    "@vue/cli-service": "~4.5.0",
 
+    "babel-eslint": "^10.1.0",
 
+    "eslint": "^6.7.2",
 
+    "eslint-plugin-vue": "^6.2.2",
 
+    "less": "^3.0.4",
 
+    "less-loader": "^5.0.0",
 
+    "vue-template-compiler": "^2.6.11"
 
+  }
 
+}

+ 16 - 0
定制化热点/public/index.html
View File 

@@ -0,0 +1,16 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="utf-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+    <title><%= htmlWebpackPlugin.options.title %></title>
 
+  </head>
 
+  <body>
 
+    <noscript>
 
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
+    </noscript>
 
+    <div id="app"></div>
 
+    <!-- built files will be auto injected -->
 
+  </body>
 
+</html>

+ 22 - 0
定制化热点/src/App.vue
View File 

@@ -0,0 +1,22 @@
 
+<template>
 
+  <div id="app">
 
+    <router-view/>
 
+  </div>
 
+</template>
 
+
 
+<style lang="less">
 
+html,body{
 
+  width: 100%;
 
+  height: 100%;
 
+  overflow: hidden;
 
+}
 
+*{
 
+  margin: 0;
 
+  padding: 0;
 
+}
 
+#app {
 
+  width: 100%;
 
+  height: 100%;
 
+}
 
+
 
+</style>

+ 34 - 0
定制化热点/src/assets/base.css
View File 

@@ -0,0 +1,34 @@
 
+* {
 
+  margin: 0;
 
+  padding: 0;
 
+  box-sizing: border-box;
 
+}
 
+body{
 
+  user-select: none;
 
+}
 
+.viewer-title {
 
+  display: none !important;
 
+}
 
+
 
+.viewer-prev {
 
+  display: none !important;
 
+}
 
+
 
+.viewer-next {
 
+  display: none !important;
 
+}
 
+
 
+.viewer-navbar {
 
+  display: none !important;
 
+}
 
+
 
+.viewer-close {
 
+  display: none !important;
 
+}
 
+
 
+@media screen and (max-width: 800px) {
 
+  .viewer-footer {
 
+    bottom: auto;
 
+    top: 10px;
 
+  }
 
+}

BIN
定制化热点/src/assets/images/IMGerror.png
View File


BIN
定制化热点/src/assets/images/loading.gif
View File


BIN
定制化热点/src/assets/images/pc/audio.png
View File


BIN
定制化热点/src/assets/images/pc/audioAc.png
View File


BIN
定制化热点/src/assets/images/pc/icon-left.png
View File


BIN
定制化热点/src/assets/images/pc/icon-right.png
View File


BIN
定制化热点/src/assets/images/pc/icon1.png
View File


BIN
定制化热点/src/assets/images/pc/icon1Ac.png
View File


BIN
定制化热点/src/assets/images/pc/icon2.png
View File


BIN
定制化热点/src/assets/images/pc/icon2Ac.png
View File


BIN
定制化热点/src/assets/images/pc/icon3.png
View File


BIN
定制化热点/src/assets/images/pc/icon3Ac.png
View File


BIN
定制化热点/src/assets/images/pc/left.png
View File


BIN
定制化热点/src/assets/images/pc/right.png
View File


BIN
定制化热点/src/assets/logo.png
View File


+ 59 - 0
定制化热点/src/components/HelloWorld.vue
View File 

@@ -0,0 +1,59 @@
 
+<template>
 
+  <div class="hello">
 
+    <h1>{{ msg }}</h1>
 
+    <p>
 
+      For a guide and recipes on how to configure / customize this project,<br>
 
+      check out the
 
+      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
 
+    </p>
 
+    <h3>Installed CLI Plugins</h3>
 
+    <ul>
 
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
 
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
 
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
 
+    </ul>
 
+    <h3>Essential Links</h3>
 
+    <ul>
 
+      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
 
+      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
 
+      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
 
+      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
 
+      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
 
+    </ul>
 
+    <h3>Ecosystem</h3>
 
+    <ul>
 
+      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
 
+      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
 
+      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
 
+      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
 
+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
 
+    </ul>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  name: 'HelloWorld',
 
+  props: {
 
+    msg: String
 
+  }
 
+}
 
+</script>
 
+
 
+<!-- Add "scoped" attribute to limit CSS to this component only -->
 
+<style scoped lang="less">
 
+h3 {
 
+  margin: 40px 0 0;
 
+}
 
+ul {
 
+  list-style-type: none;
 
+  padding: 0;
 
+}
 
+li {
 
+  display: inline-block;
 
+  margin: 0 10px;
 
+}
 
+a {
 
+  color: #42b983;
 
+}
 
+</style>

+ 23 - 0
定制化热点/src/main.js
View File 

@@ -0,0 +1,23 @@
 
+import Vue from 'vue'
 
+import App from './App.vue'
 
+import router from './router'
 
+import axios from 'axios'
 
+import 'viewerjs/dist/viewer.css'
 
+import Viewer from 'v-viewer'
 
+// 图片懒加载
 
+import VueLazyLoad from 'vue-lazyload'
 
+Vue.use(VueLazyLoad, {
 
+  error: require('@/assets/images/IMGerror.png'),
 
+  loading: require('@/assets/images/loading.gif')
 
+})
 
+
 
+Vue.config.productionTip = false
 
+Vue.prototype.$http = axios
 
+
 
+Vue.use(Viewer)
 
+
 
+import './assets/base.css'
 
+new Vue({
 
+  router,
 
+  render: h => h(App)
 
+}).$mount('#app')

+ 27 - 0
定制化热点/src/router/index.js
View File 

@@ -0,0 +1,27 @@
 
+import Vue from 'vue'
 
+import VueRouter from 'vue-router'
 
+import Home from '../views/Home.vue'
 
+
 
+Vue.use(VueRouter)
 
+
 
+const routes = [
 
+  {
 
+    path: '/',
 
+    name: 'Home',
 
+    component: Home
 
+  },
 
+  {
 
+    path: '/about',
 
+    name: 'About',
 
+    // route level code-splitting
 
+    // this generates a separate chunk (about.[hash].js) for this route
 
+    // which is lazy-loaded when the route is visited.
 
+    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
 
+  }
 
+]
 
+
 
+const router = new VueRouter({
 
+  routes
 
+})
 
+
 
+export default router

+ 29 - 0
定制化热点/src/utils/browser.js
View File 

@@ -0,0 +1,29 @@
 
+function versions () {
 
+    var u = window.navigator.userAgent
 
+    return {
 
+      // IE内核
 
+      trident: u.indexOf('Trident') > -1,
 
+      // opera内核
 
+      presto: u.indexOf('Presto') > -1,
 
+      // 苹果、谷歌内核
 
+      webKit: u.indexOf('AppleWebKit') > -1,
 
+      // 火狐内核
 
+      gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') === -1,
 
+      // 是否为移动终端 / Tablets use desktop version
 
+      mobile: (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) && !(/Tablet|iPad/i.test(navigator.userAgent)),
 
+      // ios终端
 
+      ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
 
+      // android终端或者uc浏览器
 
+      android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,
 
+      // 是否为iPhone或者安卓QQ浏览器
 
+      iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1,
 
+      // 是否为iPad
 
+      iPad: u.indexOf('iPad') > -1,
 
+      // 是否为web应用程序，没有头部与底部
 
+      webApp: u.indexOf('Safari') === -1,
 
+      // 是否为微信浏览器
 
+      weixin: ~u.indexOf('MicroMessenger')
 
+    }
 
+  }
 
+  
+  export default versions()

+ 0 - 0
定制化热点/src/utils/http.js
View File


+ 5 - 0
定制化热点/src/views/About.vue
View File 

@@ -0,0 +1,5 @@
 
+<template>
 
+  <div class="about">
 
+    <h1>This is an about page</h1>
 
+  </div>
 
+</template>

+ 583 - 0
定制化热点/src/views/Home.vue
View File 

@@ -0,0 +1,583 @@
 
+<template>
 
+  <div class="home">
 
+    <div class="main">
 
+      <div class="mainCon" v-show="!oneTxt">
 
+        <audio
 
+          id="myAudio"
 
+          v-if="audio"
 
+          v-show="isOneAduio"
 
+          :src="urlToFitFu(audio)"
 
+          controls
 
+        ></audio>
 
+        <!-- 音频图标 -->
 
+        <div
 
+          class="audioIcon"
 
+          v-if="audio && !isOneAduio"
 
+          @click="audioSta = !audioSta"
 
+          :title="audioSta ? '关闭音频' : '打开音频'"
 
+        >
 
+          <img
 
+            :src="
 
+              require(`@/assets/images/pc/audio${audioSta ? 'Ac' : ''}.png`)
 
+            "
 
+            alt=""
 
+          />
 
+        </div>
 
+
 
+        <!-- 如果只有一个模块 -->
 
+        <div
 
+          class="oneTabNum"
 
+          v-if="
 
+            flooTab.length === 1 &&
 
+            data[myType] &&
 
+            data[myType].length &&
 
+            data[myType].length > 1
 
+          "
 
+        >
 
+          {{ myInd + 1 }} / {{ data[myType].length }}
 
+        </div>
 
+
 
+        <!-- 底部的tab -->
 
+        <div class="flooTabBox" v-if="flooTab.length > 1">
 
+          <div
 
+            @click="myType = item.type"
 
+            class="tabRow"
 
+            :class="{ tabRowAc: myType === item.type }"
 
+            v-for="item in flooTab"
 
+            :key="item.id"
 
+          >
 
+            <img
 
+              :src="
 
+                require(`@/assets/images/pc/icon${item.id}${
 
+                  myType === item.type ? 'Ac' : ''
 
+                }.png`)
 
+              "
 
+              alt=""
 
+            />
 
+            {{ item.name }}
 
+            <span
 
+              v-if="
 
+                data[item.type] &&
 
+                data[item.type].length &&
 
+                data[item.type].length > 1
 
+              "
 
+              >{{ item.type === myType ? myInd + 1 + "/" : null
 
+              }}{{ data[item.type].length }}</span
 
+            >
 
+          </div>
 
+        </div>
 
+
 
+        <!-- 主要内容 -->
 
+
 
+        <div class="contenBoxMain">
 
+          <div
 
+            class="contenBox"
 
+            :class="{ contenBoxAc: index === myInd }"
 
+            v-for="(item, index) in data[myType]"
 
+            :key="myType === 'video' ? item.url : item"
 
+          >
 
+            <!-- 模型页面 -->
 
+            <div class="modelBox" v-if="myType === 'model'">
 
+              <iframe
 
+                :src="urlToFitFu(item)"
 
+                frameborder="0"
 
+                v-if="index === myInd"
 
+              ></iframe>
 
+            </div>
 
+            <!-- 视频页面 -->
 
+            <div class="videoBox" v-else-if="myType === 'video'">
 
+              <video
 
+                controls
 
+                :src="urlToFitFu(item.url)"
 
+                v-if="index === myInd"
 
+              ></video>
 
+            </div>
 
+            <!-- 图片页面 -->
 
+            <div class="imgBox" v-else-if="myType === 'img'">
 
+              <div class="smImgBox" @click="lookImg(urlToFitFu(item))">
 
+                <img v-lazy="urlToFitFu(item)" alt="" />
 
+              </div>
 
+            </div>
 
+          </div>
 
+          <!-- 左右箭头 -->
 
+          <div
 
+            @click="cutMyInd(-1, myInd === 0)"
 
+            class="leftJJ awccJJ"
 
+            :class="{ noClick: myInd === 0 }"
 
+            v-if="data[myType] && data[myType].length > 1"
 
+          ></div>
 
+          <div
 
+            @click="cutMyInd(1, myInd === data[myType].length - 1)"
 
+            class="rightJJ awccJJ"
 
+            :class="{ noClick: myInd === data[myType].length - 1 }"
 
+            v-if="data[myType] && data[myType].length > 1"
 
+          ></div>
 
+        </div>
 
+      </div>
 
+
 
+      <!-- 下面的文字介绍 -->
 
+      <div class="flooTxt" :class="{ flooTxtOne: oneTxt }">
 
+        <div class="flooTxtBox">
 
+          <div class="myTitle">{{ myTitle }}</div>
 
+          <!-- 视频的介绍 -->
 
+          <div class="myTxt" v-if="myType === 'video' && videoTxt[myInd]">
 
+            {{ videoTxt[myInd] }}
 
+          </div>
 
+          <div class="myTxt" v-if="myType === 'img' && imgTxt[myInd]">
 
+            {{ imgTxt[myInd] }}
 
+          </div>
 
+          <div class="myTxt" v-html="myTxt"></div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+    <!-- 查看图片 -->
 
+    <viewer class="viewerCla" ref="viewer" :images="lookPics">
 
+      <img :src="lookPics[0]" alt="" />
 
+    </viewer>
 
+  </div>
 
+</template>
 
+
 
+
 
+<script>
 
+export default {
 
+  name: "Home",
 
+  data() {
 
+    return {
 
+      m: this.$route.query.m,
 
+      id: this.$route.query.id,
 
+      // 音频地址
 
+      audio: "",
 
+      // 如果只有单独的音频
 
+      isOneAduio: false,
 
+      // 音频状态
 
+      audioSta: false,
 
+
 
+      data: {
 
+        // 模型数组
 
+        model: [],
 
+        // 视频数组
 
+        video: [],
 
+        // 图片数组
 
+        img: [],
 
+      },
 
+      // 当前 type
 
+      myType: "",
 
+
 
+      // 底部的tab
 
+      flooTab: [],
 
+
 
+      // 当前索引
 
+      myInd: 0,
 
+
 
+      // 查看图片
 
+      lookPics: [],
 
+
 
+      // 标题
 
+      myTitle: "",
 
+      // 内容
 
+      myTxt: "",
 
+      // 视频内容
 
+      videoTxt: [],
 
+      imgTxt: [],
 
+
 
+      // 只有标题和文字（没有视频，没有模型，没有图片）
 
+      oneTxt: false,
 
+    };
 
+  },
 
+  watch: {
 
+    myType() {
 
+      this.myInd = 0;
 
+    },
 
+    // 音频的开启和关闭
 
+    audioSta(val) {
 
+      const dom = document.querySelector("#myAudio");
 
+      if (val) {
 
+        dom.play();
 
+        dom.onended = () => {
 
+          // console.log("----音频播放完毕");
 
+          this.audioSta = false;
 
+        };
 
+      } else dom.pause();
 
+    },
 
+  },
 
+  computed: {},
 
+  components: {},
 
+  methods: {
 
+    // 本地化 url 适配
 
+    urlToFitFu(url) {
 
+      const resUrl = url;
 
+      if (url.includes("https://super.4dage.com")) {
 
+        return url.replace("https://super.4dage.com", "");
 
+      } else if (url.includes("http://super.4dage.com")) {
 
+        return url.replace("http://super.4dage.com", "");
 
+      } else return resUrl;
 
+    },
 
+
 
+    // 点击左右箭头
 
+    cutMyInd(num, flag) {
 
+      if (flag) return;
 
+      this.myInd += num;
 
+    },
 
+    // 点击查看大图
 
+    lookImg(url) {
 
+      let dom = this.$refs.viewer.$viewer;
 
+      this.lookPics = [url];
 
+      dom.show();
 
+    },
 
+    async getData() {
 
+      // https://www.4dmodel.com/
 
+
 
+      // let url = `https://super.4dage.com/data/${   // 线上数据
 
+
 
+      let url = `/data/${
 
+        //本地化部署
 
+        this.id
 
+      }/hot/js/data.js?time=${Math.random()}`;
 
+      let result = (await this.$http.get(url)).data;
 
+      const resData = result[this.m];
 
+      // console.log("----", resData);
 
+      if (resData) {
 
+        this.audio = resData.backgroundMusic;
 
+        // 只有单独的音频上传
 
+        if (
 
+          resData.backgroundMusic &&
 
+          !resData.model &&
 
+          !resData.video &&
 
+          !resData.images
 
+        ) {
 
+          this.isOneAduio = true;
 
+        }
 
+        // 底部的tab
 
+        const arr = [];
 
+        const obj = {};
 
+        if (resData.model) {
 
+          obj.model = resData.model;
 
+          arr.push({ id: 1, type: "model", name: "模型" });
 
+        }
 
+        if (resData.video) {
 
+          obj.video = resData.video;
 
+          arr.push({ id: 2, type: "video", name: "视频" });
 
+        }
 
+        if (resData.images) {
 
+          obj.img = resData.images;
 
+          arr.push({ id: 3, type: "img", name: "图片" });
 
+        }
 
+        this.flooTab = arr;
 
+        this.data = obj;
 
+
 
+        // 当前type的值 应该为
 
+        if (resData.model) this.myType = "model";
 
+        else if (resData.video) this.myType = "video";
 
+        else if (resData.images) this.myType = "img";
 
+
 
+        this.myTitle = resData.title || "";
 
+        this.myTxt = resData.content || "";
 
+        this.videoTxt = resData.videosDesc || [];
 
+        this.imgTxt = resData.imagesDesc || [];
 
+
 
+        // 只有 标题和 文字介绍（没有视频，没有模型，没有图片）
 
+        if (!obj.model && !obj.video && !obj.img && !resData.backgroundMusic) {
 
+          this.oneTxt = true;
 
+        }
 
+      }
 
+    },
 
+  },
 
+  mounted() {
 
+    this.getData();
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+.home {
 
+  .viewerCla img {
 
+    display: none;
 
+  }
 
+  width: 100%;
 
+  height: 100%;
 
+  background-color: rgba(255, 252, 247, 0.6);
 
+  backdrop-filter: blur(10px);
 
+  position: relative;
 
+  #myAudio {
 
+    z-index: 11;
 
+    position: absolute;
 
+    top: 50%;
 
+    left: 50%;
 
+    transform: translate(-50%, -50%);
 
+    width: 500px;
 
+    height: 60px;
 
+  }
 
+  .main {
 
+    width: 1200px;
 
+    margin: 0 auto;
 
+    height: 100%;
 
+    padding-top: 40px;
 
+    .mainCon {
 
+      position: relative;
 
+      border-radius: 6px;
 
+      overflow: hidden;
 
+      width: 100%;
 
+      height: calc(100% - 200px);
 
+      .audioIcon {
 
+        z-index: 10;
 
+        cursor: pointer;
 
+        position: absolute;
 
+        right: 20px;
 
+        bottom: 30px;
 
+      }
 
+      .oneTabNum {
 
+        z-index: 10;
 
+        position: absolute;
 
+        bottom: 30px;
 
+        left: 50%;
 
+        transform: translateX(-50%);
 
+        font-size: 14px;
 
+      }
 
+      .flooTabBox {
 
+        z-index: 10;
 
+        position: absolute;
 
+        bottom: 30px;
 
+        left: 50%;
 
+        transform: translateX(-50%);
 
+        display: flex;
 
+        .tabRow {
 
+          cursor: pointer;
 
+          display: flex;
 
+          align-items: center;
 
+          margin: 0 12px;
 
+          font-size: 12px;
 
+          background-color: #dedede;
 
+          padding: 0px 14px;
 
+          height: 36px;
 
+          border-radius: 18px;
 
+          & > img {
 
+            margin-right: 6px;
 
+          }
 
+        }
 
+        .tabRowAc {
 
+          background-color: #b90c0c;
 
+          pointer-events: none;
 
+          color: #d6b970;
 
+        }
 
+      }
 
+      .contenBoxMain {
 
+        position: relative;
 
+        width: 100%;
 
+        height: 100%;
 
+      }
 
+      .contenBox {
 
+        width: 100%;
 
+        height: 100%;
 
+        position: absolute;
 
+        top: 0;
 
+        left: 0;
 
+        opacity: 0;
 
+        pointer-events: none;
 
+        transition: all 0.5s;
 
+
 
+        .modelBox,
 
+        .videoBox,
 
+        .imgBox {
 
+          width: 100%;
 
+          height: 100%;
 
+        }
 
+        .modelBox {
 
+          iframe {
 
+            width: 100%;
 
+            height: 100%;
 
+          }
 
+        }
 
+        .videoBox {
 
+          padding: 100px 100px 120px;
 
+          video {
 
+            width: 100%;
 
+            height: 100%;
 
+          }
 
+        }
 
+        .imgBox {
 
+          padding: 100px 100px 120px;
 
+          .smImgBox {
 
+            width: 100%;
 
+            height: 100%;
 
+            cursor: zoom-in;
 
+            & > img {
 
+              pointer-events: none;
 
+              width: 100%;
 
+              height: 100%;
 
+              object-fit: contain;
 
+            }
 
+          }
 
+        }
 
+      }
 
+      .contenBoxAc {
 
+        opacity: 1;
 
+        pointer-events: auto;
 
+      }
 
+      .awccJJ {
 
+        cursor: pointer;
 
+        position: absolute;
 
+        top: 50%;
 
+        transform: translateY(-50%);
 
+        left: 10px;
 
+        width: 37px;
 
+        height: 37px;
 
+        background-image: url("../assets/images/pc/left.png");
 
+        background-size: 100% 100%;
 
+        &:focus {
 
+          outline: none;
 
+        }
 
+      }
 
+      .rightJJ {
 
+        left: auto;
 
+        right: 10px;
 
+        background-image: url("../assets/images/pc/right.png");
 
+      }
 
+      .noClick {
 
+        cursor: default;
 
+        opacity: 0.4;
 
+      }
 
+    }
 
+    .flooTxt {
 
+      margin-top: 20px;
 
+      width: 100%;
 
+      height: 160px;
 
+      .flooTxtBox {
 
+        width: 100%;
 
+        height: 100%;
 
+        overflow-y: auto;
 
+        .myTitle {
 
+          color: #b90c0c;
 
+          font-size: 22px;
 
+          font-weight: 700;
 
+          margin-bottom: 10px;
 
+        }
 
+        .myTxt {
 
+          font-size: 16px;
 
+          color: #333333;
 
+          line-height: 24px;
 
+        }
 
+        &::-webkit-scrollbar {
 
+          /*滚动条整体样式*/
 
+          width: 3px; /*高宽分别对应横竖滚动条的尺寸*/
 
+          height: 1px;
 
+        }
 
+        &::-webkit-scrollbar-thumb {
 
+          /*滚动条里面小方块*/
 
+          border-radius: 10px;
 
+          -webkit-box-shadow: inset 0 0 5px transparent;
 
+          background: #b90c0c;
 
+        }
 
+        &::-webkit-scrollbar-track {
 
+          /*滚动条里面轨道*/
 
+          -webkit-box-shadow: inset 0 0 5px transparent;
 
+          border-radius: 10px;
 
+          background: transparent;
 
+        }
 
+      }
 
+    }
 
+    .flooTxtOne {
 
+      height: 600px;
 
+    }
 
+  }
 
+}
 
+// 移动端
 
+@media screen and (max-width: 1000px) {
 
+  .home {
 
+    #myAudio {
 
+      width: 90vw;
 
+      max-width: 500px;
 
+    }
 
+    .main {
 
+      width: 90%;
 
+      height: 94%;
 
+      padding: 0;
 
+      position: absolute;
 
+      top: 50%;
 
+      left: 50%;
 
+      transform: translate(-50%, -50%);
 
+
 
+      .mainCon {
 
+        border-radius: 8px 8px 0 0;
 
+        .audioIcon {
 
+          cursor: default;
 
+          right: auto;
 
+          bottom: auto;
 
+          top: 6px;
 
+          left: 6px;
 
+          & > img {
 
+            width: 30px;
 
+          }
 
+        }
 
+        .flooTabBox {
 
+          width: 100%;
 
+          bottom: 20px;
 
+          justify-content: center;
 
+          .tabRow {
 
+            cursor: default;
 
+            margin: 0 6px;
 
+            padding: 0 10px;
 
+            height: 32px;
 
+            & > img {
 
+              width: 16px;
 
+            }
 
+          }
 
+        }
 
+
 
+        .contenBox {
 
+          .videoBox {
 
+            padding: 0px 0;
 
+            position: relative;
 
+            video {
 
+              width: 96%;
 
+              max-height: 100%;
 
+              height: auto;
 
+              position: absolute;
 
+              top: 50%;
 
+              left: 2%;
 
+              transform: translateY(-50%);
 
+            }
 
+          }
 
+          .imgBox {
 
+            padding: 60px 50px 80px;
 
+            .smImgBox {
 
+              cursor: default;
 
+            }
 
+          }
 
+        }
 
+        .awccJJ {
 
+          left: 0;
 
+          width: 28px;
 
+          height: 57px;
 
+          cursor: default;
 
+          background-image: url("../assets/images/pc/icon-left.png");
 
+        }
 
+        .rightJJ {
 
+          left: auto;
 
+          right: 0;
 
+          background-image: url("../assets/images/pc/icon-right.png");
 
+        }
 
+      }
 
+      .flooTxt {
 
+        margin-top: 0;
 
+        padding: 20px 15px 15px;
 
+        height: 200px;
 
+        background-color: #fff;
 
+        border-radius: 0 0 8px 8px;
 
+        .flooTxtBox {
 
+          .myTitle {
 
+            font-size: 18px;
 
+          }
 
+          .myTxt {
 
+            font-size: 14px;
 
+            line-height: 22px;
 
+          }
 
+        }
 
+      }
 
+      .flooTxtOne {
 
+        height: 100%;
 
+      }
 
+    }
 
+  }
 
+}
 
+</style>
 
+

+ 3 - 0
定制化热点/vue.config.js
View File 

@@ -0,0 +1,3 @@
 
+module.exports = {
 
+  publicPath: "./"
 
+};