From 086dc6d806c2a806eec44f878ad3111967a1e75d Mon Sep 17 00:00:00 2001
From: Ghazi Triki <ghazi.triki@speakserve.com>
Date: Tue, 3 Sep 2013 08:13:37 +0100
Subject: [PATCH] Improving performances by removing Spacer component when
 possible, replacing them by style values and replacing boxes containers by
 canvases.

---
 .../main/views/CameraDisplaySettings.mxml     | 10 +----
 .../bigbluebutton/main/views/MicSettings.mxml | 36 +++++------------
 .../chat/views/ChatMessageRenderer.mxml       | 16 +++-----
 .../modules/notes/views/NoteRenderer.mxml     |  7 ++--
 .../present/ui/views/FileUploadWindow.mxml    | 40 ++++++-------------
 .../modules/users/views/UsersWindow.mxml      |  1 -
 6 files changed, 33 insertions(+), 77 deletions(-)

diff --git a/bigbluebutton-client/src/org/bigbluebutton/main/views/CameraDisplaySettings.mxml b/bigbluebutton-client/src/org/bigbluebutton/main/views/CameraDisplaySettings.mxml
index 9cad4d279e..986a00944b 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/main/views/CameraDisplaySettings.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/main/views/CameraDisplaySettings.mxml
@@ -305,33 +305,27 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
     
 		<view:VideoHolder id="_videoHolder" width="100%" height="75%" />
         
-		<mx:HBox width="100%" height="10%" horizontalAlign="center"> 	
+		<mx:HBox width="100%" height="10%" horizontalAlign="center" horizontalGap="13" paddingRight="5"> 	
 			<mx:Button id="changeCamera" styleName="cameraDisplaySettingsWindowChangeCamBtn" 
 					   label="{ResourceUtil.getInstance().getString('bbb.publishVideo.changeCameraBtn.labelText')}" 
 					   toolTip="{ResourceUtil.getInstance().getString('bbb.publishVideo.changeCameraBtn.toolTip')}" 
 					   click="showCameraSettings()" tabIndex="{baseIndex+1}"/>
-      <mx:Spacer width="5"/>
 			<mx:ComboBox id="cmbResolution" styleName="cameraDisplaySettingsWindowChangeResolutionCombo" 
 						 dataProvider="{resolutions}" visible="false" change="updateCamera()" tabIndex="{baseIndex+2}"
                          toolTip="{ResourceUtil.getInstance().getString('bbb.publishVideo.cmbResolution.tooltip')}" height="30" />
-			<mx:Spacer width="5"/>
     </mx:HBox>
     
     <mx:HRule width="100%"/>
-    <mx:Spacer height="1"/>
     
-    <mx:HBox width="100%" height="10%" horizontalAlign="right">
+    <mx:HBox width="100%" height="10%" horizontalAlign="right" horizontalGap="13" paddingRight="5" paddingBottom="5" paddingTop="1">
       <mx:Button id="btnStartPublish" toolTip="{ResourceUtil.getInstance().getString('bbb.publishVideo.startPublishBtn.toolTip')}" 
                  click="startPublishing()" enabled="true" styleName="cameraDisplaySettingsWindowStartBtn" 
                  label="{ResourceUtil.getInstance().getString('bbb.publishVideo.startPublishBtn.labelText')}" tabIndex="{baseIndex+3}"  />
-      <mx:Spacer width="5"/>
       <mx:Button id="btnClosePublish"   
                  click="onCancelClicked()" 
                  enabled="true" tabIndex="{baseIndex+4}"
                  label="{ResourceUtil.getInstance().getString('bbb.video.publish.closeBtn.label')}"
                  accessibilityName="{ResourceUtil.getInstance().getString('bbb.video.publish.closeBtn.accessName')}"/>
-      <mx:Spacer width="5"/>
     </mx:HBox>
-    <mx:Spacer height="5"/>
 	</mx:VBox>		
 </mx:TitleWindow>
\ No newline at end of file
diff --git a/bigbluebutton-client/src/org/bigbluebutton/main/views/MicSettings.mxml b/bigbluebutton-client/src/org/bigbluebutton/main/views/MicSettings.mxml
index 0321ad2bfc..a2aacb2197 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/main/views/MicSettings.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/main/views/MicSettings.mxml
@@ -182,29 +182,22 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
 	</mx:Script>
 	<mx:VBox width="100%" height="100%"  paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5">
     
-		<mx:HBox width="100%">
+		<mx:Canvas width="100%">
 			<!-- mx:Label text="Audio Settings" styleName="micSettingsWindowTitleStyle"/ -->
 			<mx:TextArea borderSkin="{null}" editable="false" text="{ResourceUtil.getInstance().getString('bbb.users.settings.audioSettings')}" styleName="micSettingsWindowTitleStyle"
-                         tabIndex="{baseIndex}" width="400"/>
+                         tabIndex="{baseIndex}" width="400" left="0"/>
 						 <!-- accessibilityName="{ResourceUtil.getInstance().getString('bbb.micSettings.access.title')} "/ -->
-			<mx:Spacer width="100%"/>
             <mx:LinkButton fontSize="10" toolTip="{ResourceUtil.getInstance().getString('bbb.mainToolbar.helpBtn')}" 
-                           styleName="micSettingsWindowHelpButtonStyle"
+                           styleName="micSettingsWindowHelpButtonStyle" right="0"
                            click="onHelpButtonClicked()"
                            tabIndex="{baseIndex+1}"
                            accessibilityName="{ResourceUtil.getInstance().getString('bbb.micSettings.access.helpButton')}"/>
-		</mx:HBox>
+		</mx:Canvas>
     
-        <mx:HBox width="100%">
-            <mx:VBox width="100%">
-                <mx:Spacer height="5"/>
-                <mx:HRule width="100%"/>
-                <mx:HBox width="100%">
-                    <mx:Label id="testMicLabel" text="{ResourceUtil.getInstance().getString('bbb.micSettings.microphone.header')}" styleName="micSettingsWindowTestMicrophoneLabelStyle" tabIndex="{baseIndex+2}"/>
-                    <mx:Spacer width="100%"/>
-                </mx:HBox>
-            </mx:VBox>   
-        </mx:HBox>
+        <mx:VBox width="100%" paddingTop="5">
+            <mx:HRule width="100%"/>
+            <mx:Label id="testMicLabel" text="{ResourceUtil.getInstance().getString('bbb.micSettings.microphone.header')}" styleName="micSettingsWindowTestMicrophoneLabelStyle" width="100%" tabIndex="{baseIndex+2}"/>
+        </mx:VBox>   
         
         <mx:HBox width="100%">      
             <mx:Text width="100%" text="{ResourceUtil.getInstance().getString('bbb.micSettings.speakIntoMic')}"
@@ -215,14 +208,7 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
                        toolTip="{ResourceUtil.getInstance().getString('bbb.micSettings.changeMic.toolTip')}"/>		
         </mx:HBox>
         
-        <mx:HBox width="100%">
-            <mx:VBox width="100%">
-                <mx:Spacer height="5"/>
-                <mx:HBox width="100%">
-                    <mx:Label id="testSpeakersLabel" text="{ResourceUtil.getInstance().getString('bbb.micSettings.speakers.header')}" styleName="micSettingsWindowTestSpeakersLabelStyle" tabIndex="{baseIndex+5}"/>
-                </mx:HBox>
-            </mx:VBox> 
-        </mx:HBox>
+        <mx:Label id="testSpeakersLabel" text="{ResourceUtil.getInstance().getString('bbb.micSettings.speakers.header')}" styleName="micSettingsWindowTestSpeakersLabelStyle" paddingTop="5" tabIndex="{baseIndex+5}"/>
         
         <mx:HBox width="100%">
             <mx:Text width="100%" text="{ResourceUtil.getInstance().getString('bbb.micSettings.hearFromHeadset')}"
@@ -235,12 +221,10 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
         
     <mx:HRule width="100%"/>
     <mx:Spacer height="20"/>
-		<mx:HBox width="100%">
-			<mx:Spacer width="80%"/>
+		<mx:HBox width="100%" horizontalAlign="right" horizontalGap="18">
 			<mx:Button id="okBtn" label="{ResourceUtil.getInstance().getString('bbb.micSettings.join')}" 
 					   styleName="micSettingsWindowJoinButtonStyle"
 					   click="onJoinClicked()" tabIndex="{baseIndex+8}"/>
-			<mx:Spacer width="10"/>
 			<mx:Button id="cancelBtn" label="{ResourceUtil.getInstance().getString('bbb.micSettings.cancel')}" 
 					   styleName="micSettingsWindowCancelButtonStyle"
 					   click="onCancelClicked()" tabIndex="{baseIndex+9}"
diff --git a/bigbluebutton-client/src/org/bigbluebutton/modules/chat/views/ChatMessageRenderer.mxml b/bigbluebutton-client/src/org/bigbluebutton/modules/chat/views/ChatMessageRenderer.mxml
index 0317e71115..05e267a126 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/modules/chat/views/ChatMessageRenderer.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/modules/chat/views/ChatMessageRenderer.mxml
@@ -107,16 +107,12 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
 		]]>
 	</mx:Script>
 	
-  <mx:HBox width="100%" id="hbHeader">
-    <mx:Label id="lblName" text="{data.name} " visible="true" color="gray" width="100%" textAlign="left"/>
-    <mx:Spacer width="100%"/>
+  <mx:Canvas width="100%" id="hbHeader">
+    <mx:Label id="lblName" text="{data.name} " visible="true" color="gray" width="100%" textAlign="left" left="0"/>
     <mx:Text id="lblTime" htmlText="{data.translateLocale} {data.time}" textAlign="right"
              visible="true" 
-             color="gray"  width="100%"/>       
-  </mx:HBox>
-  <mx:HBox width="100%">
-    <mx:Spacer width="5"/>
-    <mx:Text id="txtMessage" htmlText="{rolledOver ? data.senderText : data.translatedText}" link="onLinkClick(event)" color="{data.senderColor}"
-             rollOver="onRollOver()" rollOut="onRollOut()" width="100%" selectable="true"/>
-  </mx:HBox>  
+             color="gray" right="0" width="100%"/>       
+  </mx:Canvas>
+  <mx:Text id="txtMessage" htmlText="{rolledOver ? data.senderText : data.translatedText}" link="onLinkClick(event)" color="{data.senderColor}"
+           rollOver="onRollOver()" rollOut="onRollOut()" paddingLeft="5" width="100%" selectable="true"/>
 </mx:VBox>
diff --git a/bigbluebutton-client/src/org/bigbluebutton/modules/notes/views/NoteRenderer.mxml b/bigbluebutton-client/src/org/bigbluebutton/modules/notes/views/NoteRenderer.mxml
index 2c73f9ff79..1ddc9d4dcc 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/modules/notes/views/NoteRenderer.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/modules/notes/views/NoteRenderer.mxml
@@ -63,10 +63,9 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
 	</mx:Script>
 	
   <mx:HBox width="100%" height="15" styleName="noteRendererTimestampStyle">
-    <mx:Text id="timestamp" htmlText="{note.timestamp}" textAlign="right" color="gray"  width="100%"/>      
+    <mx:Text id="timestamp" htmlText="{note.timestamp}" textAlign="right" color="gray" width="100%"/>      
   </mx:HBox> 
-  <mx:HBox width="100%" styleName="noteRendererTextStyle">
-    <mx:Spacer width="5"/>
-    <mx:Text id="lblTime" htmlText="{note.note}" textAlign="left" color="gray"  width="100%"/>       
+  <mx:HBox width="100%" styleName="noteRendererTextStyle" paddingLeft="5">
+    <mx:Text id="lblTime" htmlText="{note.note}" textAlign="left" color="gray" width="100%"/>       
   </mx:HBox> 
 </mx:VBox>
diff --git a/bigbluebutton-client/src/org/bigbluebutton/modules/present/ui/views/FileUploadWindow.mxml b/bigbluebutton-client/src/org/bigbluebutton/modules/present/ui/views/FileUploadWindow.mxml
index e618dd1d2a..abf7cb6f65 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/modules/present/ui/views/FileUploadWindow.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/modules/present/ui/views/FileUploadWindow.mxml
@@ -271,27 +271,20 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
   </mx:Script>
 
   <mx:VBox width="100%" height="100%">
-    <mx:Label text="{ResourceUtil.getInstance().getString('bbb.fileupload.title')}" styleName="presentationUploadTitleStyle"/>
-    <mx:Spacer height="10"/>
-    <mx:HBox width="100%">
-      <mx:Spacer height="5"/>
+    <mx:Label text="{ResourceUtil.getInstance().getString('bbb.fileupload.title')}" styleName="presentationUploadTitleStyle" paddingBottom="12"/>
+    <mx:HBox width="100%" paddingTop="5">
       <mx:Label id="fileLbl" text="{ResourceUtil.getInstance().getString('bbb.fileupload.fileLbl')}" styleName="presentationUploadChooseFileLabelStyle"/>
-      <mx:Spacer width="100%"/>
     </mx:HBox>
-    <mx:Spacer height="5"/>
-    <mx:HBox width="100%"> 
-      <mx:Spacer width="5"/>
+    <mx:HBox width="100%" paddingLeft="5" paddingTop="5"> 
       <mx:TextInput id="fileTxtInput" width="328" editable="false"/>
-		<mx:Button label="{ResourceUtil.getInstance().getString('bbb.fileupload.selectBtn.label')}" id="selectBtn" 
+	  <mx:Button label="{ResourceUtil.getInstance().getString('bbb.fileupload.selectBtn.label')}" id="selectBtn" 
 				   toolTip="{ResourceUtil.getInstance().getString('bbb.fileupload.selectBtn.toolTip')}" 
 				   click="selectFile()" styleName="presentationUploadChooseFileButtonStyle"/>
       <mx:Button id="uploadBtn" label="{ResourceUtil.getInstance().getString('bbb.fileupload.uploadBtn')}" 
                  toolTip="{ResourceUtil.getInstance().getString('bbb.fileupload.uploadBtn.toolTip')}"  click="startUpload()"
                  enabled="false" icon="{bulletGoIcon}"/>
     </mx:HBox>
-    <mx:Spacer height="5"/>
-    <mx:HBox width="100%">
-      <mx:Spacer width="10"/>
+    <mx:HBox width="100%" paddingLeft="10" paddingTop="5" paddingBottom="10">
       <mx:Label id="progBarLbl" text="{ResourceUtil.getInstance().getString('bbb.fileupload.progBarLbl')}" 
                 styleName="presentationUploadProgressBarLabelStyle"
                 visible="false"/>
@@ -299,28 +292,19 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
                       styleName="presentationUploadProgressBarStyle"
                       labelPlacement="center" width="460" visible="false"/>      
     </mx:HBox>
-    <mx:Spacer height="10"/>
-    <mx:HBox width="100%">
-      <mx:Spacer width="5"/>
-      <mx:Label id="presentationNamesLb" text="{ResourceUtil.getInstance().getString('bbb.fileupload.presentationNamesLbl')}" styleName="presentationNamesLabelStyle"/>
-    </mx:HBox>  
-    <mx:Spacer height="5"/>
-    <mx:HBox width="90%" height="100">
-      <mx:Spacer width="10"/>
-      <mx:List id="presentationNamesList" width="90%" height="100" alternatingItemColors="[#EFEFEF, #FEFEFE]" allowMultipleSelection="false"
+    <mx:Label id="presentationNamesLb" text="{ResourceUtil.getInstance().getString('bbb.fileupload.presentationNamesLbl')}" styleName="presentationNamesLabelStyle" paddingLeft="5"/>
+    <mx:Canvas width="90%" height="100">
+      <mx:List id="presentationNamesList" width="90%" height="100" left="5" top="5" alternatingItemColors="[#EFEFEF, #FEFEFE]" allowMultipleSelection="false"
                itemRenderer="org.bigbluebutton.modules.present.ui.views.UploadedPresentationRenderer"
                dragEnabled="false" dataProvider="{presentationNamesAC}">
       </mx:List>
-    </mx:HBox>
-    <mx:Spacer height="5"/>
-    <mx:HBox width="100%">
-      <mx:Spacer width="100%"/>
+    </mx:Canvas>
+    <mx:Canvas width="100%">
       <mx:Button id="okCancelBtn" label="{ResourceUtil.getInstance().getString('bbb.fileupload.okCancelBtn')}"
-                 styleName="presentationUploadCancelButtonStyle"
+                 styleName="presentationUploadCancelButtonStyle" right="5" top="5"
                  click="globalDispatch.dispatchEvent(new UploadEvent(UploadEvent.CLOSE_UPLOAD_WINDOW))"
                  toolTip="{ResourceUtil.getInstance().getString('bbb.fileupload.okCancelBtn.toolTip')}"/>
-      <mx:Spacer width="5"/>
-    </mx:HBox>	
+    </mx:Canvas>	
   </mx:VBox>
 
 </mx:TitleWindow> 
diff --git a/bigbluebutton-client/src/org/bigbluebutton/modules/users/views/UsersWindow.mxml b/bigbluebutton-client/src/org/bigbluebutton/modules/users/views/UsersWindow.mxml
index 41129ef15a..270b4e18c7 100755
--- a/bigbluebutton-client/src/org/bigbluebutton/modules/users/views/UsersWindow.mxml
+++ b/bigbluebutton-client/src/org/bigbluebutton/modules/users/views/UsersWindow.mxml
@@ -396,7 +396,6 @@
 					width="30" height="30" toolTip="{ResourceUtil.getInstance().getString('bbb.users.raiseHandBtn.toolTip')}" click="raiseHand()"
 					visible="false" tabIndex="{partOptions.baseTabIndex+15}" />
 		<mx:Label id="roomMutedLbl" text="{ResourceUtil.getInstance().getString('bbb.users.settings.muteAll')}" />
-		<mx:Spacer width="100%"/>
 	</mx:ControlBar>
 	
 </mdi:MDIWindow>