Difference between revisions of "Patch Messaging Landscape Orientation"

From WebOS Internals
Jump to navigation Jump to search
Line 76: Line 76:
 
now save and exit your all done
 
now save and exit your all done
  
next would be to fix the chat balloons and the text box size so we get into /stylesheet/messaging.css
+
next would be to fix the chat balloons and the text box size so we get into '''/stylesheet/messaging.css'''
 
once there look for '''.their-chat .message-container''' and '''.my-chat .message-container''' around line 645
 
once there look for '''.their-chat .message-container''' and '''.my-chat .message-container''' around line 645
and change the widths to 95%. should look like this:
+
and change the widths should look like this:
 
<pre>.their-chat .message-container {
 
<pre>.their-chat .message-container {
width: 255px;
+
width: 95%;
 
}
 
}
 
.my-chat .message-container {
 
.my-chat .message-container {
width: 280px;
+
width: 95%;
 
}</pre>
 
}</pre>
 
after that go down to line 820 and look for '''#messageContainer {''' make it so that it looks like this:
 
after that go down to line 820 and look for '''#messageContainer {''' make it so that it looks like this:

Revision as of 13:11, 2 September 2009

Landscape Orientation in Messagin app: /usr/palm/applications/com.palm.app.messaging/

first file we should edit is /app/controllers/compose-assistant.js around line 390 u will see this:

  var ComposeAssistant = Class.create({
   }
 	this.setCharacterCounterMaxLength();
   },

add this code right under it

	orientationChanged: function(orientation) {
		if (orientation === "left" || orientation === "right") {
			this.controller.sceneElement.addClassName('landscape');
		} else {
			this.controller.sceneElement.removeClassName('landscape');
		}
	},

once you are done it should look like this:

var ComposeAssistant = Class.create({
     }
 	this.setCharacterCounterMaxLength();
   },
	
	orientationChanged: function(orientation) {
		if (orientation === "left" || orientation === "right") {
			this.controller.sceneElement.addClassName('landscape');
		} else {
			this.controller.sceneElement.removeClassName('landscape');
		}
	},
   
   cleanup: function() {
     var that = this;

now save and exit. next file we should edit is listview-assistant.js same directory. around line 212 under var ListviewAssistant = Class.create(App e in the line:

this.controller.setupWidget(Mojo.Menu.commandMenu, {}, this.cmdMenuModel);

edit it so that it looks like this then right under it add:

this.controller.setupWidget(Mojo.Menu.commandMenu, undefined, this.cmdMenuModel);
			
	// enable free orientation
	this.controller.window.PalmSystem.setWindowOrientation("free");

should look like:

var ListviewAssistant = Class.create(App
 		items:this.commandMenuModel 
     };  
 	
   this.controller.setupWidget(Mojo.Menu.commandMenu, undefined, this.cmdMenuModel);	
			
	// enable free orientation
	this.controller.window.PalmSystem.setWindowOrientation("free");
 	this.filterField = this.controller.get('filterField');
 	this.buddyListHeader = this.controller.get('buddyListHeader');
     this.controller.setupWidget('filterField',{filterFieldName:'filterFieldElement'},this.filterField);

then around line 409 above handleCommand: function(event) { add :

		
		orientationChanged: function(orientation) {
		if (orientation === "left" || orientation === "right") {
			this.controller.sceneElement.addClassName('landscape');
		} else {
			this.controller.sceneElement.removeClassName('landscape');
		}
	},

this is how it should look like:

 			}			
 		}
 	},
		orientationChanged: function(orientation) {
		if (orientation === "left" || orientation === "right") {
			this.controller.sceneElement.addClassName('landscape');
		} else {
			this.controller.sceneElement.removeClassName('landscape');
		}
	},
 
 	handleCommand: function(event) {
     	// handle menu button command events

now save and exit your all done

next would be to fix the chat balloons and the text box size so we get into /stylesheet/messaging.css once there look for .their-chat .message-container and .my-chat .message-container around line 645 and change the widths should look like this:

.their-chat .message-container {
	width: 95%;
}
.my-chat .message-container {
	width: 95%;
}

after that go down to line 820 and look for #messageContainer { make it so that it looks like this:

#messageContainer {
	position: fixed;
	bottom:0px;
	left:0px;
	width: 100%;
}