btns control, protect route--reset pwd email, modal txt

api/static/script_util.js

@@ -5,10 +5,13 @@ var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
 });
 var myModal = new bootstrap.Modal(document.getElementById('history'), {
   keyboard: false
-})
+});
 var avatarModal = new bootstrap.Modal(document.getElementById('avatarmega'), {
   keyboard: false
-})
+});
+
+let lang = localStorage.getItem('lan');
+
 var modalImg = document.querySelector("#avatarmega .modal-img");
 var modalTitle = document.querySelector("#avatarmega .modal-title");
 var avatarSelector = document.getElementById("avatar");

html/login.html

@@ -134,30 +134,6 @@
                                     
                                 </div>
                         </div>
-                        <!-- <div class="tab-pane fade p-lg-3" 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">
-                                    <button type="button" class="btn btn-primary align-items-center btn-register">Register</button>
-                                </div>
-        
-                            </form>
-                        </div> -->
                     </div>
                 </div>
             </div>

html/make_video.html

@@ -86,12 +86,12 @@
                 <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
                 <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
                 </div>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
                 </div>
                 <hr>
                 <ul class="nav-list ps-0">

html/make_video_long.html

@@ -86,12 +86,12 @@
                 <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
                 <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
                 </div>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
                 </div>
                 <hr>
                 <ul class="nav-list ps-0">
@@ -202,9 +202,9 @@
                     <label for="myCheck" set-lan="html:add_eng">加入英文:</label> 
                     <input type="checkbox" id="multiLang" > <br/>
                     <div class="subtitle-inputs">
-                    
+                        <!-- <textarea name="" id="" cols="100" rows="15"></textarea> -->
                     </div>
-                    <span class="add">+</span>
+                    
                 </fieldset>
                 <fieldset id='imgSrc'>
                     <h3 class="fs-subtitle" style="display: inline-block;"><lan set-lan="html:img_link">影像連結</lan><img class="ms-1" src="static/img/question.png" alt="" data-bs-toggle="tooltip" data-bs-placement="right" title="僅接受png, jpg, mp4格式"></h3><br/>

html/make_video_slide.html

@@ -86,12 +86,12 @@
                 <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
                 <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
                 </div>
                 <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-                    <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+                    <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
                 </div>
                 <hr>
                 <ul class="nav-list ps-0">

html/register.js

@@ -96,40 +96,17 @@ function register() {
             data: userObj
         }).then(res => {
             console.log(res.data.msg);
-            if(res.data.msg == 'ok') {
-                let title = "註冊成功";
-                let text;
-                    if (lang == 'en') { 
-                        title = "Register Successfully!";
-                        text = res.data.msg.eng;
-                    } else {
-                        text = res.data.msg.zh;
-                    }
-                Swal.fire({
-                    title: title,
-                    icon: 'success',
-                    text: text,
-                    confirmButtonColor: '#3085d6',
-                });
-                window.setTimeout(() => {
-                    window.location.href = 'login.html';
-                }, 2000);
+            let text;
+            if (lang == 'en') { 
+                text = res.data.msg.eng;
             } else {
-                let title = "註冊失敗";
-                let text;
-                    if (lang == 'en') { 
-                        title = "Register failed!";
-                        text = res.data.msg.eng;
-                    } else {
-                        text = res.data.msg.zh;
-                    }
-                Swal.fire({
-                    title: title,
-                    icon: 'error',
-                    text: text,
-                    confirmButtonColor: '#3085d6',
-                });
+                text = res.data.msg.zh;
             }
+            Swal.fire({
+                icon: 'info',
+                text: text,
+                confirmButtonColor: '#3085d6',
+            });
         }).catch(err => {
             console.log(err);
         })

html/reset_pwd.html

@@ -65,13 +65,13 @@
       <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
       <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
       <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-          <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-          <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
-      </div>
-      <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-        <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-        <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
-        </div>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
+    </div>
+    <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
+        <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+    </div>
       <hr>
       <ul class="nav-list ps-0">
           <li class="nav-list-item pb-1 mb-3" data-bs-toggle="modal" data-bs-target="#howto"><i

html/reset_pwd.js

@@ -23,6 +23,25 @@ function renderXHR_data(jsonObj) {
    return XHRstring
  }
 
+ let lan = localStorage.getItem('lan');
+
+$('.dropdown-toggle').click(() => {
+  lan = localStorage.getItem('lan');
+  checkLan();
+});
+
+checkLan();
+
+function checkLan() {
+  if(lan == 'en') {
+    $('.btn-makev').css('display', 'none');
+    $('.btn-makelong').css('display', 'none');
+  } else {
+    $('.btn-makev').css('display', 'block');
+    $('.btn-makelong').css('display', 'block');
+  }
+}
+
 $(".sender").click(function () {
 
   var pwd = $("#in_pwd").val();

html/reset_pwd_email.html

@@ -65,13 +65,13 @@
       <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
       <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
       <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-          <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-          <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
-      </div>
-      <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-        <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-        <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
-        </div>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
+    </div>
+    <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
+        <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+        <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+    </div>
       <hr>
       <ul class="nav-list ps-0">
           <li class="nav-list-item pb-1 mb-3" data-bs-toggle="modal" data-bs-target="#howto"><i

html/reset_pwd_email.js

@@ -10,6 +10,21 @@ function loginControl() {
 
 loginControl();
 
+function get_jwt_token(){
+  jwt_raw = document.cookie.split(';').filter(s=>s.includes('jwt_token'))[0];
+  if(!jwt_raw) {return}
+  return jwt_raw.split('=')[1];
+}
+
+function checkToken() {
+  let jwt_token = get_jwt_token();
+  if(jwt_token == undefined) {
+    window.location.replace("login.html");
+  }
+}
+
+checkToken();
+
 $(".sender").click(function () {
 
   var email = $("#in_email").val()
@@ -29,6 +44,25 @@ xhr.send();
 
 });
 
+let lan = localStorage.getItem('lan');
+
+$('.dropdown-toggle').click(() => {
+  lan = localStorage.getItem('lan');
+  checkLan();
+});
+
+checkLan();
+
+function checkLan() {
+  if(lan == 'en') {
+    $('.btn-makev').css('display', 'none');
+    $('.btn-makelong').css('display', 'none');
+  } else {
+    $('.btn-makev').css('display', 'block');
+    $('.btn-makelong').css('display', 'block');
+  }
+}
+
 var loaded_data = ''
 function openNav() {
   document.getElementById("mySidenav").style.width = "250px";

html/script_profiles.js

@@ -17,8 +17,24 @@ function checkLocal() {
   $('.userName').html(`<h2 class="user-name text-white mt-4 fw-bold">Hi ${userBasics.user_info.userName}</h2>`);
 }
 
-checkLocal()
+$('.dropdown-toggle').click(() => {
+  lan = localStorage.getItem('lan');
+  checkLan();
+});
+
+checkLocal();
+
+function checkLan() {
+  if(lan == 'en') {
+    $('.btn-makev').css('display', 'none');
+    $('.btn-makelong').css('display', 'none');
+  } else {
+    $('.btn-makev').css('display', 'block');
+    $('.btn-makelong').css('display', 'block');
+  }
+}
 
+checkLan();
 
 function renderView() {
     let token = getCookie('jwt_token');

html/static/lan.js

@@ -52,7 +52,7 @@ var zh = {
     "make_video" : "影片製作",
     "make_slides" : "投影影片製作",
     "make_video_long": "長影片製作",
-    "make_video_eng": "英文影片製作",
+    "make_video_eng": "純英文影片製作",
     "login" : "登入",
     "login_link" : "立即登入",
     "user_profile": "會員資料",

html/static/script_slides.js

@@ -30,6 +30,25 @@ function checkRoute() {
   });
 }
 
+let lan = localStorage.getItem('lan');
+
+$('.dropdown-toggle').click(() => {
+  lan = localStorage.getItem('lan');
+  checkLan();
+});
+
+checkLan();
+
+function checkLan() {
+  if(lan == 'en') {
+    $('.btn-makev').css('display', 'none');
+    $('.btn-makelong').css('display', 'none');
+  } else {
+    $('.btn-makev').css('display', 'block');
+    $('.btn-makelong').css('display', 'block');
+  }
+}
+
 const btnLoginPage = document.querySelector('.btn-login');
 const btnUserProfile = document.querySelector('.btn-userProfile');
 const btnLogout = document.querySelector('.btn-logout');

html/static/script_util.js

@@ -1,10 +1,13 @@
 checkRoute();
 
 let userBasics = JSON.parse(localStorage.getItem('user_profile')) || [];
+
+
 if(userBasics !== []){
   $('.userName').html(`<h2 class="user-name text-white mt-4 fw-bold">Hi ${userBasics.user_info.userName}</h2>`);
 }
 
+
 function checkRoute() {
   let jwt_token = get_jwt_token();
   if(jwt_token == undefined) {
@@ -41,6 +44,25 @@ function loginControl() {
 
 loginControl();
 
+let lan = localStorage.getItem('lan');
+
+$('.dropdown-toggle').click(() => {
+  lan = localStorage.getItem('lan');
+  checkLan();
+});
+
+checkLan();
+
+function checkLan() {
+  if(lan == 'en') {
+    $('.btn-makev').css('display', 'none');
+    $('.btn-makelong').css('display', 'none');
+  } else {
+    $('.btn-makev').css('display', 'block');
+    $('.btn-makelong').css('display', 'block');
+  }
+}
+
 var client_id = Date.now()
 var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
 var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
@@ -159,7 +181,7 @@ $(".next").click(function () {
       console.log(responseOBJ.msg);
         //let title = "資料已送出";
         let text;
-        if(lang == 'en') {
+        if(lan == 'en') {
           //title = 'Submitted Successfully!';
           text = responseOBJ.msg.eng;
         } else {
@@ -218,7 +240,7 @@ $("#sendBTN").click(function () {
       if (responseOBJ.msg=='ok'){
         let title = "資料已送出";
         let text = '資料已傳送，請耐心等候';
-        if (lang == 'en') { // 英文版訊息
+        if (lan == 'en') { // 英文版訊息
           title = "Submitted Successfully!";
           text = 'We are working on your video. You will get notfication in line group when your video is done.';
         }
@@ -231,7 +253,7 @@ $("#sendBTN").click(function () {
       } else {
         let title = '發生錯誤';
         let text;
-        if(lang == 'en') {
+        if(lan == 'en') {
           title = 'Error';
           text = responseOBJ.msg.eng;
         } else {
@@ -274,7 +296,7 @@ $("#send_slide").click(function () {
     if (xhr.readyState === 4) {
       let title = "資料已送出";
       let text = '資料已傳送，請耐心等候';
-      if (lang == 'en') { // 英文版訊息
+      if (lan == 'en') { // 英文版訊息
         title = "Submitted Successfully!";
         text = 'We are working on your video. You will get notfication in line group when your video is done.';
       }
@@ -463,7 +485,7 @@ function load_data(tid, loaded_data, draft = false) {
     imguploadlabel.setAttribute('for', `img${i + 1}`);
     imguploadlabel.classList.add('upload-btn');
     imguploadlabel.textContent = '上傳檔案';
-    if(lang == 'en') {
+    if(lan == 'en') {
       imguploadlabel.textContent = 'Upload';
     }
     imguploadlabel.setAttribute('set-lan', `html:upload_file`);
@@ -601,7 +623,7 @@ function renderimgBlock(i) {
   imguploadlabel.setAttribute('for', `img${i}`);
   imguploadlabel.classList.add('upload-btn');
   imguploadlabel.textContent = '上傳檔案';
-  if(lang == 'en') {
+  if(lan == 'en') {
     imguploadlabel.textContent = 'Upload';
   }
   imguploadlabel.setAttribute('set-lan', `html:upload_file`);
@@ -636,7 +658,7 @@ $('.owl-carousel').owlCarousel({
 $('.draft-btn').click(() => {
   let text = '儲存中...';
 
-  if (lang == 'en') {
+  if (lan == 'en') {
     text = 'Saving...';
   }
 
@@ -684,7 +706,7 @@ $('.draft-btn').click(() => {
     console.log(res.data);
     $('.draft-btn').text('存為草稿');
     let title = "儲存完成";
-    if(lang == 'en') {
+    if(lan == 'en') {
       title = 'Saved!'
       $('.draft-btn').text('Save as Draft');
     }

html/user_profile.html

@@ -1,132 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-TW">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <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>
-    <title>AI Spokesgirl</title>
-</head>
-
-<body>
-    <!-- ================================================================= -->
-    <!-- navbar -->
-    <nav class="navbar navbar-expand-lg navbar-light">
-        <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 me-auto mb-2 mb-lg-0">
-                    <li class="nav-item">
-                        <a class="nav-link active btn-gocreate text-white me-2" aria-current="page" href="make_video.html" set-lan="html:make_video">製作影片</a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link active btn-gocreate text-white" aria-current="page" href="make_video_slide.html" set-lan="html:make_slides">SLIDE製作影片</a>                        
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link active btn-gocreate text-white" aria-current="page" href="make_video_long.html" set-lan="html:make_video_long">製作長影片</a>                        
-                    </li>
-                </ul>
-                
-                <ul class="navbar-nav 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 px-0">
-        <div class="row">
-            <div class="col-xs-12 col-md-4">
-                <div class="container-profile">
-                    <img class="img-wave img-wave-profile" src="static/img/wave.png" alt="">
-                    <img class="container-bg" src="static/img/undraw_mobile_user_7oqo.svg" alt="">
-                    <div class="card card-profile">
-                        <img src="static/img/undraw_male_avatar_323b.svg" alt="">
-                        <p class="card-profile-txt">User Profile</p>
-                        <p class="card-profile-cnt"></p>
-                        <p class="card-profile-cnt"></p>
-                        <div class="d-flex justify-content-around">
-                            <div>
-                                <p set-lan="html:used">已使用</p>
-                                <p><strong></strong><span set-lan="html:sec">秒</span></p>
-                            </div>
-                            <div>
-                                <p set-lan="html:left">未使用</p>
-                                <p><strong></strong><span set-lan="html:sec">秒</span></p>
-                            </div>
-                        </div>
-                    </div>
-                </div> 
-            </div>
-            <div class="col-xs-12 col-md-8">
-                
-            </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="static/owl.carousel.min.js"></script>
-    <!-- <script src="script_profiles.js"></script> -->
-    <script type="text/javascript" src="static/lan.js"></script>
-    <script src="static/common.js"></script>
-</body>
-
-</html>

html/user_profile2.html

@@ -81,12 +81,12 @@
             <img class="user img-fluid rounded-circle" src="./static/img/userprofile/userimg.png" alt="">
             <p class="text-white my-3 text-center" set-lan="html:Createsthtoday">今天要做甚麼影片呢?</p>
             <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
-                <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                <a class="nav-link btn-gocreate text-white col-6 btn-makeppt" aria-current="page" href="./make_video_slide.html" set-lan="html:make_slides">投影片影片製作</a>
+                <a class="nav-link btn-gocreate text-white col-6 btn-makeen" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">純英文影片製作</a>
             </div>
             <div class="navbar-nav mb-2 mb-lg-0 px-3 pe-4">
-                <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./index_eng.html" set-lan="html:make_video_eng">英文影片製作</a>
-                <a class="nav-link btn-gocreate text-white col-6" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
+                <a class="nav-link btn-gocreate text-white col-6 btn-makev" aria-current="page" href="./make_video.html" set-lan="html:make_video">影片製作</a>
+                <a class="nav-link btn-gocreate text-white col-6 btn-makelong" aria-current="page" href="./make_video_long.html" set-lan="html:make_video_long">長影片製作</a>
             </div>
             <hr>
             <ul class="nav-list ps-0">