Browse Source

add content and vtuber list

huaisianhuang 3 years ago
parent
commit
08552f8764

+ 0 - 4
layouts/_default/taxonomy.html

@@ -113,7 +113,6 @@
     {{ partial "scripts.html" . }}
     <script>
         function tab1 () {
-            console.log('pass');
             if(('.v-tabs').length){
                 // Show the first tab by default
             $('.v-tabs-stage>div').hide();
@@ -131,7 +130,6 @@
             }
         }
         function tab2 () {
-            console.log('pass');
             if(('.d-tabs').length){
                 // Show the first tab by default
             $('.d-tabs-stage>div').hide();
@@ -149,7 +147,6 @@
             }
         }
         function tab3 () {
-            console.log('pass');
             if(('.m-tabs').length){
                 // Show the first tab by default
             $('.m-tabs-stage>div').hide();
@@ -167,7 +164,6 @@
             }
         }
         function nfttab () {
-            console.log('pass');
             if(('.nft-tabs').length){
                 // Show the first tab by default
             $('.nft-tabs-stage>div').hide();

+ 1 - 1
layouts/page/single.html

@@ -11,7 +11,7 @@
 
         {{ partial "nav.html" . }}
 
-        {{ partial "carousel.html" . }}
+        <!-- {{ partial "carousel.html" . }} -->
 
         {{ partial "visualfeature.html" . }}
 

+ 1 - 1
layouts/partials/LP_components/features.html

@@ -107,6 +107,6 @@
                 </div>
             </div>
         </div>
-        <button class="btn-dark">立即開始</button>
+        <button class="btn-dark" onclick="window.location.href=`https://video.choozmo.com/register.html`">立即開始</button>
     </div>
 </section>

+ 1 - 1
layouts/partials/LP_components/hero.html

@@ -6,7 +6,7 @@
                 <p class="hero-txt">輸入文字素材,即速產生影片<br>
                     創作影片,不再需要錄影機、演員、麥克風繁雜器材。<br>
                     大幅省下時間、人力、器材成本。</p>
-                <button class="hero-btn">立即開始</button>
+                <button class="hero-btn" onclick="window.location.href=`https://video.choozmo.com/register.html`">立即開始</button>
             </div>
             <div class="col-md-6 col-left" style="position: relative;">
                 <img src="img/背景紫.png" alt="" class="hero-purple">

+ 1 - 1
layouts/partials/LP_components/steps.html

@@ -30,6 +30,6 @@
                 </div>
             </div>
         </div>
-        <button class="btn-dark">立即開始</button>
+        <button class="btn-dark" onclick="window.location.href=`https://video.choozmo.com/register.html`">立即開始</button>
     </div>
 </section>

+ 1 - 0
layouts/partials/scripts.html

@@ -17,6 +17,7 @@
 <script src="{{ "js/gmaps.init.js" | relURL }}"></script>
 {{ end }}
 <script src="{{ "js/front.js" | relURL }}"></script>
+<script src="{{ "js/vtubers.js" | relURL }}"></script>
 
 <!-- owl carousel -->
 <script src="{{ "js/owl.carousel.min.js" | relURL }}"></script>

+ 2 - 2
layouts/shortcodes/vtuberlist.html

@@ -1,6 +1,6 @@
 <div>
 <div class="container vt-list">
-    <div class="row" style="margin-right: 0px">
+    <div class="row vt-content" style="margin-right: 0px">
         <div class="col-6 col-sm-4 col-md-3">
           <div class="card" style="width: 100%;">
             <div class="card-img-fr"><img class="card-img-top" src="https://www.tcbla.org.tw//img/16202921382044L6QIxJYF2J.jpg" alt="Card image cap"></div>
@@ -92,7 +92,7 @@
         </div>
         <div class="modal-body">
           <div class="modal-imgfr"><img src="https://s.zimedia.com.tw/s/QUQXtI-4" alt=""></div>
-          <h3 class="modal-body-title">名稱</h3>
+          <h3 class="modal-body-title">關於</h3>
           <p>可愛的歡樂散播者-Lu's 永遠傳遞愛的正能量。2013年開始發表於Facebook,一年飆破60萬追蹤人氣。
             筆下人物擁有一張白白胖胖的臉、短短的身材臉上的圓圓粉色腮紅,讓人一眼就能認出。知名角色妃妃&達達,
             多次成為品牌及活動代言人。插畫創作擁有可愛Q萌的色彩,加上療癒的人物造型,成為台灣女生最愛的代表人物之一。</p>

+ 8 - 2
static/css/custom.css

@@ -1593,6 +1593,8 @@
   transition: all .5s;
   text-align: center;
   height: fit-content;
+  border-radius: 1rem;
+  overflow: hidden;
 }
 
 .card:hover {
@@ -1629,10 +1631,14 @@
   border: 2px solid #EA5413;
   border-radius: 2rem;
   padding: 5px 12px;
+  cursor: pointer;
+  background-color: transparent;
+  transition: all .4s;
 }
 
-.card .card-link {
-  cursor: pointer;
+.card .card-link:hover {
+  color: white;
+  background-color: #EA5413;
 }
 
 .more-modal .btn-primary {

+ 3 - 1
static/js/front.js

@@ -20,6 +20,7 @@ $(function () {
   counters()
   demo()
   contactFormAjax()
+  getVtuber()
 })
 
 
@@ -400,4 +401,5 @@ $(window).resize(function () {
     }, 205)
     windowWidth = newWindowWidth
   }
-})
+});
+

+ 79 - 0
static/js/vtubers.js

@@ -0,0 +1,79 @@
+const data = [
+    {
+        "id": "0",
+        "name": "宇宙喵 Kuroro",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/16202921382044L6QIxJYF2J.jpg"
+    },
+    {
+        "id": "1",
+        "name": "達達與妃妃 DaiDai FeiFei",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/162029083055025AVzgnnjV0.jpg"
+    },
+    {
+        "id": "2",
+        "name": "汪來汪趣 wdog",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/162679825917082cO19F1hVS.jpg"
+    },
+    {
+        "id": "3",
+        "name": "左翌設計 ZoeL Design",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/16198905052188k1OnWjcRae.jpg"
+    },
+    {
+        "id": "4",
+        "name": "左翌設計 ZoeL Design",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/16198905052188k1OnWjcRae.jpg"
+    },
+    {
+        "id": "5",
+        "name": "左翌設計 ZoeL Design",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/16198905052188k1OnWjcRae.jpg"
+    },
+    {
+        "id": "6",
+        "name": "左翌設計 ZoeL Design",
+        "intro": "lorem",
+        "img": "https://www.tcbla.org.tw//img/16198905052188k1OnWjcRae.jpg"
+    },
+];
+
+
+function getVtuber() {
+    if(window.location.pathname.match('vtuber')) {
+      console.log('vtuber list');
+      let result = [...data];
+      console.log(result);
+      let str = '';
+      for(let i = 0; i < result.length; i++){
+        str += `<div class="col-6 col-sm-4 col-md-3">
+                    <div class="card" style="width: 100%;">
+                        <div class="card-img-fr"><img class="card-img-top" src="${result[i].img}" alt="Card image cap"></div>
+                        <div class="card-body">
+                            <h5 class="card-title">${result[i].name}</h5>
+                            <!-- <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6> -->
+                            <button class="card-link" data-toggle="modal" data-target="#more1Modal" data-id="${result[i].id}" >查看更多></button>
+                        </div>
+                    </div>
+                </div>`;
+      }
+      $('.vt-list .vt-content').html(str);
+
+      $('.vt-content .card-link').click(function(){
+          let selected = result.filter(item => 
+            item.id == $(this).data('id')
+          )[0];
+          console.log(selected);
+          $('#more1Modal .modal-title').text(selected.name);
+          $('#more1Modal .modal-imgfr img').attr('src', selected.img);
+          $('#more1Modal .p').text(selected.intro);
+      })
+    }
+}
+
+getVtuber();

+ 20 - 0
static/js/vtubers.json

@@ -0,0 +1,20 @@
+[
+    {
+        "id": "0",
+        "name": "text",
+        "intro": "lorem",
+        "img": "https://images.hhh.com.tw/uploads/_had/adlogo_15664_1619582509.jpg"
+    },
+    {
+        "id": "1",
+        "name": "text",
+        "intro": "lorem",
+        "img": "https://images.hhh.com.tw/uploads/_had/adlogo_15664_1619582509.jpg"
+    },
+    {
+        "id": "2",
+        "name": "text",
+        "intro": "lorem",
+        "img": "https://images.hhh.com.tw/uploads/_had/adlogo_15664_1619582509.jpg"
+    }
+]

+ 30 - 0
webSite/content/blog/Metaverseandnft.md

@@ -0,0 +1,30 @@
++++
+title = "Metaverse and NFT"
+date = "2021-09-30T13:39:46+02:00"
+tags = ["metaverse"]
+categories = ["metaverse"]
+banner = "https://img.chainnews.com/upload/cover/24d7b20ad76c5943a615c075a623cf19_pxGkAHe.png-large"
++++
+
+**What is happening with the metaverse? Why is it blowing up?**  
+The idea of the metaverse rode on the wave that NFTs sparked, at least since March and the big Beeple incident. But I think Mark Zuckerberg's announcement had some major implications for this space as well.  
+  
+Metaverse has been blowing up for a little while now, to be honest, especially digital land. Showing ownership of digital land is the most important use of NFTs, though art and gaming have sort of taken the limelight right now. Land, I think, is very important because it represents the nature of ownership in the NFT space probably better than any other asset category. Property rights are not equal all over the world. In the metaverse, the one asset category that represents absolute inalienable ownership is virtual land. And that is why, when we started to collect NFTs, the first category he looked at was land. Metapurse is the largest single estate owner in Decentraland. We own vast estates in Sandbox and Cryptovoxels, too. 
+
+It allows you to experience NFT art instead of just buying it and storing it someplace. Decentraland recently had a series of football matches, they are organising a music festival, they had gallery openings. All of this stuff happens in these worlds. So there is a lot of experiential activity. There are experiments in trying to make it a sort of an actual functioning virtual world, like Second Life, with the exception that everybody's land is their own. But we're still a far way away from that. There is a lot of interest in using these virtual worlds for product launches. I think it is very interesting.  
+  
+A virtual product is an exclusively digital representation of a product. It may be a virtual representation of a real product, or it may be a product that only exists in the virtual realm. While these products may not be “real” in the way we traditionally consider reality to be, they are plenty real enough for real people to be spending real money on them.  
+  
+For many companies, the applications for virtual products might be obvious. It’s easy to imagine someone buying a virtual high-end Ferrari to get an edge in a virtual racing simulator. Someone wearing an expensive suit in a virtual environment gains a similar benefit to wearing one in real life.  
+  
+It’s less easy to imagine how a company like Taco Bell might leverage virtual products. There are certain benefits to a Chalupa Supreme that don’t seem to easily translate into a virtual environment. That didn’t stop them from creating and selling tens of thousands of dollars in [virtual products](https://rarible.com/tacobell?tab=created) in the last month.  
+  
+The message is simple. If you make and sell products in the real world, there’s probably a way to make and sell those products in virtual environments. And as we progress toward an immersive multiverse, the value of those products will only increase.
+
+Globally, the video game industry is larger than the sports and film industries combined. Think about that for a second. How badly would you like for your products and/or brand to be featured in a hit movie or on a sports broadcast? You’d reach more people with a downloadable skin in Fortnite or a product placement in Animal Crossing.  
+  
+Even if you can’t make a fortune selling virtual products right now, you can immediately begin to leverage massive boosts in brand equity. Whether or not you have a product with a use case that matches one of today’s virtual worlds, you have a brand that can be put on virtual clothing, signage, artwork, and more.  
+  
+Not only are these audiences large, but they’re likely divergent in important ways from your traditional brand audience. Companies are using NFTs and virtual products to reach younger audiences. Two-thirds of Fortnite players are 24 years old and younger. Roblox’s user base is even younger, with two-thirds of players under 16.  
+  
+Luxury brands in particular find value in allowing virtual users to purchase virtual versions of their expensive products long before they might be able to do so in the “real” world.

+ 19 - 0
webSite/content/blog/metaverse_fb.md

@@ -0,0 +1,19 @@
++++
+title = "7 Megatrends Shaping the Metaverse"
+date = "2021-09-30T13:39:46+02:00"
+tags = ["metaverse"]
+categories = ["metaverse"]
+banner = "https://img.chainnews.com/upload/cover/24d7b20ad76c5943a615c075a623cf19_pxGkAHe.png-large"
++++
+
+[Facebook has announced](https://about.fb.com/news/2021/09/building-the-metaverse-responsibly/) a $50 million fund that it says will help it develop the metaverse more responsibly. It’s officially called the XR Programs and Research Fund, and the company says it’ll be invested into “programs and external research” over the course of two years. Facebook [has previously funded](https://research.fb.com/programs/research-awards/proposals/2021-towards-trustworthy-products-in-ar-vr-and-smart-devices-request-for-proposals/) academic research into the social impact of AR wearables and solicited VR hardware proposals. Facebook’s announcement blog calls the metaverse the “next computing platform” and says that the company will be working with policymakers, researchers, and industry partners while building it.
+
+The announcement also gives us Facebook’s definition of the sometimes nebulous word “metaverse.” The company describes it as “virtual spaces where you can create and explore with other people” that you’re not physically with, spread out over a variety of products and services. Facebook says the fund’s goal is to make sure it builds its part of the metaverse with an eye towards compatibility with other services, as well as inclusivity, privacy, safety, and “economic opportunity.” Right now, Facebook’s metaverse biggest metaverse program is [a platform called Horizon](https://www.theverge.com/2020/8/28/21405249/facebook-vr-space-horizon-access-public-beta), which [exists as a beta Oculus app](https://www.theverge.com/2021/8/19/22629942/facebook-workrooms-horizon-oculus-vr) that lets people have VR meetings.
+
+[The company says](https://about.fb.com/news/2021/09/building-the-metaverse-responsibly/) it’ll be partnering with organizations like Women in Immersive Tech, Africa No Filter, Electric South, and the Organization of American States. It also says it’ll “facilitat\[e\] independent external research” with organizations like the University of Hong Kong and the National University of Singapore. When asked for comment on how the research will stay independent if Facebook is involved with it, the company said it would only be providing funds to the researchers, not data.
+
+Facebook VP Nick Clegg also spoke about the program, calling it “a start” to research into the metaverse, and saying that he hoped it would help provide answers when regulators start asking questions about the new tech.
+
+Facebook has recently been trying to paint itself as a responsible platform owner. On Monday, it announced that it was [pausing work on a pre-teen-focused Instagram](https://www.theverge.com/2021/9/27/22696039/facebook-instagram-kids-app-pause-development-criticism) after the company [strongly pushed back against a report](https://www.theverge.com/2021/9/26/22695629/facebook-says-instagram-is-not-toxic-for-teens-despite-damning-wsj-report) that claimed the company [knew Instagram was bad for teenage girls](https://www.theverge.com/2021/9/15/22675130/facebook-instagram-teens-mental-health-damage-internal-research). The company has also said [it’s becoming more transparent](https://www.theverge.com/2021/9/23/22688840/facebook-releases-content-distribution-guidelines-for-news-feed) about what types of posts its algorithms try to hide and [issued denials](https://twitter.com/joeosborne/status/1440452726433804296?s=21) about another report that said the company tried to promote itself using the News Feed. Despite its efforts, it’s still been mired in controversy: it had to apologize to researchers [after providing them inaccurate data](https://www.theverge.com/2021/9/11/22668396/facebook-provided-inaccurate-data-misinformation-researchers), and its oversight board has [called for more information](https://www.theverge.com/2021/9/21/22686364/facebook-oversight-board-xcheck-moderation-exemption) about how the platform [moderated its famous users differently](https://www.theverge.com/2021/9/13/22671565/facebook-xcheck-moderation-system-high-profile-exemptions).
+
+While Facebook pitches this fund as metaverse-focused, it appears to have a broader focus given its name. The company already does a lot of [research in the AR/VR space](https://research.fb.com/programs/research-awards/proposals/2021-towards-trustworthy-products-in-ar-vr-and-smart-devices-request-for-proposals/), and while $50 million is a lot of money, it’s a very small portion of [what Facebook makes in a single quarter](https://www.theverge.com/2021/7/28/22598592/facebook-second-quarter-earnings-29-billion) (never mind the two years over which the fund will be invested). The amount also doesn’t seem to match the importance Facebook places on AR/VR and the [future impact of the metaverse](https://www.theverge.com/22588022/mark-zuckerberg-facebook-ceo-metaverse-interview).

+ 21 - 0
webSite/content/blog/metaverse_megatrend.md

@@ -0,0 +1,21 @@
++++
+title = "7 Megatrends Shaping the Metaverse"
+date = "2021-09-30T13:39:46+02:00"
+tags = ["metaverse"]
+categories = ["metaverse"]
+banner = "https://img.chainnews.com/upload/cover/24d7b20ad76c5943a615c075a623cf19_pxGkAHe.png-large"
++++
+
+## 7 Megatrends Shaping the Metaverse
+
+Metaverse describe the concept of a future iteration of the internet, made up of persistent, shared, 3D virtual spaces linked into a perceived virtual universe.
+Virtual Mainstreaming: people increasingly regard the virtual world to be as real as the physical world. Virtual mainstreaming is core tech of Metaverse.
+Machine Intelligence: This includes domains sometimes called deep learning, machine learning, and artificial intelligence.
+Cybernetics: It is about the integration of human sensory and motor systems with computers.
+Challenge By Open Systems, the original intent of the Internet was a highly distributed, decentralized network of interoperable computers and applications.
+Blockchain Adoption, it allow for trustless data exchanges; decentralized authority, a record of history and provenance, provable scarcity of assets.
+Accelerating Distributed Networks: 5G networks will improve mobile networking speeds, concurrency and latency by orders of magnitude. And 5G is not the end of the road: 6G will improve these metrics by another 10–100X. We should see 10 Gbps speeds with latency down to 1ms within the decade.
+Simulating Reality: Almost every game with 3D graphics generated real-time imagery was through a collection of hacks called shader programming. Ray tracing uses the physics of light to simulate how images look based on how photons bounce between and through different materials.
+
+
+![Megatrends Shaping the Metaverse](https://i.imgur.com/RAjxW0v.png)

+ 20 - 0
webSite/content/blog/metaverse_story.md

@@ -0,0 +1,20 @@
++++
+title = "Metaverse Story"
+date = "2021-09-30T13:39:46+02:00"
+tags = ["metaverse"]
+categories = ["metaverse"]
+banner = "https://img.chainnews.com/upload/cover/24d7b20ad76c5943a615c075a623cf19_pxGkAHe.png-large"
++++
+
+## 5 Movies That Inspired Metaverse
+Tron, represented an early glimpse into the vision for how computers could create a Metaverse. It represented an early notion of what an immersive “cyberspace”. Tron also does an interesting job of showcasing how human/AI interaction could be a feature of a Metaverse environment.
+
+Matrix, introduces the concepts of downloaded consciousness, digital constructs, and showcases how avatars empower personal expression which can vary within digital environments. The movie explores the philosophical nature of building a utopian environment.
+
+Ready Player One, most recent example of what many modern visions of the Metaverse looks like. Immersive, persistent digital worlds filled with users from all over the physical world. Users are presented with an infinite number of opportunities within this digital contract including, education, work, and play.
+
+Inception, is useful in understanding the worldbuilding capabilities we aspire to incorporate in a Metaverse. The characters that infiltrate dreams are able to create unique constructs as prop settings for shared experiences.
+
+The Terminator, shows issues of morality in determining what constitutes sentience and whether AI has a right to freedoms. We may also need to build natural constraints that prevent baseline sentience to prevent future forecasted in The Terminator.
+
+![Metaverse Story](https://i.imgur.com/LrRJ4F6.png)