Patch Camera Shutter Sound On-Off Button

<<- Return to webOS Patches

Needed to try something to start playing with the Pre, so I decided to add a button to selectively turn on and off the shutter sound in the camera app. All of the normal precautions and methods for modifying the existing apps apply here. I've tested this and it works fine on my phone, but use at your own risk. NOTE: I'm not a great graphic artist, so the buttons are kinda crappy. If someone feels like creating some new ones, please do and post them here. Also, I'm not entirely fond of the button location, but it seemed to fit pretty well...feel free to change the location of the button in your own version.

Here is the .png of the new icons used:

Second set of icons: http://www.statestdesign.com/images/menu-shutter-sound.png

Place this file in: /usr/palm/applications/com.palm.app.camera/images

Diffs of the 3 existing files that need to be modified:

--- /usr/palm/applications/com.palm.app.camera/app/controllers/capture-assistant.js	Tue Jun 16 20:52:18 2009
+++ /Camera - Shutter Sound/capture-assistant.js	Sat Jun 27 15:23:23 2009
@@ -77,6 +77,10 @@
 		this.controller.get('flashButtonState').observe(Mojo.Event.tap, function(){
 			this._handleFlashButton();
 		}.bind(this));
+		
+		this.controller.get('shutterSoundButtonState').observe(Mojo.Event.tap, function(){
+			this._handleShutterSoundButton();
+		}.bind(this));
 
 		this.onKeyPressHandler = this.onKeyPress.bindAsEventListener(this);
 		Mojo.listen(this.controller.sceneElement, Mojo.Event.keypress, this.onKeyPressHandler);
@@ -136,7 +140,12 @@
 		if (undefined === this.flashState){
 			var prefFlashState = +this.cameraControl.prefs[CameraControl.PREFS.FLASH];
 			this.setFlashState(prefFlashState);
-		}		
+		}	
+		
+		if (undefined === this.shutterSoundState){
+			var prefShutterSoundState = this.cameraControl.prefs[CameraControl.PREFS.SOUNDS];
+			this.setShutterSoundState(prefShutterSoundState);
+		}	
 
 		try {
 			var initialOrientation = PalmSystem.screenOrientation;
@@ -607,6 +616,45 @@
 		} 
 
 		llog("Set Flash Mode to "+camera.flash);
+	},
+	
+	/**
+	 * Click handler for the shutter sound button.
+	 *  
+	 * @param {Event} event  The click event
+	 */
+	_handleShutterSoundButton: function(event){
+		if (this.shutterSoundState == 'enabled'){
+			this.shutterSoundState = 'disabled';
+		}
+		else {
+			this.shutterSoundState = 'enabled';
+		}
+
+		this.setShutterSoundState(this.shutterSoundState);
+	},
+		
+	setShutterSoundState: function(state){
+		if ((state != 'disabled') && (state != 'enabled')) {
+			/*
+			var elemC = this.controller.get('sagar_console');
+			if (elemC) {
+				elemC.innerHTML = state;
+			}
+			*/
+			llog("Requested shutter sound state is out of range ("+state+")");
+			return;
+		}
+
+		this.shutterSoundState = state;
+		CameraPrefs.updatePref(this.cameraControl.prefs, CameraControl.PREFS.SOUNDS, state);
+	
+		if (this.shutterSoundState == 'enabled') {
+			this.controller.get('shutterSoundButtonState').className = "shutter-sound-button shutter-sound-on";
+		}
+		else if (this.shutterSoundState == 'disabled') {
+			this.controller.get('shutterSoundButtonState').className = "shutter-sound-button shutter-sound-off";
+		}
 	},
 
 	/**

--- /usr/palm/applications/com.palm.app.camera/app/views/capture/capture-scene.html	Tue Jun 16 20:52:18 2009
+++ /Camera - Shutter Sound/capture-scene.html	Sat Jun 27 15:23:47 2009
@@ -14,6 +14,8 @@
 		<div id="captureSpinner" class="capture-spinner" x-mojo-element="Spinner"></div>		
 		<div class="capture-button" id="captureButton">
 		</div>
+		<div class="shutter-sound-button shutter-sound-off" id="shutterSoundButtonState">
+		</div>
 		<div class="flash-button flash-off" id="flashButtonState">
 		</div>
 	</div>
@@ -23,7 +25,7 @@
 			
 		</div>
 	</div>
-	<!-- <div id="sagar_console" style="z-index: 100; position: fixed; top: 10px; left: 10px; width: 90px; height: 20px; background-color: #000000; color: #8080ff; font-family: sans-serif; font-size: 12px; display: none;" >Hello!</div> -->
+	<!--<div id="sagar_console" style="z-index: 100; position: fixed; top: 10px; left: 10px; width: 90px; height: 20px; background-color: #000000; color: #8080ff; font-family: sans-serif; font-size: 12px; display: none;" >Hello!</div> -->
 	<div id="gpsMeter" style="z-index: 100; position: fixed; top: 10px; right: 10px; width: 90px; height: 20px; background-color: #a0a0a0; display: none" ></div> -->
 	
 	<div id="palmScrim" class="palm-scrim" style="z-index: 1001; display: none;">

--- /usr/palm/applications/com.palm.app.camera/stylesheets/camera.css	Tue Jun 16 20:52:18 2009
+++ /Camera - Shutter Sound/camera.css	Sat Jun 27 14:57:27 2009
@@ -116,6 +116,28 @@
 		z-index: 20;
 }
 
+.shutter-sound-button,
+.shutter-sound-button.shutter-sound-off {
+		width: 50px;
+		height: 50px;
+		background: url(../images/menu-shutter-sound.png) 0 0 no-repeat;
+		position: absolute;
+		left: 188px;
+		top: 15px;
+}
+
+.shutter-sound-button.shutter-sound-on:active {
+		background-position: 0px -50px;
+}
+
+.shutter-sound-button.shutter-sound-on {
+		background-position: 0px -100px;
+}
+
+.shutter-sound-button.shutter-sound-on:active {
+		background-position: 0px -150px;
+}
+
 /* Photo Roll */
 
 .photo-roll {

Couple of screenshots of what it looks like: