implement main title html,js

8c6704ae · NGUYEN HOANG SON · 6e56bb54 · 8c6704ae · 8c6704ae · 8c6704ae
Commit 8c6704ae authored 2 years ago by NGUYEN HOANG SON
Show whitespace changes
Inline Side-by-side

Showing with 38 additions and 9 deletions

abvw/common/main-title.html
+9 -0

abvw/html/dashboard.html
+2 -9

abvw/js/dashboard/dashboard.js
+10 -0

abvw/js/template/template.js
+17 -0

No files found.
--- a/abvw/common/main-title.html
+++ b/abvw/common/main-title.html
+<div id="main-ttl">
+    <div class="container">
+        <!-- title -->
+        <div class="d-flex align-items-center">
+            <h1 id="mainTitleHeader" class="fs-14 font-weight-bold pt-4 pb-3 mb-0 mr-auto lang"></h1>
+        </div>
+    </div>
+</div>
\ No newline at end of file
--- a/abvw/html/dashboard.html
+++ b/abvw/html/dashboard.html
@@ -3,7 +3,7 @@

 <head>
    <meta charset="utf-8">
-    <title>ダッシュボード</title>
+    <title class="lang" lang="dashboard"></title>
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <!-- favicons -->
    <link href="../common/img/favicon.ico" rel="icon">
@@ -37,17 +37,10 @@

    <!-- header -->
    <div id="includedHeader"></div>
+    <div id="includedMainTitle"></div>
    <!-- dashboard -->
    <main>
        <div class="container">
-            <!-- title -->
-            <div class="d-flex align-items-center">
-                <h1 class="fs-14 font-weight-bold pt-4 pb-3 mb-0 mr-auto lang" lang="dashboard"></h1>
-                <a href="#" data-toggle="modal" data-target="#dashboard-setting-modal" >
-                    <img src="../common/img/icon_dashboard_setting.svg" type="image" alt="" class="p-1 w-40px lang" lang="dashboardSettings">
-                </a>
-            </div>
-            
            <!-- sub title -->
            <h2 class="fs-8 font-weight-bold lang" id="#pickupHeader" lang="pickup"></h2>


--- a/abvw/js/dashboard/dashboard.js
+++ b/abvw/js/dashboard/dashboard.js
@@ -117,6 +117,7 @@ DASHBOARD.loadCommon = function() {
    TEMPLATE.loadHearder("#includedHeader");
    TEMPLATE.loadDashboardSetting("#includedDashboardSetting", DASHBOARD.changeSettingCallback);
    TEMPLATE.loadConfirmModal("#includedConfirmModal");
+    TEMPLATE.loadMainTitle("#includedMainTitle", "dashboard", DASHBOARD.loadMainTitleCallback);
 }

 /** Update pickup config from setting dashboard data */
@@ -168,3 +169,12 @@ DASHBOARD.goSendMessage = function() {
 DASHBOARD.changeSettingCallback = function() {
    location.reload();
 }
+
+DASHBOARD.loadMainTitleCallback = function() {
+    //add dashboard setting item
+    var elmA = $('<a href="#" data-toggle="modal" data-target="#dashboard-setting-modal">');
+    let elmImg = $('<img src="../common/img/icon_dashboard_setting.svg" alt="" class="p-1 w-40px lang" lang="dashboardSettings" data-toggle="tooltip" data-placement="bottom" title="">');
+    elmImg.attr('title', I18N.i18nText('dashboardSettings'));
+    elmA.append(elmImg);
+    $('#mainTitleHeader').after(elmA);
+}
--- a/abvw/js/template/template.js
+++ b/abvw/js/template/template.js
@@ -55,3 +55,20 @@ TEMPLATE.loadNotificationSelect = function(elmentId, selectCallback) {
        I18N.initi18n();
    }); 
 }
+
+/**
+ * load main title html to a element by id
+ * @param {string} elmentId - elementId where contain main title html
+ * @param {string} langTitle - title lang message
+ */
+TEMPLATE.loadMainTitle = function(elmentId, langTitle, completeCallback) {
+    $(elmentId).load("../common/main-title.html" , function() {
+        if (langTitle) {
+            $('#mainTitleHeader').attr("lang", langTitle);
+        }
+        I18N.initi18n();
+        if (completeCallback) {
+            completeCallback();
+        }
+    });
+}