【LuatOS】简单案例网页点灯

news2024/11/23 3:48:36

材料

硬件：合宙ESP32C3简约版，BH1750光照度模块，0.96寸OLED(4P_IIC)，杜邦线若干

接线：

ESP32C3.GND — OLED.GND — BH1750.GND

ESP32C3.3.3V — OLED.VCC — BH1750.VCC

ESP32C3.GPIO5 — OLED.SCL — BH1750.SCL

ESP32C3.GPIO4 — OLED.SDA — BH1750.SDA

LED灯是调用板载的gpio12/gpio13

功能

连接上ESP32C3开启的AP站点，能通过网页交互数据控制LED
采集BH1750的光强度数据，给单片机做判断
OLED上显示采集到的光强度数据，和当前LED灯的控制模式(自动或手动)
灯光的控制模式分成两种

自动模式：根据光强度数据来自动调整灯光亮度

手动模式：通过网页端控制灯光亮度

程序

main.lua

-- LuaTools需要PROJECT和VERSION这两个信息
PROJECT = "Demo"
VERSION = "1.0.0"

-- 引入必要的库文件(lua编写), 内部库不需要require
sys = require("sys")
-- sys库的强力补充,增加任务通知之类的
sysplus = require("sysplus")
local bh1750 = require "bh1750"

-- 全局变量
_G.BH1750_DATA = 0
_G.LedPwm_Data = 0
_G.LedMode = 0

-- 初始化LED灯, 开发板上左右2个led分别是gpio12/gpio13
local LED_PWM = gpio.setup(12, 0, gpio.PULLUP)
local LED_RUN = gpio.setup(13, 0, gpio.PULLUP)

-- 任务0--运行闪烁LED
function Task0_RunLed()
    log.info("Task0_RunLed_OK")
    while true do
        LED_RUN(0)
        sys.wait(500)
        LED_RUN(1)
        sys.wait(500)
    end
end

-- 任务1--OLED显示
function Task1_OLED()
    log.info("Task1_OLED_Init")
    -- 初始化硬件i2c的ssd1306
    u8g2.begin({ic = "ssd1306",direction = 0,mode="i2c_hw",i2c_id = 0,i2c_speed = i2c.FAST}) 
    u8g2.SetFontMode(1)
    u8g2.ClearBuffer()
    u8g2.SetFont(u8g2.font_opposansm10)
    log.info("Task1_OLED_OK")
    u8g2.SendBuffer()
    while true do
        u8g2.ClearBuffer()
        u8g2.DrawUTF8("RealTime", 30, 14)
        -- 显示光感
        u8g2.DrawUTF8("SunData: " .. string.format("%.2f", _G.BH1750_DATA), 0, 32)
        -- 控制模式
        u8g2.DrawUTF8("ConMode: " .. _G.LedMode, 0, 50)
        u8g2.SendBuffer()
        sys.wait(10)
    end
end

-- 任务2--WIFI站点
function Task2_WiFI()
    log.info("Task2_WiFI_Init")
    wlan.init()
    -- 设置为AP模式, 广播ssid, 接收wifi客户端的链接
    wlan.setMode(wlan.AP)
    wlan.createAP("ESP32C3_AP_Mode", "12345678")
    log.info("Task2_WiFI_OK")
    -- 80端口监听事件
    log.info("WIFI_status:",wlan.ready())
    httpsrv.start(80,function(client, method, uri, headers, body)
        log.info("httpsrv",method, uri, json.encode(headers), body)
        if uri == "/led/1" then
            -- LED_PWM(1)
            _G.LedPwm_Data = 100
            return 200, {},"ok"
        elseif uri == "/led/0" then
            -- LED_PWM(0)
            _G.LedPwm_Data = 0
            return 200, {},"ok"
        elseif uri == "/mode/0" then
            _G.LedMode = 0
            return 200, {},"ok"
        elseif uri == "/mode/1" then
            _G.LedMode = 1
            return 200, {},"ok"
        -- elseif uri:find("/led_pwm/") then
        elseif string.find(uri,"/led_pwm/") then
            log.info("YS:" .. string.match(uri,"%d+"))
            _G.LedPwm_Data = string.match(uri,"%d+")  
        end
        -- 无响应返回
        return 404, {}, "Not Found" .. uri
    end)
    log.info("WIFI_status:",wlan.ready())
    while true do
        sys.wait(500)
    end
end

-- 任务3--BH1750光感
function Task3_BH1750()
    log.info("Task3_BH1750_OK")
    i2c.setup(0,i2c.FAST)
    bh1750.init(0)--初始化,传入i2c_id
    while 1 do
        local bh1750_data = bh1750.read_light()
        _G.BH1750_DATA = bh1750_data
        log.info("bh1750_read_light", bh1750_data)
        sys.wait(1000)
    end
end

-- 任务4--LED调光
function Task4_LEDPWM()
    log.info("Task4_LEDPWM_Init")
    -- pwm.open(12, 1000, 50)
    log.info("Task4_LEDPWM_OK")
    while true do
        if _G.LedMode == 0 then         -- 手动模式
            pwm.open(12, 1000, _G.LedPwm_Data) -- 频率1000hz, 占空比0-100
        elseif _G.LedMode == 1 then     -- 自动模式
            if _G.BH1750_DATA > 1000 then
                -- 强光
                pwm.open(12, 1000, 0)
            elseif _G.BH1750_DATA > 50 then
                -- 正常光
                pwm.open(12, 1000, 40)
            else
                -- 较暗
                pwm.open(12, 1000, 80)
            end
        end
        sys.wait(10)
    end
end

-- 编写用户主事件 --
function MainTask()
    log.info("MainTask_OK")
    -- 引导任务创建 --
    sys.taskInit(Task0_RunLed)
    sys.taskInit(Task1_OLED)
    sys.taskInit(Task2_WiFI)
    sys.taskInit(Task3_BH1750)
    sys.taskInit(Task4_LEDPWM)
end


sys.taskInit(MainTask)
sys.run()

index.html

<!DOCTYPE html>
<html>
<header>
    <meta charset="utf-8" />
    <title>智能控制</title>
    <script type="text/javascript">
        const progress = document.getElementById('progress');
        function Mode() {
            // 0.手动模式 1.自动模式
            console.log(document.getElementById('ModeText').innerText);  
            if (document.getElementById('ModeText').innerText.includes('手动模式')) {
                document.getElementById("ModeText").innerText = '自动模式'
                fetch("/mode/" + "1")
            } else {
                document.getElementById("ModeText").innerText = '手动模式'
                fetch("/mode/" + "0")
            }   
        }

        function led(key) {
            fetch("/led/" + key)
            document.getElementById("SunValue").innerHTML = 100 * key
            document.getElementById('progress').value = 100 * key
        }

        function myFunction() {
            // 获取进度条当前值  
            document.getElementById("SunValue").innerHTML = document.getElementById('progress').value;
            fetch("/led_pwm/" + document.getElementById('progress').value)
        }
    </script>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .Box {
            text-align: center;
            width: 80%;
            height: 80%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: aqua;
            border-radius: 3%;
        }

        .ButBox,
        .RanBox {
            height: auto;
        }

        h2 {
            font-size: 100px;
            margin: 30px 20px;
        }

        p {
            font-size: 60px;

        }

        button {
            font-size: 50px;
        }

        #progress {
            width: 300px;
            /* 设置宽度 */
            height: 100px;
            /* 设置高度 */
        }
    </style>
</header>

<body>
    <div class="Box">
        <!-- 任务：自动或手动模式 -->
        <h2>灯光亮度控制</h2>
        <div class="ModeBox">
            <p>当前模式：<span><u id="ModeText" onclick="Mode()" >手动模式</u></span></p>
        </div>
        <div class="ButBox">
            <!-- <span>手动控制</span> -->
            <p>
                <button onclick="led(1)">LED亮</button>
                <button onclick="led(0)">LED灭</button>
            </p>
        </div>
        <div class="RanBox">
            <!-- <h2>灯光亮度</h2> -->
            <p id="SunValue">0</p>
            <input type="range" id="progress" min="0" max="100" value="0" oninput="myFunction()">
        </div>
    </div>
    </div>
</body>

</html>