tazpanel rev 426

Code cleaning; add icons for packages and "toggle" to tazpanel.ttf; merge checkbox.js with tazpanel.js.
author Aleksej Bobylev <al.bobylev@gmail.com>
date Fri Mar 27 14:28:32 2015 +0200 (2015-03-27)
parents d6586247420a
children b4817a7f661b
files boot.cgi hardware.cgi index.cgi lib/checkbox.js lib/tazpanel.js styles/default/base.css styles/default/tazpanel.ttf styles/default/tweaks.css
line diff
     1.1 --- a/boot.cgi	Wed Mar 25 18:48:01 2015 +0100
     1.2 +++ b/boot.cgi	Fri Mar 27 14:28:32 2015 +0200
     1.3 @@ -18,14 +18,13 @@
     1.4  
     1.5  # Print last 40 lines of given file with "more" link
     1.6  
     1.7 -loghead()
     1.8 -{
     1.9 +loghead() {
    1.10  	case $2 in
    1.11  		htmlize) tail -n40 $1 | htmlize;;
    1.12 -		*) tail -n40;;
    1.13 +		*)       tail -n40;;
    1.14  	esac
    1.15  	[ $(wc -l < $1) -gt 40 ] && cat <<EOT
    1.16 -<hr/><a href="/index.cgi?file=$1">$(gettext 'Show more...')</a>
    1.17 +<hr/><a data-icon="view" href="/index.cgi?file=$1">$(gettext 'Show more...')</a>
    1.18  EOT
    1.19  }
    1.20  
    1.21 @@ -365,23 +364,19 @@
    1.22  
    1.23  <section>
    1.24  	<header>$(gettext 'Kernel cmdline')</header>
    1.25 -	<div>
    1.26 -		<pre>$(cat /proc/cmdline)</pre>
    1.27 -	</div>
    1.28 +	<pre>$(cat /proc/cmdline)</pre>
    1.29  </section>
    1.30  
    1.31  
    1.32  <section>
    1.33 -	<header>$(gettext 'Local startup commands')</header>
    1.34 -	<div>
    1.35 -		<pre>$(cat /etc/init.d/local.sh | syntax_highlighter sh)</pre>
    1.36 -	</div>
    1.37 -	<footer>
    1.38 +	<header>
    1.39 +		$(gettext 'Local startup commands')
    1.40  		<form action="index.cgi">
    1.41  			<input type="hidden" name="file" value="/etc/init.d/local.sh"/>
    1.42 -			<button name="action" value="edit" data-icon="edit">$(gettext 'Edit script')</button>
    1.43 +			<button name="action" value="edit" data-icon="edit">$(gettext 'Edit')</button>
    1.44  		</form>
    1.45 -	</footer>
    1.46 +	</header>
    1.47 +	<pre>$(cat /etc/init.d/local.sh | syntax_highlighter sh)</pre>
    1.48  </section>
    1.49  EOT
    1.50  		;;
     2.1 --- a/hardware.cgi	Wed Mar 25 18:48:01 2015 +0100
     2.2 +++ b/hardware.cgi	Fri Mar 27 14:28:32 2015 +0200
     2.3 @@ -13,19 +13,24 @@
     2.4  TITLE=$(gettext 'TazPanel - Hardware')
     2.5  
     2.6  # Call an optional module
     2.7 -lib()
     2.8 -{
     2.9 +lib() {
    2.10  	module=lib/$1
    2.11  	shift
    2.12  	[ -s $module ] && . $module "$@"
    2.13  }
    2.14  
    2.15  
    2.16 -lsusb_table()
    2.17 -{
    2.18 +lsusb_table() {
    2.19  	cat <<EOT
    2.20  <table class="wide zebra">
    2.21 -<thead><tr><td>Bus</td><td>Device</td><td>ID</td><td>Name</td></thead>
    2.22 +	<thead>
    2.23 +		<tr>
    2.24 +			<td>$(gettext 'Bus')</td>
    2.25 +			<td>$(gettext 'Device')</td>
    2.26 +			<td>$(gettext 'ID')</td>
    2.27 +			<td>$(gettext 'Name')</td>
    2.28 +		</tr>
    2.29 +	</thead>
    2.30  <tbody>
    2.31  EOT
    2.32  	lsusb | sed 's|^Bus \([0-9]*\)|<tr><td>\1</td>|;
    2.33 @@ -37,8 +42,7 @@
    2.34  }
    2.35  
    2.36  
    2.37 -lspci_table()
    2.38 -{
    2.39 +lspci_table() {
    2.40  	cat <<EOT
    2.41  <table class="wide zebra">
    2.42  <thead><tr><td>Slot</td><td>Device</td><td>Name</td></thead>
    2.43 @@ -51,6 +55,7 @@
    2.44  	echo "</tbody></table>"
    2.45  }
    2.46  
    2.47 +
    2.48  #
    2.49  # Commands
    2.50  #
    2.51 @@ -79,10 +84,8 @@
    2.52  <p>$(gettext 'Detect PCI and USB hardware')</p>
    2.53  
    2.54  <section>
    2.55 -	<div>
    2.56 -		<pre>$(tazhw detect-pci | sed 's|^>|\&gt;|g')</pre>
    2.57 -		<pre>$(tazhw detect-usb | sed 's|^>|\&gt;|g')</pre>
    2.58 -	</div>
    2.59 +	<pre>$(tazhw detect-pci | sed 's|^>|\&gt;|g')</pre>
    2.60 +	<pre>$(tazhw detect-usb | sed 's|^>|\&gt;|g')</pre>
    2.61  </section>
    2.62  EOT
    2.63  		;;
    2.64 @@ -137,7 +140,7 @@
    2.65  		fi
    2.66  		cat <<EOT
    2.67  <section>
    2.68 -	<table class="zebra borders hborders">
    2.69 +	<table class="zebra">
    2.70  		<thead>
    2.71  			<tr>
    2.72  				<td>$(gettext 'Module')</td>
    2.73 @@ -173,11 +176,10 @@
    2.74  <p>$(gettext 'Detailed information about specified device.')</p>
    2.75  
    2.76  <section>$(lsusb_table)</section>
    2.77 -
    2.78 +EOT
    2.79 +		[ "$vidpid" != 'lsusb' ] && cat <<EOT
    2.80  <section>
    2.81 -	<div>
    2.82 -		<pre style="white-space: pre-wrap">$(lsusb -vd $vidpid | syntax_highlighter lsusb)</pre>
    2.83 -	</div>
    2.84 +	<pre style="white-space: pre-wrap">$(lsusb -vd $vidpid | syntax_highlighter lsusb)</pre>
    2.85  </section>
    2.86  EOT
    2.87  		;;
    2.88 @@ -192,11 +194,10 @@
    2.89  <p>$(gettext 'Detailed information about specified device.')</p>
    2.90  
    2.91  <section>$(lspci_table)</section>
    2.92 -
    2.93 +EOT
    2.94 +		[ "$slot" != 'lspci' ] && cat <<EOT
    2.95  <section>
    2.96 -	<div>
    2.97 -		<pre style="white-space: pre-wrap">$(lspci -vs $slot | syntax_highlighter lspci)</pre>
    2.98 -	</div>
    2.99 +	<pre style="white-space: pre-wrap">$(lspci -vs $slot | syntax_highlighter lspci)</pre>
   2.100  </section>
   2.101  EOT
   2.102  		;;
   2.103 @@ -204,7 +205,7 @@
   2.104  
   2.105  	*)
   2.106  		[ -n "$(GET brightness)" ] &&
   2.107 -		echo -n $(GET brightness) > /sys/devices/virtual/backlight/$(GET dev)/brightness
   2.108 +			echo -n $(GET brightness) > /sys/devices/virtual/backlight/$(GET dev)/brightness
   2.109  
   2.110  		#
   2.111  		# Default to summary with mounted filesystem, loaded modules
   2.112 @@ -360,8 +361,7 @@
   2.113  EOT
   2.114  		df_thead
   2.115  		echo '<tbody>'
   2.116 -		for fs in $(blkid | sort | sed 's/:.*//')
   2.117 -		do
   2.118 +		for fs in $(blkid | sort | sed 's/:.*//'); do
   2.119  			set -- $(df -h | grep "^$fs ")
   2.120  			size=$2
   2.121  			used=$3
   2.122 @@ -448,7 +448,13 @@
   2.123  		#
   2.124  		cat <<EOT
   2.125  <section>
   2.126 -	<header>$(gettext 'Filesystems table')</header>
   2.127 +	<header>
   2.128 +		$(gettext 'Filesystems table')
   2.129 +		<form action="index.cgi">
   2.130 +			<input type="hidden" name="file" value="/etc/fstab"/>
   2.131 +			<button name="action" value="edit" data-icon="edit">$(gettext 'Edit')</button>
   2.132 +		</form>
   2.133 +	</header>
   2.134  	<table class="wide zebra center">
   2.135  		<thead>
   2.136  			<tr>
   2.137 @@ -470,12 +476,6 @@
   2.138  	END{print "</tbody></table>"}'
   2.139  
   2.140  		cat <<EOT
   2.141 -	<footer>
   2.142 -		<form action="index.cgi">
   2.143 -			<input type="hidden" name="file" value="/etc/fstab"/>
   2.144 -			<button name="action" value="edit" data-icon="edit">$(gettext 'Edit')</button>
   2.145 -		</form>
   2.146 -	</footer>
   2.147  </section>
   2.148  EOT
   2.149  
     3.1 --- a/index.cgi	Wed Mar 25 18:48:01 2015 +0100
     3.2 +++ b/index.cgi	Fri Mar 27 14:28:32 2015 +0200
     3.3 @@ -161,8 +161,9 @@
     3.4  
     3.5  			cat <<EOT
     3.6  <section>
     3.7 -	<header><span data-icon="text">$file</span>
     3.8 -		<form class="nogap">
     3.9 +	<header>
    3.10 +		<span data-icon="text">$file</span>
    3.11 +		<form>
    3.12  			<input type="hidden" name="file" value="$file"/>
    3.13  			<button name="action" value="edit" data-icon="edit">$(gettext 'Edit')</button><!--
    3.14  			-->$(file_is_modified $file button)
     4.1 --- a/lib/checkbox.js	Wed Mar 25 18:48:01 2015 +0100
     4.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     4.3 @@ -1,19 +0,0 @@
     4.4 -javascript:(function() {
     4.5 -function checkBoxes(w) {
     4.6 -	try {
     4.7 -		var inputs = w.document.getElementsByTagName('input');
     4.8 -		for (var i = 0; i < inputs.length; i++) {
     4.9 -			if (inputs[i].type && inputs[i].type == 'checkbox') {
    4.10 -				inputs[i].checked = !inputs[i].checked;
    4.11 -			}
    4.12 -		}
    4.13 -	} catch (e){}
    4.14 -	if (w.frames && w.frames.length>0) {
    4.15 -		for (var i = 0; i < w.frames.length;i++) {
    4.16 -			var fr = w.frames[i];
    4.17 -			checkFrames(fr);
    4.18 -		}
    4.19 -	}
    4.20 -}
    4.21 -checkBoxes(window);
    4.22 -})()
     5.1 --- a/lib/tazpanel.js	Wed Mar 25 18:48:01 2015 +0100
     5.2 +++ b/lib/tazpanel.js	Fri Mar 27 14:28:32 2015 +0200
     5.3 @@ -162,7 +162,7 @@
     5.4  		}
     5.5  	else
     5.6  		{
     5.7 -		document.getElementById('miscinfo1').innerText = '>';
     5.8 +		//document.getElementById('miscinfo1').innerText = '>';
     5.9  		document.getElementById('head1h').style.display = 'none';
    5.10  		}
    5.11  
    5.12 @@ -407,3 +407,27 @@
    5.13  
    5.14  	wifiSettingsChange();
    5.15  }
    5.16 +
    5.17 +
    5.18 +//
    5.19 +// Toggle all checkboxes on a page
    5.20 +//
    5.21 +
    5.22 +function checkBoxes(w) {
    5.23 +	try {
    5.24 +		var inputs = w.document.getElementsByTagName('input');
    5.25 +		for (var i = 0; i < inputs.length; i++) {
    5.26 +			if (inputs[i].type && inputs[i].type == 'checkbox') {
    5.27 +				inputs[i].checked = !inputs[i].checked;
    5.28 +			}
    5.29 +		}
    5.30 +	} catch (e){}
    5.31 +	if (w.frames && w.frames.length>0) {
    5.32 +		for (var i = 0; i < w.frames.length;i++) {
    5.33 +			var fr = w.frames[i];
    5.34 +			checkFrames(fr);
    5.35 +		}
    5.36 +	}
    5.37 +	return false
    5.38 +}
    5.39 +
     6.1 --- a/styles/default/base.css	Wed Mar 25 18:48:01 2015 +0100
     6.2 +++ b/styles/default/base.css	Fri Mar 27 14:28:32 2015 +0200
     6.3 @@ -16,8 +16,7 @@
     6.4  
     6.5  body > header {
     6.6  	position: fixed; top: 0; left: 0;
     6.7 -	/*height: 40px;*/ width: 100%;
     6.8 -	/*background: #222 url(images/logo.png) no-repeat left; padding-left: 40px;*/
     6.9 +	width: 100%;
    6.10  	background-color: #222;
    6.11  }
    6.12  
    6.13 @@ -115,9 +114,10 @@
    6.14  
    6.15  #toolbarMenu a { display: block; color: inherit; text-decoration: none; }
    6.16  
    6.17 +/* Clicking this layer close menu */
    6.18  #noMenu {
    6.19  	position: fixed;
    6.20 -	background-color: transparent; /*hsla(40, 100%, 60%, 0.5);*/
    6.21 +	background-color: transparent;
    6.22  	display: none;
    6.23  	height: 100%; width: 100%;
    6.24  }
    6.25 @@ -180,7 +180,7 @@
    6.26  
    6.27  
    6.28  
    6.29 -      fieldset { border: 1pt solid; border-radius: 0.3rem; margin-bottom: 0.2rem; }
    6.30 +fieldset { border: 1pt solid; border-radius: 0.3rem; margin-bottom: 0.2rem; }
    6.31  
    6.32  
    6.33  
    6.34 @@ -193,7 +193,6 @@
    6.35  	padding: 0.1rem 0.3rem;
    6.36  	white-space: nowrap; width: 1rem; /* minimal width */
    6.37  }
    6.38 -#icons img { vertical-align: middle; }
    6.39  
    6.40  
    6.41  
    6.42 @@ -673,7 +672,7 @@
    6.43   * Inputs *
    6.44   **********/
    6.45  
    6.46 -:default  { outline: 1px dotted hsla(240, 100%, 50%, 0.5); outline-offset: -4px; }
    6.47 +/*:default  { outline: 1px dotted hsla(240, 100%, 50%, 0.5); outline-offset: -4px; }*/
    6.48  :required { outline: 1px solid  hsla( 30, 100%, 50%, 0.7); outline-offset: -3px; }
    6.49  :invalid  { outline: 2px solid  hsla(  0, 100%, 50%, 0.7); outline-offset: -3px; }
    6.50  
     7.1 Binary file styles/default/tazpanel.ttf has changed
     8.1 --- a/styles/default/tweaks.css	Wed Mar 25 18:48:01 2015 +0100
     8.2 +++ b/styles/default/tweaks.css	Fri Mar 27 14:28:32 2015 +0200
     8.3 @@ -184,24 +184,10 @@
     8.4   * Buttons with icons *
     8.5   **********************/
     8.6  
     8.7 -.light .icon:before,
     8.8 -.light .icon2:before,
     8.9 -.light [class|="icon"]:before {
    8.10 -	text-shadow: 0 1px 0   hsla(0, 0%, 100%, 0.3), 0 0   3px hsla(0, 0%, 100%, 0.7); }
    8.11 -.dark  .icon:before,
    8.12 -.dark  .icon2:before {
    8.13 -	text-shadow: 0 0   3px hsla(0, 0%,   0%, 0.7), 0 1px 0   hsla(0, 0%,   0%, 0.3); }
    8.14 +.light button[data-icon]::before {
    8.15 +	text-shadow: 0 1px 0 hsla(0, 0%, 100%, 0.9); }
    8.16  
    8.17 -.dark.nowebkit [data-icon]::before {
    8.18 -	text-shadow:
    8.19 -		0 1px 0 hsla(0, 0%, 0%, 0.7), 0 -1px 0 hsla(0, 0%, 0%, 0.4),
    8.20 -		1px 0 0 hsla(0, 0%, 0%, 0.4), -1px 0 0 hsla(0, 0%, 0%, 0.4); }
    8.21 -.light button[data-icon]::before, button {
    8.22 -	text-shadow:
    8.23 -		0 1px 0 hsla(0, 0%, 100%, 0.9) /*, 0 -1px 0 hsla(0, 0%, 100%, 0.6),
    8.24 -		1px 0 0 hsla(0, 0%, 100%, 0.6), -1px 0 0 hsla(0, 0%, 100%, 0.6)*/; }
    8.25 -
    8.26 -.dark [data-icon]:before, .dark [data-img] {
    8.27 +.dark [data-icon]:not([disabled])::before, .dark [data-img] {
    8.28  	/* Experimental webkit-only styles */
    8.29  	background-image: -webkit-radial-gradient(25% 25%, #fff, #777);
    8.30  	-webkit-background-clip: text;
    8.31 @@ -211,21 +197,22 @@
    8.32  a[data-icon] { white-space: pre-line; }
    8.33  
    8.34  [data-icon="cancel"]::before, [data-icon="delete"]::before,
    8.35 -[data-icon="remove"]::before, [data-icon="stop"]::before,
    8.36 +[data-icon="remove"]::before, [data-icon="stop"]:not([disabled])::before,
    8.37  [data-img="help"]::before,    [data-img="man"]::before,
    8.38  [data-img="off"]::before,     [data-img="remove"]::before,
    8.39 -[data-img="stop"]::before {color:#dc322f} /*red*/
    8.40 +[data-img="stop"]::before,    [data-icon="pkgib"]::before {color:#dc322f} /*red*/
    8.41  
    8.42 -[data-icon="restart"]::before, [data-img="conf"]::before {color:#cb4b16} /*orange*/
    8.43 +[data-icon="restart"]:not([disabled])::before, [data-img="conf"]::before {color:#cb4b16} /*orange*/
    8.44  
    8.45  [data-icon="ok"]::before,    [data-icon="run"]::before,
    8.46 -[data-icon="start"]::before, [data-img="on"]::before,
    8.47 -[data-img="opt"]::before, [data-img="run"]::before {color:#859900} /*green*/
    8.48 +[data-icon="start"]:not([disabled])::before, [data-img="on"]::before,
    8.49 +[data-img="opt"]::before, [data-img="run"]::before, [data-icon="pkgi"]::before {color:#859900} /*green*/
    8.50  
    8.51 -[data-img="web"]::before {color:#268bd2} /*blue*/
    8.52 +[data-img="web"]::before {color:#268bd2}, [data-icon="pkg"]::before /*blue*/
    8.53  
    8.54  /* disabled buttons with gray icons */
    8.55 -[disabled][data-icon]:before { color: #888; }
    8.56 +/*.light [disabled][data-icon]::before {color:#888}
    8.57 +.dark  [disabled][data-icon]::before {color:#222}*/
    8.58  
    8.59  
    8.60