Up Beat

Posted on June 28, 2007

No, I’m not just feeling happy today — Up Beat is a really cool game by Miniclip. Has anyone played it? It’s really addicting.

Basically, the point of the game is to ‘play the keyboard’. Different colored blocks come towards you and just as they reach a line, you’re supposed to press the corresponding letter. The closer your block is to the line when it is activated, the more points you get.

The blocks are also coming to the beat of a song — so you can basically know when the next block is coming.

As you go through the levels, harder and harder songs come up, with chords and faster notes.

It’s probably one of the best games on the internet, and it has great music

I really suggest you try it:

· Comments (6) · Other

Writing a PHP & SQL Hit Counter

Posted on June 18, 2007

Hello!
I decided to write a PHP tutorial, so today, we're going to learn how to make a database-driven hit counter.
Hopefully you'll learn a bit about database connections.
In the distant future, I'll make a flatfile-based hit counter, but for now, let's learn some SQL =D

Warning: Do not try to copy and paste from the code boxes. They're just there to show you what's happening and do not copy well; if you'd like to use/edit the code, I suggest you download it from the links at the bottom.

SQL DB Creation

This is assuming you're using MySQL and PHP 4.4.6 (like me!)
The first thing we're going to do is create the database/table.
If you have a database set up already, skip the next steps. I'll be using PHPMyAdmin to show you how to make a database.
1. Login to PHPMyAdmin.
2. You should see a home screen with various links and statistics. Find the text "Create new database".
3. In the text field underneath, enter your database's name (something like hits). Leave the select box next to it as default, and if it's set to anything other than Collation, put it back to Collation.
4. Click create.

Your database has been created, but it's not much help without some tables.
Let's create one!
1. Find the name of your database in the select box on the left side bar.
2. You should come up with a screen that says 'No tables found in database.'
3. Underneath that message is a fieldset with some text boxes. In the first, type the name of your table, e.g. hits.
4. In the second text box, type the number 1. That means we're only going to have one field -- the number of hits.
5. Click 'go' or press enter.

You should now be on a page with a bunch of text fields.
Take a look at the first HTML table. There should be the following text written across the top:

Field TypeDocumentation Length/Values1 Collation Attributes Null Default2 Extra Primary Index Unique --- Fulltext Comments
(or something close!)
Underneath should be a row of text boxes/select boxes/radio buttons.
Fill them out like this (respectively):
1. hits
2. int
3. leave this blank
4. leave this blank
5. leave this blank
6. leave this at default
7. 0
8. leave this blank
9. Select this radio button
10 through 13. leave these unselected
14. Enter any comments you have about the table--e.g. Hit counter or whatever.

For number 9, you're setting this column as a primary key.

Leave all of the fields underneath that blank and click 'save'. Not go! Save!

This is the final step for the database.
In the top menu, click "Insert".
Except for the first 'Value' box,leave everything blank. But in that box, insert the value 0.
Click go. =)
Congratulations, your database-ing is complete. You now have a working table that can be accessed by PHP. =)

PHP Code

This is going to be a step-by-step process of creating the PHP code to access the database, update it and display it.

First, we need a connection.
Make a new file called db.php.
Put this inside: (read the comments to find out what's happening)

PLAIN TEXT







<br />


<?php<br />


class DB { //Database class<br />


  function open_db() { //This function opens the connection to the database and returns the connection.<br />


    $host = "localhost"; //Your sql host<br />


    $username = "my_username"; //Duh?<br />


    $password = "db"; //Double duh?<br />


    $dbname = "hits"; //Put the name of your DB here, in this case, hits<br />


    $connection = mysql_connect($host,$username,$password) or die(mysql_error()); //This part actually takes your variables and creates the connection.<br />


    mysql_select_db("") or die(mysql_error()); //This one opens the correct database.<br />


    return $connection; //Return the connection (so we can close the correct one later!)<br />


  }<br />


  function close_db($c) { //Close the connection. $c is the connection.<br />


    mysql_close($c); //This function (mysql_close($blah)) closes a sql connection.<br />


  }<br />


}<br />


?><br />

Remember to edit the variables! You wont connect otherwise.

That's simple. How about usage?
The following code is not part of the hit counter, but is necessary for you to learn how to use the class.
Make a new file. Stick this inside:

PLAIN TEXT







<br />


<?php<br />


include("db.php"); //Include our DB class<br />


//First, we gotta initialize the db class.<br />


$db=new DB;<br />


//Now let's open the connection.<br />


$connection = $db->open_db(); //The database has been opened.<br />


echo "Congratulations! You're in!";<br />


//Now let's close the connection.<br />


$db->close_db($connection); //Notice how I passed the connection variable as a parameter.<br />


echo 'Database closed.';<br />


?><br />

Pretty simple, right? $db->open_db() returns the opened connection and $db->close_db($connection) closes the opened connection.

How about applying this to the hit counter? Basically, what we want to do is to have a php file that will:
1. Open a database connection
2. Retrieve the hit count from the hits table
3. Add 1 to the hit count
4. Echo the current hit count
5. Save the current hit count back to the table
6. Close the connection.

The final usage will be simple.
Anywhere you want the hit counter value to appear on a php page, add this:

It really couldn't be easier. But what about the code? =D
Let's start with opening the database.

PLAIN TEXT







<br />


<?php<br />


include("db.php"); //DB Class<br />


$db=new DB;<br />


$con = $db->open_db();<br />


//Our database is opened. Let's fetch the value we need.<br />

Now, we're going to need to create a sql select statement.
We basically need to get the value in the hits field of the hits table of the hits database. Sorry about the naming issues
This would be the syntax:
SELECT * FROM `hits`
You can try it out but clicking the little button labeled "SQL" on the left of phpmyadmin. Then, enter the above query. Press go. See what it returns -- it should be just a small table with the number 0 in it.

So let's apply the select to the code =)

PLAIN TEXT







<br />


//Select what we want<br />


$data=mysql_fetch_array(mysql_query("SELECT * FROM `hits`"));<br />

Now, $data contains an array of result columns. We only need hits, so let's reassign $data.

PLAIN TEXT







<br />


$data=$data['hits'];<br />

Yay! $data now contains the number 1. =)
Next, we have to take the string 1, make it an integer, and add one to it. Easy. =)

PLAIN TEXT







<br />


$hits=intval($data);<br />


$final=$hits+1;<br />

intval() Is a function that returns an integer from anything.
So now, $final contains the correct hit number. Let's echo it.

PLAIN TEXT







<br />


echo $final;<br />

For the final task, we have to input this new number into the database.

So basically, we need to find the SQL syntax to update the column.
Because the column/row we are changing already exists, we need to use an UPDATE statement. The syntax would be as follows (don't worry, I'll explain it!):

PLAIN TEXT







<br />


UPDATE `hits` SET `hits` = '$final' WHERE `hits`.`hits` ='$hits' LIMIT 1<br />

We already know what UPDATE does -- it updates a row.
SET is the placeholder so the SQL parser knows what you want to replace.
We want to replace the hits column, so we set it to $final.
WHERE is a conditional: Basically, it allows the SQL to know the conditions of the rows you'll be changing.
The variable $hits contains the old value, allowing the SQL to find the correct row (in case you made a mistake).
LIMIT 1 tells the SQL to stop after 1 replacement.

Let's use this with the program:

PLAIN TEXT







<br />


mysql_query("UPDATE `hits` SET `hits` = '$final' WHERE `hits`.`hits` ='$hits' LIMIT 1");<br />

Congratulations. You're done =)
Now we just have to close the database.

PLAIN TEXT







<br />


$db->close_db($con);<br />

Remember the $con parameter? It allows the function to close the correct connection.

Awesome job! Today, you learned how to create a full SQL hit counter in a couple of simple steps and lines of code.

Hopefully, you know a bit more about sql queries, PHP myadmin, various php functions and (even though we didn't cover this, you can read the code) classes.

Please ask any questions in the comments field. I'd love to know about any problems you're having and any comments you have about the tutorial.

If anyone likes this one, more will follow!
The full file can be downloaded here, and you can view it in action here (respectively):
ZIP File | Demo
Feel free to redistribute/edit/whatever. It's open source (OBVIOUSLY! :P)
-Choco

· Comments (8) · Tutorials, PHP

PayPerPost

Posted on June 15, 2007

I signed up for a new service named PayPerPost. It seemed quite interesting as I started looking -- money for writing quick, usually 100-word blog posts? So simple, and so rewarding! Yet not really.

I logged in a couple of days after placing their javascript on this blog. Do you know what I got?
"Your blog has been rejected."
The first thought to touch my mind was "NOOBS!". And then I thought about how I had a lot of homework due and I shouldn't be playing minigolf on the internet. Then I wondered why.
So I read on and it turns out I haven't posted enough. I knew I should have made more posts =[

Apparently, I need to get 8-9 more posts to procure a partnership with PPP. Haha. Fun to say.

I'm so bored these days! Nothing to write in Javascript =[ I've been coding a lot of website templates these days.

Hopefully, I'll have enough money soon to buy something for myself. I dunno what. What do I buy? =[ Any ideas anyone?

Gosh I need a life.
-Choco

· Comments (0) · Other

Web 3.0

Posted on May 24, 2007

If 2.0 is the new 1.0 and 1.0 is the new 3.0, what does that make pink? Is it the new blue?

Web 2.0: World's Most Common Incorrectly Used Phrase. And I'm willing to bet on that.

Web 2.0, in a general sense, is a label for the next generation of web applications, with their eyes not focused upon storage and interpretation, but the presentation and dynamic interactivity of data and users. Where does a site go from website to application? Frankly, I don't have a clue. I guess where a website gains an important and user-driven purpose, but that's not a very good description either. Let's check the definition of web application: (http://www.state.tn.us/guidelines/d.html)

WEB APPLICATION
An application that is delivered using Internet technology and meets one or more of the following conditions:

* Utilizes a database (such as Oracle or SQL Server)
* Is developed using an application development tool (such as Oracle Internet Developer Suite or Visual Studio)
* Extracts data from multi-record files
* Requires a constantly running server process (such as Newsgroups and Chatrooms)
* Stores input data from data entry screens or web forms

Depending on its requirements, a web application may be an Internet Application or an Intranet Application.

So. The main requirement is based around the database, exactly like I said -- data driven!

You must be asking if there's a point of this post, and yes, there is.

We envision web 2.0 as database/data-driven with a strong lead in user interactivity/data sharing. ITS ALL ABOUT DATA!

What does this mean for web 3.0? Will there be a web 3.0? When will it come?
Web 3.0 is mythical right now. Web 3.0 would require a new outlook on the way we share information and interact with other people, and if someone could imagine it, it would already be in existance. Not really helpful; so we're just going to have to extrapolate.
If 1.0 was based on formatting and 2.0 is based on clean presentation of data, web 3.0 has to have a new and revolutionary focus.
What are the three main components of a website?
1. Presentation
2. Data
3. Incentive
What I mean by incentive is a catch--something that brings the user back again and again and again. So. If we were to focus directly upon this, what would we need to do? We'd need to compete. Web 3.0 will be, in my eyes, one, large competition -- larger than web 2.0 is. Much larger, in fact. And when you have competition, you're too focused on beating the other person to worry about originality.

This basically means that my outlook on 3.0 is a uniformity blanket, much like 2.0, except to a greater extent (everyone wants gloss right now! Get rid of the gloss!). Not a very interesting future at this point.

There's also always the chance that we'll skip out on the web totally and we'll come up with a new form of data sharing, maybe more focused on a graphical aspect than the internet. I'd really not like to think about that...I've put too much time coding javascript!

Until next time. =)

· Comments (4) · Other

The Wii: A Review

Posted on May 8, 2007

Well, among other things, this blog will now become an impromptu Wii review site, as I received one as a gift a week or so ago.

The first thing I wanted to know as I dove into the packaging was whether or not it was worth waking up at 6:00 and lining up in a line, outside, at 40 degrees Fahrenheit. And the first thing I did find out was that you should plugin all of the attachments before starting up the system. It only took me 30 minutes to figure it out; I believe that's a record!
So after sticking the sensor bar in, I booted up the Wii for the real first time.
Quick Fact: The Wii can recognize some button presses without the sensor bar, but no movement.

I was greeted by smooth, clean, white graphics asking for various settings. After a bit of configuring, I really got into the Wii.

What a menu! Loads of shiny expanding things, just waiting to be hovered and clicked and...I was in heaven. Seriously. Obviously, Nintendo was seriously considered about aesthetics this time around. Well, I inserted the wii sports disk, waiting to be amazed.

...

Oh, there's no autoplay? :/

Oh well. I clicked the CD Channel and started the game up. Obviously, this isn't a review about Wii Sports, so I wont talk too much about it, but what a game! It puts the WOW in...err...umm...powow? Wowzorz? Err, you get what I mean.

The wii, as a console, is pleasing. It fits snugly under/next to your TV with the sensor bar hardly showing up. The removes can be neatly put away in a row, unlike the ungainly remotes of the XBox 360, or the PS 3. But how do the remotes themselves work?

Beautifully. Every motion, every action, every turn is captured perfectly and put into the game. I started playing tennis sitting down, but within 5 minutes, without noticing, I was standing up and hitting with all my might. Immersion at its finest! All three dimensions are supported by the remote.

As for the internet, I feel that was the best part of the console. I clicked the wireless settings button, apprehensively...anyone who's tried configuring a network with Windows will understand why. I found three buttons, so being the intelligent user, I did eenie-meenie-miney-mo and picked one. Well, let's just say that within about 4 seconds my wireless was set up and ready to go. It even has better signal strength than my laptop in the same room as the router. Awesome!

After a quick download of the Internet Channel from the Wii Shop (also cool!), I was surfing the internet too. I must commend Opera, they managed to put together a full browser for the Wii very nicely. Javascript, HTML and even some Flash work perfectly together to create pages that look exactly as they should. Nice.

It was also fun emailing myself from the console. You can email other people too, or even other wiis. Pictures are awesome to send--you can keep them and view them in a slide show later.

Memory wise, the Wii's okay. I can download about 15 channels without any trouble, so that's a plus.

Very nice, nintendo. Very nice. An awesome console that gets everyone active.

Suggestions: Buy 2 remotes, get at least one nunchuck (for Zelda, which you have to buy. No, seriously. You've got to buy it. Look at the fine print in the manual!), and PUT THE ****ING WRISTSTRAPS ON. My friend has a dent in his TV because he was playing Tennis too vigorously without the proper tightness on the strap. Guess who has to pay their dad $1500 for a new one *points*

Great system, awesome gameplay and huge amounts of potential. Now we stare at the game makers...can they match the sleekness of the Wii and make some good, solid games?

· Comments (0) · Other

jsPHPDate

Posted on May 1, 2007

What is jsPHPDate? Interesting question. Put simply, it's a PHP date function emulator...for javascript!

Have you ever wanted to fetch the hours, minutes and seconds in a code, but are too lazy to use the Date() object? With jsPHPDate, you just have to call date("h:i:s"). Done. Yes, it's that simple!

Supported flags are:
n
h
y
i
s
t
g
d
D
j
l
N
S
w
z
W
F
m
M
L
Y
a
A
G
H
O
P
z
Not Supported: o, B, e, T, c, I, r, U
Each of these can be looked up on the PHP Date Manual.

Now, for the actual code:
<script type="text/javascript"> /*[////////////////////////////////]*/ /*[ jsPHPDate -- PHP Date Emulator ]*/ /*[By Choco -- www.seekond.com/blog]*/ /*[ Do not edit or redistribute! ]*/ /*[ --Start Code-- ]*/ /*[////////////////////////////////]*/ nD=new Date(); Date.prototype.doy=function() { d = new Date(this.getFullYear(),0,1); return Math.ceil((this-d)/86400000); } Date.prototype.leapYear=function() { if(parseFloat(nD.getFullYear()/4)==nD.getFullYear()) return 1; else return 0; } function $.gd(num) { switch(num) { case 0: return "Sun,Mon,Tue,Wed,Thu,Fri,Sat".split(","); break; case 1: return "Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday".split(","); break; case 2: return "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec".split(","); break; case 3: return "January,February,March,April,May,June,July,August,September,October,November,December".split(","); break; case 4: return "st,nd,rd,th,th,th,th,th,th,th,th,th,th,th,th,th,th,th,th,th,st,nd,rd,th,th,th,th,th,th,th,st".split(","); break; case 5: feb=(nD.leapYear()>0)?"29":"28"; cur="31,"+feb+",31,30,31,30,31,31,30,31,30,31"; return cur.split(","); break; case 6: x=new String(nD.getFullYear()); return x.substring(2,x.length); break; case 7: return (nD.getHours()>11)?"pm":"am"; break; case 8: return (nD.getHours()>11)?"PM":"AM"; break; case 9: if(nD.getHours()<10) { x="0"+nD.getHours(); return x; } if(nD.getHours()==11 || nD.getHours()==12 || nD.getHours()==10) { return nD.getHours(); } if(nD.getHours()>12) { return nD.getHours()-12; } break; case 10: curT=(nD.getTimezoneOffset()/60)+""; curT=curT.replace(/-/,""); curT=(curT.length==1)?"0"+curT+"00":curT; curT=(curT.length==2)?curT+"00":curT; curT=(curT.length==3)?curT+"0":curT; cur=(cur<0)?"-":"+"; return (cur+curT); break; case 11: curT=(nD.getTimezoneOffset()/60)+""; cur=nD.getTimezoneOffset()/60; curT=curT.replace(/-/,""); curT=(curT.length==1)?"0"+curT+"00":curT; curT=(curT.length==2)?curT+"00":curT; curT=(curT.length==3)?curT+"0":curT; cur=(cur<0)?"-":"+"; curT=curT.substring(0,2)+":"+curT.substring(2,4); return (cur+curT); break; default: return false; break; } } date(val) { tD=val.replace(/n/,nD.getMonth()+1); tD=tD.replace(/h/,$.gD(9)); tD=tD.replace(/y/,$.gD(6)); tD=tD.replace(/i/,(nD.getMinutes()<10)?"0"+nD.getMinutes():nD.getMinutes()); tD=tD.replace(/s/,(nD.getSeconds()<10)?"0"+nD.getSeconds():nD.getSeconds()); tD=tD.replace(/t/,$.gD(5)[nD.getMonth()]); tD=tD.replace(/g/,(nD.getHours()<12)?nD.getHours():nD.getHours()-12) tD=tD.replace(/d/,(nD.getDate().length<2)?"0"+nD.getDate():nD.getDate()); tD=tD.replace(/D/,$.gD(0)[nD.getDay()]); tD=tD.replace(/j/,nD.getDate()); tD=tD.replace(/l/,$.gD(1)[nD.getDay()]); tD=tD.replace(/N/,nD.getDay()); tD=tD.replace(/S(?!at)/,$.gD(4)[nD.getDate()-1]); tD=tD.replace(/w/,nD.getDay()); tD=tD.replace(/z/,nD.doy()); tD=tD.replace(/W(?!ed)/,Math.round(nD.doy()/7)) tD=tD.replace(/F(?!ri)/,$.gD(3)[nD.getMonth()]); tD=tD.replace(/m/,(nD.getMonth()<10)?"0"+(nD.getMonth()+1):nD.getMonth()+1); tD=tD.replace(/M(?!(on|ay))/,$.gD(2)[nD.getMonth()]); tD=tD.replace(/L/,nD.leapYear); tD=tD.replace(/Y/,nD.getFullYear()); tD=tD.replace(/a(?!(t|y))/,$.gD(7)); tD=tD.replace(/A(?!p)/,$.gD(8)); tD=tD.replace(/G/,nD.getHours()); tD=tD.replace(/H/,(nD.getHours()<10)?"0"+nD.getHours():nD.getHours()); tD=tD.replace(/O(?!ct)/,$.gD(10)); tD=tD.replace(/P(?!M)/,$.gD(11)); tD=tD.replace(/z/,nD.getTimezoneOffset()*60); return tD; } </script> Usage: call the date() function, and pass it your flags in an argument. Enjoy!



					
						 · Comments (0) · Other


												
					Run!
					
						Posted on April 29, 2007					
					
beta. says:

get Nicola. i want to spank her.
CALLING NICOLA CALLING NICOLA CALLING NICOLA!

Outkast is on his way for you! 
				
				

					
						 · Comments (4) · Other						
					

					
								
												
					New Project!
					
						Posted on April 16, 2007					
					
Yay! I've got a new project now!
I will officially be working on a Javascript Table Sorter. But wait...you're thinking of something else, I bet.

This one will all you to move table columns or table rows (left and right) and (up and down), respectively. E.g. if I had a table like this:


 
Column 1
Column 2


Row 1
Cell 1
Cell 2


Row 2
Cell 3
Cell 4


I would be able to move row 2 underneath row 1 and column 1 after column two. Cool, right? Yup.

I'll probably be releasing the code; a company member requested it, but I don't think they'll mind if you use it.
I was looking towards drag & drop for the column/row moving, but unfortunately, I'm way too lazy to code a drag and drop. Actually, drag and drop isn't too bad...it's the detecting where the dragged element is that really annoys me, so for now, you'll click on the td you want to move and then click on where you want to move it. Simple, I know. But it works.  
I'll keep you updated.  

-Choco
Edit: Whoa! I actually got off my lazy butt and tried something. So far, it only allows you to select two TD's at once, and only those of the column headings and the row headings:



 
Column 1
Column 2
Column 3


Row 1
Cell 1
Cell 2
Cell3


Row 1
Cell 1
Cell 2
Cell3



				
				

					
						 · Comments (5) · Other						
					

					
								
												
					Back!
					
						Posted on April 15, 2007					
					
Hey guys! It's a relief to be back. Sorry for the delay; my web host IP banned me or something for some reason, so I couldn't post or access my site in any way (even my webmail and FTP were down!)
Well, now I'm back, and I've got LOADS of stuff to tell you.  
See you tomorrow. I gotta sleep. :O
-Choco
				
				

					
						 · Comments (0) · Other						
					

					
								
												
					Blog.statusChange(”online”);
					
						Posted on April 2, 2007					
					
Yes, it is completely done. As far as presentation goes, everything is complete. All of this smooth sliding...gosh! Where to begin?
You may want to try pressing M and watching the nav menu slide toggle. Possible take a look at the scripts page and look at an awesome tree menu? Maybe surf around the blog and look at some new posts?
Coming soon:
1. Table of contents link at the top...this needs to be fixed and completed...
That's all. It's pretty much cross-browser (some IE issues, but nothing to affect browsing).
Have fun. ^_^
-Choco
				
				

					
						 · Comments (0) · Other

iName

Search

Categories

Archives

Friends

Recent Entries

Meta:

Up Beat

Writing a PHP & SQL Hit Counter

Warning: Do not try to copy and paste from the code boxes. They're just there to show you what's happening and do not copy well; if you'd like to use/edit the code, I suggest you download it from the links at the bottom.

SQL DB Creation

PHP Code

PayPerPost

Web 3.0

The Wii: A Review

jsPHPDate

Run!

New Project!

Back!

Blog.statusChange(”online”);

	Column 1	Column 2	Column 3
Row 1	Cell 1	Cell 2	Cell3
Row 1	Cell 1	Cell 2	Cell3