From 188bc0e991df95390d2965febf9a7cf483e6ab21 Mon Sep 17 00:00:00 2001
From: hathach <thach@tinyusb.org>
Date: Thu, 5 Aug 2021 18:00:41 +0700
Subject: [PATCH] change webusb-serial landing page

- to example.tinyusb.org/webusb-serial/
- remove landing page from doc
---
 docs/conf.py                                  |   3 -
 .../examples/webusb-serial/application.css    | 107 ------------------
 .../examples/webusb-serial/application.js     |  90 ---------------
 .../examples/webusb-serial/index.html         |  33 ------
 .../examples/webusb-serial/serial.js          |  89 ---------------
 examples/device/webusb_serial/src/main.c      |   2 +-
 6 files changed, 1 insertion(+), 323 deletions(-)
 delete mode 100644 docs/html_extra/examples/webusb-serial/application.css
 delete mode 100644 docs/html_extra/examples/webusb-serial/application.js
 delete mode 100644 docs/html_extra/examples/webusb-serial/index.html
 delete mode 100644 docs/html_extra/examples/webusb-serial/serial.js

diff --git a/docs/conf.py b/docs/conf.py
index 1d05d7cb6..c7a17478f 100644
--- a/docs/conf.py
+++ b/docs/conf.py
@@ -39,7 +39,4 @@ html_theme_options = {
     'sidebar_hide_name': True,
 }
 
-# examples for webusb
-html_extra_path = ['html_extra']
-
 todo_include_todos = True
diff --git a/docs/html_extra/examples/webusb-serial/application.css b/docs/html_extra/examples/webusb-serial/application.css
deleted file mode 100644
index 4ae0138bd..000000000
--- a/docs/html_extra/examples/webusb-serial/application.css
+++ /dev/null
@@ -1,107 +0,0 @@
-.main-content {
-  width: 1440px;
-  margin: auto;
-  font-size: 14px;
-}
-
-.connect-container {
-  margin: 20px 0;
-}
-
-.container {
-  display: flex;
-}
-
-.sender, .receiver {
-  flex: 1;
-}
-
-.sender {
-  margin-right: 8px;
-}
-
-.receiver {
-  margin-left: 8px;
-}
-
-.lines-header {
-  height: 30px;
-  width: 100%;
-  box-sizing: border-box;
-  background-color: #444;
-  line-height: 30px;
-  color: white;
-  padding-left: 10px;
-}
-
-.lines-body {
-  width: 100%;
-  background-color: #222;
-  min-height: 300px;
-  padding: 10px 0 20px 0;
-}
-
-.line, .command-line {
-  box-sizing: border-box;
-  width: 100%;
-  color: #f1f1f1;
-  background-color: #222;
-  outline: none;
-  border: none;
-  padding: 5px 10px;
-  font-size: 14px;
-}
-
-.line:hover {
-   background-color: #444;
-}
-
-.button::before {
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    -webkit-box-shadow: #959595 0 2px 5px;
-    -moz-box-shadow: #959595 0 2px 5px;
-    border-radius: 3px;
-    box-shadow: #959595 0 2px 5px;
-    content: "";
-    display: block;
-    left: 0;
-    padding: 2px 0 0;
-    position: absolute;
-    top: 0;
-}
-
-.button:active::before { padding: 1px 0 0; }
-
-.button.black {
-    background: #656565;
-    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#656565), to(#444));
-    background: -moz-linear-gradient(#656565, #444);
-    background: linear-gradient(#656565, #444);
-    border: solid 1px #535353;
-    border-bottom: solid 3px #414141;
-    box-shadow: inset 0 0 0 1px #939393;
-    color: #fff;
-    text-shadow: 0 1px 0 #2f2f2f;
-    padding: 8px 16px;
-    outline: none;
-}
-
-.button.black:hover {
-    background: #4c4c4c;
-    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#4c4c4c), to(#565656));
-    background: -moz-linear-gradient(#4c4c4c, #565656);
-    background: linear-gradient(#4c4c4c, #565656);
-    border: solid 1px #464646;
-    border-bottom: solid 3px #414141;
-    box-shadow: inset 0 0 0 1px #818181;
-}
-
-.button.black:active {
-    background: #474747;
-    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#474747), to(#444));
-    background: -moz-linear-gradient(#474747, #444);
-    background: linear-gradient(#474747, #444);
-    border: solid 1px #2f2f2f;
-    box-shadow: inset 0 10px 15px 0 #3e3e3e;
-}
diff --git a/docs/html_extra/examples/webusb-serial/application.js b/docs/html_extra/examples/webusb-serial/application.js
deleted file mode 100644
index 283121e32..000000000
--- a/docs/html_extra/examples/webusb-serial/application.js
+++ /dev/null
@@ -1,90 +0,0 @@
-(function() {
-  'use strict';
-
-  document.addEventListener('DOMContentLoaded', event => {
-    let connectButton = document.querySelector("#connect");
-    let statusDisplay = document.querySelector('#status');
-    let port;
-
-    function addLine(linesId, text) {
-      var senderLine = document.createElement("div");
-      senderLine.className = 'line';
-      var textnode = document.createTextNode(text);
-      senderLine.appendChild(textnode);
-      document.getElementById(linesId).appendChild(senderLine);
-      return senderLine;
-    }
-
-    let currentReceiverLine;
-
-    function appendLine(linesId, text) {
-      if (currentReceiverLine) {
-        currentReceiverLine.innerHTML =  currentReceiverLine.innerHTML + text;
-      } else {
-        currentReceiverLine = addLine(linesId, text);
-      }
-    }
-
-    function connect() {
-      port.connect().then(() => {
-        statusDisplay.textContent = '';
-        connectButton.textContent = 'Disconnect';
-
-        port.onReceive = data => {
-          let textDecoder = new TextDecoder();
-          console.log(textDecoder.decode(data));
-          if (data.getInt8() === 13) {
-            currentReceiverLine = null;
-          } else {
-            appendLine('receiver_lines', textDecoder.decode(data));
-          }
-        };
-        port.onReceiveError = error => {
-          console.error(error);
-        };
-      }, error => {
-        statusDisplay.textContent = error;
-      });
-    }
-
-    connectButton.addEventListener('click', function() {
-      if (port) {
-        port.disconnect();
-        connectButton.textContent = 'Connect';
-        statusDisplay.textContent = '';
-        port = null;
-      } else {
-        serial.requestPort().then(selectedPort => {
-          port = selectedPort;
-          connect();
-        }).catch(error => {
-          statusDisplay.textContent = error;
-        });
-      }
-    });
-
-    serial.getPorts().then(ports => {
-      if (ports.length === 0) {
-        statusDisplay.textContent = 'No device found.';
-      } else {
-        statusDisplay.textContent = 'Connecting...';
-        port = ports[0];
-        connect();
-      }
-    });
-
-
-    let commandLine = document.getElementById("command_line");
-
-    commandLine.addEventListener("keypress", function(event) {
-      if (event.keyCode === 13) {
-        if (commandLine.value.length > 0) {
-          addLine('sender_lines', commandLine.value);
-          commandLine.value = '';
-        }
-      }
-
-      port.send(new TextEncoder('utf-8').encode(String.fromCharCode(event.which || event.keyCode)));
-    });
-  });
-})();
diff --git a/docs/html_extra/examples/webusb-serial/index.html b/docs/html_extra/examples/webusb-serial/index.html
deleted file mode 100644
index 2f1432b0b..000000000
--- a/docs/html_extra/examples/webusb-serial/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <title>TinyUSB</title>
-    <script src="serial.js"></script>
-    <script src="application.js"></script>
-    <link rel="stylesheet" href="application.css">
-  </head>
-  <body>
-    <div class="main-content">
-      <h1>TinyUSB - WebUSB Serial Example</h1>
-      <div class="connect-container">
-        <button id="connect" class="button black">Connect</button>
-        <span id="status"></span>
-      </div>
-      <div class="container">
-        <div class="sender">
-          <div class="lines-header">Sender</div>
-          <div class="lines-body">
-            <div id="sender_lines" class="lines"></div>
-            <input id="command_line" class="command-line" placeholder="Start typing ...." />
-          </div>
-        </div>
-        <div class="receiver">
-          <div class="lines-header">Receiver</div>
-          <div class="lines-body">
-            <div id="receiver_lines" class="lines"></div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </body>
-</html>
diff --git a/docs/html_extra/examples/webusb-serial/serial.js b/docs/html_extra/examples/webusb-serial/serial.js
deleted file mode 100644
index 8e985d897..000000000
--- a/docs/html_extra/examples/webusb-serial/serial.js
+++ /dev/null
@@ -1,89 +0,0 @@
-var serial = {};
-
-(function() {
-  'use strict';
-
-  serial.getPorts = function() {
-    return navigator.usb.getDevices().then(devices => {
-      return devices.map(device => new serial.Port(device));
-    });
-  };
-
-  serial.requestPort = function() {
-    const filters = [
-      { 'vendorId': 0x239A }, // Adafruit boards
-      { 'vendorId': 0xcafe }, // TinyUSB example
-    ];
-    return navigator.usb.requestDevice({ 'filters': filters }).then(
-      device => new serial.Port(device)
-    );
-  }
-
-  serial.Port = function(device) {
-    this.device_ = device;
-    this.interfaceNumber = 0;
-    this.endpointIn = 0;
-    this.endpointOut = 0;
-  };
-
-  serial.Port.prototype.connect = function() {
-    let readLoop = () => {
-      this.device_.transferIn(this.endpointIn, 64).then(result => {
-        this.onReceive(result.data);
-        readLoop();
-      }, error => {
-        this.onReceiveError(error);
-      });
-    };
-
-    return this.device_.open()
-        .then(() => {
-          if (this.device_.configuration === null) {
-            return this.device_.selectConfiguration(1);
-          }
-        })
-        .then(() => {
-          var interfaces = this.device_.configuration.interfaces;
-          interfaces.forEach(element => {
-            element.alternates.forEach(elementalt => {
-              if (elementalt.interfaceClass==0xFF) {
-                this.interfaceNumber = element.interfaceNumber;
-                elementalt.endpoints.forEach(elementendpoint => {
-                  if (elementendpoint.direction == "out") {
-                    this.endpointOut = elementendpoint.endpointNumber;
-                  }
-                  if (elementendpoint.direction=="in") {
-                    this.endpointIn =elementendpoint.endpointNumber;
-                  }
-                })
-              }
-            })
-          })
-        })
-        .then(() => this.device_.claimInterface(this.interfaceNumber))
-        .then(() => this.device_.selectAlternateInterface(this.interfaceNumber, 0))
-        .then(() => this.device_.controlTransferOut({
-            'requestType': 'class',
-            'recipient': 'interface',
-            'request': 0x22,
-            'value': 0x01,
-            'index': this.interfaceNumber}))
-        .then(() => {
-          readLoop();
-        });
-  };
-
-  serial.Port.prototype.disconnect = function() {
-    return this.device_.controlTransferOut({
-            'requestType': 'class',
-            'recipient': 'interface',
-            'request': 0x22,
-            'value': 0x00,
-            'index': this.interfaceNumber})
-        .then(() => this.device_.close());
-  };
-
-  serial.Port.prototype.send = function(data) {
-    return this.device_.transferOut(this.endpointOut, data);
-  };
-})();
diff --git a/examples/device/webusb_serial/src/main.c b/examples/device/webusb_serial/src/main.c
index c85b3cc9a..aba4aedff 100644
--- a/examples/device/webusb_serial/src/main.c
+++ b/examples/device/webusb_serial/src/main.c
@@ -71,7 +71,7 @@ enum  {
 
 static uint32_t blink_interval_ms = BLINK_NOT_MOUNTED;
 
-#define URL  "www.tinyusb.org/examples/webusb-serial"
+#define URL  "example.tinyusb.org/webusb-serial/"
 
 const tusb_desc_webusb_url_t desc_url =
 {