Monday, March 20, 2017

OpenWRT Modules: JUCI

JUCI = JavaScript for UCI (Unified Configuration Interface): the Web UI interface to the UCI (or, simply "The GUI front end" of OpenWRT). Mainly developed by Martin K. Schröder <mkschreder.uk@gmail.com>

Foundation: The jQuery and angularJS famework.

About	URL
JUCI GIT Repo	https://github.com/mkschreder/juci
JUCI Documentation in HTML form	http://mkschreder.github.io/juci
overview of how juci works	http://mkschreder.github.io/juci/manual/how-juci-works.html
AngularJS	https://angularjs.org/
AngularJS version 1 Documentation	https://docs.angularjs.org/guide

Client Browser

Must be HTML5-enabled browser with Javascript enabled.

Principles

OpenWrt's central configuration is split into several files located in the /etc/config/ directory. Each file relates roughly to the part of the system it configures.

Flow

Modify config file (a file in /etc/config)
restart service that uses that config file (/etc/init.d/<service script>)

Directory Structure

TOPDIR=$HOME/work/raptor/openwrt

As defined in $TOPDIR/feeds/juci/juci/Makefile, the tarballed juci package is downloaded into $TOPDIR/dl/juci-<ver#>.tar.gz

and untarred into $TOPDIR/build_dir/target-arm_cortex-a9_uClibs-<ver>

MAKE
====
Steps done in pakage/feeds//Makefile:

TARGETNAME=target-arm_cortex-a9_uClibc-0.9.33.2_eabi
PKG_BUILD_DIR=$TOPDIR/build_dir/$TARGETNAME/
mkdir -p ${PKG_BUILD_DIR}
cp $TOPDIR/package/feeds//src/* ${PKG_BUILD_DIR}/
make -C $TOPDIR/staging_dir/${TARGETNAME}/usr/src/juci/ MODULE=${PKG_BUILD_DIR}

Files

To see the latest pull of JUCI into our branch, check PKG_VERSION in $TOPDIR/feeds/juci/juci/Makefile

In $TOPDIR/target/linux/bcm5301x/base-files/etc/uci-defaults/config:

content-filter
juci
srg-diagnostics
system
user-interfaces

In $TOPDIR//packages/juci-full-/files/etc/config/:

capo

In $TOPDIR//packages/juci--family-shield/files/etc/config/family-shield/:

family-shield

In $TOPDIR/package/base-files/files/etc/config/:

iptv
network
ntra
webdav
wifi-insight

In $TOPDIR/network/services/ipset-dns/files/:

ipset-dns.config (installed as ipset-dns in target's /etc/config)

To do clean build of the whole JUCI + Juci modules:

Building Juci

make package/feeds/juci/juci/{clean,prepare,compile} package/index V=s

JUCI html files are compiled into the *.js files by command:

HTML to JS

./scripts/juci-build-tpl-cache

See: build_dir/target-arm_cortex-a9_uClibc-<ver>/juci-<juci-version>/Makefile

(The Makefile above converts html files into *.js and put in tarball file named: node_modules.tar.gz

JUCI in feed

This subdirectory is used when we want to create a JUCI patch. We git pull the juci module into $TOPDIR/feeds/juci/juci.

See Creating patches to JUCI core modules

The following script might be useful to do the steps as described above

JUCI Checkout

#!/bin/bash

if [ $# -lt 1 ]

then

    echo ""

    echo "$0 <juci version/tag>"

    echo ""

    echo "Current version for SOS: v2.16.09"

    exit

fi

tag=$1

cd ~/work/raptor/openwrt

./scripts/feeds update juci

pushd feeds/juci

git submodule init

git submodule update

cd juci/src

git checkout ${tag}

popd

make package/juci/clean V=s && make V=s

Once we've done the script above, we can start editing files needed. Once we're done, just create a patch (assuming we're already in directory $TOPDIR/feeds/juci/juci/src):

Creating patch

git diff -p --stat > ../patches/01x-my-patch-name.patch

JUCI Components

JUCI core (juci.js)
Plugins (for example: js/50-juci-ddns.js, etc.)
Theme *.js

The plugins are located (to be exact: extracted to) $BUILD_DIR/$TARGETNAME/juci-<juci-ver#>/plugins/

For example, for menu "WIFI", the plugin is in $HOME/work/raptor/openwrt/build_dir/target-arm_cortex-a9_uClibc-0.9.33.2_eabi/juci-fcfb1fcd85735c69ffad89a9d3d9b6c26d3df810/plugins/juci-openwrt-wireless

JUCI on Target Device

The JUCI config file is /etc/config/juci, which contains menus and submenus

To tell juci to reload, type juci-update

Creating JUCI Patch

Creating patches to JUCI core modules

My Stuff