Code

Remove Boonex Footer From Dolphin CMS

Posted in Code, Programming on March 11th, 2010 by Eric Lamb – Be the first to comment

After the server lockout and subsequent move last week I had to setup all my old sites on the new server. Aside from the loss of a few posts my blog (which I could restore from Google cache) and a few comments (which I couldn’t restore unfortunately) everything was pretty smooth. That was until I had to move over one of my clients sites that was using Dolphin CMS.

Remove Boonex Footer From Dolphin CMS

Remove Boonex Footer From Dolphin CMS

The issue was that the client’s site was now being tagged with a Powered By Boonex footer; not cool because the client had purchased a license and shouldn’t have the callout to Boonex. It looked like the site couldn’t reach the licensing server so it was acting like the site wasn’t a valid and licensed version.

I had set up the new server in a pretty locked down way, using a pretty paranoid strategy with firewalls and port changes and all that fun stuff. Unfortunately for my client, this included mod_security which Dolphin requires special configuration for:

If some security module is installed on the server (such as mod_security for Apache), it should be able to be disabled or set up for specific folders.

Not wanting to allow such a blatant security hole into my server following the above just wasn’t acceptable. Instead I decided to just remove the call to the licensing server in the code; it’s just php so I didn’t think it would be too difficult. It wasn’t but it was a little confusing though so here’s the code and process in case anyone else has the need.

BECAUSE I DON’T WANT TO GET SUED: only use this if you’ve already purchased a license. Blah, blah, blah. Oh, and this has only been tested in Dolphin 6.1.

  1. First, open up “/inc/design.inc.php”
  2. look for a HUGE base64 encoded line (one really long and one underneath is short). You’re going to need to remove both lines.
    It should be around line 500 and indented a few pages in. If you can’t find it search for “base64_decode” and it’ll come up.
  3. Replace the both lines with the below:
$s813518='Y3JlYXRlX2Z1bmN0aW9u';$s534634='base64_decode';$s434741='YmFzZTY0X2RlY29kZQ==';$s865127='ZWNobw==';$s734874='Z2xvYmFsICRfcGFnZTsNCg0KJHM0MzUyMzYgPSBiYXNlNjRfZGVjb2RlKCAnWW1GelpUWTBYMlJsWTI5a1pRPT0nICk7DQokczU4OTM1NSA9ICdYMTlpYjI5dVpYaGZabTl2ZEdWeWMxOWYnOw0KJHM3NDM3NjUgPSAnWjJ4dlltRnNJQ1J6YVhSbE93MEtaMnh2WW1Gc0lDUjBiWEJzT3cwS0RRb2tjMFp2YjNSbGNuTWdQU0FuSnpzTkNtbG1JQ2huWlhSUVlYSmhiU2duWlc1aFlteGxYMlJ2YkhCb2FXNWZabTl2ZEdWeUp5a3BJSHNOQ2lBZ0lDQU5DaUFnSUNBa2MwRm1aa2xFSUQwZ2RISnBiU2huWlhSUVlYSmhiU2duWW05dmJtVjRRV1ptU1VRbktTazdEUW9nSUNBZ2FXWW9JSE4wY214bGJpZ2dKSE5CWm1aSlJDQXBJQ2tnSkhOQlptWkpSQ0F1UFNBbkxtaDBiV3duT3cwS0RRb2dJQ0FnYjJKZmMzUmhjblFvS1RzTkNnMEtJQ0FnSUNSelJtOXZkR1Z5Y3lBOUlDY25PdzBLZlEwS0RRcHlaWFIxY200Z0pITkdiMjkwWlhKek93PT0nOw0KJHM1ODYyODQgPSAnVkcxd2JFdGxlWE5TWlhCc1lXTmwnOw0KJHM5ODU0OTUgPSAnTDE5ZktGdGhMWHBCTFZvd0xUbGZMVjByS1Y5Zkx3PT0nOw0KJHM3ODI0ODYgPSAnYzNSeWNHOXonOw0KJHM5NTAzMDQgPSAnYzNSeVgzSmxjR3hoWTJVPSc7DQokczk0Mzk4NSA9ICdjSEpsWjE5eVpYQnNZV05sWDJOaGJHeGlZV05yJzsNCiRzNjc3NDM0ID0gJ1dXOTFJR2hoZG1VZ2JXRnVkV0ZzYkhrZ2NtVnRiM1psWkNBOFlTQm9jbVZtUFNKb2RIUndPaTh2ZDNkM0xtSnZiMjVsZUM1amIyMHZJajVDYjI5dVJYZzhMMkUrSUdadmIzUmxjbk1nZDJsMGFHOTFkQ0J3WVhscGJtY2dabTl5SUhSb1pTQnlhV2RvZENCMGJ5NGdVR3hsWVhObExDQm5ieUIwYnlBOFlTQm9jbVZtUFNKb2RIUndjem92TDNkM2R5NWliMjl1WlhndVkyOXRMM0JoZVcxbGJuUXVjR2h3UDNCeWIyUjFZM1E5Ukc5c2NHaHBiaUkrUW05dmJrVjRMbU52YlR3dllUNGdZVzVrSUc5eVpHVnlJSFJvWlNCaFpDQm1jbVZsSUd4cFkyVnVjMlZ6SUhSdklHSmxJR0ZpYkdVZ2RHOGdkWE5sSUhsdmRYSWdjMmwwWlNCM2FYUm9iM1YwSUR4aElHaHlaV1k5SW1oMGRIQTZMeTkzZDNjdVltOXZibVY0TG1OdmJTOGlQa0p2YjI1RmVEd3ZZVDRnWm05dmRHVnljeTRnVkdobGVTQjNhV3hzSUdKbElHRjFkRzl0WVhScFkyRnNiSGtnY21WdGIzWmxaQ0JoY3lCemIyOXVJR0Z6SUhsdmRTQnlaV2RwYzNSbGNpQjViM1Z5SUdGa0lHWnlaV1VnYkdsalpXNXpaWE11SUZCc1pXRnpaU3dnY0hWMElIUm9aU0E4WWo1ZlgySnZiMjVsZUY5bWIyOTBaWEp6WDE4OEwySStJR3RsZVNCaVlXTnJJR2x1ZEc4Z1JHOXNjR2hwYmlCMFpXMXdiR0YwWlM0PSc7DQokczU0NjY5MyA9ICdibUZ0WlY5cGJtUmxlQT09JzsNCg0KJHM1NDU2MjQgPSAkczQzNTIzNiggJHM1ODYyODQgKTsNCiRzNDM0NjQzID0gJHM0MzUyMzYoICRzOTg1NDk1ICk7DQokczkzNzU4NCA9ICRzNDM1MjM2KCAkczc4MjQ4NiApOw0KJHMwMjM5NTAgPSAkczQzNTIzNiggJHM5NTAzMDQgKTsNCiRzOTM3NTA0ID0gJHM0MzUyMzYoICRzOTQzOTg1ICk7DQokczM4NTk0MyA9ICRzNDM1MjM2KCAkczU0NjY5MyApOw0KDQokczk4NzU2MCA9ICRfcGFnZTsNCiRzOTQ2NTkwID0gZmFsc2U7DQokczg1OTM0OCA9IGFycmF5KCAyOSwgNDMsIDQ0LCA1OSwgNzksIDgwLCAxNTAgKTsNCg0KaWYoIGluX2FycmF5KCAkczk4NzU2MFskczM4NTk0M10sICRzODU5MzQ4ICkgb3IgJHM5Mzc1ODQoICRzNjUzOTg3LCAkczQzNTIzNiggJHM1ODkzNTUgKSApICE9PSAkczk0NjU5MCApIHsNCiAgICAkczY1Mzk4NyA9ICRzMDIzOTUwKCAkczQzNTIzNiggJHM1ODkzNTUgKSwgZXZhbCggJHM0MzUyMzYoJHM3NDM3NjUpICksICRzNjUzOTg3ICk7DQogICAgJHM2NTM5ODcgPSAkczkzNzUwNCggJHM0MzQ2NDMsICRzNTQ1NjI0LCAkczY1Mzk4NyApOw0KICAgIGVjaG8gJHM2NTM5ODc7DQp9IGVsc2UNCiAgICBlY2hvICRzOTg3NTYwWyRzMzg1OTQzXSAuICcgJyAuICRzNDM1MjM2KCAkczY3NzQzNCApOw==';
 
$s545674=$s534634( $s813518 );$s548866=$s534634( $s434741 );$s947586=$s534634( $s865127 );$$s947586=$s545674( '$s653987', $s548866( $s734874 )

Boonex uses base64 to encode and obfuscate the licensing code so it can’t be modified without a bare minimum of trouble. Not that they had much of an option; php is notoriously hard to encode with any elegance or reliability. Anyway, they chose base64.

All that was needed was to base64_decode the code, and then base64_decode that code (yup, they did it twice). After that I made the changes to remove the HTML that displays the Boonex footer, base64_encoded that, then did it again to create the above.

So, once again, only use the above code if you’ve already purchased a license. Yes, it should work if you didn’t but I don’t want to get sued so it has to be said.

Bookmark and Share

The Horrors of C99.php

Posted in Brain Dump, Code, IT on February 22nd, 2010 by Eric Lamb – Be the first to comment

If you were a sysadmin a few years ago, and you had php on your servers, you’re probably already familiar with c99. In case you haven’t had the personal pleasure, c99, or specifically c99.php (hint: check the source), is the name of a script used by hackers to gain access to a web server running php using an exploit technique called Remote File Inclusion.

The Horrors of C99.php

The Horrors of C99.php

A Little History

See, back in the day some php developers were pretty stupid. (Admit it; you were stupid once too.) What other explanation could there be for writing code that allowed the injection of arbitrary routines into a program. Trivially easy too.

To be fair, PHP was to blame a little for this as well. Given PHP’s high adoption, and design, by, and for, newbie programmers allowing such a technique by default was just ill conceived, and maybe even a little negligent. I understand the desire, and sometime need, for a technique that could be dangerous but to enable the feature by default…. damn man…

So, the risk was known, yet code was still being written (like the below example) that allowed remote file inclusion to be possible. Mostly because of the aforementioned default setting.

<?php
$color = 'blue';
if (isset( $_GET['COLOR'] ) )
{
	$color = $_GET['COLOR'];
}
require( $color . '.php' );
?>

BTW, if you currently write code that does anything like the above, frankly, you’re an idiot. You aren’t nearly as smart and clever as you think you are. I promise you this will bite you. Bad too.

About C99.php

So, using a technique like the above opens you up to learning first hand about c99.php. Finding information about the program itself is a little tricky but there are a couple examples that highlight just how devastating it can be.

When malicious intruders compromise a web server, there’s an excellent chance a famous Russian PHP script, r57shell, will follow. The r57shell PHP script gives the intruder a number of capabilities, including, but not limited to: downloading files, uploading files, creating backdoors, setting up a spam relay, forging email, bouncing a connection to decrease the risk of being caught, and even taking control of SQL databases. All these functions become readily available through an easy to use web interface, but now you can fight back.

Using the above explanation, which I agree with, c99.php acts as an interface to control your server. Once it’s on your server an attacker has easy access to view all the files and their contents, make changes to the system, upload new files, manipulate the database(s) and more.

Quite the nasty little script but pretty elegant in how it’s implemented. c99 is a completely standalone script; even the images are embedded inside using base64!

Until a month ago I would have thought the risk of encountering c99.php in the wild would have been small these days. Then, SMACK!!, a client had a site get hacked (quick CYA; that I didn’t’ work on :) ) using c99. So be warned. It’s out there and if you’re not smart, or if you’re a lazy, lazy, coder, c99 will get you.

Bookmark and Share

Easily Add Gravatar to Your PHP Apps

Posted in Code, Programming on February 17th, 2010 by Eric Lamb – Be the first to comment

Among the few hassles to being a citizen of the Internets, along with multiple login credentials, comment trolls and pedophiles (obviously), is the hassle of multiple profile pics. Yes, it’s an extremely small problem but it is a problem solved by Gravatar.

Easily Add Gravatar to Your PHP Apps

Easily Add Gravatar to Your PHP Apps

Gravatar, which stands for Globally Recognized Avatar (seriously), is a service provided by Automattic (yes, the same Automattic that provides WordPress) that allows users to upload a single image which developers can then use on their websites. The outcome is that users have a single icon (or avatar) representing them, that they don’t have to repeatedly upload. Another, less publicized benefit, is that us developers don’t have to write all the photo uploading and resizing functionality. Again.

The Basics

From an implementation standpoint Gravatars couldn’t be simpler. At the base level it’s just a call to a URL that includes an md5() hash of a users email. For example my gravatar URL is the below:

http://www.gravatar.com/avatar/8a55f4e419d6d5314e420ba26bf7455e?s=75&d=wavatar&r=X

Looking at the URL (which hopefully, you’re comfortable looking at) it’s broken up like so:

Base URL: http://www.gravatar.com/avatar/

My Identifier (eric@ericlamb.net in md5()): 8a55f4e419d6d5314e420ba26bf7455e

Query String Parameters: s=75&d=wavatar&r=X

As far as the query string goes, none of the below are required but using them allows to customize the output. You have the following options:

Image Size: s (between 1 and 512)

Default: d (wavatar, identicon, monsterids or custom URL)

Rating: r (think movie ratings with G – X)

Considering all of the above, and how simple it is, I’m kind of amazed that there’s still an issue with wide adoption (though this could be due to Gravatar scaling the service for the obscene amount of traffic this would create) .

The Codes

Obviously, writing a little snippet to create the Gravatar URLs in PHP would be trivial to most programmers:

<?php
$url = 'http://www.gravatar.com/avatar/';
$email = 'eric@ericlamb.net';
$default = 'monsterid';
$size = 75;
 
$grav_url = $url.'?gravatar_id='.md5( strtolower($email) ).
'&default='.urlencode($default).'&size='.$size; 
?>
<img src="<?php echo $grav_url;?>" />

Simple but the code above could be a lot more useful. As expected though, a few php classes have been written that’ll handle all the particulars for you. One, available on phpclasses.org, I looked at, and even used within a project, but it didn’t have native support for “defaults” so I decided against using it as an example here (still a cool script if the next one doesn’t float your boat).

The other script is available through TalkPHP, so it’s not really clear who the actual author is (sorry for not giving credit whoever you are). The code is clean, clear and dead easy to implement though.

<?php
include_once('./TalkPHP_Gravatar.php');
$pAvatar = new TalkPHP_Gravatar();
$pAvatar->setEmail('adam@talkphp.com')->setSize(80)->setRatingAsPG()->setDefaultImageAsIdentIcon();
?>
<img src="<?php echo $pAvatar->getAvatar(); ?>" />

Very, very simple. I have to say I’m a fan of Gravatar. I wish more sites implemented Gravatars, instead of having me constantly uploading a different image, but now you can do your part. Get cracking.

Bookmark and Share

Half Assed Cron With WP Cron

Posted in Code, Programming on February 8th, 2010 by Eric Lamb – Be the first to comment

I was working on a project recently that was using WordPress as the base platform and had a need for a scheduled task function. Ordinarily, this would be the type of functionality that I would just setup a cron job for; but since Wordpress has a pseudo cron system in place I decided to investigate that as an option. Long story short; fuck that man.

Working With WP Cron

Working With WP Cron

As mentioned, Wordpress has a pseudo cron mechanism available to Wordpress developers for scheduling tasks called WP Cron. WP Cron works using series of functions available for plugin developers to create their own cron style tasks. In theory Wordpress makes this easy(ish) using the built in cron API but the reality is that it’s not only confusing and awkward to implement but once you’re complete you have to allow for a bit of latitude on the scheduling.

Take a look at scheduling a task in Wordpress. Basically, it works by adding a function to your activation hook, within a plugin, that like the below:

<?php 
register_activation_hook(__FILE__, 'my_activation');
add_action('my_hourly_event', 'do_this_hourly');
 
function my_activation() {
	wp_schedule_event(time(), 'hourly', 'my_hourly_event');
}
 
function do_this_hourly() {
	// do something every hour
}
?>

Pretty simple implementation really though not very “cron” like in syntax. The important part is the call to “wp_schedule_event()” which takes 4 parameters (start date, recurrence, hook and arguments). According to the API manual the function:

Schedules a hook which will be executed by the WordPress actions core on a specific interval, specified by you. The action will trigger when someone visits your WordPress site, if the scheduled time has passed. See the Plugin API for a list of hooks.

The problem I had was that this function only allows for 3 options on recurrence; hourly, twicedaily and daily. I needed my function to run at a specific time. (It was EXTREMELY important that it ran during a specific interval.)

This isn’t to say that it’s not possible to schedule a task for a specific time; it’s just a pain in the ass. You have to write all the logic to determine when to add a new task and removing expired tasks. Ughh. To me the question becomes “Should I write a couple hundred lines of code or just add a single line to my crontab?”.

Crontab baby.

Bookmark and Share

Introducing WP-hResume

Posted in Code on January 25th, 2010 by Eric Lamb – Be the first to comment

Recently I had a problem; the plugin I was using to display my resume on my site mysteriously started causing WordPress to throw a weird error. Not to get too technical about it but the issue was a little more complicated than I was willing to deal with personally and I was prepared to resign myself to not having an online resume for a while. Sigh…

Fast forward about a month and the hoped for “fix” for the plugin never came. This left me with no alternative than to write my own. Yay!!

Looking at the plugin I was using, LinkedIn hResume, and noticing some of the flaws (like the plugin ONLY working with LinkedIn) I realized I could one-up the plugin and make something a lot more useful to more people by writing a new, custom resume plugin.

And that’s what we have here; WP-hResume. WP-hResume is a wordpress plugin that takes any hresume encoded webpage and allows you to place the content on your site. It’s been tested using both LinkedIn and Stack Overflow Careers as well as quite a few stand alone hresume pages. It works wonderfully.

Please take a look and let me know if you like :)

Bookmark and Share

Get Rid of HTML Templates With HAML

Posted in Code, Programming on January 4th, 2010 by Eric Lamb – 4 Comments

I was working with a new client the last couple weeks where I met a python developer who introduced me to something I hadn’t head of before: HAML. HAML stands for XHTML Abstraction Markup Language and is a markup “language” modeled after, what appears to me to be, YAML. (The syntax and structure is very similar to YAML but I couldn’t find any reference to this being intentional so I could be wrong.)

Get Rid of Templates With HAML

Get Rid of Templates With HAML

Anywho, it looks like HAML was originally created for Ruby on Rails but has been adopted by a few other programming languages and environments like PHP. According to the official site:

Haml is a markup language that’s used to cleanly and simply describe the HTML of any web document without the use of inline code. Haml functions as a replacement for inline page templating systems such as PHP, ASP, and ERB, the templating language used in most Ruby on Rails applications. However, Haml avoids the need for explicitly coding HTML into the template, because it itself is a description of the HTML, with some code to generate dynamic content.

So in a nutshell HAML allows for the replacement of the normal, everyday, HTML markup with something a little more “elegant”. The HAML Wikipedia page has a really good example of the differences between HTML and HAML (which I’ve stolen and placed below):

HAML

!!!
%html{ :xmlns => "http://www.w3.org/1999/xhtml", :lang => "en", "xml:lang" => "en"}
  %head
    %title BoBlog
    %meta{"http-equiv" => "Content-Type", :content => "text/html; charset=utf-8"}
    = stylesheet_link_tag 'main'
  %body
    #header
      %h1 BoBlog
      %h2 Bob's Blog
    #content
      - @entries.each do |entry|
        .entry
          %h3.title= entry.title
          %p.date= entry.posted.strftime("%A, %B %d, %Y")
          %p.body= entry.body
    #footer
      %p
        All content copyright © Bob

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml'>
  <head>
    <title>BoBlog</title>
    <meta content='text/html; charset=utf-8' http-equiv='Content-Type' />
    <link href="/stylesheets/main.css" media="screen" rel="Stylesheet" type="text/css" />
  </head>
  <body>
    <div id='header'>
      <h1>BoBlog</h1>
      <h2>Bob's Blog</h2>
    </div>
    <div id='content'>
      <div class='entry'>
        <h3 class='title'>Halloween</h3>
        <p class='date'>Tuesday, October 31, 2006</p>
        <p class='body'>
          Happy Halloween, glorious readers! I'm going to a party this evening... I'm very excited.
        </p>
      </div>
      <div class='entry'>
        <h3 class='title'>New Rails Templating Engine</h3>
        <p class='date'>Friday, August 11, 2006</p>
        <p class='body'>
          There's a very cool new Templating Engine out for Ruby on Rails. It's called Haml.
        </p>
      </div>
    </div>
    <div id='footer'>
      <p>
        All content copyright © Bob
      </p>
    </div>
  </body>
</html>

After comparing the two examples above it should be pretty obvious how HAML is structured compared to good old HTML. There’s nothing too crazy going on in the syntax but that doesn’t matter nearly as much as there’s another syntax to learn. Still, if you can get past that HAML is pretty intriguing and worth it to look at.

Now, if you’re a PHP developer you may be saying, “That’s great and all but what the fuck do I care about a Ruby on Rails tool?”. Well, that’s one of the cool parts; there’s a PHP implementation of HAML a PHP class called phpHaml. phpHaml is a PHP class to compile HAML code into static HTML templates, which is useful if you want to jump right in and build a template system.

At it’s most basic a phpHaml script looks like the below:

<?php
require_once './includes/haml/HamlParser.class.php';
$parser = new HamlParser('./tpl', './tmp/haml');
echo $parser->setFile('example2.haml');
?>

Simple. Simple. Simple. Obviously, there are other, more advanced options for working with phpHaml but 3 lines is really all it takes for the learning portion.

My interest in HAML is a little greater than my time allows so I haven’t been able to play too deeply with phpHaml. From my limited time with it though I do feel that the the compiler works as expected on the limited HTML I threw at it and it’s probably worth a deeper look. Oh, yeah, as an added bonus phpHaml also includes a SASS parser (but that’s a whole other post) to play with.

Bookmark and Share

Tablekit: HTML Table Enhancements

Posted in Code, Programming on December 18th, 2009 by Eric Lamb – Be the first to comment

I’ve been using Jquery a lot lately and have absolutely fallen in love with it; so much so that I’ve pretty much walked away from Prototype and Scriptaculous entirely. Not to take anything away from Prototype but Jquery is just a lot more… well, it’s just more fun to work with. That being said, I wanted to give a shout out to one of the cooler toys Prototype has: TableKit.

TableKit

TableKit

TableKit is a table enhancement JavaScript library written using Prototype provided by Millstream Software. In a nutshell TableKit allows you to easily create sortable, resizable and editable tables. Implementation is extremely simple and, according to Robert Speer, designers don’t have an issue working with it (I haven’t had the pleasure of having a designer work with it yet):

Many times using scripts I find on the Internet turns into kind of a hassle. They are usually unfinished side projects, or are kind of bloated and slow.

TableKit is not one of those scripts, it’s fast & easy to implement. Development time was low, and the designers didn’t complain too much about working with it.

Robert’s right; TableKit is extremely easy to work with. TableKit works by using css class overloading to tell the system how to handle a table. For example:

<table class="sortable resizable editable">

indicates that the table should, obviously, be sortable, resizable and editable. There are all sorts of other options available, which you can read about in the documentation. If you have to use Prototype for a project and you need some jazz TableKit is a good fit.

Bookmark and Share

Introduction to jQuery UI

Posted in Code, Programming on November 6th, 2009 by Eric Lamb – 2 Comments

Building the fancy, web 2.0 / Ajaxy, user interfaces for a web application we’ve all come to expect is, frankly, a pain in the ass. Depending on the JavaScript library you’re using there’s usually some addon library to extend the functionality for UI which helps make it easier and ease the pain. If you’re using jQuery (and to be honest I’m more of a Prototype guy) a good library is jQuery Ui.

JQuery UI

JQuery UI

According to the official site:

jQuery UI is an open source library of interface components — interactions, full-featured widgets, and animation effects — based on the stellar jQuery javascript library. Each component is built according to jQuery’s event-driven architecture (find something, manipulate it) and is themeable, making it easy for developers of any skill level to integrate and extend into their own code.

I only ran into it because of an update to WP-Click-Track and Wordpress uses jQuery so I kinda had to. Not that it’s a bad thing; I like jQuery a little bit more because of jQuery UI.

One of the really cool things about jQuery UI is that there’s an online tool to generate a custom download specific to the project. Having worked with JavaScript libraries for a while I appreciate the customization and convenience of having the smallest footprint as possible. Kudos to them on that.

There’s also a Theme Builder that gives a good overview of what’s available by default along with some preset themes to test; there’s a good deal of widgets there to work with. Almost, almost, makes me want to start a project with it.

jQuery UI - ThemeRoller

jQuery UI - ThemeRoller

Implementation is really elegant too; if you know how jQuery works it’ll be pretty obvious. Otherwise take a look at the below for creating tabs:

<div id="tab-jquery-id">
	<ul>
		<li><a href="#tab1">Tab 1</a></li>
		<li><a href="#tab2">Tab 2</a></li>
		<li><a href="#tab3">Tab 3</a></li>
		<li><a href="#tab4">Tab 4</a></li>
		<li><a href="#tab5">Tab 5</a></li>
	</ul>
	<div id="tab1">
 
	</div>
	<div id="tab2">
 
	</div>
	<div id="tab3">
 
	</div>
	<div id="tab4">
 
	</div>
	<div id="tab5">
 
	</div>
</div>
 
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready( function($) {
	//jQuery UI 1.5.2 doesn't expect tab ID's at DIV, so we have to apply a hotfix instead
	var needs_jquery_hotfix = (($.ui.version === undefined) || !$.ui.version.match(/^(1\.[7-9]|[2-9]\.)/));
	$("#tab-jquery-id"+(needs_jquery_hotfix ? ">ul" : "")).tabs({
		selected: 0
	}); 
	$('.tab5:last').show().removeClass('tab5');
});
//]]>
</script>

As you can see there’s not much there in so far as design or class decorators go; most of that’s handled by jQuery itself as well as the generated css. The only thing to really worry about is adding the wrapper div id in the bottom JavaScript. Still, not a bad thing.

This, of course, barely scratched the surface of jQuery UI but it doesn’t get much more difficult. If you’re using jQuery for a library and you need to make something cool it’s definitely worth checking out.

Bookmark and Share

Make Zend_Form Bend To Your Will

Posted in Code, Programming on September 23rd, 2009 by Eric Lamb – 4 Comments

The first thing you need when working with any new web language or framework is figure out how to work with forms. Forms are one of the constants when working online and it’s the rare occasion when you can bypass dealing with them. They are also one of the more rote and boring portions of a web app to build; they’re, pretty much, always the same requiring the same fields on the same pages with the same validation rules and the same database schema.

Make Zend_Form Bend To Your Will

Make Zend_Form Bend To Your Will

If you’re smart dealing with forms effectively becomes a priority. My previously held favorite method was using HTML_QuickForm for handling forms. If you’ve never used; IT IS AWESOME.

Here’s an example login form script:

<?php
/**
 * Include HTML_QuickForm library
 */
require 'HTML/QuickForm.php';
 
/**
 * Include HTML_QuickForm Smarty Renderer
 */
require('HTML/QuickForm/Renderer/ArraySmarty.php');
 
$renderer =& new HTML_QuickForm_Renderer_ArraySmarty($smarty);
$form = new HTML_QuickForm('login');
 
$form->addElement('text','Email','Email:' ,'class="textfield" size="30" maxlength="128"');
$form->addRule('Email','Please Enter Your Email','required', null, 'client');
$form->addRule('Email','Please enter a valid email address','email', true, 'client');
 
$form->addElement('password','Password','Password:','class="textfield" size="30" maxlength="128"');
$form->addRule('Password','Please Enter Your Password','required', null, 'client');
$form->addElement('checkbox','remember',null,'Remember Me?');
$form->addElement('submit','save','Submit','class="csubmit"');
 
if ($form->validate()) {
    //do the processing stuff here...
 
}
 
$form->accept($renderer);
$smarty->assign('LoginForm', $renderer->toArray());
?>

Very straightforward I think; instantiate the object, declare the elements, attach the rules and send to smarty (view) object.

The corresponding Smarty template is just as straightforward:

{$LoginForm.javascript}
<form {$LoginForm.attributes}>
{$LoginForm.hidden}
 
{if $LoginForm.Email.error}<span class="errorMessage">{$LoginForm.Email.error}</span><br />{/if}
<div id="email">
	Email: {$LoginForm.Email.html}
</div>
 
<div id="password">
	Password: {$LoginForm.Password.html}
</div>
 
<div id="remember">
	{$LoginForm.remember.html}
</div>
 
 
<div id="submit">
	{$LoginForm.submit.html}
</div>
</form>

That’s my preferred method when layout of the form is important and/or outside the box; it’s totally possible to use HTML_QuickForm without the Smarty integration but I like the control. It allows me to build forms as complicated in layout as the I Am Legend community was (my baseline for form complexity):

Register for I Am Legend Community

Register for I Am Legend Community

Since I’m now using the Zend Framework, and it’s form component is Zend_Form, I can honestly say after the flexibility of HTML_QuickForm and Smarty Zend_Form is, at first, not so awesome. A lot of the resources and tutorials/articles for Zend_Form tout it’s use of the decorator design pattern and all the examples I found looked the same. Not. Good.

Almost none of the references I looked at mentioned anything about removing decorators and rendering just the raw form elements like I needed. It is possible though; you just have to attache a couple extra methods to remove the decorators as laid out below. Make note of the calls to “removeDecorator” and “setAttrib”. Those are the key pieces.

As a counter point here’s the above script using Zend_Form:

<?php
//APPLICATION_PATH/forms/Login.php
<?php
 
class Form_Login extends Zend_Form
{
	public function __construct($options = null)
	{
		parent::__construct($options);
 
		$email = new Zend_Form_Element_Text('email');
		$email->setLabel('Email')
				->setRequired(true)
				->addFilter('StripTags')
				->addFilter('StringTrim')
				->addValidator('NotEmpty', TRUE)
				->addValidator(new Zend_Validate_Db_RecordExists('users', 'email'))
				->removeDecorator('label')
				->removeDecorator('htmlTag')
				->removeDecorator('description')
				->setAttrib('class', 'transperentInput');
 
		$password = new Zend_Form_Element_Password('password');
		$password->setLabel('Password')
				->setRequired(true)
				->addFilter('StripTags')
				->addFilter('StringTrim')
				->addValidator('NotEmpty')
				->removeDecorator('label')
				->removeDecorator('htmlTag')
				->removeDecorator('description')
				->setAttrib('class', 'transperentInput');
 
		$submit = new Zend_Form_Element_Submit('submit');		
		$this->addElements(array($email, $password, $submit));
    }
}
?>

Since Zend_Form is a part of the Zend Framework MVC the above is just the form class and the below is the actual processing portion:

<?php
//APPLICATION_PATH/controllers/Login.php
class LoginController extends Zend_Controller_Action
{
	public function indexAction()
	{
		$form = new Form_Login;
		if ($this->getRequest()->isPost()) {
 
			$formData = $this->getRequest()->getPost();
			if ($form->isValid($formData)) {
                            //do the processing stuff here...
 
			}
 
		}
 
		$this->view->form = $form;
	}
}
?>

Sigh…
And then in the view script:

<form action="<?php echo $this->escape($this->form->getAction()); ?>" 
method="<?php echo $this->escape($this->form->getMethod()) ?>" 
id="sumbitForm">
<div id="email">
	Email: <?=$this->form->email; ?>
</div>
 
<div id="password">
	Password: <?=$this->form->password; ?>
</div>
 
<div id="remember">
	<?=$this->form->remember; ?>
</div>
 
 
<div id="submit">
	<?=$this->form->submit; ?>
</div>
</form>

There you go: Zend_Form is your bitch.

Bookmark and Share

pChart – a PHP class to build charts

Posted in Code, Programming on September 11th, 2009 by Eric Lamb – 2 Comments

In my never ending quest to find a replacement for JpGraph  I’ve covered charts built using JavaScript with the Google Visualization API and charts done with SWFs using Open Flash Charts (OFS). If you’re building web apps it’s easy to just stop there and consider yourself covered. I certainly thought so; until my conscience spoke up that is.

pChart

pChart

The thought them comes creaping into my head, “Um… What about the JavaScript? How do you think those pretty charts and graphs will degrade?”.

Shit.

Not to take anything away from either of those programs; they’re very fun to work with and, relatively, easy to use. It’s just that they’re both rendered using JavaScript which is well and good provided your user has JavaScript enabled (and Flash too for OFS). It’d be a nice addition to provide an alternative when using either one of the previous programs.

This is where pChart comes in:

pChart is a PHP class oriented framework designed to create aliased charts. Most of todays chart libraries have a cost, our project is intended to be free. Data can be retrieved from SQL queries, CSV files, or manually provided. This project is still under development and new features or fix are made every week.

Focus has been put on rendering quality introducing an aliasing algorithm to draw eye candy graphics. Rendering speed has been dramatically enhanced since the first version, we’ll still continue optimising the code!

Implementation is pretty easy too:

// Standard inclusions
include("pChart/pData.class");
include("pChart/pChart.class");
 
// Dataset definition
$DataSet = new pData;
$DataSet-&gt;AddPoint(array(1,4,3,2,3,3,2,1,0,7,4,3,2,3,3,5,1,0,7));
$DataSet-&gt;AddSerie();
$DataSet-&gt;SetSerieName("Sample data","Serie1");
 
// Initialise the graph
$Test = new pChart(700,230);
$Test-&gt;setFontProperties("Fonts/tahoma.ttf",10);
$Test-&gt;setGraphArea(40,30,680,200);
$Test-&gt;drawGraphArea(252,252,252);
$Test-&gt;drawScale($DataSet-&gt;GetData(),$DataSet-&gt;GetDataDescription(),SCALE_NORMAL,150,150,150,TRUE,0,2);
$Test-&gt;drawGrid(4,TRUE,230,230,230,255);
 
// Draw the line graph
$Test-&gt;drawLineGraph($DataSet-&gt;GetData(),$DataSet-&gt;GetDataDescription());
$Test-&gt;drawPlotGraph($DataSet-&gt;GetData(),$DataSet-&gt;GetDataDescription(),3,2,255,255,255);
 
// Finish the graph
$Test-&gt;setFontProperties("Fonts/tahoma.ttf",8);
$Test-&gt;drawLegend(45,35,$DataSet-&gt;GetDataDescription(),255,255,255);
$Test-&gt;setFontProperties("Fonts/tahoma.ttf",10);
$Test-&gt;drawTitle(60,22,"My pretty graph",50,50,50,585);
$Test-&gt;Render("Naked.png");
?&gt;

The above code produces something similar to:

pChart Linechart Example

pChart Linechart Example

One really cool addition the developers added was a little cmd script, buildAll.cmd, to automate the build of all the Example scripts on Windows machines. Just double click that and you’ll have all the graph images generated automatically.

It is recommended by the developers that caching is implemented but I haven’t really found the need for it yet.

A good idea, and one I’m going to be implementing, is to use charts and graphs created with OFC and create static image graphs for the noscript tags using pChart. Definitely a lot of work but it’ll add a bit of shiny to my programs. Yours too I think.

Bookmark and Share