Archive

Archive for July, 2011

Using Google CDN jQuery and jQuery ui.

July 28th, 2011 No comments

I add these to almost every page I create. Next time you want to include jQuery and jQuery ui in a page, just copy these three tags and drop them in your head. Viola! jQuery, courtesy of Google! And if everybody did this, the web would be faster…




Categories: javascript, jquery Tags:

CSS3 Buttons Quick and Easy

July 18th, 2011 No comments

I found this article http://webdesignerwall.com/tutorials/css3-gradient-buttons that provides some nice code for css3 buttons, but you have to view source and other things to get what you need.  And I am always a fan of making things simpler.  So here is the awesome code they provide for making css3 buttons…  All nice and easy to copy and paste…  To view examples of the below styles see: http://www.webdesignerwall.com/demo/css-buttons.html

/* button 
---------------------------------------------- */
.button {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 0 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em; 
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}

.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}
.medium {
	font-size: 12px;
	padding: .4em 1.5em .42em;
}
.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}

/* color styles 
---------------------------------------------- */

/* black */
.black {
	color: #d7d7d7;
	border: solid 1px #333;
	background: #333;
	background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
	background: -moz-linear-gradient(top,  #666,  #000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}
.black:hover {
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
	background: -moz-linear-gradient(top,  #444,  #000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}
.black:active {
	color: #666;
	background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#444));
	background: -moz-linear-gradient(top,  #000,  #444);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#666666');
}

/* gray */
.gray {
	color: #e9e9e9;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
	background: -moz-linear-gradient(top,  #888,  #575757);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
	background: #616161;
	background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
	background: -moz-linear-gradient(top,  #757575,  #4b4b4b);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
	color: #afafaf;
	background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
	background: -moz-linear-gradient(top,  #575757,  #888);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

/* white */
.white {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.white:hover {
	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
	background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.white:active {
	color: #999;
	background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
	background: -moz-linear-gradient(top,  #ededed,  #fff);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* orange */
.orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.orange:hover {
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.orange:active {
	color: #fcd3a5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* red */
.red {
	color: #faddde;
	border: solid 1px #980c10;
	background: #d81b21;
	background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
	background: -moz-linear-gradient(top,  #ed1c24,  #aa1317);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}
.red:hover {
	background: #b61318;
	background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
	background: -moz-linear-gradient(top,  #c9151b,  #a11115);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}
.red:active {
	color: #de898c;
	background: -webkit-gradient(linear, left top, left bottom, from(#aa1317), to(#ed1c24));
	background: -moz-linear-gradient(top,  #aa1317,  #ed1c24);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa1317', endColorstr='#ed1c24');
}

/* blue */
.blue {
	color: #d9eef7;
	border: solid 1px #0076a3;
	background: #0095cd;
	background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
	background: -moz-linear-gradient(top,  #00adee,  #0078a5);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}
.blue:hover {
	background: #007ead;
	background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
	background: -moz-linear-gradient(top,  #0095cc,  #00678e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}
.blue:active {
	color: #80bed6;
	background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
	background: -moz-linear-gradient(top,  #0078a5,  #00adee);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

/* rosy */
.rosy {
	color: #fae7e9;
	border: solid 1px #b73948;
	background: #da5867;
	background: -webkit-gradient(linear, left top, left bottom, from(#f16c7c), to(#bf404f));
	background: -moz-linear-gradient(top,  #f16c7c,  #bf404f);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c', endColorstr='#bf404f');
}
.rosy:hover {
	background: #ba4b58;
	background: -webkit-gradient(linear, left top, left bottom, from(#cf5d6a), to(#a53845));
	background: -moz-linear-gradient(top,  #cf5d6a,  #a53845);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a', endColorstr='#a53845');
}
.rosy:active {
	color: #dca4ab;
	background: -webkit-gradient(linear, left top, left bottom, from(#bf404f), to(#f16c7c));
	background: -moz-linear-gradient(top,  #bf404f,  #f16c7c);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f', endColorstr='#f16c7c');
}

/* green */
.green {
	color: #e8f0de;
	border: solid 1px #538312;
	background: #64991e;
	background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
	background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
	background: #538018;
	background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
	background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.green:active {
	color: #a9c08c;
	background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
	background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

/* pink */
.pink {
	color: #feeef5;
	border: solid 1px #d2729e;
	background: #f895c2;
	background: -webkit-gradient(linear, left top, left bottom, from(#feb1d3), to(#f171ab));
	background: -moz-linear-gradient(top,  #feb1d3,  #f171ab);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#feb1d3', endColorstr='#f171ab');
}
.pink:hover {
	background: #d57ea5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f4aacb), to(#e86ca4));
	background: -moz-linear-gradient(top,  #f4aacb,  #e86ca4);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4aacb', endColorstr='#e86ca4');
}
.pink:active {
	color: #f3c3d9;
	background: -webkit-gradient(linear, left top, left bottom, from(#f171ab), to(#feb1d3));
	background: -moz-linear-gradient(top,  #f171ab,  #feb1d3);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f171ab', endColorstr='#feb1d3');
}
Categories: css Tags:

Quickly turn on error reporting to see errors.

July 13th, 2011 1 comment

I frequently run into a page where php isn’t displaying errors… A quick way to turn them on without changing the php.ini file is:

error_reporting(E_ALL & ~E_DEPRECATED);

ini_set('display_errors', 'on');

Note: This will not show compile / fatal errors, as the page won’t even run, but if it’s just a regular non syntax related error, it will not be displayed.

Update Thanks for the way to remove deprecated warnings Jacob.

Categories: php5 Tags:

Generating Documentation from XML using xslt

July 10th, 2011 No comments

When I worked at Infusionsoft I re-cycled some code I used to generate a php sdk into code that would generate documentation for the API, it wasn’t pretty but since I didn’t get official time to do it that’s what happens. I left the company, but fortunately Vivin Paliath is actively maintaining the auto-generation of the documentation using xslt, see: http://networkedblogs.com/kco7J Now, if he gets it Mavenized, and part of the formal build process than it will be the icing on the cake for all of us Infusionsoft API developers.

Categories: php5 Tags:

Baking Cake Controllers and Views

July 5th, 2011 No comments

Scaffold is awesome!  It genereates everything you need for CRUD, and is fully customizeable…

To use it do…

cake bake controller {controllername} scaffold   (NOT scaffolding)

To make the views

cake bake view {controllername}

Viola!  Instant coolness.

Categories: php5 Tags:

Getting the profile picture for an email address via gravatar!!

July 4th, 2011 No comments

A Gravatar is a picture associated with an email address. It is a brilliant system that allows anyone anywhere to create a photo to be associated with an email address they have (gravatar.com verifies the email address before allowing them to edit the picture). And then makes this photo publicly accessible to anyone! (See: http://en.gravatar.com/site/implement/hash/) for full details).

All you do to get the image associated with an email address is compose a url.

Just take the email address, trim any whitespace off the ends, make it all lower case, md5 it, and the url is:
http://www.gravatar.com/avatar/hash

So, php code to do this is:

$emailAddress = 'Bob.cOOl@example.com';
$url = 'http://www.gravatar.com/avatar/' . md5(strtolower(trim($emailAddress)));

You can also add a size parameter to the url to get a specific size… i.e.

$emailAddress = 'Bob.cOOl@example.com';
$size = 177;
$url = 'http://www.gravatar.com/avatar/' . md5(strtolower(trim($emailAddress))) . '?size=' . $size;

Awesome huh?

Check out this link for more you can do: http://en.gravatar.com/site/implement/hash/

Categories: php Tags:

Generating Code from html tables using javascript.

July 1st, 2011 No comments

I frequently write sdks for different applications / sites. I frequently find when I do an integration of some kind for a customer the company does not provide a good sdk for the platform I am using. Because I prefer to make things easy. I usually like to write a tool to auto-generate an sdk for that tool.

An example of this is my 3dcart sdk: http://code.google.com/p/3dcart-php-sdk/

While these sdks aren’t always perfect they allow me to create the integration MUCH faster. Which means I make more money.

Recently I needed to do this for Infusionsoft to create a simple integration that could access a few objects in java via their DataService api. I didn’t need much, just 3 objects so that a fulfillment company could read order information from Infusionsoft. When I worked at Infusionsoft I created a tool that took an xml file and automatically generated their api documentation. Unfortunately, since I am no longer an employee I don’t have access to that xml document. But! I do have access to the public api documentation that my tool auto-generated. And it’s in a table!

So, I quickly used the following code to auto generate the code for my class, my class factory (that populates the class from a map) and the code to populate a list of available fields.

It worked beautifully! This same technique could be adapted to any well organized api documentation. The page I used is located here: http://developers.infusionsoft.com/dbDocs/Contact.html

Remember if the page doesn’t have jQuery on it, just install it as follows:

var s = document.createElement('script');
s.setAttribute('src', 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js');
document.body.appendChild(s);
jQuery('#staticFields, #publicFields, #factoryCode').remove();
jQuery('body').append('<pre id="staticFields"></pre> <br/>');
jQuery('body').append('<pre id="publicFields"></pre> <br/>');
jQuery('body').append('<pre id="factoryCode"></pre> <br/>');

jQuery('table tr').each(
    function(){
        var $this = jQuery(this);
        $tds = $this.find('td');
        if($tds.length == 3){
            jQuery('#staticFields').append('fields.add("' + jQuery($tds.get(0)).html() + '");\n');                   

            jQuery('#publicFields').append('public ' + jQuery($tds.get(1)).html() + ' ' + jQuery($tds.get(0)).html().substr(0, 1).toLowerCase() + jQuery($tds.get(0)).html().substr(1) + ';\n');                   


            jQuery('#factoryCode').append('contact.' + jQuery($tds.get(0)).html().substr(0, 1).toLowerCase() + jQuery($tds.get(0)).html().substr(1) + ' = (' + jQuery($tds.get(1)).html() + ') map.get("' + jQuery($tds.get(0)).html()+ '");\n');                   

        }
    }
);
Categories: code generation, code snippets, java Tags: