智慧生活科技專業社群: [OTTO Ninja] 把使用RemoteXY控制arduino程式改成Web控制

修訂後的Arduino程式，內建Web 控制程式，燒錄後，連線後，輸入：
http://192.168.4.1
就會出來下列介面：
arduino RemoteXY控制程式為基礎，藉由AI來修改程式，提示詞：改成WEB控制，不要RemoteXY。
AI產生的程式如下：
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <WebSocketsServer.h>
#include <Servo.h>

/* ========== WiFi AP ========== */
const char* ssid = "OTTO NINJA";
const char* password = "12345678";

/* ========== Web ========== */
ESP8266WebServer server(80);
WebSocketsServer webSocket(81);

/* ========== Calibration SETTINGS（沿用你原本） ========== */
// Feet forward/back speed
int LFFWRS= 20;
int RFFWRS= 20;
int LFBWRS= 20;
int RFBWRS= 20;

// Walk stand (legs)
int LA0= 60;
int RA0= 120;

// Walk tilt positions
int LATL= 100;
int RATL= 175;
int LATR= 5;
int RATR= 80;

// Roll (legs)
int LA1= 180;
int RA1= 0;

/* ========== Timing ========== */
unsigned long currentmillis1 = 0;

// Mode: 0=WALK, 1=ROLL
int ModeCounter = 0;

/* ========== Pinout（沿用你原本） ========== */
const uint8_t ServoLeftFootPin   = 13; // D7
const uint8_t ServoLeftLegPin    = 15; // D8
const uint8_t ServoRightFootPin  = 0;  // D3
const uint8_t ServoRightLegPin   = 2;  // D4

// 如果你「沒有手」：下面三個可以不接、不用管（程式不會主動動它們）
const uint8_t ServoLeftArmPin    = 16; // D0
const uint8_t ServoRightArmPin   = 3;  // RX (GPIO3)
const uint8_t ServoHeadPin       = 1;  // TX (GPIO1)

Servo myservoLeftFoot;
Servo myservoLeftLeg;
Servo myservoRightFoot;
Servo myservoRightLeg;

Servo myservoLeftArm;
Servo myservoRightArm;
Servo myservoHead;

/* ========== Web 控制輸入（取代 RemoteXY） ========== */
int CTRL_JX = 0;   // -100..100
int CTRL_JY = 0;   // -100..100

/* ========== HTML Page ========== */
const char MAIN_page[] PROGMEM = R"=====(<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>OTTO NINJA Web</title>
<style>
  body{font-family:Arial;text-align:center;background:#f4f6f8;margin:0;padding:16px;}
  .card{max-width:560px;margin:0 auto;background:#fff;border-radius:14px;padding:16px;box-shadow:0 8px 24px rgba(0,0,0,.08);}
  button{width:150px;height:54px;font-size:16px;margin:6px;border:none;border-radius:12px;background:#2d7ef7;color:#fff}
  button.gray{background:#6c757d}
  button.green{background:#00a86b}
  button.red{background:#e74c3c}
  .row{display:flex;justify-content:center;flex-wrap:wrap}
  .box{margin:10px;padding:8px;border-radius:8px;font-weight:bold;background:#eee;}
  .small{font-size:12px;color:#666;line-height:1.6}
</style>
</head>
<body>
<div class="card">
  <h2>OTTO NINJA（Web 控制）</h2>

  <div id="statusBox" class="box">狀態：未連線</div>
  <div id="modeBox" class="box">模式：未知</div>
  <div id="actBox"  class="box">動作：未知</div>

  <div class="row">
    <button class="gray" onclick="connectWS()">連線</button>
  </div>

  <div class="row">
    <button class="green" onclick="sendCmd('mode_walk')">Walk（人形）</button>
    <button class="green" onclick="sendCmd('mode_roll')">Roll（車形）</button>
  </div>

  <div class="row">
    <button onclick="move(0, 100)">前進</button>
  </div>
  <div class="row">
    <button onclick="move(-60, 0)">左轉</button>
    <button class="red" onclick="move(0,0)">停止</button>
    <button onclick="move(60, 0)">右轉</button>
  </div>
  <div class="row">
    <button onclick="move(0, -100)">後退</button>
  </div>

  <p class="small">
    連 Wi-Fi：OTTO NINJA / 12345678<br>
    瀏覽器：192.168.4.1
  </p>
</div>

<script>
let ws=null;
const statusBox=document.getElementById("statusBox");
const modeBox=document.getElementById("modeBox");
const actBox=document.getElementById("actBox");

function setStatus(t,c){statusBox.innerText="狀態："+t; statusBox.style.background=c;}
function connectWS(){
  ws=new WebSocket("ws://"+location.hostname+":81/");
  setStatus("連線中…","#ffeaa7");
  ws.onopen=()=>setStatus("已連線","#55efc4");
  ws.onclose=()=>setStatus("中斷","#fab1a0");
  ws.onerror=()=>setStatus("錯誤","#ff7675");
  ws.onmessage=(e)=>handleMsg(e.data);
}
function sendCmd(cmd){
  if(ws && ws.readyState===1) ws.send(cmd);
  else alert("請先按「連線」");
}
function move(x,y){
  sendCmd("move "+x+" "+y);
}
function handleMsg(m){
  if(m.startsWith("MODE:")) modeBox.innerText="模式："+m.substring(5);
  if(m.startsWith("ACT:"))  actBox.innerText ="動作："+m.substring(4);
}
</script>
</body>
</html>)=====";

/* ========== 工具：WebSocket 廣播（避免 String& 暫時值編譯錯） ========== */
void wsBroadcast(const String& s){
  String msg = s;
  webSocket.broadcastTXT(msg);
}

/* ========== 動作函式（沿用你的結構） ========== */
void NinjaStop(){
  myservoLeftFoot.detach();
  myservoRightFoot.detach();
  myservoLeftLeg.detach();
  myservoRightLeg.detach();
}

void NinjaSetWalk(){
  // 如果你沒手，這段可保留也沒關係（沒接就不會動）
  myservoLeftArm.attach(ServoLeftArmPin, 544, 2400);
  myservoRightArm.attach(ServoRightArmPin, 544, 2400);
  myservoLeftArm.write(90);
  myservoRightArm.write(90);
  delay(200);
  myservoLeftArm.detach();
  myservoRightArm.detach();

  myservoLeftLeg.attach(ServoLeftLegPin, 544, 2400);
  myservoRightLeg.attach(ServoRightLegPin, 544, 2400);
  myservoLeftLeg.write(LA0);
  myservoRightLeg.write(RA0);
  delay(300);
  myservoLeftLeg.detach();
  myservoRightLeg.detach();

  myservoLeftArm.attach(ServoLeftArmPin, 544, 2400);
  myservoRightArm.attach(ServoRightArmPin, 544, 2400);
  myservoLeftArm.write(180);
  myservoRightArm.write(0);
  delay(300);
  myservoLeftArm.detach();
  myservoRightArm.detach();
}

void NinjaSetRoll(){
  myservoLeftArm.attach(ServoLeftArmPin, 544, 2400);
  myservoRightArm.attach(ServoRightArmPin, 544, 2400);
  myservoLeftArm.write(90);
  myservoRightArm.write(90);
  delay(200);
  myservoLeftArm.detach();
  myservoRightArm.detach();

  myservoLeftLeg.attach(ServoLeftLegPin, 544, 2400);
  myservoRightLeg.attach(ServoRightLegPin, 544, 2400);
  myservoLeftLeg.write(LA1);
  myservoRightLeg.write(RA1);
  delay(300);
  myservoLeftLeg.detach();
  myservoRightLeg.detach();

  myservoLeftArm.attach(ServoLeftArmPin, 544, 2400);
  myservoRightArm.attach(ServoRightArmPin, 544, 2400);
  myservoLeftArm.write(180);
  myservoRightArm.write(0);
  delay(300);
  myservoLeftArm.detach();
  myservoRightArm.detach();
}

/* 重要：停止姿勢時要確保有 attach，否則 detach 後 write 不會動 */
void NinjaWalkStop(){
  myservoLeftFoot.attach(ServoLeftFootPin, 544, 2400);
  myservoRightFoot.attach(ServoRightFootPin, 544, 2400);
  myservoLeftLeg.attach(ServoLeftLegPin, 544, 2400);
  myservoRightLeg.attach(ServoRightLegPin, 544, 2400);

  myservoLeftFoot.write(90);
  myservoRightFoot.write(90);
  myservoLeftLeg.write(LA0);
  myservoRightLeg.write(RA0);
}

void NinjaRollStop(){
  myservoLeftFoot.attach(ServoLeftFootPin, 544, 2400);
  myservoRightFoot.attach(ServoRightFootPin, 544, 2400);
  myservoLeftFoot.write(90);
  myservoRightFoot.write(90);
  myservoLeftFoot.detach();
  myservoRightFoot.detach();
}

/* ========== WebSocket event：接收控制命令 ========== */
void webSocketEvent(uint8_t num, WStype_t type, uint8_t * payload, size_t length){
  if(type == WStype_CONNECTED){
    wsBroadcast("MODE:" + String(ModeCounter==0 ? "WALK" : "ROLL"));
    wsBroadcast("ACT:STOP");
    return;
  }
  if(type != WStype_TEXT) return;

  String cmd = String((char*)payload).substring(0, length);
  cmd.trim();

  if(cmd == "mode_walk"){
    NinjaSetWalk();
    ModeCounter = 0;
    wsBroadcast("MODE:WALK");
    return;
  }

  if(cmd == "mode_roll"){
    NinjaSetRoll();
    ModeCounter = 1;
    wsBroadcast("MODE:ROLL");
    return;
  }

  if(cmd.startsWith("move")){
    int sp1 = cmd.indexOf(' ');
    int sp2 = cmd.lastIndexOf(' ');
    if(sp1 > 0 && sp2 > sp1){
      CTRL_JX = cmd.substring(sp1+1, sp2).toInt();
      CTRL_JY = cmd.substring(sp2+1).toInt();
      CTRL_JX = constrain(CTRL_JX, -100, 100);
      CTRL_JY = constrain(CTRL_JY, -100, 100);
    }
    return;
  }
}

/* ========== Setup ========== */
void setup(){
  Serial.begin(115200);

  // AP mode
  WiFi.mode(WIFI_AP);
  WiFi.softAP(ssid, password);

  // Web
  server.on("/", [](){ server.send_P(200, "text/html", MAIN_page); });
  server.begin();

  webSocket.begin();
  webSocket.onEvent(webSocketEvent);

  // 初始站立（人形）
  NinjaWalkStop();
  delay(300);
  NinjaStop();

  Serial.println("OTTO NINJA Web Ready");
  Serial.println(WiFi.softAPIP()); // 通常是 192.168.4.1
}

/* ========== Loop ========== */
void loop(){
  server.handleClient();
  webSocket.loop();

  // 動作狀態判斷（供網頁顯示）
  static String lastAct = "";
  String act;

  bool idle = (abs(CTRL_JX) <= 10 && abs(CTRL_JY) <= 10);
  if(idle) act="STOP";
  else if(abs(CTRL_JY) >= abs(CTRL_JX)) act = (CTRL_JY > 0) ? "FORWARD" : "BACK";
  else act = (CTRL_JX > 0) ? "RIGHT" : "LEFT";

  if(act != lastAct){
    lastAct = act;
    wsBroadcast("ACT:" + act);
  }

  /* ===== 走路模式（沿用你原本演算法，把 RemoteXY 換成 CTRL_） ===== */
  if(ModeCounter == 0){
    if(idle){
      NinjaWalkStop();
      return;
    }

    if(CTRL_JY > 0){
      int lt= map(CTRL_JX, 100, -100, 200, 700);
      int rt= map(CTRL_JX, 100, -100, 700, 200);
      int Interval1 = 250;
      int Interval2 = 250 + rt;
      int Interval3 = 250 + rt + 250;
      int Interval4 = 250 + rt + 250 + lt;
      int Interval5 = 250 + rt + 250 + lt + 50;

      if(millis() > currentmillis1 + (unsigned long)Interval5) currentmillis1 = millis();

      if(millis() - currentmillis1 <= (unsigned long)Interval1){
        myservoLeftLeg.attach(ServoLeftLegPin, 544, 2400);
        myservoRightLeg.attach(ServoRightLegPin, 544, 2400);
        myservoRightFoot.attach(ServoRightFootPin, 544, 2400);
        myservoLeftFoot.attach(ServoLeftFootPin, 544, 2400);
        myservoLeftLeg.write(LATR);
        myservoRightLeg.write(RATR);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval1) && (millis() - currentmillis1 <= (unsigned long)Interval2)){
        myservoRightFoot.write(90 - RFFWRS);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval2) && (millis() - currentmillis1 <= (unsigned long)Interval3)){
        myservoRightFoot.detach();
        myservoLeftLeg.write(LATL);
        myservoRightLeg.write(RATL);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval3) && (millis() - currentmillis1 <= (unsigned long)Interval4)){
        myservoLeftFoot.write(90 + LFFWRS);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval4) && (millis() - currentmillis1 <= (unsigned long)Interval5)){
        myservoLeftFoot.detach();
      }
    }

    if(CTRL_JY < 0){
      int lt= map(CTRL_JX, 100, -100, 200, 700);
      int rt= map(CTRL_JX, 100, -100, 700, 200);
      int Interval1 = 250;
      int Interval2 = 250 + rt;
      int Interval3 = 250 + rt + 250;
      int Interval4 = 250 + rt + 250 + lt;
      int Interval5 = 250 + rt + 250 + lt + 50;

      if(millis() > currentmillis1 + (unsigned long)Interval5) currentmillis1 = millis();

      if(millis() - currentmillis1 <= (unsigned long)Interval1){
        myservoLeftLeg.attach(ServoLeftLegPin, 544, 2400);
        myservoRightLeg.attach(ServoRightLegPin, 544, 2400);
        myservoRightFoot.attach(ServoRightFootPin, 544, 2400);
        myservoLeftFoot.attach(ServoLeftFootPin, 544, 2400);
        myservoLeftLeg.write(LATR);
        myservoRightLeg.write(RATR);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval1) && (millis() - currentmillis1 <= (unsigned long)Interval2)){
        myservoRightFoot.write(90 + RFBWRS);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval2) && (millis() - currentmillis1 <= (unsigned long)Interval3)){
        myservoRightFoot.detach();
        myservoLeftLeg.write(LATL);
        myservoRightLeg.write(RATL);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval3) && (millis() - currentmillis1 <= (unsigned long)Interval4)){
        myservoLeftFoot.write(90 - LFBWRS);
      }

      if((millis() - currentmillis1 >= (unsigned long)Interval4) && (millis() - currentmillis1 <= (unsigned long)Interval5)){
        myservoLeftFoot.detach();
      }
    }
  }

  /* ===== 車形模式（ROLL）：差速左右轉（沿用你原本） ===== */
  if(ModeCounter == 1){
    if(idle){
      NinjaRollStop();
      return;
    }

    myservoLeftFoot.attach(ServoLeftFootPin, 544, 2400);
    myservoRightFoot.attach(ServoRightFootPin, 544, 2400);

    int LWS= map(CTRL_JY, 100, -100, 135, 45);
    int RWS= map(CTRL_JY, 100, -100, 45, 135);
    int LWD= map(CTRL_JX, 100, -100, 45, 0);
    int RWD= map(CTRL_JX, 100, -100, 0, -45);

    myservoLeftFoot.write(LWS + LWD);
    myservoRightFoot.write(RWS + RWD);
  }
}
智慧生活科技專業社群

2026年1月2日星期五

[OTTO Ninja] 把使用RemoteXY控制arduino程式改成Web控制

沒有留言:

張貼留言

2026年1月2日 星期五

[OTTO Ninja] 把使用RemoteXY控制arduino程式改成Web控制

沒有留言:

張貼留言

2026年1月2日星期五
