Learning Computer Programming Programming Blog

I post articles, tips, tricks, techniques, algorithms etc. related to C++ Programming. Many of the things that I discuss also applies to other programming languages.

Total indexed: 28 posts

Blog Directory  >  Software Blogs  >  Programming Blogs  >  Learning Computer Programming Programming Blog

Designing Your Own Lightbox in Javascript

In nowadays web 2.0 world use of Lightbox is very common. While Lightbox, fancybox (similar to the former) are great scripts and have wide uses, creating a script similar to these is never a bad idea. If you learn, read on else use of one of those scripts, they’re great and easy-to-use.

For those of you who haven’t heard about the script or don’t know what they do, see the following image:

Chances are, you might surely have seen it somewhere or the other. These scripts are generally used to display some content in kind of like a dialog box (modal one, for those of you who're geeks) while the rest of the content gets blackened. Looks great? Yes it does!

Read the full post >>

Happy Diwali

A Simple Pong Game using JavaScript

Having the knowledge of moving images using JavaScript, we’ll be creating a small Ping Pong game as an example for this post.

Today we’ll learn to do a few new things in JavaScript:

1. Executing some code every specified time interval (for game loop).
2. Tracking and using mouse movements.
3. Attaching code (function) to events.

Game Theory

As you should be knowing, in this game there is one ball and two paddles at two ends. One is user-controlled the other, for this example, is CPU controlled. User has to move the paddle in order not to let the ball pass through, CPU also has to do the same thing. Whoever’s side the ball passes through looses the game.

Read the full post >>

Moving (Positioning) an Image Using JavaScript

In this post we’re going to learn how we can move an image around using JavaScript. We’ll have four control links (Left, Right, Up, Down) that’ll move the image.

Reading along you’ll learn:

  1. What the absolute and relative positions do
  2. How some JavaScript function can be invoked automatically on page load
  3. How JavaScript can be used to manipulate the “style” properties of elements
  4. How JavaScript can be used to change these properties

Okay, now let’s start!

THEORY

We’re going to have the following elements in the page:

Read the full post >>

Image Generation Using PHP

In one of the previous posts about CAPTCHA Image Generation we made use of PHP’s image generation functions but didn’t discuss about them. So, if you had any problems or just want to know more, read on.

Creating and outputting images from PHP is very simple and easy. And since PHP supports images in a number of different formats you can very easily generate images in various formats such as JPEG, PNG, GIF etc. Generating  images involves the following steps:

  1. Creating a canvas.

  2. Drawing

  3. Outputting the image.

Read the full post >>

How CAPTCHA Works? And a Simple Script in PHP

[For this post I'm presuming that you are familiar with CAPTCHA, if not please read this Introduction to CAPTCHA]

Today we are going to see how CAPTCHA (Completely Automated Public Turing test to tell Computers and Humans Apart) works and how it minimizes automatic sign-up of forms. We will also be creating a simple CAPTCHA script in PHP to illustrate this.

Basically CAPTCHA works in the following manner:

  1. Create Random Value: Some random string is generated, random values are often hard to guess and predict.

  2. Generate an Image: Images are used as these are generally a lot harder to read for computers while being nice and readable to humans. This is also the most important step as simple text in images can be read (and CAPTCHA cracked) quite easily. To make it difficult for them, developers employ different techniques so that the text in the image becomes hard to read for computers. Some create zig-zag lines for background while others twist-and-turn individual characters in the image. Possibilities are many and new techniques are being developed all the time as crackers are always into finding ways to break them.

  3. Store it: The random string generated (which is also in the image) is stored for matching the user input. The easiest way to do so is to use the Session variables.

  4. Matching: After the above step, the CAPTCHA image is generated and shown on some form which we want to protect from being abused. The users fills in the form along with the CAPTCHA text and submits it. Now we have the following:

    1. All submitted form data.

    2. CAPTCHA string (from form), input by user.

    3. CAPTCHA string (real one, generated by us), from session variable. Session variable is generally used as it can keep stored values across page requests. Here, we needed to preserve stored values from one page (form page) to another (action page-that receives form data).

  5. If both match, it's okay otherwise not, in that case we can give the user a message that the CAPTCHA they had entered was wrong and their form could not be submitted. You could also ask them to verify it again.

Read the full post >>

Generating XML Feeds (RSS, Atom) Using PHP

RSS/ATOM feeds are very common these days and almost all Content Management Systems (CMS) can generate it. But in the case when you want to generate it yourself or just want to learn how you can, read on!

Both RSS and ATOM feeds are written in eXtensible Markup Language (XML) standard markup. Not just standard markups, you also need to be sure of what and how you put data in those markup elements (tags). For all this refer to the feed specifications of RSS and ATOM. XML itself is very strict and the standard specifications makes it even harder to generate valid feeds. And moreover, why re-invent the wheel when we can have it – ready-made.

Read the full post >>

Geany - A Good Web Development Editor (IDE)

Geany Homepage

Last year I finally made a switch to GNU/Linux as my operating system and had been in search of a good editor for my web development. In Windows I used Dreamweaver for the purpose and was quite happy with it. It could can easily highlight PHP, HTML, JavaScript and other codes of some other languages related to web. It can also do some Auto-Completion – a feature I think is a must-have. I also liked the fact that it (version MX) was reasonably light on system resources.

When I switched to Linux, I tried Bluefish, Komodo Edit, Netbeans IDE. Bluefish (ver 1.0.7) had  a  bad syntax highlighting feature besides other things I found to be quite irritable (working with PHP files, at least). Komodo Edit and Netbeans stood out especially Komodo Edit, in terms of functionality, usability and other small-small things. But still these were not what I was looking for. I wanted something good in terms of functionality but at the same time light on resources (Komodo Edit took about 15 seconds to load). I wanted something that had a good balance between features and memory footprint.

Read the full post >>

Generating XHTML MP (WAP 2.0) Pages From PHP

Maybe you guys know that I've been working on a service called MyWapBlog.com which lets peoples create/manage mobile blogs using their mobile phones. In the course of the development I've learnt great deal about mobile websites and their dynamic generation, and I'm sharing a bit of it here in this post.

How do you generate dynamic (X)HTML Pages using PHP? Simple:


<!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">
<head>
<title>Sometitle</title>
</head>
<body>
<h1>Hello</h1>
<p><?php echo date('h:i A, j-M-y'); ?></p>
</body>
</html>
Read the full post >>

Custom Tags Parsing Using Regular Expressions

In the last post, we had created a simple custom tag parsing script using PHP string functions. In this post, we are going to continue our discussion on custom tag parsing but rather using Regular Expressions. Here we will see how regular expressions can used to parse strings, we will also see where to and where not to use Regular Expressions. Before continuing, I expect that you have a working knowledge of Regular Expressions if not please first check out this websites.

Let us first create the previous custom tag parsing script using expressions:

Read the full post >>

Basic "Custom Tags" Parsing Script

Basic

Today we are going to create a basic Custom Tags parsing script that will parse special symbols (tags) in text for formatting purpose. Just like writing <b>BOLD</b>, a web browser parses it as “BOLD” in bold letters, same way our script will parse tags created by us. One very popular example of custom tag parsing for formatting purpose is, BBCode which most of the bulletin boards use to let users format their posts.

This will be a basic example of parsing custom tags so we will only be parsing two tags. One will convert the enclosing text into bold and other will be used for italics. After understanding the basic idea, you can easily add more tags according to your needs and can also use it wherever necessary. One of its good use will be in Shout Boxes that we had designed a few months back.

Read the full post >>

Basic "Custom Tags" Parsing Script

Today we are going to create a basic Custom Tags parsing script that will parse special symbols (tags) in text for formatting purpose. Just like writing <b>BOLD</b>, a web browser parses it as “BOLD” in bold letters, same way our script will parse tags created by us. One very popular example of custom tag parsing for formatting purpose is, BBCode which most of the bulletin boards use to let users format their posts.

This will be a basic example of parsing custom tags so we will only be parsing two tags. One will convert the enclosing text into bold and other will be used for italics. After understanding the basic idea, you can easily add more tags according to your needs and can also use it wherever necessary. One of its good use will be in Shout Boxes that we had designed a few months back.

Read the full post >>

Simple File Uploading Script in PHP

PHP is undoubtedly the best programming language when it comes to web programming. It gives us so many features and capabilities, a few of which we’ve discussed already. So continuing with that, today we’ll see how we can use a few lines of code to create a script that’d allow file uploading right from the web browser. File upload feature is definitely useful kinds of website but at the same time very much vulnerable to malicious attacks as well. So use it with a LOT of precautions!

Read the full post >>

Finally a Blogging Platform for the Mobile Web (WAP)

Most of the time I browse internet for reading blogs, checking emails etc. I do it on my cell phone. One day I thought why not create a mobile website or better yet blog, and started searching around. What did I find? Well, nothing much useful. In this big world and yet bigger web, to my disappointment, I couldn’t find any website offering free blogs like we do on the normal (desktop) web. Moreover, those that offered mobile websites, I just didn’t like their service. You just have to spend so much time to just have a single page up!

Read the full post >>

Designing a Simple HTML Code & Preview Tool (Online)

Designing A Simple HTML Code & Preview Tool (Online)

With online CMSs everywhere and craze of blogging like never before, we see some sort of online HTML editors everywhere. Ever blogged or posted in some forum? Most of them have it! These editors let you write, format, preview and tinker with the HTML code before publishing anything. Most of them have a nice UI to format everything much like the desktop applications like NVu, Dreamweaver etc. these online editors also let you manually change or write HTML code that can be previewed without leaving the page.

Read the full post >>

Designing a Simple HTML Code & Preview Tool (Online)

With online CMSs everywhere and craze of blogging like never before, we see some sort of online HTML editors everywhere. Ever blogged or posted in some forum? Most of them have it! These editors let you write, format, preview and tinker with the HTML code before publishing anything. Most of them have a nice UI to format everything much like the desktop applications like NVu, Dreamweaver etc. these online editors also let you manually change or write HTML code that can be previewed without leaving the page.

Read the full post >>

Creating a Simple Countdown Timer Using JavaScript II...Using getElementById() Method

Speaking of yesterday’s post, it had the following problems:

1. It could not easily be embedded into an existing page.
2. It could not be placed wherever we wanted it to be nor it could be aligned or styled easily.
3. Rather than updating the same number to countdown it showed a series of numbers as countdown proceeded.

Well all these problems can easily be solved by one of JavaScript’s powerful method getElementById(). This is documents’s method which can be used to access HTML entities within JavaScript with the help of their IDs (which is unique).

Read the full post >>

Creating a Simple Countdown Timer Using JavaScript

Some JavaScripting today! We are going to create a simple countdown timer using JavaScript. What’s the use? Umm, I really am not creative enough to find any of its perfect use but it could be used somewhere, sometimes…and there is no harm in learning something even when there seems to be no potential use of it. Who knows maybe you’d need it sometime to add creativity to your web pages. Of course some of the techniques that we are going to use will be needed at many times, so you won’t wanna miss this!

Read the full post >>

Evaluating/Executing PHP Code at Run-Time Using eval() Function

OK, so today we are going to discuss about one of the interesting functions of PHP. The eval() function. It is interesting in that it can evaluate/execute PHP code from inside scripts. This means, the eval() function can evaluate PHP code at run-time. The code itself in turn may be generated at run-time hence it could be used to execute code that may not initially be a part of the script.

Let’s see some examples:

eval("echo 'hello';");

Which is equivalent to:

echo 'hello';

Read the full post >>

Blogger: Changing Templates without Loosing Widgets

The other day when I was trying to change the Template of this blog I faced a rather disheartening problem. Blogger said that all the Widget along with their data will be lost when changing to a third-party template. As you can see I have a link list (big one) on the sidebar, it has links to all my posts so far (>180!), man could I afford to loose that? Of course NOT!

Good thing was switching to one of the templates provided by Blogger wouldn’t make me loose those widgets. Bad thing is I don’t like those templates. Those are all too old, excessively used everywhere and 2-column ones.

Read the full post >>