Preferences and event triggers were moved from the dialog into drawer in the window footer.
authorEugene Ostroukhov <eugeneo@symbian.org>
Mon, 21 Jun 2010 15:49:28 -0700
changeset 393 5b968742b729
parent 391 62472296236e
child 394 bd0603d7cbf9
Preferences and event triggers were moved from the dialog into drawer in the window footer.
org.symbian.tools.wrttools.previewer/preview/css/style.css
org.symbian.tools.wrttools.previewer/preview/images/console-close-icon.png
org.symbian.tools.wrttools.previewer/preview/images/console-close-icon_bkup.png
org.symbian.tools.wrttools.previewer/preview/images/console-open-icon.png
org.symbian.tools.wrttools.previewer/preview/script/nokia.js
org.symbian.tools.wrttools.previewer/preview/wrt_preview.html
--- a/org.symbian.tools.wrttools.previewer/preview/css/style.css	Mon Jun 21 11:52:43 2010 -0700
+++ b/org.symbian.tools.wrttools.previewer/preview/css/style.css	Mon Jun 21 15:49:28 2010 -0700
@@ -12,6 +12,13 @@
  * Contributors:
  */
 
+.tabs-bottom { position: relative; } 
+.tabs-bottom .ui-tabs-panel { height: 200px; overflow: auto; } 
+.tabs-bottom .ui-tabs-nav { position: absolute !important; left: 0; bottom: 0; right:0; padding: 0 0.2em 0.2em 0; } 
+.tabs-bottom .ui-tabs-nav li { margin-top: -2px !important; margin-bottom: 1px !important; border-top: none; border-bottom-width: 1px; }
+.ui-tabs-selected { margin-top: -3px !important; }
+
+
 body {
 /*  background-image: url(../images/Gradient0Background.png); */
 	background-image: url(../images/Gradient0Background_2.png);
@@ -332,32 +339,14 @@
 	opacity: 0.9;
 }
 
-div#PreferencesBtn{
-	width: 75px;
-	height: 85px;
-/*  background-image: url(../images/settings-icon.png); */
-	background-image: url(../images/settings_2.png); 
-	position: absolute;
-	top: 10px;
-	left: 10px;
-	background-position: left bottom;
-	cursor: pointer;
-	z-index: 200;
-}
-
-div#PreferencesBtn:hover{
-	background-image: url(../images/settings_1.png);
-	background-position: left top;
-}
-
 div#InspectorBtn{
 	width: 75px;
 	height: 85px;
 	background-image: url(../images/inspector.png); 
 	position: absolute;
 	top: 10px;
-	right: 10px;
-	float: right;
+	left: 10px;
+	float: left;
 	background-position: left bottom;
 	z-index: 200;
 	cursor: pointer;
@@ -670,8 +659,9 @@
 
 #preview-ui-bottom-body{
 	overflow:auto;
-	background-color: #ffffff;
-	display: none;
+	background-color: white;
+	color: black;
+/*	display: none;*/
 }
 
 #preview-ui-bottom-body p{
Binary file org.symbian.tools.wrttools.previewer/preview/images/console-close-icon.png has changed
Binary file org.symbian.tools.wrttools.previewer/preview/images/console-close-icon_bkup.png has changed
Binary file org.symbian.tools.wrttools.previewer/preview/images/console-open-icon.png has changed
--- a/org.symbian.tools.wrttools.previewer/preview/script/nokia.js	Mon Jun 21 11:52:43 2010 -0700
+++ b/org.symbian.tools.wrttools.previewer/preview/script/nokia.js	Mon Jun 21 15:49:28 2010 -0700
@@ -344,9 +344,6 @@
 
 			NOKIA.menu.is_dimmed = true;
 			
-			$("#PreferencesBtn").hide();
-			$("#PreferencesTab").dialog('close');
-			
 		},
 		
 		setLsk : function(func)
@@ -643,11 +640,8 @@
 			NOKIA.menu.createSFKArea();
 			
 			$("#DeviceDisplayLayout").show();
-			$("#PreferencesTab").show();
 			$("#InspectorTab").show();
 			
-			if(!NOKIA.menu.is_dimmed)
-				$("#PreferencesBtn").show();
 			if (/chrome/.test( navigator.userAgent.toLowerCase())) {
 				$("#InspectorBtn").show();
 			}
@@ -983,8 +977,6 @@
 				$("#loaderDiv").show();
 				$("#loaderDiv")[0].className = 'green';
 				
-				$("#PreferencesTab").dialog('close');
-				
 				window.setTimeout(function(){
 					document.location = document.location;
 				}, 3000);
@@ -1001,26 +993,7 @@
 
 		addListeners : function()
 		{
-			/*
-			 * Render Emulator for Interaction
-			 */
-			NOKIA.helper.prefDailog = $("#PreferencesTab").dialog({
-					width: 550,	minWidth: 550, minHeight: 350, height: 350, autoOpen: false, position : top, title : '&nbsp;',
-					buttons : {
-						Close : function(){
-							$("#PreferencesTab").dialog('close');
-
-							//	Hack for Mac firefox
-							if(/Mac/i.test(navigator.userAgent))
-							{
-								$("#WidgetArea iframe").css({overflow:'auto'});
-							}
-							
-							//	select index : 0 tab selected
-							$('#tabs').tabs( 'select' , 0);
-						}
-					}
-				});
+			NOKIA.helper.loadPreferences();
 			/*
 			 * Render Emulator for Interaction
 			 */
@@ -1035,17 +1008,6 @@
 			}}
 			});
 				
-			$('#PreferencesBtn').click(function(){
-				//	Load preferences
-				NOKIA.helper.loadPreferences();
-				$('#PreferencesTab').dialog('open');
-
-				//	Hack for Mac firefox
-				if(/Mac/i.test(navigator.userAgent))
-				{
-					$("#WidgetArea iframe").css({overflow:'hidden'});
-				}
-			});
 			$('#InspectorBtn').click(function(){
 				$('#InspectorTab').dialog('open');
 				//	Hack for Mac firefox
@@ -1099,8 +1061,6 @@
 
 
 			$("#iframeMask").click(function(){
-
-				$("#PreferencesBtn").show();
 				$("#orientationIcon").hide();
 				$("#iframeMask").hide();
 				$("#loaderDiv").hide();
@@ -1152,7 +1112,9 @@
 //					
 //				}}
 			});
-
+			$(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *") 
+	 			.removeClass("ui-corner-all ui-corner-top") 
+	 			.addClass("ui-corner-bottom");
 			
 			/*	
 			 * 	Event triggering
@@ -1274,9 +1236,7 @@
 
 						$("#iframeMask").show();
 						$("#orientationIcon").show();
-						$("#PreferencesBtn").hide();
 
-						$("#PreferencesTab").dialog('close');
 						return true;
 					}
 				}
@@ -1386,8 +1346,9 @@
 	NOKIA.layout = {
 		_console_minimized : true,
 		_console_enabled : false,
-		_consoleWindowHeight : 200,
+		_consoleWindowHeight : 290,
 		_consoleHeaderHeight : 31,
+		_tabHeight : 27,
 
 		init : function(){
 			
@@ -1455,10 +1416,17 @@
 					height: NOKIA.layout._consoleHeaderHeight + 'px'
 				});
 
-				$('#preview-ui-bottom-body').css({
+				$('#tabs').css({
 					height: parseInt(NOKIA.layout._consoleWindowHeight - NOKIA.layout._consoleHeaderHeight) + 'px',
 					display : 'block'
 				});
+				$('#console').css({
+					height : parseInt(NOKIA.layout._consoleWindowHeight
+									- NOKIA.layout._consoleHeaderHeight
+									- NOKIA.layout._tabHeight * 2)
+									+ 'px',
+					display : 'block'
+				});
 				
 				// Auto scroll when console window opened from MINIMIZED => MAXIMIZED state
 				window.setTimeout(function(){
@@ -1483,10 +1451,10 @@
 					height: NOKIA.layout._consoleHeaderHeight + 'px',
 					display : 'block'
 				});
-
-				$('#preview-ui-bottom-body').css({
-					display : 'none'
-				});
+// TODO
+//				$('#preview-ui-bottom-body').css({
+//					display : 'none'
+//				});
 			}
 		}
 		
--- a/org.symbian.tools.wrttools.previewer/preview/wrt_preview.html	Mon Jun 21 11:52:43 2010 -0700
+++ b/org.symbian.tools.wrttools.previewer/preview/wrt_preview.html	Mon Jun 21 15:49:28 2010 -0700
@@ -62,14 +62,32 @@
 				</div>
 			</div>
 		<div id="Dialog" title="Notification window"></div>
-	<div id="PreferencesTab" class="hide">
-	<div id="tabs">
-		<ul>
+	<div id="InspectorTab" class="hide">
+		<div>To open Web Inspector you need to:
+			<ol>
+				<li>Disconnect debugger from Chrome browser.</li>
+				<li>Press <span id="UniversalShortcut" class="shortcut">Ctrl+Shift+I</span><span id="MacShortcut" class="shortcut">Command+Option+I</span> to open inspector.</li>
+			</ol>
+		</div>
+	</div>
+	</div>
+	<div id="preview-ui-bottom">
+		<div id="preview-ui-bottom-header">
+			<div>Simulation Controls</div>
+			<span class="open" id="Console-Toggle-Button"></span>
+		</div>
+		<div id="tabs" class="tabs-bottom">
+		<ul id="tabs-header">
+			<li><a href="#console">Console</a></li>
 			<li><a href="#event-battery-info">Battery</a></li>
-			<li><a href="#event-messaging-info">Message</a></li>
-			<li><a href="#event-memory-info">Memory</a></li>
+			<li><a href="#event-messaging-info">Events</a></li>
 			<li><a href="#settings-view">Preferences</a></li>
 		</ul>
+		<div id="console" class="hide" style="height: 100%">
+			<span id="Console-Clear-Button"></span>
+			<div style="clear:left;"></div>
+			<div id="preview-ui-bottom-body" style="height: 100%"></div>
+		</div>
 		<div id="event-battery-info" class="hide">
 			<table cellpadding='0' cellspacing='0' width="100%">
 				<tr>
@@ -97,10 +115,6 @@
 						<a class="ui-button-fixed" id="send-mms">Trigger new MMS</a>
 					</td>
 				</tr>
-			</table>
-		</div>
-		<div id="event-memory-info" class="hide">
-			<table cellpadding='0' cellspacing='0' width="100%">
 				<tr>
 					<th>Memory Card</th>
 					<td>
@@ -133,7 +147,6 @@
 				</tr>
 			</table>
 		</div>
-	
 		<div id="mini-view-info" class="hide">
 			<div class="ui-panel">
 				<a class="ui-button" id="mini-view-back">Back</a>
@@ -153,25 +166,6 @@
 				</tr>
 			</table>
 		</div>
-	</div>
-</div>
-	<div id="InspectorTab" class="hide">
-		<div>To open Web Inspector you need to:
-			<ol>
-				<li>Disconnect debugger from Chrome browser.</li>
-				<li>Press <span id="UniversalShortcut" class="shortcut">Ctrl+Shift+I</span><span id="MacShortcut" class="shortcut">Command+Option+I</span> to open inspector.</li>
-			</ol>
-		</div>
-	</div>
-	</div>
-	<div id="preview-ui-bottom">
-		<div id="preview-ui-bottom-header">
-			<div>Console window</div>
-			<span class="open" id="Console-Toggle-Button"></span>
-			<span id="Console-Clear-Button"></span>
-		</div>
-		<div style="clear:left;"></div>
-		<div id="preview-ui-bottom-body">
 		</div>
 	</div>
 	<div id="TopToolbar">