Merge pull request #1582 from rern/UPDATE

Update

install.sh

@@ -112,40 +112,6 @@ for k in albumyear composername conductorname; do
 done
 
 [[ ! -e /usr/bin/websocat ]] && pacman -Sy --noconfirm websocat
-
-# 20231125
-grep -q connect $dirbash/websocket-server.py && websocketrestart=1
-
-file=$dirmpdconf/conf/camilladsp.conf
-if [[ -e /usr/bin/camilladsp && ! -e $file ]]; then
-	echo 'audio_output {
-	name           "CamillaDSP"
-	device         "hw:Loopback,1"
-	type           "alsa"
-	auto_resample  "no"
-	mixer_type     "none"
-}' > $file
-	echo 'include_optional    "camilladsp.conf"' >> $dirmpdconf/mpd.conf
-	[[ -e $dirsystem/camilladsp ]] && mpdrestart=1
-fi
-
-file=/etc/systemd/system/cava.service
-if [[ ! -e $file ]]; then
-	echo '[Unit]
-Description=VU level for VU LED and VU meter
-
-[Service]
-ExecStart=/srv/http/bash/cava.sh
-ExecStop=/srv/http/bash/cava.sh stop' > $file
-	systemctl daemon-reload
-	[[ -e $dirsystem/vuled ]] && killall -9 cava &> /dev/null && rm $dirsystem/vuled
-fi
-
-if [[ ! -e /lib/libfdt.so ]]; then
-	pacman -Sy --noconfirm dtc
-	systemctl try-restart rotaryencoder
-fi
-
 #-------------------------------------------------------------------------------
 installstart "$1"
 
@@ -159,7 +125,3 @@ cacheBust
 [[ -e $dirsystem/color ]] && $dirbash/cmd.sh color
 
 installfinish
-
-# 20231125
-[[ $websocketrestart ]] && systemctl restart websocket
-[[ $mpdrestart ]] && $dirsettings/player-conf.sh

srv/http/assets/css/common.css

@@ -10,7 +10,7 @@
 
 @font-face {
 	font-family : rern;
-	src         : url( '/assets/fonts/rern.woff2?v=1705850359' );
+	src         : url( '/assets/fonts/rern.woff2?v=1706187307' );
 }
 @font-face {
 	font-family : Lato;
@@ -805,6 +805,7 @@ hr {
 }
 .infomessage {
 	padding-top: 5px;
+	line-height: 24px;
 }
 .infoprompt {
 	padding: 15px 5px;
@@ -953,7 +954,7 @@ input[ type=radio ]:disabled {
 	padding: 0 10px;
 }
 #infoButton {
-	margin-top: 5px;
+	margin: 5px;
 }
 .infomenu {
 	display: inline-block;

srv/http/assets/js/common.js

@@ -439,74 +439,70 @@ function info( json ) {
 	} else {
 		htmls.list = '';
 		if ( typeof I.list[ 0 ] !== 'object' ) I.list = [ I.list ];
-		I.checkboxonly = ! I.list.some( l => l[ 1 ] !== 'checkbox' );
+		I.checkboxonly = ! I.list.some( l => l[ 1 ] && l[ 1 ] !== 'checkbox' );
 		var td0   = I.checkboxonly ? '<tr><td>' : '<tr><td></td><td colspan="2">'; // no label <td></td>
-		var label, type;
+		var colspan, kv, label, param, type;
 		var i     = 0; // for radio name
 		I.list.forEach( l => {
-			label = l[ 0 ];
-			type  = l[ 1 ];
-/*			if ( [ 'radio', 'select' ].includes( type ) ) {
-				var option = l[ 2 ];
-				var attr = l[ 3 ] || false;
-			} else {
-				var attr = l[ 2 ] || false;
-			}
-			var col = tdtr = unit = updn = width = '';
-			if ( attr ) {
-				tdtr  = attr.tdtr || '';
-				unit  = attr.unit || '';
-				updn  = attr.updn || '';
-				col   = attr.col ? ' colspan="'+ attr.col +'"' : '';
-				width = attr.width ? ' style="width: '+  +'"' : '';
+			label   = l[ 0 ];
+			type    = l[ 1 ];
+			param   = l[ 2 ] || {};
+			kv      = 'kv' in param ? param.kv : param; // radio/select - { kv: {k: v, ... }, ... } || {k: v, ... }
+			colspan = param.colspan ? ' colspan="'+ param.colspan +'"' : '';
+/*			param = {
+				  kv       : { k: V, ... }
+				, colspan  : N
+				, disable  : T/F
+				, sameline : T/F
+				, suffix   : UNIT
+				, updn     : { step: N, min: N, max: N }
 			}*/
 			switch ( type ) {
 				case 'checkbox':
-					htmls.list += htmls.list.slice( -3 ) === 'tr>' ? td0 : '<td>';
+					htmls.list += htmls.list.slice( -3 ) === 'tr>' ? td0 : '<td'+ colspan +'>';
 					break;
 				case 'hidden':
 					htmls.list += '<tr class="hide"><td></td><td>';
 					break;
 				case 'radio':
-					htmls.list += '<tr><td>'+ label +'</td><td colspan="2">';
+					colspan     = param.colspan || 2;
+					htmls.list += '<tr><td>'+ label +'</td><td colspan="'+ colspan +'">';
 					break;
 				case 'range':
-					htmls.list += '<tr><td>';
+					htmls.list += '<tr><td'+ colspan +'>';
 					break;
 				default:
 					htmls.list += htmls.list.slice( -3 ) === 'td>' ? '' : '<tr><td>'+ label +'</td>';
-					htmls.list += l[ 4 ] ? '<td colspan="'+ l[ 4 ] +'">' : '<td>';
+					htmls.list += '<td'+ colspan +'>';
 			}
 			switch ( type ) {
 				case 'checkbox':
 					htmls.list += '<label><input type="checkbox">'+ label +'</label></td>';
-					htmls.list += l[ 2 ] === 'td' ? '' : '</tr>'; // same line || 1:1 line
+					htmls.list += param.sameline ? '' : '</tr>'; // default: false
 					break;
 				case 'hidden':
 				case 'number':
 				case 'text':
-					var unit = typeof l[ 2 ] === 'object' ? false : l[ 2 ];
-					var updn = unit ? false : l[ 2 ];
-					htmls.list += '<input type="'+ type +'"'+ ( updn ? ' disabled' : '' ) +'>';
-					if ( unit ) {
-						htmls.list += l[ 3 ] === 'td' ? '' : '<td>&nbsp;<gr>'+ unit +'</gr>';
-					} else if ( updn ) {
-						I.updn.push( updn );
+					htmls.list += '<input type="'+ type +'"'+ ( param.updn ? ' disabled' : '' ) +'>';
+					if ( param.suffix ) {
+						htmls.list += '<td>&nbsp;<gr>'+ param.suffix +'</gr>';
+					} else if ( param.updn ) {
+						I.updn.push( param.updn );
 						htmls.list += '<td>'+ ico( 'remove updn dn' ) + ico( 'plus-circle updn up' );
 					}
-					htmls.list += l[ 3 ] === 'td' ? '</td>' : '</tr>';
+					htmls.list += param.sameline ? '</td>' : '</tr>';
 					break;
 				case 'password':
 					htmls.list += '<input type="password"></td><td>'+ ico( 'eye' ) +'</td></tr>';
 					break;
 				case 'radio':
-					var isarray = $.isArray( l[ 2 ] );
+					var isarray = $.isArray( kv );
 					var tr      = false;
-					$.each( l[ 2 ], ( k, v ) => {
+					$.each( kv, ( k, v ) => {
 						var k = isarray ? v : k;
-						if ( tr ) htmls.list += '<tr><td></td><td colspan="2">';
+						if ( tr ) htmls.list += '<tr><td></td><td colspan="'+ colspan +'">';
 						htmls.list += '<label><input type="radio" name="inforadio'+ i +'" value="'+ v +'">'+ k +'</label>';
-						if ( l[ 3 ] === 'tr' ) {
+						if ( param.sameline === false ) { // default: true
 							tr          = true;
 							htmls.list += '</td></tr>'; // 1:1 line
 						} else {
@@ -525,19 +521,19 @@ function info( json ) {
 								+'</div></td></tr>';
 					break
 				case 'select':
-					htmls.list += '<select>'+ htmlOption( l[ 2 ] ) +'</select>';
-					if ( l[ 3 ] ) {
-						htmls.list += l[ 3 ] === 'td' ? '</td>' : '<td>&nbsp;<gr>'+ l[ 3 ] +'</gr></td></tr>'; // unit
+					htmls.list += '<select>'+ htmlOption( kv ) +'</select>';
+					if ( param.suffix ) {
+						htmls.list += '<td>&nbsp;<gr>'+ param.suffix +'</gr></td></tr>'; // default: false
 					} else {
-						htmls.list += '</tr>';
+						htmls.list += param.sameline ? '</td>' : '</tr>';
 					}
 					break;
 				case 'textarea':
 					htmls.list += '<textarea></textarea></td></tr>';
 					break;
 				default: // generic string
-					htmls.list += l[ 2 ];
-					htmls.list += l[ 3 ] === 'td' ? '</td>' : '</td></tr>';
+					htmls.list += param.suffix || '';
+					htmls.list += param.sameline ? '</td>' : '</td></tr>';
 			}
 		} );
 		if ( type !== 'range' ) htmls.list = '<table>'+ htmls.list +'</table>';
@@ -886,15 +882,15 @@ function infoSetValues() {
 		type  = $this.prop( 'type' );
 		val   = I.values[ i ];
 		if ( type === 'radio' ) { // reselect radio by name
-			if ( val ) {
+			if ( val !== 'undefined' ) {
 				$( '#infoList input:radio[name='+ el.name +']' ).val( [ val ] );
 			} else {
 				$( '#infoList input:radio' ).eq( 0 ).prop( 'checked', true );
 			}
 		} else if ( type === 'checkbox' ) {
 			$this.prop( 'checked',  val );
 		} else if ( $this.is( 'select' ) ) {
-			val ? $this.val( val ) : el.selectedIndex = 0;
+			val !== 'undefined' ? $this.val( val ) : el.selectedIndex = 0;
 		} else {
 			$this.val( val );
 			if ( type === 'range' ) $('.inforange .value' ).text( val );
@@ -978,7 +974,7 @@ function infoWidth() {
 	} else {
 		var boxW   = 230;
 	}
-	$( '#infoList table' ).find( 'input:text, input[type=number], input:password, textarea' ).parent().css( 'width', boxW );
+	$( '#infoList table' ).find( 'input:text, input[type=number], input:password, textarea' ).parent().css( 'width', boxW +'px' );
 	if ( $( '#infoList select' ).length ) {
 		selectSet(); // render select to set width
 		$( '#infoList .select2-container' ).attr( 'style', 'width: '+ boxW +'px !important' );

srv/http/assets/js/context.js

@@ -547,14 +547,13 @@ function wrDirectoryRename() {
 }
 var listwebradio = {
 	  list   : [
-		  [ 'Name',    'text' ]
-		, [ 'URL',     'text' ]
-		, [ 'Charset', 'text', '', 'td' ]
-		, [ '',        '',     '<a href="https://www.iana.org/assignments/character-sets/character-sets.xhtml" target="_blank">'+ ico( 'help i-22 gr' ), 'td' ]
-		, [ '',        '',     '<gr>New folder</gr>&ensp;'+ ico( 'folder-plus i-22' ) ]
+		  [ 'Name',    'text', { colspan: 3 } ]
+		, [ 'URL',     'text', { colspan: 3 } ]
+		, [ 'Charset', 'text', { sameline: true } ]
+		, [ '',        '',     { suffix: '<a href="https://www.iana.org/assignments/character-sets/character-sets.xhtml" target="_blank">'+ ico( 'help i-22 gr' ), sameline: true } ]
+		, [ '',        '',     { suffix: '<gr>New folder</gr>&ensp;'+ ico( 'folder-plus i-22' ) } ]
 	]
 	, button : () => {
-		$( '#infoList tr' ).slice( 0, 2 ).find( 'td:nth-child( 2 )' ).prop( 'colspan', 3 );
 		$( '#infoList tr' ).last().find( 'td' ).eq( 1 ).css( 'width', '190px' );
 		$( '#infoList td' ).last()
 			.css( { 'text-align': 'right', cursor: 'pointer' } )

srv/http/assets/js/features.js

@@ -5,14 +5,6 @@ var default_v      = {
 		, CD        : true
 		, STARTUP   : true
 	  }
-	, localbrowser : {
-		  ROTATE      : 0
-		, ZOOM        : 100
-		, SCREENOFF   : 0
-		, ONWHILEPLAY : false
-		, CURSOR      : false
-		, RUNXINITRCD : false
-	}
 	, lyrics       : {
 		  URL      : 'https://'
 		, START    : '<'
@@ -119,7 +111,7 @@ $( '#setting-spotifyd' ).on( 'click', function() {
 				, [ 'Secret', 'text' ]
 			]
 			, focus       : 0
-			, footer      : '<br><wh>ID</wh> and <wh>Secret</wh> from Spotify private app '+ ico( 'help help' )
+			, footer      : '<wh>ID</wh> and <wh>Secret</wh> from Spotify private app '+ ico( 'help help' )
 			, footeralign : 'right'
 			, boxwidth    : 320
 			, checklength : { 0: 32, 1: 32 }
@@ -189,15 +181,15 @@ $( '#setting-localbrowser' ).on( 'click', function() {
 		, title        : SW.title
 		, list         : [
 			  [ 'Rotation',                  'select', { Normal: 0, '90° CW': 90, '90° CCW': 270, '180°': 180 } ]
-			, [ 'Zoom <gr>(%)</gr>',         'number', { step: 5, min: 50, max: 300 } ]
-			, [ 'Screen off <gr>(min)</gr>', 'number', { step: 1, min: 0, max: 60 } ]
+			, [ 'Zoom <gr>(%)</gr>',         'number', { updn: { step: 5, min: 50, max: 300 } } ]
+			, [ 'Screen off <gr>(min)</gr>', 'number', { updn: { step: 1, min: 0, max: 60 } } ]
 			, [ 'On while play',             'checkbox' ]
 			, [ 'Mouse pointer',             'checkbox' ]
 			, [ 'run <c>xinitrc.d</c>',      'checkbox' ]
 		]
 		, footer       : '<br>'+ brightness + button
 		, boxwidth     : 110
-		, values       : S.localbrowserconf || default_v.localbrowser
+		, values       : S.localbrowserconf
 		, checkchanged : S.localbrowser
 		, beforeshow   : () => {
 			var $onwhileplay = $( '#infoList input:checkbox' ).eq( 0 );
@@ -259,7 +251,7 @@ $( '#setting-lyrics' ).on( 'click', function() {
 		, list         : [
 			  [ 'URL',             'text' ]
 			, [ 'Start tag',       'text' ]
-			, [ '',                '', '<gr>Lyrics content ...</gr>' ]
+			, [ '',                '', { suffix: '<gr>Lyrics content ...</gr>' } ]
 			, [ 'End tag',         'text' ]
 			, [ 'Embedded lyrics', 'checkbox' ]
 		]
@@ -286,10 +278,10 @@ $( '#setting-multiraudio' ).on( 'click', function() {
 		  icon         : SW.icon
 		, title        : SW.title
 		, list         : [
-			  [ '', '', 'Name', 'td' ]
-			, [ '', '', 'IP / URL' ]
-			, [ '', 'text',     '', 'td' ]
-			, [ '', 'text',     ico( 'remove' ) ]
+			  [ '', '',     { suffix: 'Name', sameline: true } ]
+			, [ '', '',     { suffix: 'IP / URL' } ]
+			, [ '', 'text', { sameline: true } ]
+			, [ '', 'text', { suffix: ico( 'remove' ) } ]
 		]
 		, boxwidth     : 130
 		, values       : values
@@ -379,7 +371,7 @@ $( '#login' ).on( 'click', function() {
 $( '#setting-login' ).on( 'click', function() {
 	var list = [
 		  [ 'Existing', 'password' ]
-		, [ 'New', 'password' ]
+		, [ 'New',      'password' ]
 		, [ 'Password', 'password' ]
 	]
 	info( {
@@ -451,7 +443,7 @@ $( '#setting-stoptimer' ).on( 'click', function() {
 		  icon         : SW.icon
 		, title        : SW.title
 		, list         : [
-			  [ 'Minutes',           'number', { step: 5, min: 5, max: 120 } ]
+			  [ 'Minutes',           'number', { updn: { step: 5, min: 5, max: 120 } } ]
 			, [ 'Power off on stop', 'checkbox' ]
 		]
 		, boxwidth     : 70

srv/http/assets/js/function.js

@@ -627,8 +627,10 @@ function infoDisplayKeyValue( type ) {
 	keys.forEach( k => { values[ k ] = D[ k ] } );
 	var list   = [];
 	Object.values( json ).forEach( ( l, i ) => {
-		if ( [ 'library', 'playback' ].includes( type ) ) {
-			list.push( i % 2 ? [ l, 'checkbox' ] : [ l, 'checkbox', 'td' ] );
+		if ( ! l ) {
+			list.push( [ '', '' ] );
+		} else if ( [ 'library', 'playback' ].includes( type ) ) {
+			list.push( i % 2 ? [ l, 'checkbox' ] : [ l, 'checkbox', { sameline: true } ] );
 		} else {
 			list.push( [ l, 'checkbox' ] );
 		}
@@ -777,7 +779,7 @@ function infoUpdate( path ) {
 		  icon       : 'refresh-library'
 		, title      : 'Library Database'
 		, message    : path ? ico( 'folder' ) +' <wh>'+ path +'</wh>' : ''
-		, list       : path ? '' : [ '', 'radio', { 'Only changed files' : '', 'Rebuild entire database': 'rescan' }, 'tr' ]
+		, list       : path ? '' : [ '', 'radio', { kv: { 'Only changed files' : '', 'Rebuild entire database': 'rescan' }, sameline: false } ]
 		, beforeshow : () => {
 			if ( ! C ) {
 				$( '#infoList input' ).eq( 0 ).prop( 'disabled', true );

srv/http/assets/js/main.js

@@ -66,7 +66,7 @@ var vumeter = '<img class="imgicon" src="'+ V.covervu +'"> ';
 var chkdisplay = {
 	  library       : {
 		  album          : ico( 'album' ) +'<gr>Album</gr>'
-			, nas        : ico( 'networks' ) +'<gr>Network</gr>'
+			, nas        : ico( 'networks' ) +'<gr>NAS</gr>'
 		, albumartist    : ico( 'albumartist' ) +'<gr>Album Artist</gr>'
 			, sd         : ico( 'microsd' ) +'<gr>SD</gr>'
 		, artist         : ico( 'artist' ) +'<gr>Artist</gr>'
@@ -260,7 +260,7 @@ $( '#settings' ).on( 'click', '.submenu', function() {
 				info( {
 					  icon       : 'multiraudio'
 					, title      : 'Switch rAudio'
-					, list       : [ '', 'radio', data.list, 'tr' ]
+					, list       : [ '', 'radio', { kv: data.list, sameline: false } ]
 					, values     : currentip
 					, beforeshow : () => {
 						$( '#infoList input' ).each( ( i, el ) => {