← Back to team overview

dhis2-devs team mailing list archive

[Branch ~dhis2-devs-core/dhis2/trunk] Rev 17984: Dashboard. Support for double with per item. Resizes appropriately with browser width.

 

------------------------------------------------------------
revno: 17984
committer: Lars Helge Overland <larshelge@xxxxxxxxx>
branch nick: dhis2
timestamp: Wed 2015-01-14 13:50:26 +0100
message:
  Dashboard. Support for double with per item. Resizes appropriately with browser width.
modified:
  dhis-2/dhis-api/src/main/java/org/hisp/dhis/dashboard/DashboardItem.java
  dhis-2/dhis-services/dhis-service-core/src/main/java/org/hisp/dhis/startup/TableAlteror.java
  dhis-2/dhis-web/dhis-web-dashboard-integration/src/main/webapp/dhis-web-dashboard-integration/javascript/dashboard.js


--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk

Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-api/src/main/java/org/hisp/dhis/dashboard/DashboardItem.java'
--- dhis-2/dhis-api/src/main/java/org/hisp/dhis/dashboard/DashboardItem.java	2015-01-13 18:53:55 +0000
+++ dhis-2/dhis-api/src/main/java/org/hisp/dhis/dashboard/DashboardItem.java	2015-01-14 12:50:26 +0000
@@ -75,6 +75,7 @@
     public static final String TYPE_MESSAGES = "messages";
 
     public static final String SHAPE_NORMAL = "normal";
+    public static final String SHAPE_DOUBLE_WIDTH = "double_width";
     public static final String SHAPE_FULL_WIDTH = "full_width";
     
     private Chart chart;

=== modified file 'dhis-2/dhis-services/dhis-service-core/src/main/java/org/hisp/dhis/startup/TableAlteror.java'
--- dhis-2/dhis-services/dhis-service-core/src/main/java/org/hisp/dhis/startup/TableAlteror.java	2015-01-09 12:56:12 +0000
+++ dhis-2/dhis-services/dhis-service-core/src/main/java/org/hisp/dhis/startup/TableAlteror.java	2015-01-14 12:50:26 +0000
@@ -784,6 +784,8 @@
         // AttributeValue
         executeSql( "UPDATE attributevalue SET created=now() WHERE created IS NULL" );
         executeSql( "UPDATE attributevalue SET lastupdated=now() WHERE lastupdated IS NULL" );
+        
+        executeSql( "update dashboarditem set shape = 'normal' where shape is null" );
 
         upgradeDataValuesWithAttributeOptionCombo();
         upgradeCompleteDataSetRegistrationsWithAttributeOptionCombo();

=== modified file 'dhis-2/dhis-web/dhis-web-dashboard-integration/src/main/webapp/dhis-web-dashboard-integration/javascript/dashboard.js'
--- dhis-2/dhis-web/dhis-web-dashboard-integration/src/main/webapp/dhis-web-dashboard-integration/javascript/dashboard.js	2015-01-14 12:12:11 +0000
+++ dhis-2/dhis-web/dhis-web-dashboard-integration/src/main/webapp/dhis-web-dashboard-integration/javascript/dashboard.js	2015-01-14 12:50:26 +0000
@@ -27,8 +27,10 @@
 dhis2.db.currentMaxType = [];
 dhis2.db.maxItems = 40;
 dhis2.db.shapeNormal = "normal";
+dhis2.db.shapeDoubleWidth = "double_width";
 dhis2.db.shapeFullWidth = "full_width";
 dhis2.db.widthNormal = 408;
+dhis2.db.widthDouble = 849;
 
 // TODO support table as link and embedded
 // TODO double horizontal size
@@ -40,10 +42,10 @@
 $( document ).ready( function()
 {
 	$( "#interpretationArea" ).autogrow();
-
+	
 	$( document ).click( dhis2.db.hideSearch );
 	
-	$( window ).resize( dhis2.db.drawFullWidthItems );
+	$( window ).resize( dhis2.db.drawWideItems );
 
 	$( "#searchField" ).focus( function() {
 		$( "#searchDiv" ).css( "border-color", "#999" );
@@ -412,47 +414,75 @@
 	return fullWidth;
 }
 
+/**
+ * Toggles size of item. The order is 1) normal 2) double 3) full. 
+ */
 dhis2.db.resizeItem = function( id )
 {
 	$.getJSON( "../api/dashboardItems/" + id, function( item ) {
-				
-		if ( dhis2.db.shapeFullWidth == item.shape ) {
-			var newShape = dhis2.db.shapeNormal;
-			$( "#" + id ).css( "width", dhis2.db.widthNormal + "px" );
-			Ext.get( "plugin-" + id ).viewport.setWidth( dhis2.db.widthNormal );
-		}
-		else {
-			var newShape = dhis2.db.shapeFullWidth,
-				fullWidth = dhis2.db.getFullWidth();
-			$( "#" + id ).css( "width", fullWidth + "px" );
-			Ext.get( "plugin-" + id ).viewport.setWidth( fullWidth );
-		}
-		
-		$.ajax( {
-			url: "../api/dashboardItems/" + id + "/shape/" + newShape,
-			type: "put"
-		} );
+
+		var newShape = dhis2.db.shapeNormal;
+		
+		if ( dhis2.db.shapeDoubleWidth == item.shape ) {
+			newShape = dhis2.db.shapeFullWidth;
+			dhis2.db.setFullItemWidth( id );
+		}	
+	    else if ( dhis2.db.shapeFullWidth == item.shape ) {
+			newShape = dhis2.db.shapeNormal;
+			dhis2.db.setNormalItemWidth( id );
+		}
+	    else {
+	    	newShape = dhis2.db.shapeDoubleWidth;
+	    	dhis2.db.setDoubleItemWidth( id );
+	    }
+		
+		if ( newShape ) {
+			$.ajax( {
+				url: "../api/dashboardItems/" + id + "/shape/" + newShape,
+				type: "put"
+			} );
+		}
 	} );
 }
 
-dhis2.db.drawFullWidthItems = function()
+dhis2.db.setNormalItemWidth = function( id ) {
+	$( "#" + id ).css( "width", dhis2.db.widthNormal + "px" );
+	Ext.get( "plugin-" + id ).viewport.setWidth( dhis2.db.widthNormal );
+}
+
+dhis2.db.setDoubleItemWidth = function( id ) {
+	$( "#" + id ).css( "width", dhis2.db.widthDouble + "px" );
+	Ext.get( "plugin-" + id ).viewport.setWidth( dhis2.db.widthDouble );
+}
+
+dhis2.db.setFullItemWidth = function( id ) {
+	var	fullWidth = dhis2.db.getFullWidth();
+	$( "#" + id ).css( "width", fullWidth + "px" );
+	Ext.get( "plugin-" + id ).viewport.setWidth( fullWidth );
+}
+
+dhis2.db.drawWideItems = function()
 {
 	if ( undefined !== dhis2.db.current() ) {
-		var url = "../api/dashboards/" + dhis2.db.current() + "?fields=dashboardItems[id,shape]";
+		var url = "../api/dashboards/" + dhis2.db.current() + "?fields=dashboardItems[id,shape]",
+			viewPortWidth = $( window ).width();
 		
 		$.getJSON( url, function( dashboard ) {
 			$.each( dashboard.dashboardItems, function( i, item ) {
 				if ( dhis2.db.shapeFullWidth == item.shape ) {
-					var fullWidth = dhis2.db.getFullWidth();
-					$( "#" + item.id ).css( "width", fullWidth + "px" );
-					Ext.get( "plugin-" + item.id ).viewport.setWidth( fullWidth );
+					dhis2.db.setFullItemWidth( item.id );
+				}
+				else if ( viewPortWidth <= dhis2.db.widthDouble && dhis2.db.shapeDoubleWidth == item.shape ) {
+					dhis2.db.setNormalItemWidth( item.id );
+				}
+				else if ( viewPortWidth > dhis2.db.widthDouble && dhis2.db.shapeDoubleWidth == item.shape ) {
+					dhis2.db.setDoubleItemWidth( item.id );			
 				}
 			} );
 		} );
 	}
 }
 
-
 dhis2.db.renderDashboard = function( id )
 {
     var contentHeight = 304,
@@ -487,7 +517,15 @@
 				    return true;
 				}
 
-				var width = ( dhis2.db.shapeFullWidth == dashboardItem.shape ) ? fullWidth : dhis2.db.widthNormal;
+				var width = dhis2.db.widthNormal;
+				
+				if ( dhis2.db.shapeFullWidth == dashboardItem.shape ) {
+					width = fullWidth;
+				}
+				else if ( dhis2.db.shapeDoubleWidth == dashboardItem.shape ) {
+					width = dhis2.db.widthDouble;
+				}
+				
 				var style = "width:" + width + "px";
 				
 				if ( "chart" == dashboardItem.type )