LuCI JS: How to complete select control with values read from file?

[IceG]

Hi everyone ,
I'm trying to migrate my package from lua to LuCI JS, but I'm stuck at one point. I can't handle moving the contents of the file ('/etc/config/test.user') to the select control ('USERcmds').

	load: function() {
		return Promise.all([
			L.resolveDefault(fs.read_direct('/etc/config/test.user'), null)
		]);
	},

	render: function () {

		var USERcmds = [E('option', { value: '' }, [_('-- Select a AT command --')])];

		USERcmds.push(E('option', { 'value': 'AT+CSQ' }, 'Check signal strength ➜ AT+CSQ' ));

		return E('div', { 'class': 'cbi-map', 'id': 'map' }, [
				E('h2', {}, [ _('AT Commands') ]),
				E('div', { 'class': 'cbi-map-descr'}, _('Web UI for handling AT commands via sms-tool. More information about the sms-tool on the  %seko.one.pl forum%s.').format('<a href="https://eko.one.pl/?p=openwrt-sms_tool" target="_blank">', '</a>')),
				E('br'),
				E('div', { 'class': 'cbi-section' }, [
					E('div', { 'class': 'cbi-section-node' }, [
						E('div', { 'class': 'cbi-value' }, [
							E('label', { 'class': 'cbi-value-title' }, [ _('User AT commands') ]),
							E('div', { 'class': 'cbi-value-field' }, [
								E('select', { 'class': 'cbi-input-select', 'id': 'tk', 'style': 'margin:5px 0; width:100%;', 'change': ui.createHandlerFn(this, 'handleCopy')},
									USERcmds
								)
							]) 
						]),

file content ('/etc/config/test.user')

Check signal strength ➜ AT+CSQ;AT+CSQ
Current band in use ➜ AT+QNWINFO;AT+QNWINFO

Could someone send me the code to do this. Maybe there is already some other package with the solution I am looking for?

Thanks for any help

[jow]

The render() function will receive the results of the load() function as arguments.

	load: function() {
		return Promise.all([
			L.resolveDefault(fs.read_direct('/etc/config/test.user'), null)
		]);
	},

	render: function (loadResults) {

		var USERcmds = [E('option', { value: '' }, [_('-- Select a AT command --')])];

		USERcmds.push(E('option', { 'value': 'AT+CSQ' }, 'Check signal strength ➜ AT+CSQ' ));

		return E('div', { 'class': 'cbi-map', 'id': 'map' }, [
				E('h2', {}, [ _('AT Commands') ]),
				E('div', { 'class': 'cbi-map-descr'}, _('Web UI for handling AT commands via sms-tool. More information about the sms-tool on the  %seko.one.pl forum%s.').format('<a href="https://eko.one.pl/?p=openwrt-sms_tool" target="_blank">', '</a>')),
				E('br'),
				E('div', { 'class': 'cbi-section' }, [
					E('div', { 'class': 'cbi-section-node' }, [
						E('div', { 'class': 'cbi-value' }, [
							E('label', { 'class': 'cbi-value-title' }, [ _('User AT commands') ]),
							E('div', { 'class': 'cbi-value-field' }, [
								E('select', { 'class': 'cbi-input-select', 'id': 'tk', 'style': 'margin:5px 0; width:100%;', 'change': ui.createHandlerFn(this, 'handleCopy')},
									(loadResults[0] || "").trim().split("\n").map(function(cmd) { return E("option", [cmd]) })
								)
							]) 
						]),

[IceG]

Thanks! @jow. The code obviously works, all I have left to do is adjust/cut the result. I tried reading it as an argument before, but I had the wrong function and that's why it didn't work for me. Apparently, I still have a lot to learn. Slightly forward.

[jow]

A couple of thoughts:

• don’t place non-uci files in /etc/config/
• if feasible, maybe consider storing your user config as JSON, then use fs.read_direct("/etc/test.json", "json") to readily receive the result as JSON data
  • alternatively consider fs.lines() instead of fs.read_direct()
• drop the Promise.all() if you only load a single resource and use loadResults instead of loadResults[0]

[IceG]

Thanks for the advice/tips. I will try to submit my packages to the repository, so I will correct what you suggested @jow . Normally I use JSON, but these user files, settings files, in my opinion, are easier to edit as a text file, so I will not change here, I will only change the read/write location.