From 8161c085fdbb95180040676f9d0459f15267eb0f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=AF=E3=82=8B=E3=81=AF=E3=82=8B?=
 <61141911+htvoffcial@users.noreply.github.com>
Date: Sun, 8 Sep 2024 23:17:56 +0900
Subject: [PATCH] 1.0.1Release

---
 README.md                                     |  9 ++++++
 raw/script/siteembeddreader.js                | 19 +++++++++++
 raw/styles/siteembeddreaderstyle.css          | 32 +++++++++++++++++++
 sample/index.html                             |  0
 .../1.0.1/siteembeddreader.min.js             |  1 +
 5 files changed, 61 insertions(+)
 create mode 100644 raw/script/siteembeddreader.js
 create mode 100644 raw/styles/siteembeddreaderstyle.css
 create mode 100644 sample/index.html
 create mode 100644 siteembeddreader/1.0.1/siteembeddreader.min.js

diff --git a/README.md b/README.md
index 2cb9094..1234620 100644
--- a/README.md
+++ b/README.md
@@ -3,3 +3,12 @@
 タグを貼ればbody内を読み上げてくれます！
 ![image](https://github.com/user-attachments/assets/461331d5-498c-4454-8d91-8664b0de7ffc)
 動作イメージ
+```
+<script src="siteembeddreader.min.js"></script>
+```
+と
+```
+<div class="rb-1"></div>
+```
+を任意の場所に設置するだけです。
+※divはどのブロック要素でも問題ありません。
\ No newline at end of file
diff --git a/raw/script/siteembeddreader.js b/raw/script/siteembeddreader.js
new file mode 100644
index 0000000..3581e99
--- /dev/null
+++ b/raw/script/siteembeddreader.js
@@ -0,0 +1,19 @@
+    document.getElementById("pbtn").innerText = "▼";
+  
+    function ltts() {
+      if (document.getElementById("pbtn").className.indexOf("r-now") !== -1) {
+        document.getElementById("pbtn").classList.remove('r-now');
+        document.getElementById("pbtn").classList.add('r-pause');
+        document.getElementById("pbtn").innerText = "▼";
+        speechSynthesis.cancel();
+      } else {
+        document.getElementById("pbtn").classList.remove('r-pause');
+        document.getElementById("pbtn").classList.add("r-now");
+        document.getElementById("pbtn").innerText = "=";
+        var icontent = document.body.innerText;
+        voices = speechSynthesis.getVoices();
+        const uttr = new SpeechSynthesisUtterance(icontent);
+        uttr.voice = voices[182];
+        speechSynthesis.speak(uttr);
+      }
+    }
\ No newline at end of file
diff --git a/raw/styles/siteembeddreaderstyle.css b/raw/styles/siteembeddreaderstyle.css
new file mode 100644
index 0000000..5f8639a
--- /dev/null
+++ b/raw/styles/siteembeddreaderstyle.css
@@ -0,0 +1,32 @@
+.rb-1 {
+    cursor:pointer;
+    display: inline-flex;
+    padding: 0px;
+    border-radius: 20px;
+    background: linear-gradient(90deg, rgba(120, 119, 131, 1) 0%, rgba(173, 173, 173, 1) 35%, rgba(131, 194, 195, 1) 73%, rgba(81, 196, 219, 1) 100%);
+    object-fit: contain;
+    background-size: contain;
+    color: #fff;
+    align-items: center;
+  }
+
+  .l-box-2::before {
+    content: " ";
+    height: 100%;
+    border-left: solid 1px #fefefe;
+    margin-right: 10px;
+  }
+
+  .l-box-2 {
+    margin: 10px;
+  }
+
+  .r-box-2 {
+    margin-left: 15px;
+    cursor: pointer;
+    user-select: none;
+  }
+
+  .pbtn-p {
+    transform: rotate(-90deg);
+  }
\ No newline at end of file
diff --git a/sample/index.html b/sample/index.html
new file mode 100644
index 0000000..e69de29
diff --git a/siteembeddreader/1.0.1/siteembeddreader.min.js b/siteembeddreader/1.0.1/siteembeddreader.min.js
new file mode 100644
index 0000000..1d7aa31
--- /dev/null
+++ b/siteembeddreader/1.0.1/siteembeddreader.min.js
@@ -0,0 +1 @@
+window.onload=function(){const rbElements=document.querySelectorAll('.rb-1');rbElements.forEach(function(rbElement){rbElement.innerHTML=` <div class="r-box-2 pbtn-p" id="pbtn" onclick="ltts()">▼</div> <div class="l-box-2" onclick="ltts()" capdsa="aa"> 読み上げる </div> `});const style=document.createElement('style');style.innerHTML=` .rb-1 { display: inline-flex; padding: 0px; border-radius: 20px; background: linear-gradient(90deg, rgba(120, 119, 131, 1) 0%, rgba(173, 173, 173, 1) 35%, rgba(131, 194, 195, 1) 73%, rgba(81, 196, 219, 1) 100%); object-fit: contain; background-size: contain; color: #fff; align-items: center; } .l-box-2::before { content: " "; height: 100%; border-left: solid 1px #fefefe; margin-right: 10px; } .l-box-2 { margin: 10px; } .r-box-2 { margin-left: 15px; cursor: pointer; user-select: none; } .pbtn-p { transform: rotate(-90deg); } `;document.head.appendChild(style)};function ltts(){const pbtn=document.getElementById("pbtn");if(pbtn.className.indexOf("r-now")!==-1){pbtn.classList.remove('r-now');pbtn.classList.add('r-pause');pbtn.innerText="▼";speechSynthesis.cancel()}else{pbtn.classList.remove('r-pause');pbtn.classList.add("r-now");pbtn.innerText="=";const icontent=document.body.innerText;const voices=speechSynthesis.getVoices();const uttr=new SpeechSynthesisUtterance(icontent);uttr.voice=voices[182];speechSynthesis.speak(uttr)}}
\ No newline at end of file