Cập nhật bài viết, nạp phần mềm, tạo bài hướng dẫn sử dụng

Topic/ARGB-LED/basics/tutorials.md

@@ -1,14 +1,30 @@
 ---
 title: Tutorials
-hide:
-  # - navigation
-  # - toc
+layout: page
+title: ARGB Tutorials
+meta-title: ARGB Tutorials
+# subtitle: "... Welcome to ARGB"
+bigimg:
+  - "/Topic/ARGB-LED/image/BANER__ARGB.png"
+image: "/Topic/ARGB-LED/image/BANER__ARGB.png"
+tags: [Tutorialss, ARGBl, bluetooth]
+category: Programming MCU
+# gh-repo: bangnguyendev/flash-esp-web-bangnguyendev
+# gh-badge: [fork]
+# author: "BangNguyen"
+# comments: true
 ---
 
-**Don't know yet how to solder? Unsure how to connect your LEDs safely? How to find the perfect power supply?**  
-No worries, we have collected a few helpful links for you to learn more about these and more topics:
+**Bạn vẫn chưa biết cách hàn? Không chắc chắn làm thế nào để kết nối đèn LED của bạn một cách an toàn? Làm thế nào để tìm được nguồn điện hoàn hảo?**  
 
-### WLED specific tutorials
+Đừng lo lắng, chúng tôi đã thu thập một số liên kết hữu ích để bạn tìm hiểu thêm về những chủ đề này và nhiều chủ đề khác:
+
+### ARGB Happy Smart Light hướng dẫn cụ thể (tiếng Việt)
+
+{: .box-note}
+**Note:**Đang được cập nhật ...
+
+### WLED hướng dẫn cụ thể (English)
 
 | Resource | Maker | Type | Date | Info
 | --- | --- | --- | --- | --- |

Topic/ARGB-LED/index.md

@@ -22,6 +22,36 @@ category: Programming MCU
 
 **Triển khai nhanh chóng** và nhiều tính năng của máy chủ web để điều khiển đèn **LED NeoPixel** (WS2812B, WS2811, SK6812, ...) hoặc các chipsets dựa trên SPI như WS2801 và APA102!
 
+{: .box-warning}
+**Warning:** Đối với mạch điều khiển LED **ARGB Happy Smart Light** chỉ có tiếng Việt cho chip **ESP32** và **ESP32-S3**.
+
+<!-- Sử dụng cho button class="action action--button" -->
+<link rel="stylesheet" href="/dist/css/main-bio.css"> 
+<div style="text-align: center;">
+  <h4>ESP Web Tools - bangnguyendev</h4>
+  <!-- Lựa chọn các option -->
+  <div>
+    <label for="optiongroup">Chọn phiên bản:</label>
+    <select id="optiongroup">
+      <optgroup label="ARGB Led tiếng Việt">
+        <option value="/dist/json/manifest_ESP8266_ESP32_ARGB_VN.json">ARGB Led - v1.0.0_VN</option>
+      </optgroup>
+      <optgroup label="ARGB Led">
+        <option value="/dist/json/manifest_ESP8266_ESP32_ARGB.json">ARGB Led - v1.0.0</option>
+     </optgroup>
+      <optgroup label="Example ESP Web Tools - OTA">
+        <option value="/dist/json/manifest_ESP8266_ESP32.json">ESP Web Tools - OTA - v1.0.0</option>
+      </optgroup>
+    </select>
+  </div>
+
+  Kết nối <a href="https://s.shopee.vn/4Aewn9TB7g"><b>USB-TTL</b></a> với bo mạch <b>ARGB Happy Smart Light</b>.<br> Cắm <b>USB-TTL</b> vào máy tính của bạn. <br>Phiên bản đang chọn: <span style="font-weight: bold;" id="verstr"></span><br>
+  <!-- Button install ESP -->
+  <esp-web-install-button id="espInstallButton">
+  <button class="action action--button" slot="activate"><i class="fa fa-usb"></i><span class="action__text">Kết nối & Cài đặt</span></button>
+  </esp-web-install-button>
+</div>
+
 #### ⚙️ Tính năng
 
 - Thư viện **WS2812FX** tích hợp cho **hơn 180 hiệu ứng đặc biệt**
@@ -73,7 +103,7 @@ category: Programming MCU
 
 [Hướng dẫn sử dụng nhanh!](basics/getting-started)
 
-[On this page](basics/tutorials) you can find excellent tutorials made by the community and helpful tools to help you get your new lamp up and running!
+[Trên trang này](basics/tutorials), bạn có thể tìm thấy các hướng dẫn tuyệt vời do cộng đồng thực hiện và các công cụ hữu ích để giúp bạn thiết lập và vận hành chiếc đèn mới của mình!
 
 #### 🖼️ User interface
 
@@ -87,5 +117,38 @@ See [here](basics/compatible-hardware)! -->
 
 Licensed under the MIT license   -->
 
-### ✌️ Happy Smart Light - bangnguyendev
-
+## ✌️ Happy Smart Light - bangnguyendev
+
+
+<script>
+document.addEventListener("DOMContentLoaded", function() {
+  var optiongroup = document.getElementById("optiongroup");
+  var espButton = document.getElementById("espInstallButton");
+
+
+
+  // Thiết lập mặc định cho option đầu tiên
+  espButton.setAttribute("manifest", optiongroup.options[0].value);
+  document.getElementById('verstr').textContent = optiongroup.options[0].text;
+
+  // Lắng nghe sự kiện khi người dùng thay đổi tùy chọn
+  optiongroup.addEventListener("change", function() {
+    var selectedManifest = this.value;
+
+    if (!selectedManifest) {
+      // Nếu không có tùy chọn nào được chọn, sử dụng tùy chọn đầu tiên
+      espButton.setAttribute("manifest", optiongroup.options[0].value);
+      document.getElementById('verstr').textContent = optiongroup.options[0].text;
+    } else {
+      // Sử dụng tùy chọn được chọn
+      espButton.setAttribute("manifest", selectedManifest);
+      document.getElementById('verstr').textContent = optiongroup.options[optiongroup.selectedIndex].text;
+    }
+  });
+});
+</script>
+
+<script
+  type="module"
+  src="https://unpkg.com/flash-esp-web-bangnguyendev@1.0.1/dist/web/install-button.js?module">
+</script>

_config.yml

@@ -21,7 +21,8 @@ navbar-links:
     - Electronic components: Topic/Electronic components
   ⚙️Tools: 
     - Esp Web Tools: 2024-05-10-Flash-firmware
-    - ARGB - Led: Topic/ARGB-LED/index
+    - ARGB HappyLight: Topic/ARGB-LED/index
+    - ARGB Hướng dẫn: Topic/ARGB-LED/basics/tutorials
   🏋️About Me: 
     - About Me: resume/aboutme
     - LinkedIn: "https://www.linkedin.com/in/bangnguyenduy"

_posts/2024-05-10-Flash-firmware.md

@@ -13,11 +13,14 @@ category: Programming MCU
 # author: "BangNguyen"
 # comments: true
 ---
-Web Serial is available in Google Chrome and Microsoft Edge browsers. Android support should be possible but has not been implemented yet.
+**Web Serial** có sẵn trong trình duyệt **Google Chrome** và **Microsoft Edge**. Có thể hỗ trợ Android nhưng vẫn chưa được triển khai.
 
 <!-- Sử dụng cho button class="action action--button" -->
 <link rel="stylesheet" href="/dist/css/main-bio.css"> 
 
+{: .box-warning}
+**Warning:** Đối với mạch điều khiển LED **ARGB Happy Smart Light** chỉ có tiếng Việt cho chip **ESP32-S3** (cấu hình **ESP8266** không đủ cấu hình để thêm tính năng mới!).
+
 <div style="text-align: center;">
   <h4>ESP Web Tools - bangnguyendev</h4>
   <!-- Lựa chọn các option -->
@@ -30,7 +33,7 @@ Web Serial is available in Google Chrome and Microsoft Edge browsers. Android su
       <optgroup label="ARGB Led">
         <option value="/dist/json/manifest_ESP8266_ESP32_ARGB.json">ARGB Led - v1.0.0</option>
       </optgroup>
-      <optgroup label="ARGB_VN Led">
+      <optgroup label="ARGB_VN Led ONLY ESP32 S3">
         <option value="/dist/json/manifest_ESP8266_ESP32_ARGB_VN.json">ARGB Led - v1.0.0_VN</option>
       </optgroup>
       <optgroup label="Ươm mầm lập trình nhí">

dist/json/manifest_ESP8266_ESP32_ARGB_VN.json

@@ -5,6 +5,15 @@
     "new_install_prompt_erase": true,
     "new_install_improv_wait_time": 20,
     "builds": [
+        {
+            "chipFamily": "ESP32",
+            "parts": [
+                {
+                    "path": "/img/Load-Firmware/ARGB_1.0.0_ESP32_VN.bin",
+                    "offset": 65536
+                }
+            ]
+        },
         {
             "chipFamily": "ESP32-S3",
             "parts": [