tazpanel rev 45

Better loading integration and clean up code in pkgs.cgi
author Christophe Lincoln <pankso@slitaz.org>
date Fri Apr 08 03:26:38 2011 +0200 (2011-04-08)
parents 13b1019d68d8
children 56d55a9dcc9c
files lib/libtazpanel pkgs.cgi styles/default/header.html styles/default/style.css tazpanel.conf
line diff
     1.1 --- a/lib/libtazpanel	Fri Apr 08 01:17:37 2011 +0200
     1.2 +++ b/lib/libtazpanel	Fri Apr 08 03:26:38 2011 +0200
     1.3 @@ -94,5 +94,7 @@
     1.4  	cat << EOT
     1.5  	</tbody>
     1.6  </table>
     1.7 +<a href="#header">`gettext "Go up"`</a>
     1.8  EOT
     1.9 +	
    1.10  }
     2.1 --- a/pkgs.cgi	Fri Apr 08 01:17:37 2011 +0200
     2.2 +++ b/pkgs.cgi	Fri Apr 08 03:26:38 2011 +0200
     2.3 @@ -32,26 +32,24 @@
     2.4  
     2.5  # We need packages information for list and search
     2.6  parse_packages_desc() {
     2.7 -while read line
     2.8 +	IFS="|"
     2.9 +	cut -f 1,2,3,5 -d "|" | while read PACKAGE VERSION SHORT_DESC WEB_SITE
    2.10  	do
    2.11  		echo '<tr>'
    2.12 -		pkg=$(echo $line | cut -d "|" -f 1)
    2.13 -		vers=$(echo $line | cut -d "|" -f 2)
    2.14 -		desc=$(echo $line | cut -d "|" -f 3)
    2.15 -		web=$(echo $line | cut -d "|" -f 5)
    2.16 -		if [ -d $INSTALLED/$pkg ]; then
    2.17 -			echo -e "<td><input type='checkbox' name='pkg' value=\"$pkg\">\n
    2.18 -				<a href='$SCRIPT_NAME?info=$pkg'>
    2.19 -				<img src='$IMAGES/tazpkg-installed.png'/>$pkg</a></td>"
    2.20 +		if [ -d $INSTALLED/$PACKAGE ]; then
    2.21 +			echo -e "<td><input type='checkbox' name='pkg' value=\"$PACKAGE\">\n
    2.22 +				<a href='$SCRIPT_NAME?info=$PACKAGE'>
    2.23 +				<img src='$IMAGES/tazpkg-installed.png'/>$PACKAGE</a></td>"
    2.24  		else
    2.25 -			echo -e "<td><input type='checkbox' name='pkg' value=\"$pkg\">\n
    2.26 -				<img src='$IMAGES/tazpkg.png'/>$pkg</td>"
    2.27 +			echo -e "<td><input type='checkbox' name='pkg' value=\"$PACKAGE\">\n
    2.28 +				<img src='$IMAGES/tazpkg.png'/>$PACKAGE</td>"
    2.29  		fi
    2.30 -		echo "<td>$vers</td>"
    2.31 -		echo "<td class='desc'>$desc</td>"
    2.32 -		echo "<td><a href='$web'>web</a></td>"
    2.33 +		echo "<td>$VERSION</td>"
    2.34 +		echo "<td class='desc'>$SHORT_DESC</td>"
    2.35 +		echo "<td><a href='$WEB_SITE'>web</a></td>"
    2.36  		echo '</tr>'
    2.37  	done
    2.38 +	unset IFS
    2.39  }
    2.40  
    2.41  # Remove status and ESC char from tazpkg commands output
    2.42 @@ -145,9 +143,25 @@
    2.43  EOT
    2.44  }
    2.45  
    2.46 -# For my packages list
    2.47 -list_actions() {
    2.48 -	cat << EOT
    2.49 +#
    2.50 +# Commands
    2.51 +#
    2.52 +
    2.53 +case "$QUERY_STRING" in
    2.54 +	list*)
    2.55 +		#
    2.56 +		# List installed packages. This is the default because parsing
    2.57 +		# the full packages.desc can be long and take some resources
    2.58 +		#
    2.59 +		cd $INSTALLED
    2.60 +		search_form
    2.61 +		sidebar
    2.62 +		LOADING_MSG="Listing packages..."
    2.63 +		loading_msg
    2.64 +		cat << EOT
    2.65 +<h2>`gettext "My packages"`</h2>
    2.66 +<form method='get' action='$SCRIPT_NAME'>
    2.67 +<div id="actions">
    2.68  <div class="float-left">
    2.69  	`gettext "Selection:"`
    2.70  	<input type="submit" name="do" value="Remove" />
    2.71 @@ -158,82 +172,6 @@
    2.72  	<input type="submit" name="upgradeable" value="Upgrade" />
    2.73  </div>
    2.74  EOT
    2.75 -}
    2.76 -
    2.77 -# For list-cat
    2.78 -list_cat_action() {
    2.79 -	cat << EOT
    2.80 -<div class="float-left">
    2.81 -	`gettext "Selection:"`
    2.82 -	<input type="submit" name="do" value="Install" />
    2.83 -	<input type="submit" name="do" value="Remove" />
    2.84 -</div>
    2.85 -<div class="float-right">
    2.86 -	`gettext "List:"`
    2.87 -	<input type="submit" name="recharge" value="Recharge" />
    2.88 -	<input type="submit" name="upgradeable" value="Upgrade" />
    2.89 -	<a class="button" href='$SCRIPT_NAME?list'>
    2.90 -		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
    2.91 -</div>
    2.92 -EOT
    2.93 -}
    2.94 -
    2.95 -# For search with JS function to toogle all pkgs
    2.96 -list_full_actions() {
    2.97 -	cat << EOT
    2.98 -<div class="float-left">
    2.99 -	`gettext "Selection:"`
   2.100 -	<input type="submit" name="do" value="Install" />
   2.101 -	<input type="submit" name="do" value="Remove" />
   2.102 -	<a href="`cat $PANEL/lib/checkbox.js`">`gettext "Toogle all"`</a>
   2.103 -</div>
   2.104 -<div class="float-right">
   2.105 -	`gettext "List:"`
   2.106 -	<input type="submit" name="recharge" value="Recharge" />
   2.107 -	<input type="submit" name="upgradeable" value="Upgrade" />
   2.108 -	<a class="button" href='$SCRIPT_NAME?list'>
   2.109 -		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.110 -</div>
   2.111 -EOT
   2.112 -}
   2.113 -
   2.114 -# For upgrade with JS function to toogle all pkgs and no 'Upgrade' button
   2.115 -list_up_actions() {
   2.116 -	cat << EOT
   2.117 -<div class="float-left">
   2.118 -	`gettext "Selection:"`
   2.119 -	<input type="submit" name="do" value="Install" />
   2.120 -	<input type="submit" name="do" value="Remove" />
   2.121 -	<a href="`cat $PANEL/lib/checkbox.js`">`gettext "Toogle all"`</a>
   2.122 -</div>
   2.123 -<div class="float-right">
   2.124 -	`gettext "List:"`
   2.125 -	<input type="submit" name="recharge" value="Recharge" />
   2.126 -	<a class="button" href='$SCRIPT_NAME?list'>
   2.127 -		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.128 -</div>
   2.129 -EOT
   2.130 -}
   2.131 -
   2.132 -#
   2.133 -# Commands
   2.134 -#
   2.135 -
   2.136 -case "$QUERY_STRING" in
   2.137 -	list*)
   2.138 -		# List installed packages. This is the default because parsing
   2.139 -		# the full packages.desc can be long and take some resources
   2.140 -		cd $INSTALLED
   2.141 -		search_form
   2.142 -		sidebar
   2.143 -		LOADING_MSG="Listing... please wait"
   2.144 -		loading_msg
   2.145 -		cat << EOT
   2.146 -<h2>`gettext "My packages"`</h2>
   2.147 -<form method='get' action='$SCRIPT_NAME'>
   2.148 -<div id="actions">
   2.149 -EOT
   2.150 -		list_actions
   2.151  		echo '</div>'
   2.152  		table_start
   2.153  		table_head
   2.154 @@ -253,41 +191,70 @@
   2.155  			echo '</tr>'
   2.156  		done
   2.157  		table_end
   2.158 -		list_actions
   2.159  		echo '</form>' ;;
   2.160  	cat*)
   2.161 +		#
   2.162  		# List all available packages by category on mirror. Listing all
   2.163  		# packages is to resource intensive and not usefull.
   2.164 +		#
   2.165  		cd  $LOCALSTATE
   2.166  		category=${QUERY_STRING#cat=}
   2.167  		[ "${QUERY_STRING}" == "cat" ] && category="base-system"
   2.168  		search_form
   2.169  		sidebar | sed s/"active_${category}"/"active"/
   2.170 +		LOADING_MSG="Listing packages..."
   2.171 +		loading_msg
   2.172  		cat << EOT
   2.173  <h2>`gettext "Category:"` $category</h2>
   2.174  <form method='get' action='$SCRIPT_NAME'>
   2.175  <div id="actions">
   2.176 +<div class="float-left">
   2.177 +	`gettext "Selection:"`
   2.178 +	<input type="submit" name="do" value="Install" />
   2.179 +	<input type="submit" name="do" value="Remove" />
   2.180 +</div>
   2.181 +<div class="float-right">
   2.182 +	`gettext "List:"`
   2.183 +	<input type="submit" name="recharge" value="Recharge" />
   2.184 +	<input type="submit" name="upgradeable" value="Upgrade" />
   2.185 +	<a class="button" href='$SCRIPT_NAME?list'>
   2.186 +		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.187 +</div>
   2.188  EOT
   2.189 -		list_cat_action
   2.190  		echo '</div>'
   2.191  		table_start
   2.192  		table_head
   2.193  		grep "| $category |" packages.desc | parse_packages_desc
   2.194  		table_end
   2.195 -		list_cat_action
   2.196  		echo '</form>' ;;
   2.197  	search=*)
   2.198 +		#
   2.199  		# Search for packages
   2.200 +		#
   2.201  		pkg=${QUERY_STRING#*=}
   2.202  		cd  $LOCALSTATE
   2.203  		search_form
   2.204  		sidebar
   2.205 +		LOADING_MSG="Searching packages..."
   2.206 +		loading_msg
   2.207  		cat << EOT
   2.208  <h2>`gettext "Search packages"`</h2>
   2.209  <form method="get" action="$SCRIPT_NAME">
   2.210  <div id="actions">
   2.211 +<div class="float-left">
   2.212 +	`gettext "Selection:"`
   2.213 +	<input type="submit" name="do" value="Install" />
   2.214 +	<input type="submit" name="do" value="Remove" />
   2.215 +	<a href="`cat $PANEL/lib/checkbox.js`">`gettext "Toogle all"`</a>
   2.216 +</div>
   2.217 +<div class="float-right">
   2.218 +	`gettext "List:"`
   2.219 +	<input type="submit" name="recharge" value="Recharge" />
   2.220 +	<input type="submit" name="upgradeable" value="Upgrade" />
   2.221 +	<a class="button" href='$SCRIPT_NAME?list'>
   2.222 +		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.223 +</div>
   2.224  EOT
   2.225 -		list_full_actions
   2.226  		echo '</div>'
   2.227  		table_start
   2.228  		table_head
   2.229 @@ -295,21 +262,26 @@
   2.230  		table_end
   2.231  		echo '</form>' ;;
   2.232  	recharge*)
   2.233 +		#
   2.234  		# Let recharge the packages list
   2.235 +		#
   2.236  		search_form
   2.237  		sidebar
   2.238 +		LOADING_MSG="Recharging lists..."
   2.239 +		loading_msg
   2.240  		cat << EOT
   2.241  <h2>`gettext "Recharge"`</h2>
   2.242  <form method='get' action='$SCRIPT_NAME'>
   2.243  <div id="actions">
   2.244  	<div class="float-left">
   2.245  		<p>
   2.246 -			`gettext "Recharge will check for new or updated packages...
   2.247 -please wait"`
   2.248 +			`gettext "Recharge checks for new or updated packages"`
   2.249  		</p>
   2.250  	</div>
   2.251  	<div class="float-right">
   2.252  		<p>
   2.253 +			<a class="button" href='$SCRIPT_NAME?upgradeable'>
   2.254 +				`gettext "Check upgrade"`</a>
   2.255  			<a class="button" href='$SCRIPT_NAME?list'>
   2.256  				<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.257  		</p>
   2.258 @@ -318,20 +290,39 @@
   2.259  <pre>
   2.260  EOT
   2.261  		tazpkg recharge | filter_tazpkg_msgs
   2.262 -		echo '</pre>'
   2.263 -		echo '<p>'
   2.264 -		gettext "Packages lists are up-to-date"
   2.265 -		echo '</p>' ;;
   2.266 +		cat << EOT
   2.267 +</pre>
   2.268 +<p>
   2.269 +	`gettext "Packages lists are up-to-date. You should check for upgrade now."`
   2.270 +</p>
   2.271 +EOT
   2.272 +		;;
   2.273  	upgradeable*)
   2.274 +		#
   2.275 +		# Ugrade packages
   2.276 +		#
   2.277  		cd $LOCALSTATE
   2.278  		search_form
   2.279  		sidebar
   2.280 +		LOADING_MSG="Checking for upgrade..."
   2.281 +		loading_msg
   2.282  		cat << EOT
   2.283  <h2>`gettext "Upgradeable packages"`</h2>
   2.284  <form method="get" action="$SCRIPT_NAME">
   2.285  <div id="actions">
   2.286 +<div class="float-left">
   2.287 +	`gettext "Selection:"`
   2.288 +	<input type="submit" name="do" value="Install" />
   2.289 +	<input type="submit" name="do" value="Remove" />
   2.290 +	<a href="`cat $PANEL/lib/checkbox.js`">`gettext "Toogle all"`</a>
   2.291 +</div>
   2.292 +<div class="float-right">
   2.293 +	`gettext "List:"`
   2.294 +	<input type="submit" name="recharge" value="Recharge" />
   2.295 +	<a class="button" href='$SCRIPT_NAME?list'>
   2.296 +		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.297 +</div>
   2.298  EOT
   2.299 -		list_up_actions
   2.300  		tazpkg upgradeable
   2.301  		echo '</div>'
   2.302  		table_start
   2.303 @@ -341,10 +332,11 @@
   2.304  			grep "^$pkg |" $LOCALSTATE/packages.desc | parse_packages_desc
   2.305  		done
   2.306  		table_end
   2.307 -		list_up_actions
   2.308  		echo '</form>' ;;
   2.309  	do=*)
   2.310 +		#
   2.311  		# Do an action on one or some packages
   2.312 +		#
   2.313  		cmdline=`echo ${QUERY_STRING#do=} | sed s'/&/ /g'`		
   2.314  		cmd=`echo ${cmdline} | awk '{print $1}'`		
   2.315  		pkgs=`echo $cmdline | sed -e s'/+/ /g' -e s'/pkg=//g' -e s/$cmd//`
   2.316 @@ -356,13 +348,15 @@
   2.317  		esac
   2.318  		search_form
   2.319  		sidebar
   2.320 +		LOADING_MSG="${cmd}ing packages..."
   2.321 +		loading_msg
   2.322  		cat << EOT
   2.323  <h2>Tazpkg: $cmd</h2>
   2.324  <form method="get" action="$SCRIPT_NAME">
   2.325  <div id="actions">
   2.326  	<div class="float-left">
   2.327  		<p>
   2.328 -			`gettext "Performing task on packages... please wait"`
   2.329 +			`gettext "Performing task on packages"`
   2.330  		</p>
   2.331  	</div>
   2.332  	<div class="float-right">
   2.333 @@ -373,16 +367,19 @@
   2.334  	</div>
   2.335  </div>
   2.336  EOT
   2.337 -		echo '<pre class="pre-main">'
   2.338 +		echo '<div class="box">'
   2.339  		gettext "Executing $cmd for:$pkgs"
   2.340 -		echo '</pre>'
   2.341 +		echo '</div>'
   2.342  		for pkg in $pkgs
   2.343  		do
   2.344  			echo '<pre>'
   2.345 -			echo 'y' | tazpkg $cmd $pkg $opt 2>/dev/null | filter_tazpkg_msgs
   2.346 +			echo 'o' | tazpkg $cmd $pkg $opt 2>/dev/null | filter_tazpkg_msgs
   2.347  			echo '</pre>'
   2.348  		done ;;
   2.349  	info=*)
   2.350 +		#
   2.351 +		# Packages info
   2.352 +		#
   2.353  		pkg=${QUERY_STRING#*=}
   2.354  		search_form
   2.355  		sidebar
   2.356 @@ -422,7 +419,9 @@
   2.357  EOT
   2.358  		;;
   2.359  	config*)
   2.360 +		#
   2.361  		# Tazpkg configuration page
   2.362 +		#
   2.363  		cmd=${QUERY_STRING#*=}
   2.364  		case "$cmd" in
   2.365  			clean)
   2.366 @@ -477,23 +476,22 @@
   2.367  		cat << EOT
   2.368  <h2>`gettext "Summary"`</h2>
   2.369  <div id="actions">
   2.370 -	`gettext "Overview of all installed and mirrored packages"`
   2.371 +	<a class="button" href='$SCRIPT_NAME?list'>
   2.372 +		<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.373 +	<a class="button" href='$SCRIPT_NAME?recharge'>
   2.374 +		<img src="$IMAGES/recharge.png" />`gettext "Recharge list"`</a>
   2.375 +	<a class="button" href='$SCRIPT_NAME?upgradeable'>
   2.376 +		<img src="$IMAGES/update.png" />`gettext "Check upgrade"`</a>
   2.377 +	<a class="button" href='$SCRIPT_NAME?config'>
   2.378 +		<img src="$IMAGES/edit.png" />`gettext "Configuration"`</a>	
   2.379  </div>
   2.380  <pre class="pre-main">
   2.381  `packages_summary`
   2.382  </pre>
   2.383 -<a class="button" href='$SCRIPT_NAME?list'>
   2.384 -	<img src="$IMAGES/tazpkg.png" />`gettext "My packages"`</a>
   2.385 -<a class="button" href='$SCRIPT_NAME?recharge'>
   2.386 -	<img src="$IMAGES/recharge.png" />`gettext "Recharge list"`</a>
   2.387 -<a class="button" href='$SCRIPT_NAME?upgradeable'>
   2.388 -	<img src="$IMAGES/update.png" />`gettext "Check upgrade"`</a>
   2.389 -<a class="button" href='$SCRIPT_NAME?config'>
   2.390 -	<img src="$IMAGES/edit.png" />`gettext "Configuration"`</a>
   2.391  
   2.392  <h3>`gettext "Latest log entries"`</h3>
   2.393  <pre>
   2.394 -`tail -n 6 /var/log/tazpkg.log | fgrep "-" | \
   2.395 +`tail -n 5 /var/log/tazpkg.log | fgrep "-" | \
   2.396  	awk '{print $1, $2, $3, $4, $5, $6, $7}'`
   2.397  </pre>
   2.398  
     3.1 --- a/styles/default/header.html	Fri Apr 08 01:17:37 2011 +0200
     3.2 +++ b/styles/default/header.html	Fri Apr 08 03:26:38 2011 +0200
     3.3 @@ -5,16 +5,10 @@
     3.4  	<meta charset="utf-8" />
     3.5  	<link rel="shortcut icon" href="/styles/default/favicon.ico" />
     3.6  	<link rel="stylesheet" type="text/css" href="/styles/default/style.css" />
     3.7 -	<!--
     3.8 -		This function will hide the the loading message when page is fully
     3.9 -		loaded. We use div id="loading", function in <head> and body onload=
    3.10 -	-->
    3.11 +	<!-- Function to hide the loading message when page is generated. -->
    3.12  	<script type="text/javascript">
    3.13  		function showLoading(){
    3.14 -			//hide loading status...
    3.15  			document.getElementById("loading").style.display='none';
    3.16 -			
    3.17 -			document.getElementById("content").style.display='block';
    3.18  		}
    3.19  	</script>
    3.20  </head>
     4.1 --- a/styles/default/style.css	Fri Apr 08 01:17:37 2011 +0200
     4.2 +++ b/styles/default/style.css	Fri Apr 08 03:26:38 2011 +0200
     4.3 @@ -25,15 +25,6 @@
     4.4  a { text-decoration: none; color: #666; }
     4.5  a:hover { color: #000; }
     4.6  
     4.7 -#loading {
     4.8 -  /* font-weight: bold; */
     4.9 -  color: #666;
    4.10 -  position: fixed;
    4.11 -  top: 92px;
    4.12 -  right: 80px;
    4.13 -  width: 200px;
    4.14 -}
    4.15 -
    4.16  /* Header and main title */
    4.17  
    4.18  #header {
    4.19 @@ -49,7 +40,7 @@
    4.20  	left: 0;
    4.21  	height: 24px;
    4.22  	width: 100%;
    4.23 -	padding: 0 0 0 0;
    4.24 +	padding: 0;
    4.25  	background-color: #f1efeb;
    4.26  	border-bottom: 1px solid #c1baad;
    4.27  	z-index: 200;
    4.28 @@ -63,7 +54,18 @@
    4.29  #icons { margin: 2px 8px; float: right; }
    4.30  #icons img { padding: 0; }
    4.31  
    4.32 -.progress { cursor: progress; }
    4.33 +#loading {
    4.34 +  /* font-weight: bold; */
    4.35 +  background-color: #f8f8f8;
    4.36 +  border: 1px solid #ddd;
    4.37 +  color: #666;
    4.38 +  cursor: progress;
    4.39 +  position: fixed;
    4.40 +  top: 92px;
    4.41 +  right: 40px;
    4.42 +  width: 248px;
    4.43 +  padding: 4px 4px 2px;
    4.44 +}
    4.45  
    4.46  /* Blocks */
    4.47  
    4.48 @@ -128,6 +130,7 @@
    4.49  	padding: 4px;
    4.50  	height: 17px;
    4.51  	margin: 0;
    4.52 +	width: 190px;
    4.53  	border-top-left-radius: 4px;
    4.54  	border-bottom-left-radius: 4px;
    4.55  }
    4.56 @@ -146,11 +149,11 @@
    4.57  
    4.58  .debug {
    4.59  	position: fixed;
    4.60 -	top: 20px;
    4.61 -	left: 5px;
    4.62 +	bottom: 0px;
    4.63 +	left: 0px;
    4.64 +	margin: 10px 20px;
    4.65  	padding: 6px 20px;
    4.66 -	background-color: #f8f8f8;
    4.67 -	border: 1px solid #ddd;
    4.68 +	background-color: #e64a00;
    4.69  }
    4.70  
    4.71  .float-left { float: left;  }
    4.72 @@ -210,7 +213,7 @@
    4.73  
    4.74  /* Round corner */
    4.75  
    4.76 -table, pre, input[type=submit], .debug, .box,
    4.77 +#loading, table, pre, input[type=submit], .debug, .box,
    4.78  .button, div.scroll {
    4.79  	/*-moz-border-radius: 4px;
    4.80  	-webkit-border-radius: 4px; */
     5.1 --- a/tazpanel.conf	Fri Apr 08 01:17:37 2011 +0200
     5.2 +++ b/tazpanel.conf	Fri Apr 08 03:26:38 2011 +0200
     5.3 @@ -17,7 +17,7 @@
     5.4  XTERM_OPTS="-geometry 80x16-0+24 -bg black -fg white"
     5.5  
     5.6  # Generic page loading message
     5.7 -LOADING_MSG="Loading... please wait"
     5.8 +LOADING_MSG="Loading..."
     5.9  
    5.10  # Busybox HTTP deamon config
    5.11  HTTPD_CONF="/etc/slitaz/httpd.conf"