Quick Note: This is taken straight out of one of my applications. I have a singleton registry object called $core which you’ll see referenced many times. I suggest you make your own or use global variables.

.htaccess

First of all we need to create a .htaccess file in the root directory of your project. We turn the RewriteEngine on, and then declare a rule to route everything except images/js/css through our index.php file. So even if the person goes to www.yoursite.com/directory/file.php , rather than executing that file it will execute our index.php instead.

RewriteEngine on
RewriteRule !\.(js|ico|txt|gif|jpg|png|css)$ index.php

If your building a framework or application you’ll probably have some ini/bootstrapping code that you want to run here. The router itself is procedural so include it at the bottom of index.php.

Declaring the Routes

We define our routes in an array called $urls (naming matters). You can declare these anywhere before the router is included. In the array key we declare our regular expression. I’ve listed a couple as examples below. The first matches to the root - as if someone went to www.yoursite.com. This gets mapped to application/views/blog.php , then the index() method in the blog class is executed. The second is slightly more complex and captures a value called slug. This value is then passed as a parameter in the individual_post() method when it is executed.

$urls = array(
			// "Regex to match" => "path_to_file.php___className___functionName",

			"(^[/]$)" => "application/views/blog.php___blog___index", // No captured values
			"(/post/(?P <slug>\w.*)$)" => "application/views/blog.php___blog___individual_post",

			);

The Router Itself

The operation of the router itself is pretty simple:

• Figure out the URI the user requested
• Try and match one of the defined regular expressions to that URI
• If it does match, see if there are any captured matches (eg. our slug name above)
• If there are matches, call the appropriate method and pass them as a parameter

First we need to figure out the URI. For example if they went to www.yoursite.com/blog/first-post/ , we would just want to capture the /blog/first-post/ so it matches our regular expressions. The code below does that with a series of str_replace()s.

$already_there = str_replace('index.php', '', $_SERVER['SCRIPT_NAME']);

$slightly = str_replace($_SERVER['SCRIPT_NAME'], "", $_SERVER['REQUEST_URI']);

$uri = '/' . str_replace($already_there, '', $slightly);

We will then iterate through our defined URL routes/regular expressions and try to get a match.

foreach($urls as $regex => $mapper)
{

	if (preg_match($regex, $uri, $matches))
	{

$matches is an array that is populated when a URL pattern is matched. If we are capturing a value (eg. slug in the above example) then there will be a key called ’slug’ and the value it captured in the array. If there is only one item in the $matches array, then there the user didn’t try to capture any values in their regular expression so we don’t need to pass any arguments in the method that we call. We simply explode the $val variable to get the filename, class name and method name, then call it.
If however we iterate across a key that isn’t numeric, then we know there is a value that is getting captured. We simply get that and pass it as an argument when we call the method.

		foreach($matches as $key => $val)
		{

			if(count($matches) == 1)
			{

				$foo = explode("___", $mapper);

				//Include the view they specified
				include($core->settings->application_path . $foo[0]);

				//Instantiate a new class they specified
				$bar = new $foo[1]();

				//Call the function they specified
				$bar->$foo[2]();

			}

			//Make sure the key is not numeric - some extra garbage preg_match() gives us.
			if(!is_numeric($key))
			{

				//Split the value they defined up into sections
				$foo = explode("___", $mapper);

				//Include the view they specified
				include($core->settings->application_path . $foo[0]);

				//Instantiate a new class they specified
				$bar = new $foo[1]();

				//Call the function they specified
				$bar->$foo[2]($val);

				//echo $key . ' -> ' . $val . '';
			}
		}
	break;

Theres also a place to indicate to the user that there we no matches - it’s up to you if you want to give a custom error page, 404, whatever.

	}
	else
	{
	    //echo "A match was not found.";
	}

}

Example

We have a simple application with the index.php file in the root directory and a directory called classes that contains numerous classes.
classes/time.class.php

class time
{
	function fn1()
	{
		echo 'hello world';
	}
}

The code below shows what we’d need to do if we didn’t have autoload. While that code doesn’t seem so bad, imagine writing includes on each of your 30-40 files. It would get messy and very hard to maintain. Another option would be to have a single file that all of your classes are included in, there include that one file in each of your functional scripts but you could expect a performance loss as every one of your classes would be included on the page - even if it wasn’t needed.

index.php

include('classes/time.class.php');

$time = new time();

$time->fn1();

//Returns hello world

The __autoload() function accepts one parameter - the name of the class that is being instantiated. We pass this so we know what file to include.

index.php revised

function __autoload($class_name)
{
	include('classes/' . $class_name . '.class.php');
}

$time = new time();

$time->fn1();

//Returns hello world

A More Complex Example

Large projects and frameworks often have classes split up into groups - extensions, modules and core components. When instantiating a new class, we don’t want to have to declare what group it belongs to. We can build this right into our autoload function, and also check if the file/class exists.

function __autoload($class)
{

	if(file_exists('core/' . $class . '.class.php'))
	{
		include('core/' . $class . '.class.php');
	}

	if(file_exists('extensions/' . $class . '.class.php'))
	{
		include('extensions/' . $class . '.class.php');
	}

	if(file_exists('modules/' . $class . '.class.php'))
	{
		include('modules/' . $class . '.class.php');
	}

}

Netbeans

Netbeans is a full featured IDE written in Java by Sun. Some people prefer Eclipse and Eclipse based IDEs (Aptana) but I find them slow and laggy on my system. The current Netbeans version in the Ubuntu repositories is 6.1, whlie this is good for Java and C++ developement, PHP support wasn’t included until 6.5.X. You can download the PHP package here - 26mb. Netbeans comes with standard project support, code completion, syntax highlighting and searching. What sets Netbeans apart from the rest is that it has on the fly PHP debugging (that works!). It also has version control support out of the box and in general it’s very quick.

Gedit

Gedit is the default text editor for GNOME, if you use GNOME, chances are it is already installed. If not you can find it by the package name gedit in your distro’s repository. The KDE equivalent is Kate. By itself it is just a text editor, but with a few plugins you can turn it into a mini IDE. You can view all of the available plugins here they range from version control to a lorem ipsum generator. I recommend you install the following:

• Browser preview - Firefox, Opera, Internet Explorer (done through ies4linux)
• Python Console - Supports PyGTK, PyQT and Tkinter. Think of an in-editor IDLE
• File Browser - Gives a pane to view files. Comes with Gedit out of the box.
• Code Snippets - Allows you to type a few characters and expand them to full code snippets. Comes with Gedit out of the box.

Heidi SQL

The choice of SQL editor largely depends upon the person as there are many with similar features. I prefer HeidiSQL. Although there are no native builds of HeidiSQL for Linux, it runs perfectly under WINE. I find it easier to use than phpmyadmin as content loads seamlessly and you can be connected to several different servers simultaneously.

Firefox

Although Firefox is primarily a web browser, there have been many creative addons released that add extra functionality to it. I won’t cover Firebug as there are many articles and tutorials out there but I will bring your attention to Pencil. Pencil allows you to prototype user interfaces. It includes Microsoft Windows and GTK+ widgets that you can drag and drop onto a palette. Although it doesn’t actually generate an XML file like the Glade Interface Designer does, it allows for rapid prototyping for both desktop and web. As it’s a firefox addon it’s cross platform, so you can share interfaces you make with colleagues.

Filezilla

Filezilla is an open source cross-platform FTP client. It has an easy to use five pane interface. Two for local directories and files, two for remote directories and files and one for the status of transferring files. Filezilla can also connect through proxies or sFTP. One of my favourite features of Filezilla is that you can edit remote files on the fly. Just right click on the file and choose the edit option and it will download the contents and open it in your specified editor. When you save the file it will automatically re-upload itself to the server.

Setup

Install and do some basic configuration (URL, database settings) of Code Igniter. If you don’t know how to do this, read here. Autoload the database library and url helper as we will be using them.

The user will be able to post new items and delete current items and the app itself will be made up of:

• One Controller - todo.php
• One Model - todo_model.php
• One View - todo_index.php

PHP4 Compatibility

Because Code Igniter supports both PHP4 and PHP5, you are forced to use PHP4 style OOP. Your constructor must be the same name as the class, and it needs to contain parent::Controller(); or parent::Model();
The naming conventions for controllers and models are very strict. The name of both class and constructor must be the same as the file name, but capitalized. In our case of our controller, the file name is todo.php and the name of the class and constructor is called Todo.

Model

The model in Code Igniter is a place where you write your application’s SQL queries (It doesn’t map your schema like in Django/RoR). In our application we specify 3 methods, which can then be called upon in the controller. You will notice we are using the Code Igniter database class but not Code Igniter’s full ORM. This is just personal preference. In get_all_todo_items() we call $q->result_array() . Think of it as an equivalent to mysql_fetch_array().

class Todo_model extends Model {

    function Todo_model()

    {

        parent::Model();

    }

	function new_todo($content)

	{
		$date = date('l jS \of F Y h:i:s A');

		$q = $this->db->query("INSERT INTO items (date,content) VALUES ('$date','$content')");

	}

	function get_all_todo_items()
	{
		$q = $this->db->query("SELECT id,date,content FROM items");
		return $q->result_array();
	}

	function delete_todo_item($id)
	{
		$q = $this->db->query("DELETE FROM items WHERE id = '$id'");
	}

}

Controller

/system/application/controllers/todo.php

You can also see in the Controller that we are loading the form helper and todo_model model. Notice there are no file extensions being used. In Code Igniter URLs are structured like: www.foo.com/ci/index.php/controller/method/. If no method is specified then Code Igniter will automatically run the index() method.

index_page()
We assign the results of get_all_todo_items() to $info['item'] . We then pass the $info array (which contains all of our todo items) to our view which we’ll create soon.
add_item()
Rather than using $_POST['content'] to access a property, you should use $this->input->post(’content’). This utilises Code Igniter’s input class which automatically filters out SQL injections and XSS attacks (line 266 /application/config/config.php)
We then pass the result from that to our new_todo() method in our model and redirect the user back to the index page.
delete_item()
We can use the segment() method in the uri class to grab bits of information from the URL. Because our URI will be /todo/delete_item/id/, by grabbing the 3rd segment we get the id. We can then feed that do our delete_todo_item() method we defined in the model and redirect the user to the main page.

class Todo extends Controller {

	function Todo()
	{
		parent::Controller();
                $this->load->helper('url');
		$this->load->helper('form');
		$this->load->model('todo_model');
	}

	function index()
	{
		$this->index_page();
	}

	function index_page()
	{
		$info['item'] = $this->todo_model->get_all_todo_items();
		$this->load->view('todo_index.php', $info);
	}

	function add_item()
	{
		$content = $this->input->post('content');
		$this->todo_model->new_todo($content);

		redirect('');
	}

	function delete_item()
	{
		$this->todo_model->delete_todo_item($this->uri->segment(3));

		redirect('');
	}
}

Finally we need to write our view.

/system/application/views/todo_index.php

On line 5 you can see the form_open() function being used. This creates our opening form tag. The action attribute is specified by the parameter that we passed. Code Igniter automatically prepends your site URL to this parameter it ends up as action=”http://path_to_site.com/URI_passed”. This is useful because if we move the site to another domain name, the form will continue to post to the correct URL. Between lines 12 and 17 we are iterating through the todo items posted.

<h1>Todo List</h1>

<hr />

<?php echo form_open('todo/add_item'); ?>

	<textarea cols="40" rows="10" name="content"></textarea>
	<input type="submit" value="Add new item" />
</form>

<ul>
<?php
for($i = 0; $i < sizeof($item); ++$i)
{
    echo '<li>' . $item[$i]['content'] . ' - <i>' . $item[$i]['date'] . '</i> - <a href="' . site_url() . '/todo/delete_item/' . $item[$i]['id'] . '">Delete</a></li>';
}
?>
</ul>

<hr />
<p>Created by <a href="http://www.query7.com">Query7</a></p>

Feel free to post any questions or comments you have.

Code Igniter is a PHP web framework which assists in creating complex websites. Unlike other web frameworks, Code Igniter doesn’t force you to use all of it’s components. You select and load them as you require. The only feature you have to use is the URL structuring (/controller/method/) which is very helpful anyway.

Code Igniter follows the Model, View, Controller (MVC) principle. All of your database queries are stored in models, HTML/XML output in Views and the logic code in Controllers. You aren’t forced to do this, however it does keep your code organized and reusable.

Helpers and Libraries

Like most frameworks, Code Igniter comes with many classes that help assist development. They are split into Libraries (AKA Classes) and Helpers. Libraries contain code that you could use on every page of your application - Database ORM, Image Manipulation, Pagination and Benchmarking. Helpers are things like Relative URLs, Forms and Email.

Using helpers and libraries is very easy. If you want it included throughout the site see below (autoloads). If you want it included for every method in a Controller, then you can add it to that Controller’s constructor. If you just want it included in one method, add the code inside the method.

$this->load->helper('helper_name');
$this->load->library('library_name');

Installation

Installing Code Igniter is alot easier than installing other PHP web frameworks. There is no need for command line access, nor the need to write your database schema in XML. You only need to edit a few configuration files.

Download and Install the latest version off the Code Igniter download page. Extract it and upload it to your web server. You may notice the directory /user_guide/ . This only contains documentation so it can be deleted safely. Up to date documentation can always be found at www.codeigniter.com/user_guide/.

Now that Code Igniter has been ‘installed’ we need to configure our settings. Open..

/system/application/config/config.php

On line 14 we need to set the path to our website. Make sure it has a trailing slash.

$config['base_url']	= "http://www.website.com/path/to/codeigniter/";

I also put global XSS filtering on. By default it is not active. Replace line 267 with..

$config['global_xss_filtering'] = TRUE;

If your application uses a database, now is a good time to set it up. Open..

/system/application/config/database.php

$db['default']['hostname'] = "localhost"; //usually localhost
$db['default']['username'] = "usernamet";  //database username
$db['default']['password'] = "password";  //password to user set above
$db['default']['database'] = "database";  //database name
$db['default']['dbdriver'] = "mysql";  //database driver - mysql/postgre/sqlite etc..
$db['default']['dbprefix'] = "";
$db['default']['pconnect'] = FALSE;
$db['default']['db_debug'] = TRUE;
$db['default']['cache_on'] = FALSE;
$db['default']['cachedir'] = "";
$db['default']['char_set'] = "utf8";
$db['default']['dbcollat'] = "utf8_general_ci";

When you call the database class, Code Igniter will connect to the database with the information you set in $db['default'] array.

$this->load->database();

You can then interact with the database through

$this->db->method();

If your application uses more than one database, you can set another array in the same database.php file but call it a seperate name. eg $db['remote'] (copy and paste the $db['default'] array and change where necessary). You can then connect that database with..

$remote_db = $this->load->database('remote', TRUE);

And execute database methods through..

$remote_db->method();

I also recommend you set up autoloads..

/system/application/config/autoload.php

Here you can specify classes and helpers that will be available in every file throughout your project. This is useful because you won’t need to call them every time you make a new controller. I recommend autoloading the database class and the URL helper. You will find the URL helper very useful in your Views, being able to use relative URLs instead of hard coding full http://www.website.com/path/to/codeigniter/ URLs is very useful. You just need to add the name of the library/helper in the appropriate array..

$autoload['libraries'] = array('database');
$autoload['helper'] = array('url');

Thats it.. Feel free to ask any questions.
In the next couple of weeks I’ll be writing a tutorial showing how to get a fully featured authentication system up and running with Code Igniter.

It will consist of two textareas, two dropdowns and one button. It will look something like this:

HTML

The HTML code is fairly straight foward. Notice the dropdown menus have values. These are essential as this is the language code, it’s sent to Google.

<body>
<div class="he">
<h2>Translate</h2>
From:
<select id="from">
<option value=sq>Albanian</option><option value=ar>Arabic</option><option value=bg>Bulgarian</option><option value=ca>Catalan</option><option value=zh-CN>Chinese (Simplified)</option><option value=zh-TW>Chinese (Traditional)</option><option value=hr>Croatian</option><option value=cs>Czech</option><option value=da>Danish</option><option value=nl>Dutch</option><option value=en selected>English</option><option value=et>Estonian</option><option value=tl>Filipino</option><option value=fi>Finnish</option><option value=fr>French</option><option value=gl>Galician</option><option value=de>German</option><option value=el>Greek</option><option value=iw>Hebrew</option><option value=hi>Hindi</option><option value=hu>Hungarian</option><option value=id>Indonesian</option><option value=it>Italian</option><option value=ja>Japanese</option><option value=ko>Korean</option><option value=lv>Latvian</option><option value=lt>Lithuanian</option><option value=mt>Maltese</option><option value=no>Norwegian</option><option value=pl>Polish</option><option value=pt>Portuguese</option><option value=ro>Romanian</option><option value=ru>Russian</option><option value=sr>Serbian</option><option value=sk>Slovak</option><option value=sl>Slovenian</option><option value=es>Spanish</option><option value=sv>Swedish</option><option value=th>Thai</option><option value=tr>Turkish</option><option value=uk>Ukrainian</option><option value=vi>Vietnamese</option>
</select>

To:
<select id="to">
<option value=sq>Albanian</option><option value=ar>Arabic</option><option value=bg>Bulgarian</option><option value=ca>Catalan</option><option value=zh-CN>Chinese (Simplified)</option><option value=zh-TW>Chinese (Traditional)</option><option value=hr>Croatian</option><option value=cs>Czech</option><option value=da>Danish</option><option value=nl>Dutch</option><option value=en selected>English</option><option value=et>Estonian</option><option value=tl>Filipino</option><option value=fi>Finnish</option><option value=fr>French</option><option value=gl>Galician</option><option value=de>German</option><option value=el>Greek</option><option value=iw>Hebrew</option><option value=hi>Hindi</option><option value=hu>Hungarian</option><option value=id>Indonesian</option><option value=it>Italian</option><option value=ja>Japanese</option><option value=ko>Korean</option><option value=lv>Latvian</option><option value=lt>Lithuanian</option><option value=mt>Maltese</option><option value=no>Norwegian</option><option value=pl>Polish</option><option value=pt>Portuguese</option><option value=ro>Romanian</option><option value=ru>Russian</option><option value=sr>Serbian</option><option value=sk>Slovak</option><option value=sl>Slovenian</option><option value=es>Spanish</option><option value=sv>Swedish</option><option value=th>Thai</option><option value=tr>Turkish</option><option value=uk>Ukrainian</option><option value=vi>Vietnamese</option>

</select>
</div>

<div class="tebg">
<table>
<tr><td><textarea rows="10" cols="60" id="or" class="te"></textarea></td></tr>
<tr><td><textarea rows="10" cols="60" id="tr" class="te"></textarea></td></tr>
</table>
</div>

<input type="submit" id="translate" value="Translate" />
<div id="translation"></div>
</body>

We’ll start by including Google’s Language API and jQuery. We can’t link directly to a language.js file, instead we need to use Google’s own load function. jQuery will also be included this way.

google.load("language", "1");
google.load("jquery", "1.3.2");

We need to use jQuery to get 3 values. The textarea containing the words they want translated, the language it is currently in and the language they want it translated into. We only want to capture these when the user clicks the translate button so we wrap it in the click event.

    $(document).ready(function(){

		    $("#translate").click(function(){

		        var from = $("#from").val();
			var to = $("#to").val();

			var orig = $("#or").val();

			    });

	});

Now we need to use Google’s translate function. It takes several parameters - the text we want translated (orig), the language the text was in (from) and the language we want it translated to (to). We capture the information google sends back to is in result. If there are no errors then we set the textarea to the translated text.

google.language.translate(orig, from, to, function(result) {

	if(!result.error)
	{

		$("#tr").val(result.translation);

	}

	});

If you have any questions or comments feel free to post them below.

Git

A typical programmer’s workflow would be to:

1. pull (download) the latest copy of code from the git respository.
2. Make neccessary changes, modify code etc.
3. commit the changed files
4. push (upload) the files back to the git repository.

If multiple programmers were working on the same project they would all use the same git repository. It’s good practice to always pull the latest copy before you push any of your changes to make sure your using the most update-to-date copy of the code (Someone may have pushed another change while you were editing your code). You can also branch (fork) a git repository. For example two programmers might be working on the same code but both are implementing different features. Their work flow would be something like:

1. Each of them fork the master (main) copy of code
2. Make appropriate changes to their branches/forks of code
3. Merge both forks back into master (Git does this for you)

Installing Git

Git is very easy to install and use on *nix type operating systems (Linux, Mac, BSD). Using Macports or your package management system, install the package git-core. It’s a little more complicated on Windows. I use msysgit. Download and install that. On Windows git is not integrated into the windows command prompt, instead it has it’s own *nix like terminal (cygwin?). You use *nix commands rather than windows commands -  ls instead of dir. Fire up the shortcut to ‘git bash’ (The git command prompt), you should be able to cd around, viewing your directories, and when you type git it should bring you up a list of available commands.

Git Basics

To use Git you must have a repository. You can host one yourself or use one of the numerous Git Hosts out there. I use Github, it allows unlimited repositories for open source projects, and also offers paid plans for private repositories. For the rest of this tutorial I’ll assume your using github. The first thing you need to do is set your username and email. (In the git shell)

git config --global user.name "Username Here"

git config --global user.email "email@email.here"

Note that we use –global, this tells git that we want these details to be applied to all of our projects, you can can override these settings when in the local project directory by calling the command again without the –global flag.

Now we need to generate an SSH key. Git requires it as it’s an extra step of authentication. There are numerous ways to generate the key and they are different on all platforms so I advise you read this (github.com) tutorial on setting it up.

The final step is to create the git project itself. On Github, login to an account (that you have created) then head over to the create a repository page. Enter the information and hit Ok.

Now we can make that project on our local system. Change into the project’s directory then

git init

This generates the .git directory and git will now start ‘watching’ deletes, alterations and the like. Now we need to add the files that we want to commit. You can name them individually or to select all we simply use the decimal point.

git add .

That will add the entire directory’s contents and all sub directories. We can then commit our changes/additions. We also provide a commit message, explaining to ourselves/others/repository readers what changes you made in that commit - eg new features in the code.

git commit -m 'This is our first commit'

Now we need to attach our project to the repository, then push the changes we made. Again, this is fairly simple.

git remote add origin git@github.com:GITHUBUSERNAME/REPOSITORYNAME.git

git push origin master

You can view your project’s page on github now and you will see that the files have been added. From now on it’s just a matter of git add-ing altered files, git commit-ing then finally git push-ing to upload the changes.

RSS Feed consumption has always been a stick point in PHP. Simple Pie is a library that works with both PHP4 and PHP5 that enables you to easily parse and save RSS feeds. Today I’ll show you some common uses of Simple Pie and explain how it runs.

Simple Pie requires:

• PHP 4.3.0 or higher
• cURL Enabled.
• zLib (Caching?)

As well as a few other PHP modules that will be enabled in a vanilla PHP install. To run the compatibility test, upload the un-compressed archive to your server and navigate to www.yourname.com/pathtosimplepie/compatibility_test/sp_compatibility_test.php .

Finding the RSS Feed

The first thing we need to do is include SimplePie and then make a new SimplePie feed.

include('path/to/simplepie.inc');

$feed = new SimplePie('lastkarrde.com');

Simple Pie has a very useful ‘auto feed discovery’ feature. If you give it a plain URL, such as Query7.com, it will automatically find the RSS feed. Of course you can specify the path to the .xml file or Feed Burner page if you wanted to. Although the feed has been pulled we need to do call on another function, handle_content_type, to ensure that the feed has the correct mime type and encoding.

$feed->handle_content_type();

Parsing the RSS Feed

Now that all of the configuration/setup is done (all 3 lines of it) we can parse the feed on our page. We use a foreach loop to iterate through all of the items. Simple Pie’s functions make everything easy! As you can see below we simply echo the date, content and title of each item in the RSS feed.

foreach($feed->get_items() as $item){

echo '<h3><a href="' . $item->get_permalink() . '">' . $item->get_title() . '</a></h3>';
echo '<p>' . $item->get_date() . '</p>';
echo '<p>' . $item->get_content() . '</p>';

}

Extra Data from the Feed

In the above example we only got the permalink, title, date and content from each feed item. Simple Pie provides alot of other functions that are used in the same way. Some of the more useful ones are.

• get_author(s) - Get the author(s) of the post item (if set).
• get_description - Gets a summary of the post content, rather than the whole post like get_content() does.
• get_source - Returns the source site of the feed. This is particularly useful if you are parsing multiple feeds and displaying them on one page.
• get_title - Returns the title of the entire RSS feed, wouldn’t be called in the loop.

Parsing Multiple Feeds onto one Page

With Simple Pie, this is painfully easy. When declaring a new instance of the Simple Pie class, we pass an array of websites rather than a string. Instead of..

$feed = new SimplePie('lastkarrde.com');

We would use

$sites = array('query7.com', 'digg.com', slashdot.org');
$feed = new SimplePie($sites);

Caching

Simple Pie comes with an easy to use and very effective caching system. By default it caches each feed for 60 minutes, then it automatically discards it and pulls a new copy of the feed. This is great for a ‘typical user’ who just wants to use Simple Pie for a few things but for someone who knows the feed they are monitoring updates every 2 hours.. or every 20 minutes you need to change the length of caching time. This is done with the set_cache_duration() function. You specify it after you have pulled the feed, but before you display any information onto the page. You can also change the location of where the feed is cached with the set_cache_location() function. Both are demonstrated below.

$feed = new SimplePie('query7.com');
$feed->set_cache_duration(1800); //Value in seconds, 1800s = 30 minutes
$feed->set_cache_duration('/home/user/simplepie/customcache'); //Full path to cache

//Continue with display code here.

As you can see Simple Pie makes parsing RSS feeds really easy. You don’t have to parse them directly onto the page, you can just as easily put database INSERTs into the loop rather than echos and display them from the database at a later date. Simple Pie is an open source project so you don’t need to worry about any fees or license agreements.

If you have any questions about Simple Pie, feel free to post them below.

First we’ll setup some variables to allow for easy editing.

$dir = '/path/to/file'; // Directory to backup.
$filename = 'backups/backup' . date("MdY") . '.tar'; //path to where the file will be saved.

$ftp_server = 'urlToFTPServer.Com'; //External FTP server
$ftp_user_name = 'ftpUsername'; //External FTP server username
$ftp_password = 'ftpPassword'; //External FTP server password

Now we need to archive the site. We’re going to wrap an if statement around it so if for some reason it doesn’t archive, the FTP part of the script won’t try and copy it over to another server. The system function executes a system command, here we are calling tar cvf which will archive our $dir (directory) and save it to the path specified in $filename.

if(system("tar cvf $filename $dir")){

We’ll then connect to the FTP server itself. Because we set variables, if we need to change servers, it’s very easy to implement.

$conn_id = ftp_connect($ftp_server); 

$login_result = ftp_login($conn_id, $ftp_user_name, $ftp_user_password);

If it connects to the server, then we can move our backup across. We give it the same name as the archive on our own server and store it in a /backups directory.

if (($conn_id) || ($login_result)) { 

$upload = ftp_put($conn_id, 'backups/' . date("MdY") . '.tar', $filename, FTP_BINARY);      

    }

Once that is done, we can close the FTP stream as we don’t need to use it anymore.

ftp_close($conn_id);
} //Initial if statement

All thats needed to do is automate this script. For this we use something built into the Linux Operating System called a Cron Tab. Crons will automatically run a script at a time you specify. We can set it up to run every time at the same day so you have a daily backup. You can make this more frequent or less frequent depending on how often the data of your site changes. Making a cronjob in cPanel is alot easier than if you didn’t have cPanel. But both are fairly straight foward.

Take this standard web page. It pulls the latest news items from a database and displays them like so. That is the basic DOM of the page.

<head>
<title>Latest News</title>
</head>

<body>

# More Header, sidebar code here #

<p class="latest">Employees at the Karate Bank are getting the chop</p>
<p class="latest">NASA shares have sky-rocketed</p>
<p class="latest">Investors at the Sushi Bank feel they are getting a raw deal</p>

# More content, footer code here #

</body>

</html>
</pre>

If we wanted to highlight all of the news items on this page we can use jQuery’s each method to iterate through them and modify their CSS.

$("p.latest").each(function(){

	$(this).css({"background-color" : "yellow"});

});

But what if we wanted to pull that information from another page? Due to some restrictions in the software the website is using, mayby they can’t display the latest posts on every page that they want to. To get this information we would need to do 2 things. The first is to pull the latest news page itselfand the second is to parse that page and only show the latest news (not the header, sidebar etc.)

Ajax

First of all we want to pull the page using AJAX and save it in a variable. To do this we use jQuery’s $.get method. We specify the page and since we are not sending any data (like information from a form) we don’t need to specify anything else. We then save the contents of latestnews.html into the variable content. This is important.

$.get('http://urlto.com/latestnews.html' ,function(content) {

});

Narrowing Our Search

At this stage we cannot simply document.write(content) as it contains all of the header, footer, sidebar and text in there. We need to select the latest news paragraphs that we want. For this we use jQuery’s standard selector. We don’t need to use a special plugin or write our own function. The only thing we need to change is to pass an extra parameter into the selector. This parameter tells jQuery’s selector engine where it look for the pattern/rule. If it isn’t specified (it usually isn’t in standard codes) then jQuery assumes you mean the current page’s source (DOM) however by specifying this we can narrow our search. In the code below we pass the content variable (which contains the entire source of latestnews.html) into the selector. jQuery will then look for all paragraphs with a class of latest inside the content variable.

$.get('http://urlto.com/latestnews.html' ,function(content) {

$("p.latest", content).each(function(){

});

});

Displaying the data

Since we have matched the URLs, we can display the content as we please.
If we wanted to highlight the latest news paragraphs on that page then we would:

$.get('http://urlto.com/latestnews.html' ,function(content) {

$("p.latest", content).each(function(){

$(this).appendTo("#latest");

});

});

More

Using the information you’ve learnt, you can apply this to other situations. For example you can parse RSS feeds and reflect live updates of the RSS feed on the website straight away. These techniques are especially useful in remotely hosted software systems where you have no control over the source code. Or if PHP coding isn’t your strong point, but you know a little bit of jQuery, you can easily modify some of your website content this way.

1. The Firebug Extension for Firefox
2. Greasemonkey

If the page that we are going to manipulate doesn’t already include jQuery on it, then we can include it with this small Greasemonkey script. If jQuery is already included on the page, there is no use for this script.

// Add jQuery
    var GM_JQ = document.createElement('script');
    GM_JQ.src = 'http://jquery.com/src/jquery-latest.js';
    GM_JQ.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(GM_JQ);

// Check if jQuery's loaded
    function GM_wait() {
        if(typeof unsafeWindow.jQuery == 'undefined') { window.setTimeout(GM_wait,100); }
    else { $ = unsafeWindow.jQuery; letsJQuery(); }
    }
    GM_wait();

// All your GM code must be inside this function
    function letsJQuery() {
        alert($); // check if the dollar (jquery) function works

    }

Source
With the jQuery library on the page we can now go ahead and start entering commands. For this example we’ll take jQuery.com, we can enter a basic jQuery Selector and see what happens.

before.png (http://img228.imageshack.us/img228/1918/beforeus0.png) Download, rehost, embed this image here.

after.png (http://img218.imageshack.us/img218/5812/aftercd6.png) Download, rehost, embed this image here.

As you can see it’s very easy to manipulate pages. You can use this to manipulate scripts that your working on. For example, if you were trying to nail down a certain selector, or find a 4th parent of something, its going to be alot easier and faster to do it in the Firebug terminal than editing, saving and refreshing the page while your trying to perfect it. With jQuery’s CSS capabilities, you can also test your CSS out live, without needing to switch back and forth between your editor and firefox.

In part 1 of the tutorial, we covered the PHP and MySQL side of things. In this part we will be enhancing it with jQuery’s AJAX and manipulation functionality. The to-do list will degrade fine - if the user has Javascript disabled, the application will still work. All changes occur in the index.php file.

There are two parts to the script. One handles the posting of new posts, while the other handles posts being deleted. We’ll start with adding new posts.

//When the button with an id of submit is clicked (the submit button)
$("#submit").click(function(){

//Retrieve the contents of the textarea (the content)
var formvalue = $("#content").val();

//Build the URL that we will send
var url = 'submit=1&content=' + formvalue;

//Use jQuery's ajax function to send it
 $.ajax({
   type: "POST",
   url: "process.php",
   data: url,
   success: function(){

//If successful , notify the user that it was added
   $("ul").before("<p class='new'>You just added: <i>" + formvalue + "</i></p>");

   }
 });

//We return false so when the button is clicked, it doesn't follow the action
return false;

});

The url part confuses some people. What we are doing is sending a request to the process page, we need to include some data with that request. In process.php there was the line

if($_POST['submit']){

It checks to see if $_POST['submit'] isn’t null (has a value). If it is null (has no value), then it means that the form hadn’t been submitted, by sending any value, in our case submit=1, we are telling process.php that the button had been clicked so it should run the rest of the PHP script. The rest of the PHP script calls for the content, which we also send in the url (content= ‘ + formvalue). Instead of sending anything, we only want to send the value of the form (The stuff inside the textarea - that the user wants to submit). By returning false at the end, it prevents the submit button from carrying through with its action=”process.php”. If it did, it means the page would refresh when the information was sent which is exactly what we don’t want.

The code that handles the deletion of posts is similar.

//Check to see if an anchor link was clicked (The delete link)
$("a").click(function(){

//Save the link in a variable called element
var element = $(this);

//Find the id of the link that was clicked
var noteid = element.attr("id");

//Built a url to send
var info = 'id=' + noteid;

 $.ajax({
   type: "GET",
   url: "delete.php",
   data: info,
   success: function(){
   element.parent().eq(0).fadeOut("slow");
   }
 });

//We return false so the browser doesn't actually follow the link
return false;

});

When we were displaying the posts in process.php we echo’d the id of the post in the anchor tag. We are then getting this id element.attr(”id”) and building the URL. So when the AJAX call is sent, it will be something like delete.php?id=POSTID. If the AJAX call is successful, then we need to hide the list item.

element.parent().eq(0).fadeOut("slow");

In that bit of code, we select the element (anchor tag) that was clicked. We then find it’s parents and take the first one using eq(0). It’s ‘first’ parent is the list item its in (<li><a href></a></li>) and we fade that out slowly.

Demo: http://lastkarrde.com/q7todo/

Download: http://lastkarrde.com/files/q7todo.zip

You can read the first part of the series at PHP + jQuery Todo List Part 1

In this two part series I’m going to show you how to make a simple to-do list in PHP, and then enhance it using jQuery’s AJAX and manipulation capabilities. This won’t follow any proper coding principles, but will give you the skills to adapt the code to fit your own situations. A todo list isn’t that far away from a simple threaded forum.

It will consist of a few files.

• delete.php - delete the note.
• process.php - create the note, display the notes.
• index.html - form, javascript

We will be storing the list items in a MySQL database. The query:

CREATE TABLE `notes`
(
`id` INT PRIMARY KEY AUTO INCREMENT NOT NULL,
`content` VARCHAR(500) NOT NULL
)

index.php will only contain the form (for now). It’s a fairly basic form, it contains a textarea (where the user enters their note) and a button they hit to submit it. The information is sent to a file called process.php through the post method.

<form id="form" action="process.php" method="post">
<textarea name="content" id="content" cols="50" rows="3"></textarea>
<input type="submit" id="submit" name="submit" value="Post it" />
</form>

process.php then handles the information that was sent from the form. We only need to insert the content into the database because the id field auto_increments itself. We display the to-do list in a nice and tidy list. We also provide a link after the post to delete it.

<?php
//Connect to the database
$connection = mysql_connect('host (usually localhost)', 'mysql_username' , 'mysql_password');
$selection = mysql_select_db('mysql_database', $connection);

//Was the form submitted?
if($_POST['submit']){

//Map the content that was sent by the form a variable. Not necessary but it keeps things tidy.
$content = $_POST['content'];

//Insert the content into database
$ins = mysql_query("INSERT INTO `notes` (content) VALUES ('$content')");

//Redirect the user back to the index page
header("Location:index.php");
}

/*Doesn't matter if the form has been posted or not, show the latest posts*/

//Find all the notes in the database and order them in a descending order (latest post first).
$find = mysql_query("SELECT * FROM `notes` ORDER BY id DESC");

//Setup the un-ordered list
echo '<ul>';

//Continue looping through all of them
while($row = mysql_fetch_array($find)){

//For each one, echo a list item giving a link to the delete page with it's id.
echo '<li>' . $row['content'] . ' <a id="' . $row['id'] . '" href="delete.php?id=' . $row['id'] . '"><img src="cancel.png" alt="Delete?" /></a></li>';

}

//End the un-ordered list
echo '</ul>';

?>

delete.php does nothing more than delete the post. It uses the id parameter its provided to find the post entry in the database. Once it’s found, it’s deleted.

<?php

//Connect to the database
$connection = mysql_connect('host (usually localhost)', 'mysql_username' , 'mysql_password');
$selection = mysql_select_db('mysql_database', $connection);

//delete.php?id=IdOfPost
if($_GET['id']){

$id = $_GET['id'];

//Delete the record of the post
$delete = mysql_query("DELETE FROM `notes` WHERE `id` = '$id'");

//Redirect the user
header("Location:index.php");

}

?>

All of this produces a tidy to-do system. The source, stylesheet and images will be provided in a .zip file at the end of Part 2 of this tutorial.

You can read the second part of the series at PHP/jQuery Todo List Part 2

PHP is a very vast language. It’s hard to say that you’ve mastered it. For example, do you know how to crop an image using GD and process web requests with XML-RPC off the top of your head? You may know one of them, but probably not both. That being said, there are a lot of resources out there that help you learn the basics of PHP – Processing forms, security, database interactions and array manipulation. I’ve compiled a list of 5 websites that I think will help you learn the ‘basics’ of PHP as well as taking them a step further.

KillerPHP.com’s Video Tutorials
I used these when I was initially learning PHP and are still a great resource today. These screencasts are typically 10 minutes long and cover the absolute basics – getting your development enviroment up and running to variables and includes.

• Local server setup
• Variables
• Arrays
• Includes
• Loops
• Form Processing
• Functions
• Sessions
• OOP

Pixel2Life’s Tutorial Index
Pixel2Life is a tutorial index where bloggers can submit their tutorials and articles. The result of hundreds of people doing this is a very large library of ‘specialised’ links. For example, at the time of writing this, the frontpage contains tutorials about Twitter, Code Igniter, Gravatars and Converting Excel to CSV with PHP. There are also numerous tutorials and articles on PHP frameworks (Code Igniter, CakePHP etc) that aren’t on the framework’s website. Be aware that there are excellent tutorials back 6 or 7 pages, so have a dig around for them.

NetTut’s PHP Tutorials
Nettuts is well known for it’s high quality tutorials. They have recently done a 3 part series on making your own PHP framework – something you don’t see on an everyday blog. Although there aren’t many PHP tutorials now, new authors are writing more tutorials on them. Often the tutorials are not only PHP, a recent one showed how to make a twitter clone in PHP which used mootools for the AJAX and effects. Lately the editor, Jeff Way, has been doing some screencasts.

PHP.net Quickref
Sorry, I had to put it in. If you don’t know what a certain function does, do a quick search on the quickref page and find it in seconds. The documentation provided by PHP isn’t the only good part, read peoples comments on real application usage of function. For example the sleep function (http://www.php.net/manual/en/function.sleep.php) , it not only shows usage of it, but mini hacks people have used to get it working better, or an alternative way to do it.

PHP Builder
PHP Builder is a portal for everything PHP. It has PHP job lisitings, original articles, a snippet library, forum and a mailing list. Some of the articles on there are really interesting, using PHP as a shell language (http://www.phpbuilder.com/columns/darrell20000319.php3?page=1) not only covers the basic ‘hello world’ tutorial, but using arguments and reading input from the console. The forum (http://phpbuilder.com/board/) is incredibly useful. There are fully certified Zend Engineers that help you think up 

Chapter 7 is another excellent chapter - showing you how to write your own plugins. It goes into alot of detail, from extending the wrapper to proper naming conventions to looping through each element effected. This chapter is a must read for anyone considering writing their own jQuery plugins. Again, the authors have written 3 example plugins providing alot of reference material.

• The first, its incredibly slow - It took along time to download the updates i needed (Slower than downloading a normal file that size from the server) and it took along time to generate the meta data of plugins list.
• The second is that (in my opnion) the User Interface is horrible. Its hard to navigate to select the packages you want, When you select a package it takes a few more clicks to even see the dependencies it requires, whereas adept and synaptic show you right away.

I tried it, i can honestly say i gave it a good go, but its not for me. Since im new to the rpm system, i searched around for alternatives, i found one called Yum Extender (Yumex).  Its easy to install, just yum install yumex or download it from the websit.

Check it out

http://p.sohei.org/jquery-plugins/menu/
Latest release: Jan 07

This plugin was constructed to emulate a desk top apps menu. They don’t close until clicked off and are activated by clicking them (rather than hovering). It requires the jQuery dimensions plugin to perform ‘smart calculations’.

Example Usage: http://p.sohei.org/stuff/jquery/menu/demo/demo.html
Download: http://p.sohei.org/jquery-plugins/menu/

http://jdsharp.us/jQuery/plugins/jdMenu/
Latest release: April 08

Although the jdMenu plugin is only 3kb itself, it depends on or looks a hell of a lot better with the plugins dimension, positionBy and bgiframe. jdMenu boasts keyboard access and can be easily made into a verticle menu by changing an option.
Example Usage & Download: http://jdsharp.us/jQuery/plugins/jdMenu/

http://users.tpg.com.au/j_birch/plugins/superfish/
Latest release: Sometime in 08

Superfish takes a CSS based dropdown then enhances it with jQuery so if the user has Javascript disabled, it degrades perfectly well. Since the menu is mainly CSS based, I’d imagine it’s a fair bit faster than the other options.

Example Usage: http://users.tpg.com.au/j_birch/plugins/superfish/#examples
Download: http://users.tpg.com.au/j_birch/plugins/superfish/#download

More menus

• http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery
• http://javascript-array.com/scripts/jquery_simple_drop_down_menu/
• http://designreviver.com/tutorials/jquery-css-example-dropdown-menu/
• http://www.dynamicdrive.com/style/csslibrary/item/jquery_multi_level_css_menu_2/

Plugins are useful, but a lot of the time you don’t need their full functionality. If your confident of modifying a few scripts, then taking something like http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery and changing it to meet your needs would be the best way to go. That being said, the plugins have dropshadows and funky multi level code that some of the ‘smaller menus’ do not.

General Rules

Number 1: You don’t use “?>”. PHP does not require it. Do not end your files with ?> just leave it blank. It should not change anything at all in your code. It also prevents accidental whitespace injection into your files. The exception is when the file is both php and html. Although that is also bad practice. PHP shouldn’t really have HTML and PHP in the same file.

Number 2: Short tags are never allowed. Short tags are when you use instead of the full value which is .

Number 3: Indentation should be 4 spaces. Tabs aren’t allowed. Some IDE’s such as Dreamweaver allow you to set your tabs at 4 spaces. Number 4: You should aim to have a maximum of 80 characters per line. However Zend allows up to 120. This can also be set in your IDE. These should all be followed strictly.

Naming

The naming of files is important, files should be named appropriately and end in .php. There is no general rule but I like to have classes named as “ClassName.class.php”. It helps seperate classes from general php. It’s also easy for anyone looking at the code to find what they need. “MySQL.class.php” means they would know it’s a MySQL class. All characters in the name have to be alpha numberic. So either numbers or letters. Functions and methods are named starting with a lowercase then each new word starts with an uppercase. Underscores are not permitted. A function should be named along the lines of this. “phpIsAwesome( );”. Variable names can never contain underscores. Only alpha numberic characters. The same method as functions should be used when naming. This is the “$lowerUpper” variable naming. The one thing that does however need underscores are Constants. Constants should be underscored at each new word however all letters must be uppercase. “WE_LOVE_CONSTANTS”.

If and Else

If’s must have a single space before any conditions and a single space before an opening bracket. All code inside it should be properly indented with 4 spaces. This is one of the most vital rules as most people hate code without indentation. It is almost impossible to read. An example of good, clean and indented code is this:

if ( $a > $b ) {
	// Some Code
} else {
	// Some more code here
}

This is what you should aim for. Rather than a block of code with no indentation such as this:

if($a > $b){
//code and stuff
}else{
//other code
} 

Code like that is the pet hate of almost all developers.
Documentation
All documentation blocks must be documented using phpDocumentor format. This looks somewhat like this:

/**
 * Short description for file / class
 *
 * Long description for file / class (if any)...
 *
 * LICENSE: Some license information
 *
 * @copyright  2008 Your Company
 * @license    http://license.yoursite.com
 * @link       http://www.yourfile.com
 * @since      File available since Release 1.5.0
*/ 

Try and document alot of your code. It’s important so other developers know whats going on with your work. Remember that not everyone codes like you, everyone will have different ways of doing things. So explain what your doing but don’t go over the top.
The End
That’s all for this article on coding standards. I hope you learned somethings from this article and put them into practice. For a full list on zend coding standards read the Zend Coding Standards Manual. You do not have to adhere exactly to these, adding your own twists to the style.

Mark Cole.

What we want: When the user clicks a list item, it will show the corresponding div

PHP
ASP
Ruby
Python
AIR


http://www.php.net
http://www.asp.net
http://www.ruby-lang.org
http://www.python.org
http://www.adobe.com/products/air/

If i were a beginner and i was asked to write the script, i’d most likely code sections for each id/div such as below.. Once the specified link is clicked it’ll hide all the divs shown(the other content panels) and then it’ll fade in the relevant content panel.

$("ul#langs li#php").click(function(){

	$("div#container div").hide();
	$("div#container div#d_php").fadeIn("slow");

	});

	$("ul#langs li#asp").click(function(){

	$("div#container div").hide();
	$("div#container div#d_asp").fadeIn("slow");

	});

This is alright.. it does the job but for each id/div you need around 3 lines of code, your also listening for alot of events (all of those clicks) which may use more memory and slow the script down in general.

Instead of listening for unique clicks(php, asp, ruby etc..), why don’t we just listen for any click (on the list) and after its clicked, find out which item it was by getting the id (via attributes), save it as a variable, and then use that variable in the selector for the div.

$("ul#langs li").click(function(){

	var elid = $(this).attr('id');
	$("div#container div").hide();

	$("div#container div#d_" + elid + "").fadeIn("slow");

	});

This code is alot smaller, its scalable and its not going to get any bigger. You can use this method in other applications such as calling for ajax.

Questions/Comments?

**The Next Day**
Thanks for all your thanks/comments/”gtfo noob why are you programming”-ings. Matt August, Bryan Migliorisi and Karol Kowalski pointed out that you can’t have more than 1 element with the same id, I completely overlooked this and I’ve fixed the code up.

First of all, download XAMPP from sourceforge. As of writing this, the latest version is 1.6.7 so ill be referencing to that in the tutorial. Save it to your /home/$USER/ directory.

Extract the archive to your /opt/ directory.

sudo tar xvfz xampp-linux-1.6.7.tar.gz -C /opt

Now its installed
To start it:

sudo /opt/lampp/lampp start

To stop it:

sudo /opt/lampp/lampp start

To launch the panel/manager:

sudo /opt/lampp/lampp panel

You can test if its on by going to http://localhost

To add files to the server, you would need to put them in /opt/lampp/htdocs/ but since that directory is owned by root, your user doesn’t have neccesary privilages. The easiest way to “get around” this is to set up a symlink folder in your home directory. You may be familiar with public_html or www directories on your webhosting, we are basically setting the same thing up here.

First we want to set up the directory we are going to link to in htdocs. So..

sudo mkdir /opt/lampp/htdocs/homefiles/

Then make the equivilant directory in our home directory.

mkdir ~/public_html/

And finally link them together.

sudo ln -S ~/public_html/ /opt/lampp/htdocs/homefiles/

So now we can put PHP files/whatnot into our ~/public_html/ folder and they will show up in localhost/homefiles/

• kksou - Sample Codes, Hundreds of code examples with explanations.
• kksou - Blog, Some nice advanced info, updated frequently.
• kksou - Forums, Can ask for help on your codes.
• Gnope, Installation of PHP-GTK2.
• cweiske, Some PHP-GTK1 resources, you may/may not find it useful for PHP-GTK2 development.
• gtk.php.net, Official PHP-GTK2 homepage, numerous links, source code.
• gtk.php.net docs, Official PHP-GTK2 documentation.
• gtk.php.net FAQ, Frequently Asked Questions.
• gtk.php.net Resources, PHP-GTK2 mailing list, more resources.
• php-gtk.eu, Great support forum, samples,news.
• activenture, Docs, Refs, Tutorials. Very good.
• php-gtk.eu apps, Largest list (that i could find) of PHP-GTK2 apps.

Remember, you can subscribe to our RSS Feed to get the latest updates and tutorials and request tutorials and screencasts.

I eventually was able to compile it without any errors. It did need a system restart to take effect, but low and behold.

I couldn’t use the GUI installer as there was some conflict with my monitor, so i need to use the text based installer. Its no big hassle for me, ive used the text base installer on slackware and other distros. The anaconda installer is great, i selected the programs i wanted to install and install. All up the install only took around 20-25 minutes - very speedy considering i installed gnome, xfce, servers, dev tools and a number of other things. Once the installation had finished i rebooted.

Straight away i noticed that i didn’t have an X server. When you run Fedora for the first time, im pretty sure theres a little dialog that lets you make accounts etc.. unfortunately there was no text option for me and i got left with a command prompt. I was forced to login as root. I tried startx and it worked! I was in the GNOME desktop, i quickly made myself a normal user account and restarted the computer. Unfortunately the Desktop Manager/GUI Login screen didn’t start so i was at the command prompt again, however i could still startx .

UPDATE: I decided to reinstall Fedora (2 Hours after i initially installed it. I got Anaconda to run graphically, i added the boot parameter resolution=1024×768 and it worked! The installation went smoothly, the boot screen was working and i added my user the proper way. X works straight off now, im very pleased

Heres a video by the Filament group, who made the theme roller.

ThemeRoller for jQuery UI Screencast v4 from filamentgroup on Vimeo.

More posts are coming, ive been working on a couple of video tutorials lately so i can post them with the launch of the new site/theme.

Just letting everyone know.

~Panzer

We are going to start writing the PHP code to process the form. This is fairly basic stuff, using $_POST to get the values from the form, then checking them against pre-assigned values, if they match, then echo approved, if they don’t then echo denied.

So at the end of this stage, you will have an HTML form set up and this PHP file. You can enter the username Panzer and the password of query7 into the form and it will return Logged in.

Next tutorial, the fun part, the AJAX!

1. Plan, code the form (This tutorial)
2. Code the PHP backend, make it work
3. Code the AJAX, implement it.
4. Tidy it up, make it look snazzy

Ok then. So we will have a forum with 2 inputs; username and password. The user will enter the details and we’ll use PHP to authenticate them. If its true, we can set a cookie or echo some text. We will then implement jQuery’s AJAX and make the whole thing seemless. Some nice little fades will be added at the end.

So, the form. Its a plain and simple HTML form. Nothing special about it.

Username:

Password:

Thats all for now. Next lesson we will code the PHP and “make it work“.

It might take a little while to finish up so i might not be posting much over the next week (sorry) but it will be worth it in the end.

Someone emailed me asking if the menu could truely slide in , vertically, not how it is now with the slide on a slight angle ( using jquery’s show / hide ). Its very easy to alter the existing code to make it truely slide.

Instead of using jQuery’s show and hide functions, we just use slideDown and slideUp in replace of them. So the jQuery looks like this..

$(document).ready(function(){

$("#drop_down").hide();
$("#drop_down").animate({

opacity:0.5

});

$("a:contains('Google')").click(function() {
$("#drop_down").slideDown("slow");

});

$("#drop_down").mouseout(function(){
$(this).slideUp("slow");

});
});

Sorry for the low sound, i was trying something different with my microphone.

Features Include

• Template engine
• Search engine friendly URLS (I presume /forumname/topicname rather than ?fid=493&tid=98 )
• New BB Code system
• More Administrator controls (Picky options i’d image - turning signatures off in specific forums etc..)
• Reputation System (Finally catching up with vBulletin )
• Enhanced permission and moderator systems.

They say they are adding more integration tools, so you can integrate it with your existing website, or adleast provide some easier integration tools; it will also have tighter integration with other IPS products such as the blog, gallery.

Its interesting to see that they are dropping support for Oracle. They boast about having so many big business clients, i’d presume they all run Oracle, and yet are dropping support for it. Mayby they are turning back into a community board rather than a business board?

I’d be interested to hear your thoughts on that.

I bought Scott Mattock’s PHP-GTK 2 book (Only to learn later that it was based on one of the early alphas) and dove straight in. Installation wasn’t hard, and i could get started straight away. I learned the hello world example first, and here it is..

set_title('Hello world');
$wnd->connect_simple('destroy', array('gtk', 'main_quit'));

$lblHello = new GtkLabel("Just wanted to say\r\n'Hello world!'");
$wnd->add($lblHello);

$wnd->show_all();
Gtk::main();
?>

As you can see, the syntax is OOP. If you’ve coded GTK, or PyGTK before things will look very similar. We start off by declaring a new GtkWindow() and assign it to the class/variable $wnd. We then set a title using set_title. The next line makes sure the window shuts correctly (destroys) it when you close the window, it will also stop the gtk main loop. Then we declare a new GtkLabel and give it some text, and then add it to the window, again fairly self explanitory. We then tell the window to show and declare the Gtk Main loop (which keeps the window open).

Finished Product:

• Basics of jQuery and Slides
• Using Selectors to Select HTML Elements in jQuery

So you know the very basics of jQuery, and multiple ways to select the HTML element that you want to manipulate. In this tutorial i’ll show you how to manipulate that element after you have selected it; changing the contents, changing the HTML and getting values. I won’t be showing you slides/effects , that’ll be in a tutorial coming up.

I will be using the HTML example from the selectors tutorial, and ill only be calling on cells by using their id - im focusing on the manipulation rather than the selecting. Anywho, lets get into it. First the HTML code we’ll be manipulating.

One
Two
Three
Four
Five

Ok, say we want to change the text value of a column. We can do this using text() . Take note that text does not parse HTML, it keeps it as plain text.

$("#3").text("wowow");

This changes the value of the #3 td to wowow

What if we wanted to put some HTML in their, mayby make some text bold? We use the html function, very much alike the text function except that it parses the HTML. So the text “cool this is bold” is bolded.

$("#2").html("cool this is bold");

Lets say we wanted to get rid of it completely, so no one could see it. For that we would use the remove function. It does what it says.. it just removes it.

$("#3").remove();

What if you wanted to keep the current text or HTML code in and element but simply add some text at the beginning or end. We would use append or prepend .These keep the contents of what ever is inside the element but will add a small bit of text at either the start or end of the element. append adds it at the start, prepend adds it onto the end.

$("#4").append("hoola hoops");

So the output of that would be Four Hoola Hoops

$("#4").prepend("hoola hoops");

The output of that would be hoola hoops Four.

Another very nice function jQuery has to offer is the clone function. It lets you take an element and make an exact copy of it. Thanks to jQuery’s chainability its very easy to add that clone where ever you want. So, we want to make a copy of #4, and add its contents to #2.

$("#4").clone().prependTo("#2");

So, thats about it for this tutorial on manipulation. I’d love some comments, what sorts of things you’d like to see next or feedback on it.

Rick Rolling has taken off as late and links are popping up all over forums, websites and IRC. What links? You say. These links. . On top of tricking your friends.. or blog viewers .. to click this link there have been some “live rick rollings”.

Ever been rickrolled yourself? Or got a really good one on somebody? Share it here.

When they do a full release there will be two types of accounts, premium and free. The free accounts will get 1gb of space each, premium is as of yet undecided. At the moment they are beta testing. Beta accounts get 2gb of space and will be kept free forever.

You can sign up on the getdropbox.com website to try and get a beta account but they take along time and sometimes you aren’t accepted. Im offering dropbox invites.. for free. Once i sent the invite email your account will get activated straight away! Thats a 2gb account for ever!

*Beta accounts used to be 5gb, but are now 2gb. If your 2gb is getting full you ask the dropbox staff and they will upgrade you to a 5gb*

To get an invite.. simply comment here asking for one and ill send via email.

The popular discussion board phpbb2 is being pulled/development dropped. Security patches and support will be given until January 2009 and you will be able to download the software from the website until the 1st of Ocbober 2008 . phpBB2 has been plagued by a large number of vulnerabilities, a significant number of them were through user submitted modifications.

phpBB 3 started strong and is continuing to do so. With more database types being support, and a massive new set of administrator controls, it’s set up to compete with the likes of MyBB and Simple Machine Forums. People often look back at this thread, posted when phpBB 1 was undergoing testing.

One
Two
Three
Four
Five

So.. we want to select the first td. We do this by first selecting all the td tags and then use :first to select the first td. Using jQuery’s great chaining ability, we change the text.

  $("td:first").text("This is the altered first box");

jQuery also has :odd and :even selectors. This will select the odd or even id’s. In this next example. We are selecting all of the odd td’s , and then select the first one of them. Again , we use jQuery’s chainability.

 $("td:odd:first").text("We changed this using odd and first");

You need to be aware that selecting the odds/evens does not use the element ids. It just counts them. It starts from 0 and starts counting, not from 1. This is why it changes the second cell using the method above.

Now, lets match the next one by specific text. We can do this using the :contains selector. We look in all td elements, then in them we look for the word Three , if we find it we replace the text.

$("td:contains('Three')").text("we matched the text, then changed it.");

We can use the element id to edit select what we want. jQuery’s element selector is the hash symbol (#).

$("#4").text("We found this using the id");

The last one! How are we going to select it? We are going to use the gt selector. We can specify a tag, and jQuery counts how many there are. In this case we select td and it counts them (remember it starts at 0, not 1). It will select all the td that are higher than the number we specify. So we have 5 td , 0,1,2,3,4 . Se specify number 3, so only number 4 is effected. Thats our last td.

$("td:gt(3)").text("The Last One!");

The 8th version of Ubuntu has now been released! Notable inclusions are..

• Linux Kernel 2.6.24
• Xorg 7.3 (Latest)
• GNOME 2.22
• Firefox 3 Beta 5

Its interesting to see that they’ve given some

of their older applications an overhaul. It now includes the Brasero CD burning utility which replaces Serpentine. They’ve also included the GTK front-end bit-torrent client Transmission and added a new VNC viewer called Vinagre. If you put the burnt ISO disk into a Windows machine, you can install Ubuntu via Windows! I thought this was a cool little feature.

Ive been following Ubuntu for a few years now, i started Using Hoary right through to Fiesty. After that Ubuntu wasn’t right for me. It felt pretty bloated, trying to do things for you, and now im happily running Zenwalk 5.0 which is based off Slackware. I’m interested to here what you think, of Ubuntu and the new release.

File -> Open Network Stream

Select the HTTP/HTTPS/FTP/MMS box and in the form, enter the URL of the shoutcast server, with the port. In my case its enaxi.com:8000 . Then click OK.

And tadah.. It works!

function secure($string) {
		$string = strip_tags($string);
		$string = htmlspecialchars($string);
		$string = trim($string);
		$string = stripslashes($string);
		$string = mysql_real_escape_string($string);
	return $string;

	}

As you can see, it basically sanitises the heck out of everything. Some people say its an overkill but you can use it in almost every situation when user data is incoming.

Say you have a menu and you want to add some extra items to it. The menu code is something like..

Item two
Item three
Item four
Item five

We want to add another

Item Six

beneath the element

So, in normal javascript you would need to find the unordered list with an id of navlist, then add innerHTML or a childnode of the ordered list. However in jQuery we can do this with one easy line.

 $("#navlist").append("
A Custom item

");

That would add it to the start of the list, if we wanted it at the end we would use the prepend function.

 $("#navlist").prepend("
A Custom item

");

What if there were a menu item we didn’t like? Say Item Four. Lets get ride of it! We could need to match the text inside the list, then hide it. With this next snippet, we are using the selector contains and are looking for the word four in every single ordered list ( li )

 $("li:contains('four')").hide();

For some strange reason, if you wanted to make the list items fade out instead of just being hidden, its not hard to change it (Because of jQuery’s chainability). Instead of hide() -ing. Just fade out like so.

 $("li:contains('four')").fadeOut("slow");

If theres something you want to do with your remotely hosted system, but don’t know how. Feel free to ask!

Debian uses apt-get package management. It looks at a series of defined repositories (servers) for the package(s) you want and will download them if they are there. The repositories are defined in the file

/etc/apt/sources.list

You can edit that file directly (make sure you have root) or use frontends like the Synaptic Package Manager or Software Sources (Menu item) in the distro.

Command Line Usage

To install a package you need to use the apt-get install command. For example to install the IRC program XChat you would type into the console.

sudo apt-get  install xchat

It would prompt you for your root password and then list information about the package and would double check you still want to download and install it.

To remove a package you would use the apt-get remove command. This will remove the package files but will keep the configuration files incase you install the same application at a later date. If you wanted to remove XChat you would type into the console.

sudo apt-get remove xchat

To completely remove a package and leave no trace of it you would use the apt-get –purge remove command. If you wanted to completely remove XChat you would type into the console.

sudo apt-get –purge remove xchat

To upgrade packages on your system you would use the apt-get -u upgrade command. This would update all your packages but before updating them, would list them for you to see. If you wanted to update packages on your system you would type into the console.

sudo apt-get -u

To do a complete distro upgrade (Eg upgrade from Ubuntu Fiesty Fawn to Ubuntu Gutsy Gibbon then you would use the apt-get -u dist-upgrade command. Its considered to be good practice in reinstalling your system when a new release comes out or only dist-upgrade once or twice. It can lead to breaks in the OS and sluggishness. If you wanted to dist-upgrade your system you would type into the console.

sudo apt-get -u dist-upgrade

Again, it would show you what packages you would be upgrading before actually starting.

Aptitude

aptitude is a Command Line/Basic GUI tool for installing packages using apt-get. If your still not comfortable with full command line usage but the Synaptic Package Manager takes up too much system resources on your system then aptitude might be right for you. You can start it with the command

sudo aptitude

It launches a basic GUI in the console in which you can browse packages by category and search for them.

Once you have found the package you want to install, you can confirm it and it will download and install it.

Synaptic Package Manager

The Synaptic Package Manager is one of the most widely used applications in Debian based systems. Its got a friendly and easy to navigate GUI. Like aptitude its really just an apt-get frontend but new users seem to like it.

Although it may seem basic, it provides updating, installing, removing, purging, searching and an editor for /etc/apt/sources.list all in one.

Some people using pre-made software think they are immune to hacking attempts. 4 days ago, there was a vulnerability found in the latest version of the Coppermine Gallery software, after the vulnerability was made public, hundreds of people got hit, and their galleries essentially destroyed. Infact there were 2 SQL injection vulnerabilities found within 5 days of each other. For something that has been in development since September 7th 2003, thats pretty scary.

Now, if you owned a Coppermine Gallery what measures could you take to make sure that your installation was safe, even if you couldn’t patch it yourself, you could take it offline until one is released. The website securityfocus.com is a security and vulnerability website. People post the latest vulnerabilities there in software, for example one of the coppermine vulns , http://www.securityfocus.com/bid/28767 . If you do a daily run of your blogs/forums, you could also go there and type in the version and software that your using to do a quick check. Social news websites such as digg, stumbleupon and del.icio.us are also good for checking for a vulnerability. Again, just type in your software name and version number and some results might come up!

There is no proper way to prevent your website from being hacked, all of these new exploits are 0 days. Its a race between you shutting down or patching your website, and the hacker getting to it first.