Update src/addons/addons/save-to-google/userscript.js

src/addons/addons/save-to-google/userscript.js

@@ -1,50 +1,106 @@
 export default async ({ addon, console, msg }) => {
-  // 永続的に対象要素が出現するのを待つループ
   while (true) {
-    // 対象のメニュー要素を待機
     const targetElem = await addon.tab.waitForElement(
       'div[class*="menu-bar_file-group"] > div:last-child:not(.sa-record)',
       { markAsSeen: true }
     );
 
-    // 同じボタンが複数作られないようにチェック
     if (!document.querySelector('.sa-custom-modal-button')) {
-      // ボタン要素を作成
       const button = document.createElement("div");
       button.className = "sa-custom-modal-button " + targetElem.className;
-      button.textContent = msg("open-modal"); // ローカライズされた文字列
+      button.textContent = "保存";
       button.style.cursor = "pointer";
 
-      // ボタンがクリックされたときにモーダルを表示するイベントリスナー
       button.addEventListener("click", () => {
-        // モーダルを作成（addon.tab.createModalを利用）
         const { backdrop, container, content, closeButton, remove } = addon.tab.createModal(
-          msg("modal-title"), // モーダルのタイトル
+          "保存", 
           { isOpen: true, useEditorClasses: true }
         );
 
-        // モーダル内に任意のHTMLを設定
         content.innerHTML = `
           <div>
-            <h1>${msg("modal-header")}</h1>
-            <p>${msg("modal-description")}</p>
-            <button id="modal-ok-button">${msg("ok")}</button>
+            <h1>Googleドライブに接続</h1>
+            <p>Googleでログインして、プロジェクトを保存します。</p>
+            <button id="google-login-button">Googleでログイン</button>
           </div>
         `;
 
-        // 「OK」ボタンがクリックされたらモーダルを閉じる
-        const okButton = content.querySelector("#modal-ok-button");
-        if (okButton) {
-          okButton.addEventListener("click", () => remove());
+        const loginButton = content.querySelector("#google-login-button");
+        if (loginButton) {
+          loginButton.addEventListener("click", () => {
+            const authUrl = `https://accounts.google.com/o/oauth2/auth?client_id=1033286471224-n9mv8l869fqikubj2e8q92n8ige3qr6r.apps.googleusercontent.com&redirect_uri=${encodeURIComponent("close.php")}&response_type=token&scope=https://www.googleapis.com/auth/drive.file`;
+            
+            const authWindow = window.open(authUrl, "_blank", "width=500,height=600");
+            
+            const checkAuth = setInterval(() => {
+              if (authWindow.closed) {
+                clearInterval(checkAuth);
+                saveToGoogleDrive();
+              }
+            }, 1000);
+          });
         }
 
-        // バックドロップやクローズボタンをクリックした場合もモーダルを閉じる
         backdrop.addEventListener("click", () => remove());
         closeButton.addEventListener("click", () => remove());
       });
 
-      // 対象の親要素にボタンを追加
       targetElem.parentElement.appendChild(button);
     }
   }
 };
+
+async function saveToGoogleDrive() {
+  const dataURL = await new Promise((resolve) => {
+    SB3Downloader.saveProjectSb3().then((blob) => {
+      const fr = new FileReader();
+      fr.onload = () => resolve(fr.result);
+      fr.onabort = () => {
+        throw new Error("Read aborted");
+      };
+      fr.readAsDataURL(blob);
+    });
+  });
+
+  const accessToken = getAccessTokenFromUrl();
+  if (!accessToken) {
+    console.error("Google認証トークンが取得できませんでした。");
+    return;
+  }
+
+  const metadata = {
+    name: "project.sb3",
+    mimeType: "application/x-scratch",
+  };
+  
+  const form = new FormData();
+  form.append("metadata", new Blob([JSON.stringify(metadata)], { type: "application/json" }));
+  form.append("file", dataURLToBlob(dataURL));
+
+  fetch("https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart", {
+    method: "POST",
+    headers: {
+      Authorization: `Bearer ${accessToken}`,
+    },
+    body: form,
+  })
+  .then(response => response.json())
+  .then(data => console.log("ファイルがGoogleドライブに保存されました: ", data))
+  .catch(error => console.error("Googleドライブへの保存中にエラーが発生しました: ", error));
+}
+
+function getAccessTokenFromUrl() {
+  const params = new URLSearchParams(window.location.hash.substring(1));
+  return params.get("access_token");
+}
+
+function dataURLToBlob(dataURL) {
+  const byteString = atob(dataURL.split(",")[1]);
+  const mimeString = dataURL.split(",")[0].split(":")[1].split(";")[0];
+  const ab = new ArrayBuffer(byteString.length);
+  const ia = new Uint8Array(ab);
+  for (let i = 0; i < byteString.length; i++) {
+    ia[i] = byteString.charCodeAt(i);
+  }
+  return new Blob([ab], { type: mimeString });
+}