xml

introduction
the extensible markup language (xml) is a general-purpose specification for creating custom markup languages. it is classified as an extensible language, because it allows the user to define the mark-up elements. xml’s purpose is to aid information systems in sharing structured data, especially via the internet, to encode documents, and to serialize data; in the last context, it compares with text-based serialization languages such as json and yaml.
Continue reading »

mysql

introduction
mysql is a relational database management system (rdbms) which has more than 11 million installations. the program runs as a server providing multi-user access to a number of databases.

mysql is owned and sponsored by a single for-profit firm, the swedish company mysql ab, now a subsidiary of sun microsystems, which holds the copyright to most of the codebase. the project’s source code is available under terms of the , as well as under a variety of proprietary agreements.

“mysql” is officially pronounced /maɪˌɛskjuːˈɛl/ (my s q l), not “my sequel” /maɪˈsiːkwəl/. this adheres to the official ansi pronunciation; sequel was an earlier ibm database language, a predecessor to the sql language. the company does not take issue with the pronunciation “my sequel” or other local variations

uses
mysql is popular for web applications and acts as the database component of the lamp, bamp, mamp, and wamp platforms (linux/bsd/mac/windows-apache-mysql-/perl/python), and for bug tracking tools like bugzilla. its popularity for use with web applications is closely tied to the popularity of and ruby on rails, which are often combined with mysql. and mysql are essential components for running popular content management systems such as expression engine, drupal, e107, joomla!, wordpress and some bittorrent trackers. wikipedia runs on mediawiki software, which is written in and uses a mysql database. several high-traffic web sites use mysql for its data storage and logging of user data, including flickr, facebook, wikipedia, google, nokia and youtube.

platforms and interfaces
mysql is written in c and c++. the sql parser uses yacc and a home-brewed lexer.

mysql works on many different system platforms, including aix, bsdi, freebsd, hp-ux, i5/os, linux, mac os x, netbsd, novell netware, openbsd, ecomstation , os/2 warp, qnx, irix, solaris, symbian, sunos, sco openserver, sco unixware, sanos, tru64, windows 95, windows 98, windows me, windows nt, windows 2000, windows xp, and windows vista. a port of mysql to openvms is also available.

libraries for accessing mysql databases are available in all major programming languages with language-specific apis. in addition, an odbc interface called myodbc allows additional programming languages that support the odbc interface to communicate with a mysql database, such as asp or coldfusion. the mysql server and official libraries are mostly implemented in ansi c/ansi c++.

to administer mysql databases one can use the included command-line tool (commands: mysql and mysqladmin). also downloadable from the mysql site are gui administration tools: mysql administrator and mysql query browser. both of the gui tools are now included in one package called tools/5.0.html mysql gui tools.

in addition to the above-mentioned tools developed by mysql ab, there are several other commercial and non-commercial tools available. examples include phpmyadmin, a free web-based administration interface implemented in php, and navicat lite edition, a free desktop based gui tool.

php goal thermometer

introduction
you’ve seen them all over the internet: non-profit ‘money raised’ goal thermometers. you know, where the ‘temperature’ is the current amount of money raised. i just got finished constructing one an i thought id share.

gd library
the gd graphics library is a library for dynamically manipulating images. it can create images composed of lines, arcs, text (using program-selected fonts), other images, and multiple colors. version 2.0 adds support for truecolor images, alpha channels, resampling (for smooth resizing of truecolor images), and many other features. gd is extensively used with php and has been included by default as of php 4.3. to create the goal thermometer we are going to utilize the power of this library.

getting started
we are going to be using php to create an image and then reference the php file in the src attribute of an img tag in html. the browser has to know to render the file as an image so we will need to set the header to reflect that:

<?php
header("Content-type: image/jpg");

we will also include some get variables in the query string of the src attribute to tell the php file the size of the goal thermometer so the next step is to grab those values:

$width = $_GET['width'];
$height = $_GET['height'];
$goal = $_GET['goal'];
$current = $_GET['current'];

then we use the information to calculate our current progress towards our goal. notice that i’ve put a check to set the goal progress to 100% if we’ve exceeded it, this way the goal thermometer doesn’t display anything higher than 100%:

if ($current > $goal) {
	$percent= "100%!";
} else {
	$percent = round(($current/$goal)*100) . "%";
}

begin image creation
now we have some data to work with so we can begin to create the image using the gd library. first let’s just create the canvas for the image:

$im = imagecreate($width, $height);

now we can define the colors we will be using for the image as well as the text size:

$background_color = imagecolorallocate($im,200,200,200);
$fill_color = imagecolorallocate($im,255,0,0);
$notch_color = imagecolorallocate($im,255,200,200);
$text_color = imagecolorallocate($im, 0, 0, 0);
$text_size = 5;

the next step is to determine how much fill color to use, or in other words, what ‘temperature’ to set the goal thermometer at. since i’m constructing a horizontal goal thermometer i work with the $width variable:

$fill = (($current/$goal)*width);

once we have our fill amount we need to create a rectangle of that size to mimic the goal thermometers’s mercury:

imagefilledrectangle($im, 0, 0, $fill, $height, $fill_color);

next i will generate the notches along the goal thermometer so someone viewing it can get a bearing on how far along the progress is. for this example i’m going to put a notch every 10% of goal thermometer size:

$inc = $width / 10;
for($i=0;$i<=$width;$i+=$inc){
	if ($i > 0) imageline($im,$i,0,$i,4,$notch+color);
}

to make the goal thermometer easier to read, i want the current progress displayed in the center of the thermometer. so we calculate the dead center of the goal thermometer and set coordinates accordingly (don’t forget to adjust the coordinates relative to the font size):

$text_x = ($width / 2) - 12;
$text_y = ($height / 2) - 7;
imagestring($im, $text_size, $text_x, $text_y,  $percent, $text_color);

display the image
now that php has generated all the pieces of the image all we have left to do is put them together and then free up the memory that was used to generate the image.

imagejpeg($im);
imagedestroy($im);
?>

make sure to use the imagedestroy() whenever creating an image. using php to generate images is easy and powerful but it does use a substantial amount of memory and if you use it too often without freeing the memory (let’s say in an image gallery for example) you may experience server bloat. save the document as thermometer.php.

the only step left is to call the php image from html:

<img src="thermometer.php?width=200&height=15&goal=1000&current=200" />

the above img tag will generate a goal thermometer that’s 200px wide and 15px tall that has currently raised $200 of a $1000 goal. to make it completely dynamic you’d probably want to calculate the current when the pages loads rather than leaving it as a static number.

closing
you can see just how easy it really is to use php and the gd library to create images. there are plenty of practical uses for this other than a simple goal thermometer. one that immediately comes to mind is a captcha device.

javascript

introduction
javascript is a scripting language widely used for client-side web development. it was the originating dialect of the ecmascript standard. it is a dynamic, weakly typed, prototype-based language with first-class functions. javascript was influenced by many languages and was designed to look like java, but be easier for non-programmers to work with.

although best known for its use in websites (as client-side javascript), javascript is also used to enable scripting access to objects embedded in other applications (see below).

javascript, despite the name, is essentially unrelated to the java programming language, although both have the common c syntax, and javascript copies many java names and naming conventions. the language’s name is the result of a co-marketing deal between netscape and sun, in exchange for netscape bundling sun’s java runtime with their then-dominant browser. the key design principles within javascript are inherited from the self and scheme programming languages.

“javascript” is a trademark of sun microsystems. it was used under license for technology invented and implemented by netscape communications and current entities such as the mozilla foundation.

history and naming
javascript was originally developed by brendan eich of netscape under the name mocha, which was later renamed to livescript, and finally to javascript. the change of name from livescript to javascript roughly coincided with netscape adding support for java technology in its netscape navigator web browser. javascript was first introduced and deployed in the netscape browser version 2.0b3 in december 1995. the naming has caused confusion, giving the impression that the language is a spin-off of java, and it has been characterized by many as a marketing ploy by netscape to give javascript the cachet of what was then the hot new web-programming language.

microsoft named its dialect of the language jscript to avoid trademark issues. jscript was first supported in internet explorer version 3.0, released in august 1996, and it included y2k-compliant date functions, unlike those based on java.util.date in javascript at the time. the dialects are perceived to be so similar that the terms “javascript” and “jscript” are often used interchangeably (including in this article). microsoft, however, notes dozens of ways in which jscript is not ecma compliant.

netscape submitted javascript to ecma international for standardization resulting in the standardized version named ecmascript.

main uses
the primary use of javascript is to write functions that are embedded in or included from html pages and interact with the document object model (dom) of the page. some simple examples of this usage are:

• opening or popping up a new window with programmatic control over the size, position, and attributes of the new window (i.e. whether the menus, toolbars, etc. are visible).
• validation of web form input values to make sure that they will be accepted before they are submitted to the server.
• changing images as the mouse cursor moves over them: this effect is often used to draw the user’s attention to important links displayed as graphical elements.

because javascript code can run locally in a user’s browser (rather than on a remote server) it can respond to user actions quickly, making an application feel more responsive. furthermore, javascript code can detect user actions which html alone cannot, such as individual keystrokes. applications such as gmail take advantage of this: much of the user-interface logic is written in javascript, and javascript dispatches requests for information (such as the content of an e-mail message) to the server. the wider trend of ajax programming similarly exploits this strength.

a javascript engine (also known as javascript interpreter or javascript implementation) is an interpreter that interprets javascript source code and executes the script accordingly. the first ever javascript engine was created by brendan eich at netscape communications corporation, for the netscape navigator web browser. the engine, code-named spidermonkey, is implemented in c. it has since been updated (in javascript 1.5) to conform to ecma-262 edition 3. the rhino engine, created primarily by norris boyd (also at netscape) is a javascript implementation in java. rhino, like spidermonkey, is ecma-262 edition 3 compliant.

the most common host environment for javascript is by far a web browser. web browsers typically use the public api to create “host objects” responsible for reflecting the dom into javascript. the web server is another common application of the engine. a javascript webserver would expose host objects representing an http request and response objects, which a javascript program could then manipulate to dynamically generate web pages.

things to consider
the dom interfaces for manipulating web pages are not part of the ecmascript standard, or of javascript itself. officially, they are defined by a separate standardization effort by the w3c; in practice, browser implementations differ from the standards and from each other, and not all browsers execute javascript.

to deal with these differences, javascript authors can attempt to write standards-compliant code which will also be executed correctly by most browsers; failing that, they can write code that checks for the presence of certain browser features and behaves differently if they are not available. in some cases, two browsers may both implement a feature but with different behavior, and authors may find it practical to detect what browser is running and change their script’s behavior to match. programmers may also use libraries or toolkits which take browser differences into account.

security
javascript and the dom provide the potential for malicious authors to deliver scripts to run on a client computer via the web. browser authors contain this risk using two restrictions. first, scripts run in a sandbox in which they can only perform web-related actions, not general-purpose programming tasks like creating files. second, scripts are constrained by the same origin policy: scripts from one web site do not have access to information such as usernames, passwords, or cookies sent to another site. most javascript-related security bugs are breaches of either the same origin policy or the sandbox.

one common javascript-related security problem is cross-site scripting, or xss, a violation of the same-origin policy. xss vulnerabilities occur when an attacker is able to cause a trusted web site, such as an online banking website, to include a malicious script in the webpage presented to a victim. the script in this example can then access the banking application with the privileges of the victim, potentially disclosing secret information or transferring money without the victim’s authorization.

xss vulnerabilities can also occur because of implementation mistakes by browser authors.

xss is related to cross-site request forgery or xsrf. in xsrf one website causes a victim’s browser to generate fraudulent requests to another site with the victim’s legitimate http cookies attached to the request.

ajax

introduction
ajax (asynchronous and xml) is a group of interrelated web development techniques used for creating interactive web applications or rich internet applications. with ajax, web applications can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. data is retrieved using the object or through the use of remote scripting in browsers that do not support it. despite the name, the use of and xml is not required, and they do not have to be used asynchronously.
Continue reading »