diff --git a/extractor/index.html b/extractor/index.html
deleted file mode 100644
index 55109d5..0000000
--- a/extractor/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
-
-
-
-
- SpreadSheetIDExtractor
-
-
-
- スプシID抽出 & ドライブ画像リンク変換ツール
-
-
本ツールはSpreadSyncCMSを使用する際に必要なID & 画像リンクを変換するツールです。IDはGASに記載する際にURLから抽出する必要があり、画像リンクはスプシのimgの行に書き込む際に変換が必要です。
-
-
スプレッドシートID抽出
-
GoogleスプレッドシートのURL内のIDを抽出します。
-
【抽出前】https://docs.google.com/spreadsheets/d/10OZa1MYV1zZVjOMZzoBglNwW0BRp55Wn2OQkjbaIGo8/edit#gid=771807520
-
【抽出後】10OZa1MYV1zZVjOMZzoBglNwW0BRp55Wn2OQkjbaIGo8
-
-
-
-
-
-
Drive画像リンク変換
-
Googleドライブの画像リンクをimgタグで利用できるURLに変換します。
-
【変換前】https://drive.google.com/file/d/1M0IIk14mg_G0eBf3yaLk1PD5JEz--6RA/view?usp=sharing
-
【変換後】https://lh3.google.com/u/o/d/1M0IIk14mg_G0eBf3yaLk1PD5JEz--6RA
-
-
-
-
-
-
-
-
diff --git a/extractor/script.js b/extractor/script.js
deleted file mode 100644
index f5002aa..0000000
--- a/extractor/script.js
+++ /dev/null
@@ -1,61 +0,0 @@
-document.getElementById("spreadsheetUrlInput").addEventListener("blur", function() {
- var url = this.value;
- if(SpreadsheetUrl(url)) {
- document.getElementById("spreadsheetIdDisplay").value = extractSpreadsheetId(url);
- document.getElementById("spreadsheetWarning").textContent = '';
- } else {
- document.getElementById("spreadsheetWarning").textContent = '正しいスプレッドシートのURLを入力してください。';
- }
-});
-
-document.getElementById("driveUrlInput").addEventListener("blur", function() {
- var url = this.value;
- if(DriveUrl(url)) {
- document.getElementById("driveUrlDisplay").value = convertDriveUrlToImageTag(url);
- document.getElementById("driveWarning").textContent = '';
- } else {
- document.getElementById("driveWarning").textContent = '正しいドライブの共有リンクを入力してください。';
- }
-});
-
-function SpreadsheetUrl(url) {
- return /\/spreadsheets\/d\/[a-zA-Z0-9-_]+/.test(url);
-}
-
-function DriveUrl(url) {
- return /\/file\/d\/[a-zA-Z0-9-_]+/.test(url);
-}
-
-function extractSpreadsheetId(url) {
- var matches = /\/spreadsheets\/d\/([a-zA-Z0-9-_]+)/.exec(url);
- return matches ? matches[1] : '';
-}
-
-function convertDriveUrlToImageTag(url) {
- var fileId = extractFileId(url);
- return "https://lh3.google.com/u/o/d/" + fileId;
-}
-
-function extractFileId(url) {
- var matches = /\/file\/d\/([a-zA-Z0-9-_]+)/.exec(url);
- return matches ? matches[1] : '';
-}
-
-document.getElementById("copySpreadsheetId").addEventListener("click", function() {
- copyToClipboard("spreadsheetIdDisplay");
-});
-
-document.getElementById("copyDriveUrl").addEventListener("click", function() {
- copyToClipboard("driveUrlDisplay");
-});
-
-function copyToClipboard(elementId) {
- var copyText = document.getElementById(elementId).value;
- navigator.clipboard.writeText(copyText)
- .then(() => {
- console.log('Text copied to clipboard');
- })
- .catch(err => {
- console.error('Error in copying text: ', err);
- });
-}
\ No newline at end of file
diff --git a/extractor/style.css b/extractor/style.css
deleted file mode 100644
index 6bd8e3c..0000000
--- a/extractor/style.css
+++ /dev/null
@@ -1,87 +0,0 @@
-body {
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
- background-color: #f2f2f2;
- color: #333;
- padding: 20px;
- line-height: 1.6;
-}
-
-h1 {
- color: #2c3e50;
- font-size: 1.8em;
- margin-bottom: 0.7em;
- text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
- text-align: center;
-}
-
-h2 {
- color: #34495e;
- font-size: 1.4em;
- padding: 0 8px;
- border-left: #4d7aa8 solid 4px;
-}
-
-p {
- color :#34495e;
- font-size: 0.9em;
-}
-
-input[type="text"], button {
- width: 75%;
- padding: 10px;
- margin: 10px 0;
- border-radius: 5px;
- border: 1px solid #ccc;
- box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
-}
-
-input[type="text"] {
- box-sizing: border-box;
-}
-
-button {
- width: auto;
- background-color: #4caf50;
- color: white;
- border: none;
- cursor: pointer;
- transition: background-color 0.3s ease;
-}
-
-button:hover {
- background-color: #45a049;
-}
-
-.warning {
- color: red;
- margin-top: 5px;
-}
-
-.container {
- width: 70%;
- margin: auto;
- overflow:scroll
-}
-
-@media screen and (max-width: 700px) {
- h1 {
- font-size: 1.3em;
- }
-
- h2 {
- font-size: 1.1em;;
- }
-
- p {
- font-size: 0.7em;
- }
-
- .container {
- width: 95%;
- margin: 20px auto;
- }
-
- input[type="text"], button {
- width: 100%;
- }
-}
diff --git a/system/extractor/index.html b/system/extractor/index.html
new file mode 100644
index 0000000..55109d5
--- /dev/null
+++ b/system/extractor/index.html
@@ -0,0 +1,33 @@
+
+
+
+
+ SpreadSheetIDExtractor
+
+
+
+ スプシID抽出 & ドライブ画像リンク変換ツール
+
+
本ツールはSpreadSyncCMSを使用する際に必要なID & 画像リンクを変換するツールです。IDはGASに記載する際にURLから抽出する必要があり、画像リンクはスプシのimgの行に書き込む際に変換が必要です。
+
+
スプレッドシートID抽出
+
GoogleスプレッドシートのURL内のIDを抽出します。
+
【抽出前】https://docs.google.com/spreadsheets/d/10OZa1MYV1zZVjOMZzoBglNwW0BRp55Wn2OQkjbaIGo8/edit#gid=771807520
+
【抽出後】10OZa1MYV1zZVjOMZzoBglNwW0BRp55Wn2OQkjbaIGo8
+
+
+
+
+
+
Drive画像リンク変換
+
Googleドライブの画像リンクをimgタグで利用できるURLに変換します。
+
【変換前】https://drive.google.com/file/d/1M0IIk14mg_G0eBf3yaLk1PD5JEz--6RA/view?usp=sharing
+
【変換後】https://lh3.google.com/u/o/d/1M0IIk14mg_G0eBf3yaLk1PD5JEz--6RA
+
+
+
+
+
+
+
+
diff --git a/system/extractor/script.js b/system/extractor/script.js
new file mode 100644
index 0000000..f5002aa
--- /dev/null
+++ b/system/extractor/script.js
@@ -0,0 +1,61 @@
+document.getElementById("spreadsheetUrlInput").addEventListener("blur", function() {
+ var url = this.value;
+ if(SpreadsheetUrl(url)) {
+ document.getElementById("spreadsheetIdDisplay").value = extractSpreadsheetId(url);
+ document.getElementById("spreadsheetWarning").textContent = '';
+ } else {
+ document.getElementById("spreadsheetWarning").textContent = '正しいスプレッドシートのURLを入力してください。';
+ }
+});
+
+document.getElementById("driveUrlInput").addEventListener("blur", function() {
+ var url = this.value;
+ if(DriveUrl(url)) {
+ document.getElementById("driveUrlDisplay").value = convertDriveUrlToImageTag(url);
+ document.getElementById("driveWarning").textContent = '';
+ } else {
+ document.getElementById("driveWarning").textContent = '正しいドライブの共有リンクを入力してください。';
+ }
+});
+
+function SpreadsheetUrl(url) {
+ return /\/spreadsheets\/d\/[a-zA-Z0-9-_]+/.test(url);
+}
+
+function DriveUrl(url) {
+ return /\/file\/d\/[a-zA-Z0-9-_]+/.test(url);
+}
+
+function extractSpreadsheetId(url) {
+ var matches = /\/spreadsheets\/d\/([a-zA-Z0-9-_]+)/.exec(url);
+ return matches ? matches[1] : '';
+}
+
+function convertDriveUrlToImageTag(url) {
+ var fileId = extractFileId(url);
+ return "https://lh3.google.com/u/o/d/" + fileId;
+}
+
+function extractFileId(url) {
+ var matches = /\/file\/d\/([a-zA-Z0-9-_]+)/.exec(url);
+ return matches ? matches[1] : '';
+}
+
+document.getElementById("copySpreadsheetId").addEventListener("click", function() {
+ copyToClipboard("spreadsheetIdDisplay");
+});
+
+document.getElementById("copyDriveUrl").addEventListener("click", function() {
+ copyToClipboard("driveUrlDisplay");
+});
+
+function copyToClipboard(elementId) {
+ var copyText = document.getElementById(elementId).value;
+ navigator.clipboard.writeText(copyText)
+ .then(() => {
+ console.log('Text copied to clipboard');
+ })
+ .catch(err => {
+ console.error('Error in copying text: ', err);
+ });
+}
\ No newline at end of file
diff --git a/system/extractor/style.css b/system/extractor/style.css
new file mode 100644
index 0000000..6bd8e3c
--- /dev/null
+++ b/system/extractor/style.css
@@ -0,0 +1,87 @@
+body {
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+ background-color: #f2f2f2;
+ color: #333;
+ padding: 20px;
+ line-height: 1.6;
+}
+
+h1 {
+ color: #2c3e50;
+ font-size: 1.8em;
+ margin-bottom: 0.7em;
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+ text-align: center;
+}
+
+h2 {
+ color: #34495e;
+ font-size: 1.4em;
+ padding: 0 8px;
+ border-left: #4d7aa8 solid 4px;
+}
+
+p {
+ color :#34495e;
+ font-size: 0.9em;
+}
+
+input[type="text"], button {
+ width: 75%;
+ padding: 10px;
+ margin: 10px 0;
+ border-radius: 5px;
+ border: 1px solid #ccc;
+ box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
+}
+
+input[type="text"] {
+ box-sizing: border-box;
+}
+
+button {
+ width: auto;
+ background-color: #4caf50;
+ color: white;
+ border: none;
+ cursor: pointer;
+ transition: background-color 0.3s ease;
+}
+
+button:hover {
+ background-color: #45a049;
+}
+
+.warning {
+ color: red;
+ margin-top: 5px;
+}
+
+.container {
+ width: 70%;
+ margin: auto;
+ overflow:scroll
+}
+
+@media screen and (max-width: 700px) {
+ h1 {
+ font-size: 1.3em;
+ }
+
+ h2 {
+ font-size: 1.1em;;
+ }
+
+ p {
+ font-size: 0.7em;
+ }
+
+ .container {
+ width: 95%;
+ margin: 20px auto;
+ }
+
+ input[type="text"], button {
+ width: 100%;
+ }
+}