Strona główna Odkrywaj Pomoc
Zarejestruj się Zaloguj się
lanxin
/
gmlx
1
0
Forkuj 0
Pliki Problemy 0 Oczekujące zmiany 0 Wiki
Przeglądaj źródła

gx

lanxin 4 dni temu
rodzic
6e62747084
commit
66ff900f21
40 zmienionych plików z 140 dodań i 36 usunięć
Zunifikowany widok Pokaż statystyki zmian
  1. 11 0
      pano/src/assets/styles/base.css
  2. 13 0
      pano/src/assets/styles/base.less
  3. 11 7
      pano/src/components/Pano/index.module.scss
  4. 3 3
      pano/src/components/Pano/index.tsx
  5. 8 0
      project/public/index.html
  6. 47 9
      project/public/three/data.js
  7. 3 0
      project/src/assets/styles/base.css
  8. 5 1
      project/src/assets/styles/base.less
  9. 9 1
      project/src/components/MenuSider/index.module.scss
  10. 1 1
      project/src/pages/A0base/index.tsx
  11. 12 4
      project/src/pages/A3architecture/LoadingVideo/index.tsx
  12. 6 7
      project/src/pages/A6life/Intro/index.module.scss
  13. 1 1
      project/src/pages/A6life/Intro/index.tsx
  14. 1 1
      project/src/pages/A6lifeM/index.tsx
  15. 9 1
      project/src/types/declaration.d.ts
  16. BIN
      静态文件/myData/img/life1.jpg
  17. BIN
      静态文件/myData/img/life1_M.png
  18. BIN
      静态文件/myData/img/life1_big.png
  19. BIN
      静态文件/myData/img/life2.jpg
  20. BIN
      静态文件/myData/img/life2_M.png
  21. BIN
      静态文件/myData/img/life2_big.png
  22. BIN
      静态文件/myData/img/life3.jpg
  23. BIN
      静态文件/myData/img/life3_M.png
  24. BIN
      静态文件/myData/img/life3_big.png
  25. BIN
      静态文件/myData/img/life4.jpg
  26. BIN
      静态文件/myData/img/life4_M.png
  27. BIN
      静态文件/myData/img/life4_big.png
  28. BIN
      静态文件/myData/img/life5.jpg
  29. BIN
      静态文件/myData/img/life5_M.png
  30. BIN
      静态文件/myData/img/life5_big.png
  31. BIN
      静态文件/myData/img/life6.jpg
  32. BIN
      静态文件/myData/img/life6_M.png
  33. BIN
      静态文件/myData/img/life6_big.png
  34. BIN
      静态文件/myData/img/life7.jpg
  35. BIN
      静态文件/myData/img/life7_M.png
  36. BIN
      静态文件/myData/img/life7_big.png
  37. BIN
      静态文件/myData/img/life8.jpg
  38. BIN
      静态文件/myData/img/life8_M.png
  39. BIN
      静态文件/myData/img/life8_big.png
  40. BIN
      静态文件/myData/media/record.mp4

+ 11 - 0
pano/src/assets/styles/base.css
Wyświetl plik 

@@ -224,3 +224,14 @@ textarea {
 
     pointer-events: auto;
 
     pointer-events: auto;
 
   }
 
   }
 
 }
 
 }
 
+@keyframes a0hotspot-breathe {
 
+  0% {
 
+    scale: 1;
 
+  }
 
+  50% {
 
+    scale: 0.98;
 
+  }
 
+  100% {
 
+    scale: 1;
 
+  }
 
+}

+ 13 - 0
pano/src/assets/styles/base.less
Wyświetl plik 

@@ -344,3 +344,16 @@ textarea {
 
     pointer-events: auto;
 
     pointer-events: auto;
 
   }
 
   }
 
 }
 
 }
 
+
 
+
 
+@keyframes a0hotspot-breathe {
 
+  0%{
 
+   scale: 1;
 
+  }
 
+  50% {
 
+    scale: 0.98;
 
+  }
 
+  100% {
 
+    scale: 1;
 
+  }
 
+}

+ 11 - 7
pano/src/components/Pano/index.module.scss
Wyświetl plik 

@@ -5,17 +5,20 @@
 
   position: fixed;

   position: fixed;

   top: 0;

   top: 0;

   left: 0;

   left: 0;

-

+ 

   :global {

   :global {

     .krpano {

     .krpano {

       height: 100vh;

       height: 100vh;

     }

     }

 

 

+   

+

     .A0hotspot {

     .A0hotspot {

       width: 430px;

       width: 430px;

       height: 295px;

       height: 295px;

-      color: rgba(112, 73, 7, 1);

-      background-image: url('../../assets/img/hotpot_bg.png');

+     

+      color: rgba(255, 243, 197, 1);

+      background-image: url('../../assets/img/hotpot_bg_ac.png');

       background-repeat: no-repeat;

       background-repeat: no-repeat;

       background-position: center center;

       background-position: center center;

       background-size: contain;

       background-size: contain;

@@ -25,6 +28,7 @@
 
       align-items: flex-start;

       align-items: flex-start;

       justify-content: center;

       justify-content: center;

       pointer-events: auto !important;

       pointer-events: auto !important;

+      animation: a0hotspot-breathe 2.2s linear infinite;

 

 

       .text {

       .text {

         width: 100%;

         width: 100%;

@@ -35,8 +39,8 @@
 
       }

       }

 

 

       &:has(.text:hover) {

       &:has(.text:hover) {

-        background-image: url('../../assets/img/hotpot_bg_ac.png');

-        color: rgba(255, 243, 197, 1);

+        background-image: url('../../assets/img/hotpot_bg.png');

+        color: rgba(112, 73, 7, 1);

       }

       }

 

 

     }

     }

@@ -178,8 +182,8 @@
 
     @media screen and (max-width: 500px) {

     @media screen and (max-width: 500px) {

       // 取消hover

       // 取消hover

       .A0hotspot:has(.text:hover) {

       .A0hotspot:has(.text:hover) {

-        background-image: url('../../assets/img/hotpot_bg.png');

-        color: rgba(112, 73, 7, 1);

+        background-image: url('../../assets/img/hotpot_bg_ac.png');

+        color: rgba(255, 243, 197, 1);

       }

       }

     }

     }

   }

   }

+ 3 - 3
pano/src/components/Pano/index.tsx
Wyświetl plik 

@@ -61,7 +61,7 @@ const Panoramic = ({ openHot }: { openHot: (id: string) => void }) => {
 
           <>
 
           <>
 
             <View
 
             <View
 
               hlookat={0}
 
               hlookat={0}
 
-              vlookat={40}
 
+              vlookat={20}
 
               fovType='MFOV'
 
               fovType='MFOV'
 
               fov={120}
 
               fov={120}
 
               maxPixelZoom={2}
 
               maxPixelZoom={2}
 
@@ -75,8 +75,8 @@ const Panoramic = ({ openHot }: { openHot: (id: string) => void }) => {
 
             <HotSpot
 
             <HotSpot
 
               name='dccgftTitle'
 
               name='dccgftTitle'
 
               type='text'
 
               type='text'
 
-              atv={25.83}
 
-              ath={-1.08}
 
+              atv={-5.17}
 
+              ath={1.22}
 
               scale={0.5}
 
               scale={0.5}
 
               edge='top'
 
               edge='top'
 
               bg={false}
 
               bg={false}

+ 8 - 0
project/public/index.html
Wyświetl plik 

@@ -10,6 +10,7 @@
 
     <meta name="description" content="Web site created using create-react-app" />
 
     <meta name="description" content="Web site created using create-react-app" />
 
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 
     <link rel="shortcut icon" href="./favicon.png" />
 
     <link rel="shortcut icon" href="./favicon.png" />
 
+    <link rel="preload" href="./syst.otf" as="font" type="font/otf" crossorigin />
 
     <script src="./three/data.js"></script>
 
     <script src="./three/data.js"></script>
 
     <title>革命领袖视察黑龙江纪念馆</title>
 
     <title>革命领袖视察黑龙江纪念馆</title>
 
   </head>
 
   </head>
 
@@ -17,6 +18,7 @@
 
   <body>
 
   <body>
 
     <noscript>You need to enable JavaScript to run this app.</noscript>
 
     <noscript>You need to enable JavaScript to run this app.</noscript>
 
     <div id="root" style="width: 100%; height: 100vh"></div>
 
     <div id="root" style="width: 100%; height: 100vh"></div>
 
+    <span class="font-preload-syst" aria-hidden="true">syst preload</span>
 
   </body>
 
   </body>
 
   <style>
 
   <style>
 
     @font-face {
 
     @font-face {
 
@@ -24,6 +26,12 @@
 
       src: url('./syst.otf') format('opentype');
 
       src: url('./syst.otf') format('opentype');
 
       font-display: swap;
 
       font-display: swap;
 
     }
 
     }
 
+    .font-preload-syst {
 
+      position: absolute;
 
+      opacity: 0;
 
+      pointer-events: none;
 
+      font-family: 'syst';
 
+    }
 
     * {
 
     * {
 
       .nameEn {
 
       .nameEn {
 
         font-family: 'syst';
 
         font-family: 'syst';

Plik diff jest za duży
+ 47 - 9
project/public/three/data.js


+ 3 - 0
project/src/assets/styles/base.css
Wyświetl plik 

@@ -6,6 +6,9 @@
 
   -webkit-tap-highlight-color: transparent;
 
   -webkit-tap-highlight-color: transparent;
 
   font-family: heiti;
 
   font-family: heiti;
 
 }
 
 }
 
+* .nameEn {
 
+  font-family: 'syst';
 
+}
 
 video {
 
 video {
 
   object-fit: fill;
 
   object-fit: fill;
 
   width: 100%;
 
   width: 100%;

+ 5 - 1
project/src/assets/styles/base.less
Wyświetl plik 

@@ -5,6 +5,10 @@
 
   word-wrap: break-word;
 
   word-wrap: break-word;
 
   -webkit-tap-highlight-color: transparent;
 
   -webkit-tap-highlight-color: transparent;
 
   font-family: heiti;
 
   font-family: heiti;
 
+
 
+  .nameEn {
 
+    font-family: 'syst';
 
+  }
 
 }
 
 }
 
 
 
 video {
 
 video {
 
@@ -825,4 +829,4 @@ textarea {
 
     opacity: 1;
 
     opacity: 1;
 
     pointer-events: auto;
 
     pointer-events: auto;
 
   }
 
   }
 
-}
 
+}

+ 9 - 1
project/src/components/MenuSider/index.module.scss
Wyświetl plik 

@@ -35,15 +35,23 @@
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 
     padding-left: 10%;
 
     padding-left: 10%;
 
     font-size: 1.2vw;
 
     font-size: 1.2vw;
 
-    font-weight: 500;
 
+
 
     color: rgb(112, 73, 7);
 
     color: rgb(112, 73, 7);
 
     cursor: pointer;
 
     cursor: pointer;
 
+    .siderItemTitle {
 
+      width: 100%;
 
+      height: 100%;
 
+      display: flex;
 
+      align-items: center;
 
+      padding-bottom: 1%;
 
+    }
 
   }
 
   }
 
   .siderItemAc {
 
   .siderItemAc {
 
     background-image: url('../../assets/img/tab_btn_ac.png');
 
     background-image: url('../../assets/img/tab_btn_ac.png');
 
     background-size: contain;
 
     background-size: contain;
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 
     color: rgba(249, 211, 109, 1);
 
     color: rgba(249, 211, 109, 1);
 
+    font-weight: 500;
 
     pointer-events: none;
 
     pointer-events: none;
 
   }
 
   }
 
 }
 
 }

+ 1 - 1
project/src/pages/A0base/index.tsx
Wyświetl plik 

@@ -110,7 +110,7 @@ function A0base() {
 
           const displayProgress =
 
           const displayProgress =
 
             performance.now() - startTime < MIN_STAY_MS ? Math.min(realProgress, 60) : realProgress
 
             performance.now() - startTime < MIN_STAY_MS ? Math.min(realProgress, 60) : realProgress
 
 
 
-          setProgress(displayProgress)
 
+          setProgress(displayProgress * 2)
 
 
 
           // 下载到50%即可尝试跳转（但后台继续完整下载）
 
           // 下载到50%即可尝试跳转（但后台继续完整下载）
 
           if (realProgress >= EARLY_NAVIGATE_PROGRESS) {
 
           if (realProgress >= EARLY_NAVIGATE_PROGRESS) {

+ 12 - 4
project/src/pages/A3architecture/LoadingVideo/index.tsx
Wyświetl plik 

@@ -3,7 +3,8 @@ import styles from './index.module.scss'
 
 import MenuSider from '@/components/MenuSider'

 import MenuSider from '@/components/MenuSider'

 import { baseOssUrl } from '@/utils/http'

 import { baseOssUrl } from '@/utils/http'

 

 

-const LOADING_MS = 20_000

+const FIRST_LOADING_MS = 20_000

+const NEXT_LOADING_MS = 2_000

 const EXIT_MS = 600

 const EXIT_MS = 600

 

 

 type LoadingVideoProps = {

 type LoadingVideoProps = {

@@ -27,6 +28,13 @@ function LoadingVideo({ videoSrc }: LoadingVideoProps) {
 
     setIsLoadingExiting(false)

     setIsLoadingExiting(false)

     setLoadingProgress(0)

     setLoadingProgress(0)

 

 

+    const loadingSeenKey = `loading-video-seen:${videoUrl}`

+    const hasSeenLoading = localStorage.getItem(loadingSeenKey) === '1'

+    const loadingMs = hasSeenLoading ? NEXT_LOADING_MS : FIRST_LOADING_MS

+    if (!hasSeenLoading) {

+      localStorage.setItem(loadingSeenKey, '1')

+    }

+

     let finished = false

     let finished = false

     let timer: ReturnType<typeof setTimeout> | undefined

     let timer: ReturnType<typeof setTimeout> | undefined

     const t0 = performance.now()

     const t0 = performance.now()

@@ -50,7 +58,7 @@ function LoadingVideo({ videoSrc }: LoadingVideoProps) {
 
       if (finished) return

       if (finished) return

       const v = videoRef.current

       const v = videoRef.current

       const elapsed = performance.now() - t0

       const elapsed = performance.now() - t0

-      const timePct = Math.min(95, Math.floor((elapsed / LOADING_MS) * 95))

+      const timePct = Math.min(95, Math.floor((elapsed / loadingMs) * 95))

       let bufPct = 0

       let bufPct = 0

       if (v && v.duration && isFinite(v.duration) && v.buffered.length > 0) {

       if (v && v.duration && isFinite(v.duration) && v.buffered.length > 0) {

         bufPct = Math.floor((v.buffered.end(v.buffered.length - 1) / v.duration) * 100)

         bufPct = Math.floor((v.buffered.end(v.buffered.length - 1) / v.duration) * 100)

@@ -66,14 +74,14 @@ function LoadingVideo({ videoSrc }: LoadingVideoProps) {
 
     const raf = requestAnimationFrame(() => {

     const raf = requestAnimationFrame(() => {

       const v = videoRef.current

       const v = videoRef.current

       if (!v) {

       if (!v) {

-        timer = setTimeout(reveal, LOADING_MS)

+        timer = setTimeout(reveal, loadingMs)

         return

         return

       }

       }

       v.addEventListener('progress', tick)

       v.addEventListener('progress', tick)

       v.addEventListener('loadedmetadata', tick)

       v.addEventListener('loadedmetadata', tick)

       v.addEventListener('canplay', tick)

       v.addEventListener('canplay', tick)

 

 

-      timer = setTimeout(reveal, LOADING_MS)

+      timer = setTimeout(reveal, loadingMs)

 

 

       removeListeners = () => {

       removeListeners = () => {

         v.removeEventListener('progress', tick)

         v.removeEventListener('progress', tick)

+ 6 - 7
project/src/pages/A6life/Intro/index.module.scss
Wyświetl plik 

@@ -8,20 +8,20 @@
 
   .imgBox {
 
   .imgBox {
 
     width: 55%;
 
     width: 55%;
 
     height: 100%;
 
     height: 100%;
 
-    .imgBoxInner{
 
+    .imgBoxInner {
 
       width: 100%;
 
       width: 100%;
 
       height: 100%;
 
       height: 100%;
 
       background-image: url('../../../assets/img/A6_life_intro.png');
 
       background-image: url('../../../assets/img/A6_life_intro.png');
 
       background-size: 100% 100%;
 
       background-size: 100% 100%;
 
       background-repeat: no-repeat;
 
       background-repeat: no-repeat;
 
       background-position: center center;
 
       background-position: center center;
 
-      & >img {
 
-        padding: 2.5%;
 
+      & > img {
 
+        padding: 1%;
 
         width: 100%;
 
         width: 100%;
 
         height: 100%;
 
         height: 100%;
 
         object-fit: fill;
 
         object-fit: fill;
 
       }
 
       }
 
-    } 
+    }
 
   }
 
   }
 
   .textBox {
 
   .textBox {
 
     width: 45%;
 
     width: 45%;
 
@@ -31,7 +31,7 @@
 
     align-items: center;
 
     align-items: center;
 
     justify-content: center;
 
     justify-content: center;
 
     gap: 2vh;
 
     gap: 2vh;
 
-    .textTop{
 
+    .textTop {
 
       width: 70%;
 
       width: 70%;
 
       height: 10vh;
 
       height: 10vh;
 
       background-image: url('../../../assets/img/A6_life_intro_title.png');
 
       background-image: url('../../../assets/img/A6_life_intro_title.png');
 
@@ -43,9 +43,8 @@
 
       line-height: 9.5vh;
 
       line-height: 9.5vh;
 
       font-weight: bold;
 
       font-weight: bold;
 
       color: rgba(249, 211, 109, 1);
 
       color: rgba(249, 211, 109, 1);
 
-
 
     }
 
     }
 
-    .textBottom{
 
+    .textBottom {
 
       width: 90%;
 
       width: 90%;
 
       height: fit-content;
 
       height: fit-content;
 
       max-height: calc(100% - 12vh);
 
       max-height: calc(100% - 12vh);

+ 1 - 1
project/src/pages/A6life/Intro/index.tsx
Wyświetl plik 

@@ -13,7 +13,7 @@ function Intro({
 
     <div className={styles.Intro}>
 
     <div className={styles.Intro}>
 
       <div className={styles.imgBox}>
 
       <div className={styles.imgBox}>
 
         <div className={styles.imgBoxInner}>
 
         <div className={styles.imgBoxInner}>
 
-          <img src={baseOssUrl + myDataTemp.lifeList[activeIndex].imgSrc} alt='' />
 
+          <img src={baseOssUrl + myDataTemp.lifeList[activeIndex].imgSrcBig} alt='' />
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
       <div className={styles.textBox}>
 
       <div className={styles.textBox}>

+ 1 - 1
project/src/pages/A6lifeM/index.tsx
Wyświetl plik 

@@ -12,7 +12,7 @@ function A6lifeM() {
 
       <div className={styles.title}>{myDataTemp.lifeList[activeIndex].name}</div>
 
       <div className={styles.title}>{myDataTemp.lifeList[activeIndex].name}</div>
 
       {activeIndex !== myDataTemp.lifeList.length - 1 ? (
 
       {activeIndex !== myDataTemp.lifeList.length - 1 ? (
 
         <div className={styles.imgBox}>
 
         <div className={styles.imgBox}>
 
-          <img src={baseOssUrl + myDataTemp.lifeList[activeIndex].imgSrc} alt='' />
 
+          <img src={baseOssUrl + myDataTemp.lifeList[activeIndex].imgSrcM} alt='' />
 
         </div>
 
         </div>
 
       ) : (
 
       ) : (
 
         <div className={styles.videoBox}>
 
         <div className={styles.videoBox}>

+ 9 - 1
project/src/types/declaration.d.ts
Wyświetl plik 

@@ -39,7 +39,15 @@ type MyDataType = {
 
     imgSrcLight: string
 
     imgSrcLight: string
 
     videoSrc: string
 
     videoSrc: string
 
   }[]
 
   }[]
 
-  lifeList: { name: string; time: string; imgSrc: string; videoSrc?: string; desc: string }[]
 
+  lifeList: {
 
+    name: string
 
+    time: string
 
+    imgSrc: string
 
+    imgSrcBig: string
 
+    imgSrcM: string
 
+    videoSrc?: string
 
+    desc: string
 
+  }[]
 
   animationList: { name: string; imgSrc: string; videoSrc: string }[]
 
   animationList: { name: string; imgSrc: string; videoSrc: string }[]
 
 }
 
 }

BIN
静态文件/myData/img/life1.jpg
Wyświetl plik


BIN
静态文件/myData/img/life1_M.png
Wyświetl plik


BIN
静态文件/myData/img/life1_big.png
Wyświetl plik


BIN
静态文件/myData/img/life2.jpg
Wyświetl plik


BIN
静态文件/myData/img/life2_M.png
Wyświetl plik


BIN
静态文件/myData/img/life2_big.png
Wyświetl plik


BIN
静态文件/myData/img/life3.jpg
Wyświetl plik


BIN
静态文件/myData/img/life3_M.png
Wyświetl plik


BIN
静态文件/myData/img/life3_big.png
Wyświetl plik


BIN
静态文件/myData/img/life4.jpg
Wyświetl plik


BIN
静态文件/myData/img/life4_M.png
Wyświetl plik


BIN
静态文件/myData/img/life4_big.png
Wyświetl plik


BIN
静态文件/myData/img/life5.jpg
Wyświetl plik


BIN
静态文件/myData/img/life5_M.png
Wyświetl plik


BIN
静态文件/myData/img/life5_big.png
Wyświetl plik


BIN
静态文件/myData/img/life6.jpg
Wyświetl plik


BIN
静态文件/myData/img/life6_M.png
Wyświetl plik


BIN
静态文件/myData/img/life6_big.png
Wyświetl plik


BIN
静态文件/myData/img/life7.jpg
Wyświetl plik


BIN
静态文件/myData/img/life7_M.png
Wyświetl plik


BIN
静态文件/myData/img/life7_big.png
Wyświetl plik


BIN
静态文件/myData/img/life8.jpg
Wyświetl plik


BIN
静态文件/myData/img/life8_M.png
Wyświetl plik


BIN
静态文件/myData/img/life8_big.png
Wyświetl plik


BIN
静态文件/myData/media/record.mp4
Wyświetl plik