How to add a new element to LUCI21.03

For Developers
1

Hi community:
I want to do some customization with LUCI21.02.
After some study, I understand the basic concept of LUCI.
https://openwrt.org/docs/guide-developer/luci
From this article, I learned if I want to add a new element to LUCI, at least I need to define a new module and entry like this:

module("luci.controller.myapp.new_tab", package.seeall)  --notice that new_tab is the name of the file new_tab.lua
 function index()
     entry({"admin", "new_tab"}, firstchild(), "New tab", 60).dependent=false  --this adds the top level tab and defaults to the first sub-tab (tab_from_cbi), also it is set to position 30

And add a cbi_tab like this:

m = Map("cbi_file", translate("First Tab Form"), translate("Please fill out the form below")) -- cbi_file is the config file in /etc/config
d = m:section(TypedSection, "info", "Part A of the form")  -- info is the section called info in cbi_file
a = d:option(Value, "name", "Name"); a.optional=false; a.rmempty = false;  -- name is the option in the cbi_file
return m

But after query the source code of LUCI21.02, I didn't find the entry and cbi element in it.
My configration is like this:
image
besides, I notice another article which was marked like this:

  • Reference: CBI (FIXME: obsolete now that we have client-side CBI in Javascript?)
    My question is:
    1.Where is the entry and cbi element defined in LUCI21.02?
    2.Where can I get the latest reference about CBI?
2

The LUCI21.02 source code is confusing:

image
image788×181 71 KB

Where is the network/status/system controller and where is network/status/system CBI?

3

This functionality has been ported to client side JS, there is no Lua code on the router side anymore.

4

Hi Jow
Do you have any document about how to add a element with "client side JS"?
We still need to know the basic concept(programming guide line) about the new structure.

5

check, this might be relevant for you, down the road LuCI rewrite in ucode - testers wanted

6

Applications usually define static JSON files nowadays that describe the available menu entries (routes) and associated actions.

Example:

The client side form.js API (which is the successor of server side Lua CBI) is here:
https://openwrt.github.io/luci/jsapi/LuCI.form.html

7

Thanks. But I still suggest you update the document and that will make 3rd party developer easier to understand the concept.

8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.