added ribbon count to ribbon status indicator...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

ui (gen4)/css/layout.less

@@ -1394,7 +1394,7 @@ stretching in width... */
 	opacity: 0.6;
 }
 */
-.overlay-info .ribbon-number[base] {
+.overlay-info .ribbon-index[base] {
 	/* NOTE: we are using shadow instead of a border or underline 
 	 	here as we need to control both the uniform shading and
 	 	placement without overcomplicating things when having
@@ -1402,6 +1402,13 @@ stretching in width... */
 	//border-bottom: solid 2px yellow;
 	box-shadow: 0 -2px 0 0 yellow inset;
 }
+.overlay-info .ribbon-count {
+	opacity: 0.3;
+	font-size: small;
+}
+.overlay-info .ribbon-count:before {
+	content: "/";
+}
 
 /* changes */
 .overlay-info .changes {

ui (gen4)/features/ui-status.js

@@ -187,25 +187,36 @@ var StatusBarActions = actions.Actions({
 			var n = (this.data && this.data.ribbon_order.length > 0) ? 
 				this.data.getRibbonOrder(gid || this.current) 
 				: '-'
+			var t = this.data ? this.data.ribbon_order.length : null
 
 			// make an element...
 			if(typeof(item) == typeof('str')){
 				item = $('<span>')
-					.addClass('ribbon-number')
-					.attr('info', 'Current ribbon (click to edit)')
-					.makeEditable()
-					.on('edit-done', function(_, text){
-						that.focusRibbon(text == '*' ? that.base : parseInt(text))
-					})
-					.focus(function(){
-						$(this).selectText()
-					})
-					.blur(function(){
-						that.updateStatusBar()
-					})
+					.addClass('ribbon-index')
+					.append($('<span>')
+						.addClass('ribbon-number')
+						.attr('info', 'Current ribbon (click to edit)')
+						.makeEditable()
+						.on('edit-done', function(_, text){
+							that.focusRibbon(text == '*' ? that.base : parseInt(text))
+						})
+						.focus(function(){
+							$(this).selectText()
+						})
+						.blur(function(){
+							that.updateStatusBar()
+						}))
+					.append($('<span>')
+						.addClass('ribbon-count')
+						.attr('info', 'Number of ribbons'))
 			}
 
-			item.html(n) 
+			item
+				.find('.ribbon-number')
+					.html(n) 
+					.end()
+				.find('.ribbon-count')
+					.html(t || '') 
 
 			// flag the base ribbon...
 			// NOTE: for some reason can't get jQuery .prop(..)/.removeProp(..)

ui (gen4)/ui.js

@@ -113,6 +113,7 @@ $(function(){
 				'experiments',
 
 				//'-commandline',
+				//'-ui-partial-ribbons',
 
 				// XXX BUG: disabling features on this level does not 
 				// 		work, yet works deeper down...