David Hewards | Web Log

Something that will crop up at some point in your programming lifespan is a little bit of compound interest.

Well its very easy to work it out. The below example does so over a 7 day period at 1.8% interest per day.

function compound($amount,$time,$rate){
for($i=0;$i<$time;$i++){
$amount = $amount + round($amount*$rate);
}
return $amount;
}
$compound = compound(1000000,7,0.018);
echo number_format($compound);

This afternoon i’ve been trying to work out how facebook detects whether or not your focused on its interface or not. Ie focused on the browser tab.
Triggering a $(window).focus(function(){}); event in jquery will in most browsers solve coming back to the browser tab if your away from it, but in respect of how it detects on success of an ajax call whether or not to change the page title based upon if you are focused on the tab or not is still a mystery to me.

Can anyone shed any light on this?

I am now beginning to think, facebook uses a sly dog in the mix in which it detects if you have a mouse move over the body of the page, and when you do initiating all required requests.

Today I was faced with the small problem of scrolling to the bottom of a page using jQuery. I noticed while trying to find a quick solution around the web that there was a distinct lack of examples, so I decided just to make my own code.

This will simply scroll the window focus to the very bottom of your page, which can be handy in some cases.

<script type="text/javascript">
$(document).ready(function(){
var offsettop = parseInt($("body").css("height"));
window.scrollTo(0,offsettop);
});
</script>

Whilst working on our online game Street Crime - Mmorpg Gangster Game I came accross the need to add a wrapper layer to all of our ajax calls thus to make sure players are always logged in before they make the call and if not then re-direct them too our login pages.

Most of you who are familiar with jQuery will also be familiar with the $.ajax() function that is commonly used for making ajax requests.

I decided to use jQuerys plugin functionality to create the wrapper layer.

jQuery.AJAXwrapper=function(options) {
var defaults = {
extensions: '',
theurl: '',
thetype: "POST",
defaultdataType: "xml",
payload: ''
};
var options = $.extend(defaults, options);
$.ajax({
url: options.theurl,
type: options.thetype,
data: options.extensions,
dataType: options.defaultdataType,
beforeSend: function(){
//in here insert your custom function
},
success: function(xml){
if(typeof options.payload==='function'){
options.payload(xml);
}
}
});
};
I call my function above by using a simple bit of code that you can added to any action/event you like.
$(document).ready(function(){
$("#myid").click(function(){
AJAXwrapper({
theurl: "somephp.php",
extensions: "action=refresh",
payload: yourcustomfunction;
});
});
});

And finally I stick an alert in the custom function I have selected to be my on success from the AJAXwrapper function.

function yourcustomfunction(){
alert("we made it to this bit");
}

There you have it now you could make all of your ajax calls using AJAXwrapper({}) and its possible values which I have listed below for clarity.

• extensions - These are your normal ‘data’ fields in the normal $.ajax() function so something like ‘action=fred’
• theurl - Quite simply the url you want AJAXwrapper to call
• thetype - The type of request your making GET,POST default is set to POST
• defaultdataType - The default data type of the call my function is defaulted to xml, but you could choose JSON,HTML etc
• payload - Finally the payload, this is your defined function for AJAXwrapper to call when your request comes back successfully.

When working on your server with ssh access, you tend to get very used to doing everything you need to do via the terminal window. Sometimes you may come accross problems which unless you have the know how you will be puzzled as to why somethings not working.

Today I came across a small problem in that a few commands which would normally work on my local os x machine were not working on my server machine.
Im going to use the ‘zip’ function as my guinea pig. If this function is not installed or enabled in your servers configuration/installation you will see a message like this:

-bash: zip: command not found

This is easy to fix simply by running the following command:

yum install zip

Now if you try the zip command again you will notice its worked or at least should work. You can also if you wish check to see if its installed first by viewing the install list on your server with the following command.

rpm -qa

This is a nice quick easy way to find duplicate rows in your database based on one field.
So say for instance id like to find all users with duplicate rows in my orders table.

The following query can achieve that.

select userid, count(*) from orders group by userid HAVING count(*) > 1

//this will fetch all the userids with duplicate rows, then you could run a delete query or whatever it is you need to do to get rid of them in a while loop of this.

Installing wordpress via subversion couldn’t be simpler follow the steps below.

Navigate to the directory on your site in which you wish to create the new installation of wordpress.

//If you need to create the directory run this
$ mkdir blog (or other name of your choice, or you could just install it into the route of your site)

$ cd blog

$ svn co http://core.svn.wordpress.org/trunk/ .

If you already have a copy of wordpress on your server and are looking to just update, run the following code.

$ cd blog

$ svn up

Now you should see all the files flying into your new installation!

A while back I faced the daunting prospect of learning yet another language, jQuery. At the time I had a little to average knowledge of javascript, I would recommend you to stop reading if you do not have any prior knowledge of javascript or other similar programming languages.

As web sites march forward and us programmers look for ever more elaborate and space saving ways of delightfully cramming our pages with as much content as we can whilst also doing it within a respectable time frame, some life saving javascript libraries have emerged. Elaborate javascript effects have always been possible, but for clients not willing to pay that bit extra for the time it would normally take to build and utilise such features and for programmers not willing to spend the time on some projects, these features have sat very much in the dark corner of the room. Untill now! In relatively simple commands using jQuery you can achieve some actually very complex and cross browser compatible javascript functionality. Which not only looks really cool, but in use is very, very practical!

How to use jQuery

Using jQuery couldn’t be any simpler, head over to the jQuery website and simply download the library. This consists of only one file, which makes everything even more simple!

Upload this file to somewhere on your server and then include it to the head of the page you want to test something on, it should look something like this.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>My jQuery Test</title>
<script src="/path/to/your JQUERY filename/on/your/server"></script>
</head><body></body></html>

Im only going to touch on what you can do with jQuery in this topic as I want to focus on the main principles of switching from coding using your basic javascript mark up, to using jQuery. Alot of people refuse to make the move from javascript to jQuery or simply do not see the point. I think in alot of ways thats rather sad, especially when you consider the time it can save you and the simplicity in which otherwise complex javascript can be added to your pages. Yes like many other things it cannot do everything, but whats so great about it is that it can be mixed and matched with regular javascript.

The massive plus point for me using jQuery is its pretty much give or take cross browser compatible. At least the core of it is, this is a hugely important factor when choosing to use jQuery as we all know how javascript is rendered differently in every other browser. So leave the compatibility issues up to someone else and focus on your website, is what I say!

A Simple jQuery Example

Im simply going to show you the very core of any javascript or jQuery application. The selector! In regular javascript were all very used to using the following code to select an element from the dom (or page) by its id.

Add this div to the body of your test page:

<div id="specialdiv"></div>

Then add this code to the head of the page.

<script type="text/javascript">
//normal js selector code
var elem = document.getElementById("specialdiv");
//jquerys selector
var jqelem = $("#specialdiv");
</script>

This is a extremely simple example, but I think it demonstrates nicely what jQuery stands for, “do more and write less!”
One of the most important functions available to you when using jQuery is the following:

$(document).ready(function(){ });
As the name suggests this calls and runs whatever is inside the function when the document is ready ie when the page finishes loading. Try inserting the code below into the head of your test page.

<script type="text/javascript">
$(document).ready(function(){ alert("hi this is my function running"); });
</script>

Another very important thing to learn about jQuery is how it works, differently to normal. For instance say we have a button that we wanted to fire a javascript when it was clicked, jQuery provides ways to bind events to elements. Ie if you click my button I can bind an event to that button on page load and when you click it fire a function of my choice. Where as conventionally before you would have attached the event as an attribute to the element. For example a onclick=”alert(’clicked’)” on an element. Where as I could do the following with jQuery.

First add the button to your page
<input type="button" id="mybutton">

Then add the jQuery below to the head.
<script type="text/javascript">
$(document).ready(function(){
$("#mybutton").click(function(){ alert("You just clicked my button"); });
});
</script>

You will see an alert pop out with the text “You clicked my button”.

Selectors

Selectors are hugely important factor of selecting elements from the dom or the page to a non programmer. jQuery allows you to use numerous ways to select elements. Im only going to touch on a few of the most important ones, have a look at the following examples.

//# selects by the id of the element like so : $("#mybutton");
//. fullstop or a dot select by the class of the element like so : $(".mybutton");
//using a tree or selecting multiples elements by there element type
// selects all divs on the page $("div");
// selects all spans within a div on the page $("div span");

As you can see rather than using regular javascript to do the same its very very quick to code and works really well.

Im going to touch on one last subject in this small tutorial and thats binding of events to the same element. Earlier I showed you how to bind a click function to an element, but what jQuery rather uniquely does is enable you to continuously bind function after function to that element. So in the same function I could lets say add a click function and also a mouseover function with an action in it to change the color of the button. I’ll give a quick example below.

Using your button with the id of “mybutton” that you should have inserted into the body of your test page. Add the following code to the head of your page.
<script type="text/javascript">
//start with our document ready function
$(document).ready(function(){
//select the element by its id
$("#mybutton").click(function(){ alert("you clicked the button"); }).mouseover(function(){ $(this).css("background":"red"); });
});
</script>

In this one line of code I can now tell whether you moused over the button and then perform an action if you do and whether you clicked the button or not. Hopefully your starting the see the scope and speed of this scripting language. Thats it for now, check my jQuery category for other posts about jquery.

If your anything like me then on a sunday night or all be it any other night when boredom hits  you look for a game or something of the sort to pass some time and hopefully surpass that to “not so much a waste of time” as “genuine fun”. However I use a new generation Imac with all the bells and whistles which is amazing for work purposes, being a web designer its brilliant but not for gaming!

I was thinking about this tonight and realised that it was odd that Apple havent really thought to themselves, okay weve managed to sell our product being the (mac) to a massive world wide audience, but we havent managed to fulfill and persuade all our users that its the best. I mean im not being funny but for most people under the age of 25 the sole purpose of a computer is work and recreation. And I bet in the case of 95% of those people using it for recreation will be the use or the want to use it for gaming.

Now perhaps with this in mind, Apple might have thought to themselves we could make games ourselves for our own computers. I mean microsoft sure as hell do. If they could invest in a large gaming company and make some awesome titles available for the mac they would see there whole image in the face of hardcore internet and game users turned around. I think they HUGELY under-estimate what alot of people that spend alot of time on there computers “out of choice” actually do on them.

I say “out of choice” as these are the users using computers away from work and free of will meaning they want to be there.

Its the one most dissapointing thing about having a mac what also strikes me as funny is that id bet my cotton socks that its easier to develop for a mac than a windows system barring the fact its not been as widely done.

Just an idea.

I always find blogging what i find out is a good idea, we sometimes get conflicts with our subversion repository so here is a list of commands to deal with the conflict in a way that best suits you.

  (e)  edit             - change merged file in an editor
     (df) diff-full        - show all changes made to merged file
     (r)  resolved         - accept merged version of file

     (dc) display-conflict - show all conflicts (ignoring merged version)
     (mc) mine-conflict    - accept my version for all conflicts (same)
     (tc) theirs-conflict  - accept their version for all conflicts (same)

     (mf) mine-full        - accept my version of entire file (even non-conflicts)
     (tf) theirs-full      - accept their version of entire file (same)

     (p)  postpone         - mark the conflict to be resolved later
     (l)  launch           - launch external tool to resolve conflict
     (s)  show all         - show this list