Procházet zdrojové kódy

Merge branch 'master' of http://git.choozmo.com:3000/choozmo/AI_Anchor_2

ming před 3 roky
rodič
revize
c86b106c09

+ 8 - 2
html/index.html

@@ -65,7 +65,7 @@
                         </ul>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link active btn-login" aria-current="page" href="login.html" set-lan="html:login">登入</a>
+                        <a class="nav-link active btn-login" aria-current="page" href="loginB.html" set-lan="html:login">登入</a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link btn-userProfile" aria-current="page" href="user_profile.html" set-lan="html:user_profile">會員資料</a>
@@ -91,6 +91,12 @@
     </div>
     <div class="price-int mt-5">
         <div class="price-content m-auto">
+            <div class="register_btn">
+                <p class="mt-5" set-lan="html:index_action">想要快速製作影音內容?立即註冊,開始創作!</p>
+                <div class="text-center">
+                    <a href="./register.html"><button class="get-started my-3" set-lan="html:pricing_checkout">立即註冊</button></a>
+                </div>
+            </div>
             <div class="price-content-1 text-center">
                 <h1 class="pb-5 pe-3"><i style="color:#EA5413" class="fas fa-tags pe-2"></i><lan set-lan="html:launch_special">限時早鳥方案</lan></h1>
                 <div class="row">
@@ -122,7 +128,7 @@
                 </div>
              
                 <!-- <h1 class="mt-5 d-inline pe-5">$1200/7min</h1> -->
-                <p class="mt-5" set-lan="html:index_action">想要快速製作影音內容?立即註冊,開始創作!</p>
+                <p class="register_text mt-5" set-lan="html:index_action">想要快速製作影音內容?立即註冊,開始創作!</p>
                 <a href="./register.html"><button class="get-started my-3" set-lan="html:pricing_checkout">立即註冊</button></a>
             </div>
         </div>

+ 1 - 1
html/indexB.html

@@ -65,7 +65,7 @@
                         </ul>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link active btn-login" aria-current="page" href="login.html" set-lan="html:login">登入</a>
+                        <a class="nav-link active btn-login" aria-current="page" href="loginB.html" set-lan="html:login">登入</a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link btn-userProfile" aria-current="page" href="user_profile.html" set-lan="html:user_profile">會員資料</a>

+ 184 - 0
html/invite.html

@@ -0,0 +1,184 @@
+<!DOCTYPE html>
+<html lang="zh-TW">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="Cache-Control" content="no-cache">
+    <title>AI Spokesgirl</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
+      crossorigin="anonymous">
+    <link rel="stylesheet"
+      href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
+      crossorigin="anonymous">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet"> 
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.css">
+    <link rel="stylesheet" href="static/owl.carousel.min.css">
+    <link rel="stylesheet" href="static/owl.theme.default.min.css">
+    <link rel="stylesheet" href="static/scss/style.css">
+    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+
+    <!-- Google Tag Manager -->
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-5M8S4GH');</script>
+    <!-- End Google Tag Manager -->
+</head>
+
+<body>
+    <!-- Google Tag Manager (noscript) -->
+    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5M8S4GH"
+    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+    <!-- End Google Tag Manager (noscript) -->
+
+    <!-- ================================================================= -->
+    <!-- navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light d-block d-md-none">
+        <div class="container-fluid">
+            <a class="navbar-brand" href="index.html">AI Spokesgirl</a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
+                data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
+                aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarSupportedContent">
+                <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
+                    <li class="nav-item">
+                        <a class="nav-link active" aria-current="page" href="pricing.html" set-lan="html:pricing">早鳥方案</a>
+                    </li>
+                    <li class="nav-item dropdown">
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
+                            中/En
+                        </a>
+                        <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                            <li><button class="nav-link lan-swtich" aria-current="page" set-lan="html:en" onclick="changeLan(this)" value="en">English</button></li>
+                            <li><button class="nav-link lan-switch" aria-current="page" set-lan="html:zh" onclick="changeLan(this)" value="zh">中文</button></li>
+                        </ul>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link active btn-login" aria-current="page" href="login.html" set-lan="html:login">登入</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-userProfile" aria-current="page" href="user_profile.html" set-lan="html:user_profile">會員資料</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-logout" aria-current="page" set-lan="html:logout">登出</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <!-- ================================================================= -->
+
+
+    <!-- ================================================================= -->
+    <!-- content -->
+    <div class="container-fluid px-0">
+        <div class="container-login">
+            <div class="row-img">
+                <video autoplay loop class="video">
+                    <source src="static/img/登入影片.mp4" type="video/mp4">
+                </video>
+                <div class="row-img-box text-center">
+                    <h2 set-lan="html:logleftbox1">將你的生活、創作 、宣傳做成影片</h2>
+                    <h4 set-lan="html:logleftbox2">開始使用 AI Spokesgirl</h4>
+                </div>
+                <div class="row-img-txt text-center">ChoozMo AI Spokesgirl</div>
+            </div>
+            <div class="row-login">
+                <div class="login-top d-none d-md-block">
+                    <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
+                        <li class="nav-item">
+                            <a class="nav-link active" aria-current="page" href="pricing.html" set-lan="html:pricing">早鳥方案</a>
+                        </li>
+                        <li class="nav-item dropdown">
+                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
+                                中/En
+                            </a>
+                            <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                <li><button class="nav-link lan-swtich" aria-current="page" set-lan="html:en" onclick="changeLan(this)" value="en">English</button></li>
+                                <li><button class="nav-link lan-switch" aria-current="page" set-lan="html:zh" onclick="changeLan(this)" value="zh">中文</button></li>
+                            </ul>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link active btn-login" aria-current="page" href="login.html" set-lan="html:login">登入</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link btn-userProfile" aria-current="page" href="user_profile.html" set-lan="html:user_profile">會員資料</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link btn-logout" aria-current="page" set-lan="html:logout">登出</a>
+                        </li>
+                    </ul>
+                </div>
+                <div class="login-content">
+                    <!-- 已登入 {% if success %} -->
+                  <!-- 未登入 {% endif %} -->
+                    <h2 class="my-3 title" set-lan="html:goRegister">REGISTER</h2>
+                    <div class="tab-content" id="myTabContent">
+                        <div class="tab-pane fade p-lg-3 show active" id="register" role="tabpanel" aria-labelledby="register-tab">
+                            <form>
+                                <div class="form-floating mb-3">
+                                    <input type="text" class="form-control" id="username" name="username" placeholder="User name" required>
+                                    <label for="username"><i class="fas fa-user me-2"></i>User name</label>
+                                </div>
+                                <div class="form-floating mb-3">
+                                    <input type="email" class="form-control" id="email" name="email" placeholder="name@example.com" required>
+                                    <label for="email"><i class="fas fa-envelope me-2"></i>Email address</label>
+                                </div>
+                                <div class="form-floating mb-3">
+                                    <input type="password" class="form-control" id="password" name="password"  placeholder="Password" required>
+                                    <label for="password"><i class="fas fa-lock me-2"></i>Password</label>
+                                </div>
+                                <!-- <div class="mb-3">
+                                    <input type="checkbox" id="privacy" name="privacy" checked required>
+                                    <label for="privacy"><a href="privacy.html" class="link_privacy" target="_blank" set-lan="html:privacy_term">同意隱私政策及使用條款</a></label>
+                                </div> -->
+                                <div class="d-flex justify-content-center">
+                                    <p set-lan="html:oldHere">已經有帳號?</p>
+                                    <a class="ms-1" href="login.html" set-lan="html:login">登入</a>
+                                </div>
+                                <div class="mb-3 d-flex justify-content-center">
+                                    <button type="button" class="btn btn-primary align-items-center btn-register" set-lan="html:goRegister_link">立即註冊</button>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- ================================================================= -->
+
+
+    <!-- ================================================================= -->
+    <!-- footer -->
+    <footer class="fixed-bottom text-center py-2">
+
+    </footer>
+    <!-- ================================================================= -->
+  
+    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
+    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js'></script>
+    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"
+        integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" 
+        crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js"
+        integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script> 
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.all.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/validatorjs/2.0.0/validator.min.js" 
+        integrity="sha512-Y/Pox7RqKmT84klgmJCva3drWoXQWO42oHiWWhb9zd1pkIH60NF2SamgBrFHOTzrzHJhwgPGNGjNJ5ZmxLpUAQ=="
+        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script src="static/owl.carousel.min.js"></script>
+    <script src="invite.js"></script>
+    <script type="text/javascript" src="static/lan.js"></script>
+    <script src="static/common.js"></script>
+</body>
+
+</html>

+ 146 - 0
html/invite.js

@@ -0,0 +1,146 @@
+const btnRegister = document.querySelector('.btn-register');
+const btnLoginPage = document.querySelector('.btn-login');
+const btnUserProfile = document.querySelector('.btn-userProfile');
+const btnLogout = document.querySelector('.btn-logout');
+const registerPassword = document.querySelector('#register #password');
+const btnLoginPage_d = document.querySelector('.login-top .btn-login');
+const btnUserProfile_d = document.querySelector('.login-top .btn-userProfile');
+const btnLogout_d= document.querySelector('.login-top .btn-logout');
+
+registerPassword.addEventListener('keyup', registerByEnter);
+btnRegister.addEventListener('click', register);
+
+function registerByEnter(e) {
+    if (e.keyCode === 13) {
+        e.preventDefault();
+        console.log('login!');
+        register();
+    }
+};
+
+function validateEmail(email) {
+    const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+    if(re.test(String(email).toLowerCase()) === false) {
+        $('#register [name = "email"]').addClass('error');
+        if( !$('.error-text').length ) {
+            let msg = '請輸入正確E-mail';
+
+            if (lang == 'en') { 
+                msg = 'Please enter valid Email format.';
+            }
+
+            $('input.error').after('<p class="error-text" set-lan="html:errorEmail">' + msg + '</p>');
+        } 
+    } else {
+        $('#register [name = "email"]').removeClass('error');
+        $('.error-text').remove();
+    }
+    
+    return re.test(String(email).toLowerCase());
+}
+
+function validatePassword(psd) {
+    if(psd.length >=4) {
+        $('#register [name = "password"]').removeClass('error');
+        $('.error-text').remove();
+        return true;
+    } else {
+        $('#register [name = "password"]').addClass('error');
+        if( !$('.error-text').length ) {
+            $('input.error').after('<p class="error-text" set-lan="html:errorPsd">密碼至少為4個字元</p>');
+        } 
+        return false;
+    }
+}
+
+function getpathId() {
+  id = window.location.search.split('?').pop();
+  if(id.split('=')[0] === 'code') {
+    return id.split('=')[1];
+  }
+}
+
+function register() {
+    let url = 'https://www.choozmo.com:8887/register';
+    let userName = $('#register [name = "username"]').val();
+    let email = $('#register [name = "email"]').val();
+    let password = $('#register [name = "password"]').val();
+    let code = getpathId();
+
+    let userObj = {
+      username: userName,
+      email,
+      password
+    }
+
+    if(code) {
+      url = 'https://www.choozmo.com:8887/register_by_invite';
+      userObj = {
+        username: userName,
+        email,
+        password,
+        code: code
+      }
+    }
+
+    // 註冊資料檢查
+    if (username == '' || password == '') {
+        let title = "註冊失敗";
+        let text = "請先輸入您的帳號/密碼";
+
+        if (lang == 'en') { 
+            title = "Login Failed!";
+            text = "Please enter your username and password";
+        }
+
+        Swal.fire({
+            title: title,
+            icon: 'error',
+            text: text,
+            confirmButtonColor: '#3085d6',
+        });
+
+        return;
+    }
+
+    if(userName && validateEmail(email) && validatePassword(password)) {
+        console.log(userObj);
+        const headers = {
+            "accept": "application/json",
+            "Content-Type": "application/json"
+        }
+        axios({
+            method: 'post',
+            url: 'https://www.choozmo.com:8887/register',
+            headers: headers,
+            data: userObj
+        }).then(res => {
+            console.log(res.data.msg);
+            let text;
+            if (lang == 'en') { 
+                text = res.data.msg.eng;
+            } else {
+                text = res.data.msg.zh;
+            }
+            Swal.fire({
+                icon: 'info',
+                text: text,
+                confirmButtonColor: '#3085d6',
+            });
+        }).catch(err => {
+            console.log(err);
+        })
+    }
+}
+
+
+function loginControl() {
+    btnLoginPage.style.display = 'block';
+    btnLogout.style.display = 'none';
+    btnUserProfile.style.display = 'none';
+    btnLoginPage_d.style.display = 'block';
+    btnLogout_d.style.display = 'none';
+    btnUserProfile_d.style.display = 'none';
+}
+
+loginControl();

+ 3 - 3
html/loginB.html

@@ -72,7 +72,7 @@
                         </li>
                     </div>
                     <li class="nav-item">
-                        <a class="nav-link active btn-login" aria-current="page" href="login.html"
+                        <a class="nav-link active btn-login" aria-current="page" href="loginB.html"
                             set-lan="html:login">登入</a>
                     </li>
                     <li class="nav-item">
@@ -118,7 +118,7 @@
                             </ul>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link active btn-login" aria-current="page" href="login.html"
+                            <a class="nav-link active btn-login" aria-current="page" href="loginB.html"
                                 set-lan="html:login">登入</a>
                         </li>
                         <li class="nav-item">
@@ -176,7 +176,7 @@
                             </ul>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link active btn-login" aria-current="page" href="login.html"
+                            <a class="nav-link active btn-login" aria-current="page" href="loginB.html"
                                 set-lan="html:login">登入</a>
                         </li>
                         <li class="nav-item">

+ 27 - 8
html/make_video_long.html

@@ -224,13 +224,33 @@
             <div class="col-lg-10 px-0">
                 <div>
                     <form id="msform">
-                        <div class="linker__box">
-                            <p set-lan="html:preview_videos">預覽影片</p>
-                            <i class="fas fa-link"></i>
-                            <a id='linker' style="display: none;" class="ms-2" set-lan="html:video_link">影片連結</a>
-                        </div>
-                        <!-- fieldsets -->
                         <fieldset>
+                            <h3 class="fs-subtitle">
+                                <lan set-lan="html:video_long_title">標題</lan>
+                            </h3>
+                            <style>
+                                .embed-container {
+                                    position: relative;
+                                    padding-bottom: 56.25%;
+                                    height: 0;
+                                    overflow: hidden;
+                                    max-width: 100%;
+                                }
+    
+                                .embed-container iframe,
+                                .embed-container object,
+                                .embed-container embed {
+                                    position: absolute;
+                                    top: 0;
+                                    left: 0;
+                                    width: 100%;
+                                    height: 100%;
+                                }
+                            </style>
+                            <div class='embed-container'><iframe class='youtube-video' src='https://www.youtube.com/embed//bowrtLQ6mg4'
+                                    frameborder='0' allowfullscreen height="394" allow="autoplay;"></iframe></div>
+                        </fieldset>
+                        <!--<fieldset>
                             <h3 class="fs-subtitle">
                                 <lan set-lan="html:video_title">標題</lan><img class="ms-1" src="static/img/question.png"
                                     alt="" data-bs-toggle="tooltip" data-bs-placement="right" title="將作為影片的內嵌標題">
@@ -342,9 +362,8 @@
                             <div style="display: none;" id="myProgress">
                                 <div style="display: none;" id="myBar">0%</div>
                             </div>
-                        </fieldset>
+                        </fieldset> -->
                     </form>
-                    <!-- <div style="width: 80%;margin: 0 auto;"><iframe src="http://www.choozmo.com:8168/ai_anchor_video/16250306886652043.mp4" frameborder="0" style="width: 100%;height: 400px;"></iframe></div> -->
                 </div>
             </div>
             <!-- <div id="mySidenav" class="sidenav">

+ 140 - 19
html/pricing.html

@@ -39,8 +39,108 @@
     <!-- End Google Tag Manager (noscript) -->
 
     <!-- ================================================================= -->
+    <div class="card">
+        <img class="profile-bgimg-m img-fluid" src="./static/img/userprofile/banner-m.png" class="card-img" alt="...">
+        <!-- 行動版選單 -->
+        <div class="menu-box">
+            <div class="menu-box2">
+                <div style="font-size: 28px;" class="close_btn text-end">
+                    <i class="fas fa-times text-white me-3 mt-3"></i>
+                </div>
+                <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
+                    <li class="nav-item">
+                        <a class="nav-link active" aria-current="page" href="pricing.html"
+                            set-lan="html:pricing">早鳥方案</a>
+                    </li>
+                    <li id="changeLanguage" class="nav-item me-lg-1">
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
+                            data-bs-toggle="dropdown" aria-expanded="false">
+                            中/En
+                        </a>
+                        <!-- <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                <li><button class="nav-link lan-swtich" aria-current="page" set-lan="html:en"
+                                        onclick="changeLan(this)" value="en">English</button></li>
+                                <li><button class="nav-link lan-switch" aria-current="page" set-lan="html:zh"
+                                        onclick="changeLan(this)" value="zh">中文</button></li>
+                            </ul> -->
+                    </li>
+                    <div id="lang-manu">
+                        <li><button class="nav-link lan-swtich bg-transparent text-white border-0 mx-auto"
+                                aria-current="page" set-lan="html:en" onclick="changeLan(this)"
+                                value="en">English</button></li>
+                        <li><button class="nav-link lan-switch bg-transparent text-white border-0 mx-auto"
+                                aria-current="page" set-lan="html:zh" onclick="changeLan(this)" value="zh">中文</button>
+                        </li>
+                    </div>
+                    <li class="nav-item">
+                        <a class="nav-link active btn-login" aria-current="page" href="login.html"
+                            set-lan="html:login">登入</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-userProfile" aria-current="page" href="user_profile2.html"
+                            set-lan="html:user_profile">會員資料</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-logout" aria-current="page" set-lan="html:logout">登出</a>
+                    </li>
+                </ul>
+
+            </div>
+        </div>
+        <div class="card-img-overlay pt-2 py-lg-3">
+            <nav class="navbar navbar-expand-lg navbar-light d-block d-md-none pt-0">
+
+                <!-- <a class="navbar-brand d-block d-md-none" href="index.html">AI Spokesgirl</a> -->
+
+                <!-- <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
+                        data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
+                        aria-label="Toggle navigation">
+                        <span class="navbar-toggler-icon"></span>
+                    </button> -->
+                <div class="collapse navbar-collapse d-flex" id="navbarSupportedContent">
+                    <a href="./index.html">
+                        <img width="150" src="./static/img/contactus/CMM_LOGO.png" alt="">
+                    </a>
+                    <ul class="navbar-des navbar-nav ms-auto mb-2 mb-lg-0">
+                        <li class="nav-item">
+                            <a class="nav-link active" aria-current="page" href="pricing.html"
+                                set-lan="html:pricing">早鳥方案</a>
+                        </li>
+                        <li class="nav-item dropdown">
+                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
+                                data-bs-toggle="dropdown" aria-expanded="false">
+                                中/En
+                            </a>
+                            <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                <li><button class="nav-link lan-swtich" aria-current="page" set-lan="html:en"
+                                        onclick="changeLan(this)" value="en">English</button></li>
+                                <li><button class="nav-link lan-switch" aria-current="page" set-lan="html:zh"
+                                        onclick="changeLan(this)" value="zh">中文</button></li>
+                            </ul>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link active btn-login" aria-current="page" href="loginB.html"
+                                set-lan="html:login">登入</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link btn-userProfile" aria-current="page" href="user_profile2.html"
+                                set-lan="html:user_profile">會員資料</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link btn-logout" aria-current="page" set-lan="html:logout">登出</a>
+                        </li>
+                    </ul>
+                    <span class="menu-bar ms-auto" style="font-size: 32px;"><i
+                            class="fas fa-bars text-white"></i></span>
+                </div>
+
+            </nav>
+
+        </div>
+    </div>
     <!-- navbar -->
-    <nav class="navbar navbar-expand-lg navbar-light">
+
+    <nav id="pricing-nav" class="navbar navbar-expand-lg navbar-light">
         <div class="container-fluid">
             <a class="navbar-brand" href="index.html"><img class="img-fluid" style="width: 150px;" src="./static/img/contactus/choozmo-nav.png" alt=""></a>
             <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
@@ -81,7 +181,7 @@
     <!-- ================================================================= -->
     <!-- content -->
     <!-- 手機版 -->
-    <div class="d-block d-md-none">
+    <div class="d-block d-md-none mt-5">
         <div class="container text-center">
             <div class="row">
                 <div class="col-md-4 col-sm-6">
@@ -169,25 +269,27 @@
     <script type="text/javascript" src="static/lan.js"></script>
     <script src="static/common.js"></script>
     <script>
-        const btnLoginPage = document.querySelector('.btn-login');
-        const btnUserProfile = document.querySelector('.btn-userProfile');
-        const btnLogout = document.querySelector('.btn-logout');
-        btnLoginPage.style.display = 'none';
-        btnLogout.style.display = 'none';
-        btnUserProfile.style.display = 'none';
+        $('.btn-login').hide();
+        $('.btn-userProfile').hide();
+        $('.btn-logout').hide();
         function get_jwt_token(){
             if(!document.cookie) {
                 return
             }
-            jwt_raw = document.cookie.split(';').filter(s=>s.includes('jwt_token'))[0]
-            return jwt_raw.split('=')[1]
+            try {
+                jwt_raw = document.cookie.split(';').filter(s=>s.includes('jwt_token'))[0];
+                return jwt_raw.split('=')[1];
+            } catch (e) {
+                return undefined;
+            }
         }
         function checkRoute() {
             let jwt_token = get_jwt_token();
             if(jwt_token == undefined) {
-                btnLoginPage.style.display = 'block';
-                btnLogout.style.display = 'none';
-                btnUserProfile.style.display = 'none';
+                console.log(jwt_token); // test
+                $('.btn-login').show();
+                $('.btn-userProfile').hide();
+                $('.btn-logout').hide();
                 return;
             }
             axios({
@@ -200,19 +302,38 @@
             }).then(res => {
                 console.log(res.data);
                 if(res.status !== 200) {
-                    btnLoginPage.style.display = 'block';
-                    btnLogout.style.display = 'none';
-                    btnUserProfile.style.display = 'none';
+                    $('.btn-login').show();
+                    $('.btn-userProfile').hide();
+                    $('.btn-logout').hide();
                 }
-                btnLoginPage.style.display = 'none';
-                btnLogout.style.display = 'block';
-                btnUserProfile.style.display = 'block';
+                $('.btn-login').hide();
+                $('.btn-userProfile').show();
+                $('.btn-logout').show();
             }).catch(err => {
                 console.log(err);
             });
         }
         checkRoute();
     </script>
+     <script>
+        $(".menu-bar").click(function () {
+            $(".menu-box").fadeIn();
+            $(".menu-box2").fadeIn();
+
+        });
+
+        $(".close_btn").click(function () {
+            $(".menu-box").fadeOut();
+            $(".menu-box2").fadeOut();
+
+        });
+        $("#lang-manu").hide();
+
+        $("#changeLanguage").click(function () {
+            $("#lang-manu").slideToggle();
+            $("#lang-arrow").toggleClass("arrowdoup");
+        });
+    </script>
 </body>
 
 </html>

+ 218 - 0
html/pricingB.html

@@ -0,0 +1,218 @@
+<!DOCTYPE html>
+<html lang="zh-TW">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1">
+    <meta http-equiv="Cache-Control" content="no-cache">
+    <title>AI Spokesgirl</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
+      crossorigin="anonymous">
+    <link rel="stylesheet"
+      href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
+      crossorigin="anonymous">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet"> 
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.css">
+    <link rel="stylesheet" href="static/owl.carousel.min.css">
+    <link rel="stylesheet" href="static/owl.theme.default.min.css">
+    <link rel="stylesheet" href="static/scss/style.css">
+    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    
+    <!-- Google Tag Manager -->
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-5M8S4GH');</script>
+    <!-- End Google Tag Manager -->
+</head>
+
+<body>
+    <!-- Google Tag Manager (noscript) -->
+    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5M8S4GH"
+    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+    <!-- End Google Tag Manager (noscript) -->
+
+    <!-- ================================================================= -->
+    <!-- navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light">
+        <div class="container-fluid">
+            <a class="navbar-brand" href="index.html"><img class="img-fluid" style="width: 150px;" src="./static/img/contactus/choozmo-nav.png" alt=""></a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
+                data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
+                aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarSupportedContent">
+                <ul class="navbar-nav mb-2 ms-auto mb-lg-0">
+                    <li class="nav-item">
+                        <a class="nav-link active" aria-current="page" href="pricing.html" set-lan="html:pricing">早鳥方案</a>
+                    </li>
+                    <li class="nav-item dropdown">
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
+                            中/En
+                        </a>
+                        <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                            <li><button class="nav-link lan-swtich" aria-current="page" set-lan="html:en" onclick="changeLan(this)" value="en">English</button></li>
+                            <li><button class="nav-link lan-switch" aria-current="page" set-lan="html:zh" onclick="changeLan(this)" value="zh">中文</button></li>
+                        </ul>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link active btn-login" aria-current="page" href="login.html" set-lan="html:login">登入</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-userProfile" aria-current="page" href="user_profile2.html" set-lan="html:user_profile">會員資料</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link btn-logout" aria-current="page" set-lan="html:logout">登出</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <!-- ================================================================= -->
+
+
+    <!-- ================================================================= -->
+    <!-- content -->
+    <!-- 手機版 -->
+    <div class="d-block d-md-none">
+        <div class="container text-center">
+            <div class="row">
+                <div class="col-md-4 col-sm-6">
+                    <div class="pricingTable">
+                        <div class="pricingTable-header">
+                            <h3 class="title" set-lan="html:launch_special">早鳥方案</h3>
+                        </div>
+                        <ul class="pricing-content">
+                            <li set-lan="html:pricing_lan">語言選擇: 中文 | 英文</li>
+                            <li set-lan="html:pricing_avatars">多款預設AI代言主播任你選</li>
+                            <li set-lan="html:pricing_content">畫面素材支援: 圖檔 | 影檔 | 簡報</li>
+                            <!-- <li class="disable">Maintenance</li>
+                            <li class="disable">15 Subdomains</li> -->
+                        </ul>
+                        <div class="price-value">
+                            <span class="price-title" set-lan="html:pricing_discount">限時優惠</span>
+                            <span class="price-amount">$1200 <span class="duration">7<lan set-lan="html:mins">分鐘</lan></span></span>
+                        </div>
+                        <div class="pricingTable-signup">
+                            <a href="https://p.ecpay.com.tw/B3701C8" target="_blank" set-lan="html:pricing_checkout">立即註冊</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 電腦版 -->
+    <div class="d-none d-md-block">
+        <div class="container-fluid text-center">
+            <div class="row">
+                <div class="col-4">
+                    <div class="pricingTable">
+                        <div class="pricingTable-header">
+                            <div class="title" set-lan="html:launch_special" style="font-size:2rem;">早鳥方案</div>
+                        </div>
+                        <ul class="pricing-content">
+                            <li set-lan="html:pricing_lan">語言選擇: 中文 | 英文</li>
+                            <li set-lan="html:pricing_avatars">多款預設AI代言主播任你選</li>
+                            <li set-lan="html:pricing_content">畫面素材支援: 圖檔 | 影檔 | 簡報</li>
+                            <!-- <li class="disable">Maintenance</li>
+                            <li class="disable">15 Subdomains</li> -->
+                        </ul>
+                        <div class="price-value">
+                            <span class="price-title" set-lan="html:pricing_discount">限時優惠</span>
+                            <span class="price-amount">$1200 <span class="duration">7<lan set-lan="html:mins">分鐘</lan></span></span>
+                        </div>
+                        <div class="pricingTable-signup">
+                            <a href="https://p.ecpay.com.tw/B3701C8" target="_blank" set-lan="html:pricing_checkout">立即查看</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-8">
+                    <a href="https://p.ecpay.com.tw/B3701C8" target="_blank">
+                        <img class="img-fluid" src="static/img/intro2.jpg" set-lan="img:intro_img"></img>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    
+    
+    <!-- ================================================================= -->
+
+
+    <!-- ================================================================= -->
+    <!-- footer -->
+    <footer class="fixed-bottom text-center py-2">
+
+    </footer>
+    <!-- ================================================================= -->
+  
+    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
+    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js'></script>
+    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"
+        integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" 
+        crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js"
+        integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script> 
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.all.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/validatorjs/2.0.0/validator.min.js" 
+        integrity="sha512-Y/Pox7RqKmT84klgmJCva3drWoXQWO42oHiWWhb9zd1pkIH60NF2SamgBrFHOTzrzHJhwgPGNGjNJ5ZmxLpUAQ=="
+        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script src="static/owl.carousel.min.js"></script>
+    <script type="text/javascript" src="static/lan.js"></script>
+    <script src="static/common.js"></script>
+    <script>
+        const btnLoginPage = document.querySelector('.btn-login');
+        const btnUserProfile = document.querySelector('.btn-userProfile');
+        const btnLogout = document.querySelector('.btn-logout');
+        btnLoginPage.style.display = 'none';
+        btnLogout.style.display = 'none';
+        btnUserProfile.style.display = 'none';
+        function get_jwt_token(){
+            if(!document.cookie) {
+                return
+            }
+            jwt_raw = document.cookie.split(';').filter(s=>s.includes('jwt_token'))[0]
+            return jwt_raw.split('=')[1]
+        }
+        function checkRoute() {
+            let jwt_token = get_jwt_token();
+            if(jwt_token == undefined) {
+                btnLoginPage.style.display = 'block';
+                btnLogout.style.display = 'none';
+                btnUserProfile.style.display = 'none';
+                return;
+            }
+            axios({
+                method: 'post',
+                url: 'https://www.choozmo.com:8887/user_profile',
+                headers: { 
+                    'accept': 'text/html',
+                    'Authorization': `Bearer ${jwt_token}`
+                }
+            }).then(res => {
+                console.log(res.data);
+                if(res.status !== 200) {
+                    btnLoginPage.style.display = 'block';
+                    btnLogout.style.display = 'none';
+                    btnUserProfile.style.display = 'none';
+                }
+                btnLoginPage.style.display = 'none';
+                btnLogout.style.display = 'block';
+                btnUserProfile.style.display = 'block';
+            }).catch(err => {
+                console.log(err);
+            });
+        }
+        checkRoute();
+    </script>
+</body>
+
+</html>

+ 5 - 5
html/script_long.js

@@ -80,8 +80,8 @@ var modalTitle = document.querySelector("#avatarmega .modal-title");
 var avatarSelector = document.getElementById("avatar");
 var card = document.getElementsByClassName('card');
 card = [...card];
-avatarSelector.addEventListener('change', avatarChange);
-avatarChange();
+// avatarSelector.addEventListener('change', avatarChange);
+// avatarChange();
 
 function addCardListener() {
   for (let i = 0; i < card.length; i++) {
@@ -89,7 +89,7 @@ function addCardListener() {
   }
 }
 
-addCardListener();
+// addCardListener();
 
 function avatarChange() {
   var value = avatarSelector.options[avatarSelector.selectedIndex].text;
@@ -448,13 +448,13 @@ function initial() {
   }
 }
 
-initial();
+//initial();
 
 
 var addimgbtn = document.querySelector(".addimg");
 
 
-addimgbtn.addEventListener('click', addimgBlock);
+//addimgbtn.addEventListener('click', addimgBlock);
 
 
 function addimgBlock() {

+ 7 - 2
html/script_profile.js

@@ -11,6 +11,7 @@ function getCookie(name) {
 }
 
 let userBasics = JSON.parse(localStorage.getItem('user_profile')) || [];
+let inviteCode;
 
 function checkLocal() {
   if(userBasics.length == 0){ return };
@@ -82,7 +83,12 @@ function renderView() {
               }
             });
           }
+        $('.fb-share-button').attr('data-href', `https://video.choozmo.com?code=${userInfo.user_info.invite_code}`);
+        console.log($('.fb-share-button').attr('data-href'));
+        $('.share-twitter').attr('href',
+        `https://twitter.com/intent/tweet?text=I%20just%20created%20a%20video%20in%205%20minutes.%20Check%20it%20out%20%F0%9F%91%89%20https%3A%2F%2Fvideo.choozmo.com/invite.html?code=${userInfo.user_info.invite_code}&related=ai_cmm`)
         
+        inviteCode = userInfo.user_info.invite_code;
         const str = `<img src="static/img/undraw_male_avatar_323b.svg" alt="">
         <p class="card-profile-txt">User Profile</p>
         <p class="card-profile-cnt">${userInfo.user_info.userName}</p>
@@ -384,8 +390,7 @@ function deleteDraft(id) {
 $('.share-email').click(function() {
   var link = `mailto:me@example.com?subject=
   ${encodeURIComponent("Check out AI Spokesgirl")}
-  &body=${encodeURIComponent('I just created a video in 5 minutes, check out this amazing video making tool. https://video.choozmo.com/')}`;
-    
+  &body=${encodeURIComponent(`I just created a video in 5 minutes, check out this amazing video making tool. https://video.choozmo.com/invite.html?code=${inviteCode}`)}`;
     window.location.href = link;
 });
 

+ 4 - 2
html/static/lan.js

@@ -129,7 +129,8 @@ var zh = {
     "trial_title": "想要免費獲得更多時間額度?",
     "trial_txt": "透過社群分享專屬連結,邀請好友註冊 AI Spokesgirl,凡是好友透過連結註冊成功,您可以免費獲得2分鐘製作額度。",
     "share": "分享",
-    "close": "關閉"
+    "close": "關閉",
+    "video_long_title": "長影片範例"
 };
 
 var en = {
@@ -213,7 +214,8 @@ var en = {
     "trial_title": "Want to get more minutes?",
     "trial_txt": "Invite your friends to AI Spokesgirl and for each eligible one that signs up from your referral, we'll give you 2 more minutes free!",
     "share": "Share:",
-    "close": "Close"
+    "close": "Close",
+    "video_long_title": "Long Video Demo"
 };
 
 function switchLanContent(val){

+ 2 - 1
html/static/script_slides.js

@@ -191,8 +191,9 @@ $("#send_slide").click(function () {
   var step;
   multiLang = 0
   if ($('#multiLang').prop("checked")) {multiLang = 1;}
-  dataOBJ = {'slide_url':$('#slide_raw_url').val(),"avatar": avatar,"multiLang":multiLang, "client_id": client_id }
+  dataOBJ = {'slide_url':$('#slide_raw_url').val(),"avatar": avatar,"multiLang":multiLang, "client_id": client_id, "url_type": 0 }
   objstr = JSON.stringify(dataOBJ);
+  console.log(objstr)
   jwt_token =  get_jwt_token()
   var xhr = new XMLHttpRequest();
   xhr.open("POST", "https://www.choozmo.com:8887/make_anchor_video_gSlide");

+ 6 - 0
html/static/scss/style.css

@@ -1175,6 +1175,12 @@ body {
 }
 
 /* Pricing */
+@media screen and (max-width: 767px) {
+  #pricing-nav {
+    display: none;
+  }
+}
+
 .pricingTable {
   background: #fff;
   font-family: "Open Sans", sans-serif;

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 0
html/static/scss/style.css.map


+ 5 - 0
html/static/scss/style.scss

@@ -1088,6 +1088,11 @@ body {
 }
 
 /* Pricing */
+#pricing-nav{
+	@media screen and(max-width:$moblie) {
+		display: none;
+	}
+}
 .pricingTable {
 	background: #fff;
 	font-family: "Open Sans", sans-serif;

+ 1 - 1
html/user_profile2.html

@@ -327,7 +327,7 @@
                                                             <span class="facebook"
                                                                 style="position: relative; bottom:2px;">Facebook</span>
                                                         </div>
-                                                        <a class="mx-2 mx-lg-4 text-center"
+                                                        <a class="mx-2 mx-lg-4 text-center share-twitter"
                                                             href="https://twitter.com/intent/tweet?text=I%20just%20created%20a%20video%20in%205%20minutes.%20Check%20it%20out%20%F0%9F%91%89%20https%3A%2F%2Fvideo.choozmo.com/&related=ai_cmm"
                                                             target="_blank">
                                                             <img width="28" class="me-2"

Některé soubory nejsou zobrazeny, neboť je v těchto rozdílových datech změněno mnoho souborů