Home Explore Help
Register Sign In
jared
/
liff_test
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

add misa

SyuanYu 2 years ago
parent
0e2274c0e0
commit
ed3f40ac46
17 changed files with 1004 additions and 0 deletions
Split View Show Diff Stats
  1. 3 0
      .vscode/settings.json
  2. BIN
      misa-0309/.DS_Store
  3. BIN
      misa-0309/icon/badge.png
  4. BIN
      misa-0309/icon/example.png
  5. BIN
      misa-0309/icon/icon.ico
  6. BIN
      misa-0309/icon/liff.png
  7. 61 0
      misa-0309/index.html
  8. 360 0
      misa-0309/js/liff-functions.js
  9. 84 0
      misa-0309/js/liff-init.js
  10. BIN
      misa-course-3/.DS_Store
  11. BIN
      misa-course-3/icon/badge.png
  12. BIN
      misa-course-3/icon/example.png
  13. BIN
      misa-course-3/icon/icon.ico
  14. BIN
      misa-course-3/icon/liff.png
  15. 61 0
      misa-course-3/index.html
  16. 351 0
      misa-course-3/js/liff-functions.js
  17. 84 0
      misa-course-3/js/liff-init.js

+ 3 - 0
.vscode/settings.json
View File 

@@ -0,0 +1,3 @@
 
+{
 
+    "liveServer.settings.port": 5501
 
+}

BIN
misa-0309/.DS_Store
View File


BIN
misa-0309/icon/badge.png
View File


BIN
misa-0309/icon/example.png
View File


BIN
misa-0309/icon/icon.ico
View File


BIN
misa-0309/icon/liff.png
View File


+ 61 - 0
misa-0309/index.html
View File 

@@ -0,0 +1,61 @@
 
+<!DOCTYPE html>
 
+<html>
 
+
 
+<head>
 
+  <meta charset="utf-8" />
 
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
 
+  <title>MISA 資訊分享</title>
 
+  <link rel="shortcut icon" href="icon/icon.ico" type="image/x-icon" />
 
+  <link rel="icon" href="icon/icon.ico" type="image/x-icon" />
 
+  <link rel="stylesheet" href="/css/style.css">
 
+</head>
 
+
 
+<body>
 
+  <div id="message">
 
+    <center>
 
+      <img style="margin: 0; width: 250px; image-rendering: -webkit-optimize-contrast;" src="https://s3cdn.yourator.co/banners/banners/000/001/645/home/06dc43274281d1bd66f4a49adbbae354ec3426b8.png"
 
+        alt="">
 
+      <h2>MISA 行動 EMBA 學程 <br> LINE 傳單分享</h2>
 
+    </center>
 
+
 
+    <div class="step-container">
 
+      <div class="step-item">
 
+        <div>
 
+          <img src="/liff2/img/phone.png" alt="">
 
+        </div>
 
+        <div class="text">
 
+          <h3>如何 2 步驟分享給好友</h3>
 
+          <div>
 
+            <p>步驟 １</p>
 
+            <p>請點擊登入 LINE 帳號。<br>（第一次使用需授予許可）</p>
 
+          </div>
 
+          <img src="/liff2/img/arrow.png" alt="">
 
+          <div>
 
+            <p>步驟 ２</p>
 
+            <p>請點擊「發傳單給最多十位好友」，<br>選擇發送對象後按下分享即可傳送。</p>
 
+          </div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+
 
+    <center>
 
+      <img
 
+        src="https://firebasestorage.googleapis.com/v0/b/uce-bot.appspot.com/o/user.jpg?alt=media&token=554b90c5-562c-469a-bfee-f36b5e3f54c9"
 
+        style="border-radius: 10px;" width="150px" height="150px" id="profileImage" />
 
+    </center>
 
+
 
+    <center>
 
+      <button onclick="login()">登入 LINE</button>
 
+      <button onclick="logout()">登出 LINE</button>
 
+      <button id="senddm" onclick="shareTargetPicker()">發傳單給最多十個好友</button>
 
+    </center>
 
+  </div>
 
+
 
+  <p id="load">ChoozMo</p>
 
+  <script src="https://static.line-scdn.net/liff/edge/2.1/sdk.js"></script>
 
+  <script src="js/liff-init.js?1234"></script>
 
+  <script src="js/liff-functions.js?12345"></script>
 
+  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
 
+</body>
 
+
 
+</html>

+ 360 - 0
misa-0309/js/liff-functions.js
View File 

@@ -0,0 +1,360 @@
 
+function getProfile() {
 
+  liff
 
+    .getProfile()
 
+    .then(profile => {
 
+      console.log(JSON.stringify(profile));
 
+      window.alert(JSON.stringify(profile));
 
+    })
 
+    .catch(e => {
 
+      console.log(e);
 
+      window.alert(e);
 
+    });
 
+}
 
+function getAccessToken() {
 
+  window.alert(liff.getAccessToken());
 
+}
 
+function getContext() {
 
+  window.alert(JSON.stringify(liff.getContext()));
 
+}
 
+
 
+function sendMessage() {
 
+  liff
 
+    .sendMessages([{ type: "text", text: "中文測試 Hello from LIFF2.0" }])
 
+    .then(() => {
 
+      window.alert("Message has been sent");
 
+    })
 
+    .catch(e => {
 
+      window.alert(e);
 
+    });
 
+}
 
+
 
+function login() {
 
+  liff.login();
 
+}
 
+
 
+function scanCode() {
 
+  liff
 
+    .scanCode()
 
+    .then(result => {
 
+      window.alert(JSON.stringify(result));
 
+    })
 
+    .catch(e => {
 
+      window.alert(e);
 
+    });
 
+}
 
+
 
+function openWindow() {
 
+  liff.openWindow({
 
+    url: "https://line.me/1657386781-XARmDogn",
 
+    external: true
 
+  });
 
+}
 
+
 
+function closeWindow() {
 
+  liff.closeWindow();
 
+}
 
+
 
+function logout() {
 
+  if (liff.isLoggedIn()) {
 
+    liff.logout();
 
+    window.alert("Successfully to Logout");
 
+    location.reload();
 
+  }
 
+}
 
+
 
+
 
+// function createFlexMessageData() {
 
+//   var flex = {
 
+//     "type": "flex",
 
+//     "altText": redistitle,
 
+//     "contents": redisdata,
 
+//   };
 
+
 
+//   return flex;
 
+// }
 
+
 
+var _title = "MISA 向您分享了最新消息！";
 
+
 
+function createFlexMessageData() {
 
+  var myFlexContent = {
 
+    "type": "bubble",
 
+    "hero": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "contents": [
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "text",
 
+              "text": "MISA 沙龍小聚",
 
+              "color": "#f39a00",
 
+              "align": "center",
 
+              "offsetTop": "3px",
 
+              "size": "lg",
 
+              "weight": "bold"
 
+            }
 
+          ],
 
+          "paddingAll": "15px"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "image",
 
+              "size": "full",
 
+              "margin": "none",
 
+              "url": "https://imgur.com/5Ny8EuX.jpg",
 
+              "offsetTop": "-10px"
 
+            }
 
+          ],
 
+          "paddingStart": "5px",
 
+          "paddingEnd": "5px",
 
+          "height": "240px"
 
+        }
 
+      ]
 
+    },
 
+    "body": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "contents": [
 
+        {
 
+          "type": "text",
 
+          "text": "優秀的商業簡報能力",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "lg"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "為你創造企業與個人之最大價值",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "separator",
 
+          "margin": "lg"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "對內，進行工作報告",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "lg"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "展現工作成果",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "對外，進行商業提案",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "lg"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "取得資金或奪得訂單",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "對政府，你必須精煉價值論述",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "margin": "lg",
 
+          "wrap": true
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "爭取政府資源或獎項",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "margin": "sm",
 
+          "wrap": true
 
+        }
 
+      ],
 
+      "offsetTop": "-20px"
 
+    },
 
+    "footer": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "spacing": "sm",
 
+      "contents": [
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "報名參加",
 
+                "uri": "https://s.aiii.ai/g/85785f"
 
+              },
 
+              "color": "#ffffff"
 
+            }
 
+          ],
 
+          "backgroundColor": "#f39a00",
 
+          "cornerRadius": "md"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "活動分享",
 
+                "uri": "https://liff.googo.org/misa-0309/?openInAppBrowser=1&openExternalBrowser=1"
 
+              },
 
+              "color": "#f39a00"
 
+            }
 
+          ],
 
+          "cornerRadius": "md",
 
+          "margin": "lg",
 
+          "borderColor": "#f39a00",
 
+          "borderWidth": "normal"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "官方網站",
 
+                "uri": "https://www.misaglobal.org"
 
+              },
 
+              "color": "#f39a00"
 
+            }
 
+          ],
 
+          "cornerRadius": "md",
 
+          "margin": "lg",
 
+          "borderColor": "#f39a00",
 
+          "borderWidth": "normal"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "image",
 
+              "url": "https://static.kolable.com/images/misa/logo.png/120?v=1641520480847"
 
+            }
 
+          ],
 
+          "margin": "none",
 
+          "position": "absolute",
 
+          "offsetStart": "108px",
 
+          "offsetTop": "135px"
 
+        }
 
+      ],
 
+      "flex": 0,
 
+      "height": "200px",
 
+      "offsetTop": "-10px"
 
+    }
 
+  };
 
+
 
+  var flex = {
 
+    "type": "flex",
 
+    "altText": _title,
 
+    "contents": myFlexContent,
 
+  };
 
+
 
+  return flex;
 
+}
 
+
 
+var redisdata = '';
 
+
 
+function shareTargetPicker() {
 
+
 
+  liff.shareTargetPicker([
 
+    createFlexMessageData()
 
+  ])
 
+    .then(function (res) {
 
+      if (res) {
 
+        // succeeded in sending a message through TargetPicker
 
+        console.log(`[${res.status}] Message sent!`)
 
+      } else {
 
+        const [majorVer, minorVer] = (liff.getLineVersion() || "").split('.');
 
+        if (parseInt(majorVer) == 10 && parseInt(minorVer) < 11) {
 
+          // LINE 10.3.0 - 10.10.0
 
+          // Old LINE will access here regardless of user's action
 
+          console.log('TargetPicker was opened at least. Whether succeeded to send message is unclear')
 
+        } else {
 
+          // LINE 10.11.0 -
 
+          // sending message canceled
 
+          console.log('TargetPicker was closed!')
 
+        }
 
+      }
 
+    }).catch(function (error) {
 
+      // something went wrong before sending a message
 
+      console.log('something wrong happen', error)
 
+    })
 
+
 
+  // const url = 'https://liff.googo.org:9898/misa-liff'
 
+  // axios
 
+  //   .get(url)
 
+  //   .then(({data}) => {
 
+  //     redisdata=data.data;
 
+  //     redistitle=data.title;
 
+  //     console.log(redistitle);
 
+  //     console.log(redisdata);
 
+
 
+  //     liff.shareTargetPicker([
 
+  //       {
 
+  //         type: "text",
 
+  //         text: "Test!"
 
+  //       }
 
+  //     ])
 
+  //       .then(
 
+  //         console.log("ShareTargetPicker was launched")
 
+  //       ).catch(function (res) {
 
+  //         alert(res);
 
+  //         console.log("Failed to launch ShareTargetPicker", res)
 
+  //       })
 
+
 
+  //     // liff
 
+  //     // .shareTargetPicker([
 
+  //     //   createFlexMessageData()      
+  //     // ])
 
+  //     // .then(() => {
 
+  //     //   alert("Shared to the friend(s) you picked");
 
+  //     // })
 
+  //     // .catch(function(res) {
 
+  //     //   alert(res);
 
+  //     // });
 
+
 
+  //   });
 
+}

+ 84 - 0
misa-0309/js/liff-init.js
View File 

@@ -0,0 +1,84 @@
 
+// ----- Configuration Zone! -----
 
+// Don't forget to change this to your LIFF ID
 
+
 
+const liffId = "1660679999-4NA66odd";
 
+
 
+// Don't forget to change this to your LIFF ID
 
+
 
+liff.init(
 
+  { liffId: liffId },
 
+  () => {
 
+    initLIFF();
 
+  },
 
+  err => {
 
+    window.alert(err);
 
+  }
 
+);
 
+function initLIFF() {
 
+  if (liff.isLoggedIn()) {
 
+    liff
 
+      .getProfile()
 
+      .then(profile => {
 
+        document.getElementById("profileImage").src = profile.pictureUrl;
 
+        // document.getElementById("userId").innerHTML = profile.userId;
 
+        // document.getElementById("displayName").innerHTML = profile.displayName;
 
+        // document.getElementById("statusMessage").innerHTML =
 
+        //   profile.statusMessage;
 
+        // document.getElementById("pictureUrl").href = profile.pictureUrl;
 
+        // document.getElementById("pictureUrl").innerHTML = profile.pictureUrl;
 
+        // document.getElementById(
 
+        //   "email"
 
+        // ).innerHTML = liff.getDecodedIDToken().email;
 
+      })
 
+      .catch(e => {
 
+        // document.getElementById("userId").innerHTML = "No data, " + e;
 
+        // document.getElementById("displayName").innerHTML = "No data, " + e;
 
+        // document.getElementById("statusMessage").innerHTML = "No data, " + e;
 
+        // document.getElementById("pictureUrl").innerHTML = "No data, " + e;
 
+        // document.getElementById("email").innerHTML = "No data, " + e;
 
+      });
 
+  } else {
 
+    // document.getElementById("userId").innerHTML = "No data, Login first";
 
+    // document.getElementById("displayName").innerHTML = "No data, Login first";
 
+    // document.getElementById("statusMessage").innerHTML = "No data, Login first";
 
+    // document.getElementById("pictureUrl").innerHTML = "No data, Login first";
 
+    // document.getElementById("email").innerHTML = "No data, Login first";
 
+  }
 
+
 
+  // document.getElementById("getOS").innerHTML = liff.getOS();
 
+  // document.getElementById("getLanguage").innerHTML = liff.getLanguage();
 
+  // document.getElementById("getVersion").innerHTML = liff.getVersion();
 
+  // document.getElementById("isInClient").innerHTML = liff.isInClient();
 
+  // document.getElementById("isLoggedIn").innerHTML = liff.isLoggedIn();
 
+  var context = liff.getContext();
 
+  if (context !== null) {
 
+    // document.getElementById("context_type").innerHTML = context.type;
 
+    // document.getElementById("context_viewType").innerHTML = context.viewType;
 
+    // document.getElementById("context_userId").innerHTML = context.userId;
 
+    if (context.utouId) {
 
+      // document.getElementById("context_utouId").innerHTML = context.utouId;
 
+    } else {
 
+      // document.getElementById("context_utouId").innerHTML =
 
+      // "You are not in the utou";
 
+    }
 
+    if (context.roomId) {
 
+      // document.getElementById("context_roomId").innerHTML = context.roomId;
 
+    } else {
 
+      // document.getElementById("context_roomId").innerHTML =
 
+      // "You are not in the room";
 
+    }
 
+    if (context.groupId) {
 
+      // document.getElementById("context_groupId").innerHTML = context.groupId;
 
+    } else {
 
+      // document.getElementById("context_groupId").innerHTML =
 
+      //   "You are not in the group ";
 
+    }
 
+  } else {
 
+    // document.getElementById("context_type").innerHTML = "No data.";
 
+    // document.getElementById("context_viewType").innerHTML = "No data.";
 
+    // document.getElementById("context_userId").innerHTML = "No data.";
 
+    // document.getElementById("context_utouId").innerHTML = "No data.";
 
+    // document.getElementById("context_roomId").innerHTML = "No data.";
 
+    // document.getElementById("context_groupId").innerHTML = "No data.";
 
+  }
 
+}

BIN
misa-course-3/.DS_Store
View File


BIN
misa-course-3/icon/badge.png
View File


BIN
misa-course-3/icon/example.png
View File


BIN
misa-course-3/icon/icon.ico
View File


BIN
misa-course-3/icon/liff.png
View File


+ 61 - 0
misa-course-3/index.html
View File 

@@ -0,0 +1,61 @@
 
+<!DOCTYPE html>
 
+<html>
 
+
 
+<head>
 
+  <meta charset="utf-8" />
 
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
 
+  <title>MISA 資訊分享</title>
 
+  <link rel="shortcut icon" href="icon/icon.ico" type="image/x-icon" />
 
+  <link rel="icon" href="icon/icon.ico" type="image/x-icon" />
 
+  <link rel="stylesheet" href="/css/style.css">
 
+</head>
 
+
 
+<body>
 
+  <div id="message">
 
+    <center>
 
+      <img style="margin: 0; width: 250px; image-rendering: -webkit-optimize-contrast;" src="https://s3cdn.yourator.co/banners/banners/000/001/645/home/06dc43274281d1bd66f4a49adbbae354ec3426b8.png"
 
+        alt="">
 
+      <h2>ESG 國際領袖班－LINE 傳單分享</h2>
 
+    </center>
 
+
 
+    <div class="step-container">
 
+      <div class="step-item">
 
+        <div>
 
+          <img src="/liff2/img/phone.png" alt="">
 
+        </div>
 
+        <div class="text">
 
+          <h3>如何 2 步驟分享給好友</h3>
 
+          <div>
 
+            <p>步驟 １</p>
 
+            <p>請點擊登入 LINE 帳號。<br>（第一次使用需授予許可）</p>
 
+          </div>
 
+          <img src="/liff2/img/arrow.png" alt="">
 
+          <div>
 
+            <p>步驟 ２</p>
 
+            <p>請點擊「發傳單給最多十位好友」，<br>選擇發送對象後按下分享即可傳送。</p>
 
+          </div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+
 
+    <center>
 
+      <img
 
+        src="https://firebasestorage.googleapis.com/v0/b/uce-bot.appspot.com/o/user.jpg?alt=media&token=554b90c5-562c-469a-bfee-f36b5e3f54c9"
 
+        style="border-radius: 10px;" width="150px" height="150px" id="profileImage" />
 
+    </center>
 
+
 
+    <center>
 
+      <button onclick="login()">登入 LINE</button>
 
+      <button onclick="logout()">登出 LINE</button>
 
+      <button id="senddm" onclick="shareTargetPicker()">發傳單給最多十個好友</button>
 
+    </center>
 
+  </div>
 
+
 
+  <p id="load">ChoozMo</p>
 
+  <script src="https://static.line-scdn.net/liff/edge/2.1/sdk.js"></script>
 
+  <script src="js/liff-init.js?1234"></script>
 
+  <script src="js/liff-functions.js?12345"></script>
 
+  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
 
+</body>
 
+
 
+</html>

+ 351 - 0
misa-course-3/js/liff-functions.js
View File 

@@ -0,0 +1,351 @@
 
+function getProfile() {
 
+  liff
 
+    .getProfile()
 
+    .then(profile => {
 
+      console.log(JSON.stringify(profile));
 
+      window.alert(JSON.stringify(profile));
 
+    })
 
+    .catch(e => {
 
+      console.log(e);
 
+      window.alert(e);
 
+    });
 
+}
 
+function getAccessToken() {
 
+  window.alert(liff.getAccessToken());
 
+}
 
+function getContext() {
 
+  window.alert(JSON.stringify(liff.getContext()));
 
+}
 
+
 
+function sendMessage() {
 
+  liff
 
+    .sendMessages([{ type: "text", text: "中文測試 Hello from LIFF2.0" }])
 
+    .then(() => {
 
+      window.alert("Message has been sent");
 
+    })
 
+    .catch(e => {
 
+      window.alert(e);
 
+    });
 
+}
 
+
 
+function login() {
 
+  liff.login();
 
+}
 
+
 
+function scanCode() {
 
+  liff
 
+    .scanCode()
 
+    .then(result => {
 
+      window.alert(JSON.stringify(result));
 
+    })
 
+    .catch(e => {
 
+      window.alert(e);
 
+    });
 
+}
 
+
 
+function openWindow() {
 
+  liff.openWindow({
 
+    url: "https://line.me/1657386781-XARmDogn",
 
+    external: true
 
+  });
 
+}
 
+
 
+function closeWindow() {
 
+  liff.closeWindow();
 
+}
 
+
 
+function logout() {
 
+  if (liff.isLoggedIn()) {
 
+    liff.logout();
 
+    window.alert("Successfully to Logout");
 
+    location.reload();
 
+  }
 
+}
 
+
 
+
 
+// function createFlexMessageData() {
 
+//   var flex = {
 
+//     "type": "flex",
 
+//     "altText": redistitle,
 
+//     "contents": redisdata,
 
+//   };
 
+
 
+//   return flex;
 
+// }
 
+
 
+var _title = "MISA 向您分享了最新消息！";
 
+
 
+function createFlexMessageData() {
 
+  var myFlexContent = {
 
+    "type": "bubble",
 
+    "hero": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "contents": [
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "text",
 
+              "text": "企業成長戰略課程",
 
+              "color": "#f39a00",
 
+              "align": "center",
 
+              "offsetTop": "3px",
 
+              "size": "lg",
 
+              "weight": "bold"
 
+            }
 
+          ],
 
+          "paddingAll": "15px"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "image",
 
+              "size": "full",
 
+              "margin": "none",
 
+              "url": "https://imgur.com/pfjoK8W.jpg",
 
+              "offsetTop": "-10px"
 
+            }
 
+          ],
 
+          "paddingStart": "5px",
 
+          "paddingEnd": "5px",
 
+          "height": "240px"
 
+        }
 
+      ]
 
+    },
 
+    "body": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "contents": [
 
+        {
 
+          "type": "text",
 
+          "text": "由 MISA 企業院士及",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "lg"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "國際級專業教練共同授課",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "專為 CEO / 高階主管打造",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": " 「企業成長戰略課程」",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "wrap": true,
 
+          "margin": "sm"
 
+        },
 
+        {
 
+          "type": "separator",
 
+          "margin": "xl"
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "透過企經班的實戰實操課程",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "margin": "xl",
 
+          "wrap": true
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "推動組織變革、",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "margin": "sm",
 
+          "wrap": true
 
+        },
 
+        {
 
+          "type": "text",
 
+          "text": "執行企業成長戰略 / 戰術！",
 
+          "weight": "bold",
 
+          "size": "md",
 
+          "align": "center",
 
+          "margin": "sm",
 
+          "wrap": true
 
+        }
 
+      ],
 
+      "offsetTop": "-20px"
 
+    },
 
+    "footer": {
 
+      "type": "box",
 
+      "layout": "vertical",
 
+      "spacing": "sm",
 
+      "contents": [
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "報名參加",
 
+                "uri": "https://www.misaglobal.org/event"
 
+              },
 
+              "color": "#ffffff"
 
+            }
 
+          ],
 
+          "backgroundColor": "#f39a00",
 
+          "cornerRadius": "md"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "活動分享",
 
+                "uri": "https://liff.googo.org/misa-course-3/?openInAppBrowser=1&openExternalBrowser=1"
 
+              },
 
+              "color": "#f39a00"
 
+            }
 
+          ],
 
+          "cornerRadius": "md",
 
+          "margin": "lg",
 
+          "borderColor": "#f39a00",
 
+          "borderWidth": "normal"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "button",
 
+              "style": "link",
 
+              "height": "sm",
 
+              "action": {
 
+                "type": "uri",
 
+                "label": "官方網站",
 
+                "uri": "https://www.misaglobal.org"
 
+              },
 
+              "color": "#f39a00"
 
+            }
 
+          ],
 
+          "cornerRadius": "md",
 
+          "margin": "lg",
 
+          "borderColor": "#f39a00",
 
+          "borderWidth": "normal"
 
+        },
 
+        {
 
+          "type": "box",
 
+          "layout": "vertical",
 
+          "contents": [
 
+            {
 
+              "type": "image",
 
+              "url": "https://static.kolable.com/images/misa/logo.png/120?v=1641520480847"
 
+            }
 
+          ],
 
+          "margin": "none",
 
+          "position": "absolute",
 
+          "offsetStart": "108px",
 
+          "offsetTop": "135px"
 
+        }
 
+      ],
 
+      "flex": 0,
 
+      "height": "200px",
 
+      "offsetTop": "-10px"
 
+    }
 
+  };
 
+
 
+  var flex = {
 
+    "type": "flex",
 
+    "altText": _title,
 
+    "contents": myFlexContent,
 
+  };
 
+
 
+  return flex;
 
+}
 
+
 
+var redisdata = '';
 
+
 
+function shareTargetPicker() {
 
+
 
+  liff.shareTargetPicker([
 
+    createFlexMessageData()
 
+  ])
 
+    .then(function (res) {
 
+      if (res) {
 
+        // succeeded in sending a message through TargetPicker
 
+        console.log(`[${res.status}] Message sent!`)
 
+      } else {
 
+        const [majorVer, minorVer] = (liff.getLineVersion() || "").split('.');
 
+        if (parseInt(majorVer) == 10 && parseInt(minorVer) < 11) {
 
+          // LINE 10.3.0 - 10.10.0
 
+          // Old LINE will access here regardless of user's action
 
+          console.log('TargetPicker was opened at least. Whether succeeded to send message is unclear')
 
+        } else {
 
+          // LINE 10.11.0 -
 
+          // sending message canceled
 
+          console.log('TargetPicker was closed!')
 
+        }
 
+      }
 
+    }).catch(function (error) {
 
+      // something went wrong before sending a message
 
+      console.log('something wrong happen', error)
 
+    })
 
+
 
+  // const url = 'https://liff.googo.org:9898/misa-liff'
 
+  // axios
 
+  //   .get(url)
 
+  //   .then(({data}) => {
 
+  //     redisdata=data.data;
 
+  //     redistitle=data.title;
 
+  //     console.log(redistitle);
 
+  //     console.log(redisdata);
 
+
 
+  //     liff.shareTargetPicker([
 
+  //       {
 
+  //         type: "text",
 
+  //         text: "Test!"
 
+  //       }
 
+  //     ])
 
+  //       .then(
 
+  //         console.log("ShareTargetPicker was launched")
 
+  //       ).catch(function (res) {
 
+  //         alert(res);
 
+  //         console.log("Failed to launch ShareTargetPicker", res)
 
+  //       })
 
+
 
+  //     // liff
 
+  //     // .shareTargetPicker([
 
+  //     //   createFlexMessageData()      
+  //     // ])
 
+  //     // .then(() => {
 
+  //     //   alert("Shared to the friend(s) you picked");
 
+  //     // })
 
+  //     // .catch(function(res) {
 
+  //     //   alert(res);
 
+  //     // });
 
+
 
+  //   });
 
+}

+ 84 - 0
misa-course-3/js/liff-init.js
View File 

@@ -0,0 +1,84 @@
 
+// ----- Configuration Zone! -----
 
+// Don't forget to change this to your LIFF ID
 
+
 
+const liffId = "1660679950-obd445d7";
 
+
 
+// Don't forget to change this to your LIFF ID
 
+
 
+liff.init(
 
+  { liffId: liffId },
 
+  () => {
 
+    initLIFF();
 
+  },
 
+  err => {
 
+    window.alert(err);
 
+  }
 
+);
 
+function initLIFF() {
 
+  if (liff.isLoggedIn()) {
 
+    liff
 
+      .getProfile()
 
+      .then(profile => {
 
+        document.getElementById("profileImage").src = profile.pictureUrl;
 
+        // document.getElementById("userId").innerHTML = profile.userId;
 
+        // document.getElementById("displayName").innerHTML = profile.displayName;
 
+        // document.getElementById("statusMessage").innerHTML =
 
+        //   profile.statusMessage;
 
+        // document.getElementById("pictureUrl").href = profile.pictureUrl;
 
+        // document.getElementById("pictureUrl").innerHTML = profile.pictureUrl;
 
+        // document.getElementById(
 
+        //   "email"
 
+        // ).innerHTML = liff.getDecodedIDToken().email;
 
+      })
 
+      .catch(e => {
 
+        // document.getElementById("userId").innerHTML = "No data, " + e;
 
+        // document.getElementById("displayName").innerHTML = "No data, " + e;
 
+        // document.getElementById("statusMessage").innerHTML = "No data, " + e;
 
+        // document.getElementById("pictureUrl").innerHTML = "No data, " + e;
 
+        // document.getElementById("email").innerHTML = "No data, " + e;
 
+      });
 
+  } else {
 
+    // document.getElementById("userId").innerHTML = "No data, Login first";
 
+    // document.getElementById("displayName").innerHTML = "No data, Login first";
 
+    // document.getElementById("statusMessage").innerHTML = "No data, Login first";
 
+    // document.getElementById("pictureUrl").innerHTML = "No data, Login first";
 
+    // document.getElementById("email").innerHTML = "No data, Login first";
 
+  }
 
+
 
+  // document.getElementById("getOS").innerHTML = liff.getOS();
 
+  // document.getElementById("getLanguage").innerHTML = liff.getLanguage();
 
+  // document.getElementById("getVersion").innerHTML = liff.getVersion();
 
+  // document.getElementById("isInClient").innerHTML = liff.isInClient();
 
+  // document.getElementById("isLoggedIn").innerHTML = liff.isLoggedIn();
 
+  var context = liff.getContext();
 
+  if (context !== null) {
 
+    // document.getElementById("context_type").innerHTML = context.type;
 
+    // document.getElementById("context_viewType").innerHTML = context.viewType;
 
+    // document.getElementById("context_userId").innerHTML = context.userId;
 
+    if (context.utouId) {
 
+      // document.getElementById("context_utouId").innerHTML = context.utouId;
 
+    } else {
 
+      // document.getElementById("context_utouId").innerHTML =
 
+      // "You are not in the utou";
 
+    }
 
+    if (context.roomId) {
 
+      // document.getElementById("context_roomId").innerHTML = context.roomId;
 
+    } else {
 
+      // document.getElementById("context_roomId").innerHTML =
 
+      // "You are not in the room";
 
+    }
 
+    if (context.groupId) {
 
+      // document.getElementById("context_groupId").innerHTML = context.groupId;
 
+    } else {
 
+      // document.getElementById("context_groupId").innerHTML =
 
+      //   "You are not in the group ";
 
+    }
 
+  } else {
 
+    // document.getElementById("context_type").innerHTML = "No data.";
 
+    // document.getElementById("context_viewType").innerHTML = "No data.";
 
+    // document.getElementById("context_userId").innerHTML = "No data.";
 
+    // document.getElementById("context_utouId").innerHTML = "No data.";
 
+    // document.getElementById("context_roomId").innerHTML = "No data.";
 
+    // document.getElementById("context_groupId").innerHTML = "No data.";
 
+  }
 
+}