Dev Hotel

Apress : Beginning CakePHP : Chapter 8 Error & Fix

In Chapter 8, on Page 120, Listing 8-7 in line 15 of the example it sets the $ajax->form helper to

<?=$ajax->form(‘/comments/add’, ‘post’, array(‘update’=>’comments’)); ?>

however when this is done the form action is then set to ‘/posts/comments/add’ and creates an error, since it is looking for the comments action in the posts_controller. I was able to get past this problem by setting the $ajax->form helper to

<?=$ajax->form(null, ‘post’, array(‘model’=>’Comment’, ‘url’=>’/comments/add’, ‘update’=>’comments’));?>

then the form action ends up being ‘/comments/add’ and fixes the error. I am not sure if setting the first parameter to null is either necessary or correct, but it does seem to function correctly.

you are welcome.

Javascript : FlashObject

Thought I’d throw this one up even though I know it could use a little bit more work. Basically, this just calls on a Object to insert Flash via the Flash Satay: Embedding Flash While Supporting Standards way into your page. It supports web standards which is kind of a bitch to do over and over again. Also, the main reason I like this code is in IE you don’t have to click on the flash in order to interact with it.

This goes in your javascript file.

// this Object writes in a Flash object
// using the Flash Satay Method from Drew McLellan in 
// Flash Satay: Embedding Flash While Supporting Standards

FlashObject = {
		
	writeObject: function( url, w, h, bg, trans, altImage, altLink, menu, nav ) {
		
		if ( trans ) {
			var trans = 'transparent';
		} else {
			var trans = 'window';
		}
		
		if ( menu ) {	
			var menu = 'true';
		} else {			
			var menu = 'false';
		}
		
		document.writeln( '<object type="application/x-shockwave-flash" data="' ⇒
+ url + '" width="' + w + '" height="' + h + '">' );
		document.writeln( '<param name=quality value=high>' );
		document.writeln( '<param name=wmode value="' + trans + '">' );
		document.writeln( '<param name=menu value="' + menu + '">' );
		document.writeln( '<param name=movie value="' + url + '">' );
		
		if ( bg != null ) {
			document.writeln( '<param name=bgcolor value="#' + bg + '">' );
		}
		
		if ( nav ) {
                        //this is a altNav in case of no flash
			document.writeln( altNav );
		} else {
		
			if ( !altLink ) {
				document.writeln( '<img src="/assets/images/' + altImage ⇒
 + '" />' );
			} else {
				document.writeln( '<a href="' + altLink + '"> ⇒
<img src="/assets/images/' + altImage + '" /></a>' );
			}
		
		}
		
		document.writeln( '</object>' );
	}
	
}

Then you call the Object in your .html and then the code will insert the .swf into the page. Pretty easy.

<script type="text/javascript">
FlashObject.writeObject( 'your_file_goes_here.swf', 550, 450, 'ffffff', true, 0, 0, 0, 0);
</script>

Prototype Popup Function

Last night I wrote this to start working with Prototype. It does kind of amaze me how much easier life is with a Javascript framework like Prototype

Obviously for this to work you need to have the prototype.js and the popup.js files linked in the head your html file like so:

<script src="__js/prototype.js" type="text/javascript"></script>
<script src="__js/popup.js" type="text/javascript"></script>

Then where ever you have a link you want to “popup” just make sure it has a class of “popup.” Like so:

<p>Developed By <a class="popup" href="http://www.groupswitch.com">Switch</a></p>

That’s about it and you should be good to go. Below is the code that will need to go into your “popup.js” file. Enjoy.

	// makes popup windows happy with XHTML strict
	document.observe("dom:loaded", function() {
	
		// degrade gracefully
		if (!document.getElementsByTagName) {
			return false;
		}
		
		// get a tags with a class of popup
		var popup_links = $$('a.popup');
		
		popup_links.each(function(element) {
			element.onclick = function() {
				window.open(this.readAttribute('href'), "popup");
			}
		});
				
	});

CSS File Reset.

Alright, so we are going to start it off nice and easy. This is what I start every .css file off with. If you are just starting out with CSS then this might be kiinda helpful. It was a while before I understood this was even possible, and now I can’t even live with out it.

As you can probably tell I like a lot of formatting in my .css files. I think it keeps things moving by adding in space to breathe. Also, I use Coda made by Panic as my text editor which does a lot of really cool things when you call out comments in a specific way (/* ! something here */). So, check it out and let me know what you think.

/*

- (client goes here)
- designed by
- Switch Creative Group
- http://www.groupswitch.com

*/

/* ! ---- COLORS ---- */
/* ---------------------------------------------------- */
/*
	
	#4B4D4D	:	body copy grey
	#7D7E7F	:	top header nav copy
	
*/



/*

Table of Contents

1. Universal Declarations
2. Structure
	2.1. Header
	2.2. Content
	2.3. Comments
	2.4  Sidebar
	2.5  Footer
3. Lists
4. Headings
5. Images
6. Forms
7. Page Specific
8. Extras

*/


/* ! ---- UNIVERSAL SELECTORS ---- */
/* ----------------------------------------------------------------------------- */

	* {
		margin: 0;
		padding: 0;
		/* Resets all margins and paddings on the page */
		}
		
	body {
		font-family: Arial, Helvetica, Verdana, sans-serif;
		font-size: 62.5%; /* Sets the page font to 10px */
		}
			
	ul {
		list-style-type: none;
		}
	
	* a:link, * a:visited, * a:hover, * a:active {
		color: #7D7E7F;
		text-decoration: none;
		}
		
	* a:hover {
		cursor: pointer;
		/* works well for onclick anchors */
		}
	
	* p {
		text-align: left;
	        }
	
	:link img {
		border: none;
		}
	
	* img {
		border: none;
		}
	
	a img {
		border: none;
		}
	
	:link img, :active img {
		border: none;
		}