http://www.oxavi.com Web design, scripts, templates, and more. http://www.oxavi.com/i/og-icon.jpg http://www.oxavi.com/blog http://www.oxavi.com/blog/How_to_Write_a_Pagination_Class_in_PHP/29 Let's Get Started The goal of this tutorial is to show the basic concepts involved in MySQL/PHP paging and how you go about coding a simple solution. This is not meant as a final class ready to use on a live site with lots of traffic. The class can be further optimized and streamlined, but that is beyond the purpose of this article. To accomplish simple MySQL pagination you need two things: a function to run the MySQL statement through to go grab the right rows from the database and a function to create the navigation. I want mine to output a fully styled navigation, with some default css that is really easy to change. To begin with lets call the class pagination and make the two functions. [code] [/code] If you want you can download the files here. Handling the SQL First let's make the function which handles the MySQL statement. Let's call it paginate. Paginate will take 3 arguments: the page we are on, the sql statement, and how many results per page we want (with a default of 10). It will return the limited MySQL statement. First take a look at the complete function then I'll break down each part. [php]function paginate($page,$sql,$perpage=10) { //count the number of resutls $count = mysql_num_rows(mysql_query("$sql")); //if the page isnt a number set it to page 1 $page = is_nan($page)?1:$page; //limit the sql statement $start = (($page - 1) * $perpage); $end = $start + $perpage; $sql .= " LIMIT $start, $perpage"; //return the result return $sql; } [/php] First off let's take a look at the first two lines. [php]$count = mysql_num_rows(mysql_query("$sql")); $page = is_nan($page)?1:$page; [/php] The first thing we do is count the number of rows for the statement and store it in $count. The second line just makes it so that if the page number is not a number it will default to page one. Now the rest. [php]$start = (($page - 1) * $perpage); $end = $start + $perpage; $sql = " LIMIT $start, $perpage"; [/php] All these lines do is LIMIT the MySQL statement by starting on the first record for that page, and ending on the last record for that page. Pretty simple. For example let's say you are displaying a list of blog posts and want 10 to a page. You might do something like this to show all the posts on page 5: [php]//start the class $paging = new paging; //this grabs all the blog posts $sql = "SELECT * FROM `blog_posts`"; //set this to the page you want $currentpage = "5"; //limit the statement to just this page $new_sql = $paging->paginate($currentpage,$sql); //now use the new_sql like you normally would... [/php] Now that you see how it works, you can change the page in the best way you see fit. An easy way is setting a GET variable like /blog_post.php?page=5 and running it like this: [php]//start the class $paging = new paging; //this grabs all the blog posts $sql = "SELECT * FROM `blog_posts`"; //limit the statement to just this page $new_sql = $paging->paginate($_GET['page'],$sql); //now use the new_sql like you normally would... [/php] Implementing a Navigation The navigation function is a bit more complex. It takes 5 arguments: the page we are on, the original MySQL statement, optional number of results per page, optional number of links to limit the navigation to, and optional url of the page we are on. Take a look at the full thing, with comments explaining what is going on. [php]function navigation($page,$sql,$perpage=10,$limitnav=10,$link="") { //count the number of rows $count = mysql_num_rows(mysql_query("$sql")); //if the page isnt a number set it to page 1 $page = is_nan($page)?1:$page; //if the number of rows is less than the number per page we only need //one page and no nav if($count 1) { $nav .= "first"; } if($page !== 1 && $page !== "1") { $nav .= " prev "; } //if the number of pages is more than our limit for links in the //navigation then create the inner links if($pages > $limitnav) { //if we are past halfway then start at half the limit under the page if(( $page - ($limitnav/2) ) > 0) { $a = $page - ($limitnav/2); } else { //otherwise start at page 1 $a = 1; } //similarly find the end page number of the navigation if(($page+($limitnav/2)) http://www.oxavi.com/blog/My_Super_Sneak_Peak_Preview_of_the_G1/28 Casually stopping by T-Mobile, hoping to get some information on the G1 phone, we found out more than we could have hoped for… except for my original question, what is the monthly plan going to be? I guess I should mention I was with my friend Trevor so the use of we implies us, not my having multiple personalities… which I don’t… know of. The salesgirl, whose name shall not be… named, came over to help us. We asked a few questions and she basically said, “We won’t know anything about the phone until Sunday’s training session.” We continued to chat and after a bit she asked us, “do you want to see it?” Unsure at first what she was talking about, I said yes… she had snuck back to grab the G1! Yeah she lied about knowing nothing, but who could stay mad? She opened it up and we got to see many of its features and try the Android software. The phone felt very solid and light for its size. The flip-screen was awesome. I don’t think people will have to worry about that breaking off. It’s more likely to survive any accident than you or me. The first application she opened up was the GPS/Google-Map navigator (sorry I don’t really know the names of these things). We played with this for 10 or 15 minutes. Well, it was like the video so I won’t go into detail there, but I can confirm it is just as fun and functional as you’d imagine from the snippets you have probably seen. I should also mention that the multi-touch does work very well. The second application we tried was the SmartShopper… or something like that. I don’t remember if this application has been shown online, but what it does is it allows you to take a snapshot of a barcode and it will read the code, tell you the store you are at and how much the item is. I also believe it checks the stores online price. According to Trevor’s memory, the item we scanned was on sale online. This is great for price comparison and competitor price matching. I’m sure this feature alone is going to cover the cost of the phone and possibly the monthly fees. Those were the only applications we messed around with, but I’ll go into a little more detail about the phone itself. The buttons are great, not so easy to press that you will accidentally hit them while doing whatever you are doing. Also, typing on a real keypad is 1000 times easier than on a touch-screen, another superior feature to the I-Phone. I am personally a fan of the larger phones because you can actually type and read what is on the screen. In addition, you can see everything you are typing so you really have at least twice as much viewable screen area as the I-Phone. It still fits in your pocket and you’re not very likely to forever lose it if you drop it like a super mini nano I-Pod. http://www.oxavi.com/blog/My_Geek_Noir_G1_Encounter/27 As I placed my hand on the door, I almost slipped as my excitement was taking hold. Was I actually going to see it? Was this the pinnacle of technology, the end all to the personal device? I barely noticed the saleswoman assure me that she would help me soon; all I could focus on was a small nondescript plaque with the following: G-1 Phone: Coming October 22nd “How may I help you?” she said, as I tried to cover up my anticipation and play it cool. “Uh…um… I’d like to know more about the G-1.” My voice didn’t betray the hours I spent gazing at my shimmering LCD monitor at home, gleaning every morsel of information I could find about the contraption. “The G-1 will not be here until October 22nd.” Rejected yet again, I thought. She went into some diatribe about how she had to go to a five hour meeting on Sunday to talk about the phone. I nodded sympathetically, even though I would have given up my right nut just to be able to touch and cradle the G-1. “Would you like to see it? My manager doesn’t want me to show anyone, but I think I can sneak this by him.” This caught me totally off guard; I could merely nod and drool. She slumbered away deftly as I crept behind a sales rack. She came back and in moments I had my eye on the G-1. What a masterpiece of engineering! I was amazed by the ease of using the trackball to navigate Google Maps, and a smile slowly grew on my face as she flipped the touch-screen up and revealed the QWERTY keyboard. She told me to bring her an item, I quickly grabbed a Bluetooth earpiece as I thought her boss was coming and she was going to have to put the G-1 away. Instead I was treated to a demonstration of the bar-code scanning ability, which clearly showed that the in-store price was three bucks more than online. Worrying about revealing too much, my newfound friend carefully closed the flip screen and snuck it into her bra. I wished her good day, and promised that I would return on October 22nd. As I left the store, the sun shown brilliant rays, a my spirits lifted, and the whole world became a much happier place. Uh, actually I knew dick about the G-1 Phone until I stepped into the T-Mobile store and while this post is a little exaggerated, the thing was freakin’ awesome! http://www.oxavi.com/blog/The_Search_for_Web_Version_Control/25 Where Art Thou, Good Web Version Control? This post started out as an ask Reddit question in programming, but I soon realized that I couldn't quite ask the question in just a self reddit title. My question was as follows: Is there version control software that automatically backs up changes I make to files in a directory on my webserver? After much looking and a bit of pondering I think the answer is, unfortunately, no. I work in many small development groups for many different web sites. Most of the groups consist of me and one or two other people. A few projects have a couple more. I started learning about version control software after realizing that backing up the public_html and the mysql databases every so often is not quite enough. I have yet to lose any significant portion of my work, but I imagine it is only a matter of time unless I get a version control solution. The problem is I couldn't get subversion to work quite how I wanted it to, and other options that I looked at seem to be even further from what I want. After looking at what was available I started thinking about what would be ideal. I realized that it was really only 5 things: I Want it to be Unobtrusive I should not have to change my work flow to accommodate my version control. If I change any file for my website it should get backed up automatically. When I set it up I imagine I should have to specify a directory (such as public_html.) where if any file in that directory is edited, a backup is made. If I choose to edit via FTP, locally, through SSH, or whatever the version control software should notice and backup the change. I shouldn't have to check anything out or in. I shouldn't have to tell the software to do anything. It should just work. I Want it to be Easy Many of the people I work with only know and change html. These people shouldn't have to worry that the changes they are making to the site may cause an irrevocable loss of information. These people need access to the files to edit them, but shouldn't (or can't) be expected to know how to set up and use version control software and have to check things in and out. I don't really care how hard the thing is to set up, just that once it is set up it is easy for everyone to use. I Want it to Track Who Is Doing What, and When it Was Done It should log the IP address and timestamp of each change. It should log how this IP address is accessing the system. I should be able to set up a system based on FTP users or linux users where only certain users get to change files in directories of my choosing. Is 6.43.143.4 using FTP to edit it? Is diane@myserver logging in through SSH and using nano to edit it? I should know. I Want Database Backups I want options on how to deal with backing up my databases. Maybe I want to save space by keeping infrequent snapshots. Maybe I want it to export a backup to another computer or DB every so often. Maybe I want to backup certain tables more frequently than others. I should have options. It should integrate with MySQL (and probably others) off the bat. I Want Web-Based Administration I want a web-based administration area along the lines of phpMyAdmin. From here I should be able to see who changed files and when. I should be able to revert to backups of my choosing, or a snapshot in time of my choosing. If I want it to be just how it was last friday before Joe went through and messed up half the site, it should be easy to do that. I shouldn't have to know what files Joe messed up, or how he messed them up. I should just be able to revert to a date. I should be able to have some sort of diff functionality so I can compare what has changed in different revisions. I should have the ability to merge changes from the diff view. I should have options to use these features intelligently and easily. I should be able to do all of this from http://www.domain.com/myVersionControl or something similar. Of everything I want this is probably the least important. If I could get the first four things and not this one I would be happy, but this would be the icing on the cake. Is There Such a Thing? I wrote this post hoping that someone could tell me there would be something, or some set of things, that could do what I want. Or, if there isn't that magic software maybe some people on Reddit or Digg might like to start a new open source project to make it. I would definitely be willing to work on it if others were. Do you know of anything that might work? Comment below! http://www.oxavi.com/blog/Programming_for_Android_with_Eclipse/24 This is part two of our Programming for Android series. See part one: A Look at the Android SDK. Now that we have set up the Android emulator, we need to get cracking with Eclipse and the Android Development plugins. It's time to make an (admittedly simple) app! Setting Up Eclipse After installing JDK 6 I had to get Eclipse Ganymede from the Eclipse website. The version that comes in the Ubuntu repositories is 3.2, and you need at least 3.3 to work with Android. Once that was out of the way I installed the WST and Android plugins for Eclipse. Just go to Help > Software Updates, click Add Site, and put [code]https://dl-ssl.google.com/android/eclipse/[/code] Check the developer tools box and the Web Tools. Once that is done hit Install. Go through the windows and it will automatically install. Restart Eclipse and set up the Android Project location by going to Window > Preferences > Android and add the SDK location. Mine is ~/Programs/android-sdk-linux_x86-1.0_r1/. Hello World Start up by opening your emulator. Go to File > New > Project > Android and fill in the project details. I called my project Hello World, with the package name of com.oxavi.hello, an activity name of HelloWorld, and application name of HelloWorld. The package name has to follow the same naming convention as Java packages. This is what it looked like right after I made the project. On the phone an error message popped up so I hit force close and went on to changing the code. I added a few lines to HelloWorld.java to get it to do something. Lines that I added are commented. [code]package com.oxavi.hello; import android.app.Activity; import android.os.Bundle; //you need this to get the TextView functions to work import android.widget.TextView; public class HelloWorld extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); //this sets TextView variable tv TextView tv = new TextView(this); //this sets the text of the tv variable tv.setText("Hello, Android. This is Oxavi!"); //this displays the tv variable setContentView(tv); } } [/code] Now go to Run > Run > Android Application and hit OK. You should see something like this on the phone after a few seconds. Starting Out With XML Layouts Writing the layout into the code can be a problem when you later want to make a small interface change and you now have to edit code all over the place. Here enters the XML layout, which lets you separate the layout from the logic, similarly to how you separate it with HTML and CSS in web design. Eclipse already made an XML layout for us, we just haven't been using it. To use it lets go to res > layout > main.xml and change the code to in that file to: [code] [/code] You can change the android:text="" to whatever you want it to say. res will be used a lot later, it is the folder that will contain stuff your app uses that isn't code, like images. Now open up R.java. This file contains references to some of the stuff your app needs to run. It lets you use the references as a shorthand while coding. This file is auto-generated by Eclipse, so there is no need to change it. It will get auto-updated as you change things and work on your app. Now we need to change a few lines in the HelloWorld.java file to: [code]package com.oxavi.hello; import android.app.Activity; import android.os.Bundle; /* we no longer need this to run the XML layout so comment it out //need this to get the textview functions to work import android.widget.TextView; */ public class HelloWorld extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); //this sets the XML layout to display setContentView(R.layout.main); /* this is the old layout view that we dont need, so comment it out //this sets textview variable TextView tv = new TextView(this); //this sets the text of the tv variable tv.setText("Hello, Android. This is Oxavi!"); //this displays the tv variable setContentView(tv); */ } } [/code] Now we have successfully ran our first XML based app! Here is what it should look like, a lot like before. If you check the menu you will see your HelloWorld app there, but it needs an icon! Let's do that now. Adding Application Attributes We can go ahead and add a description first. Go to res > values > strings.xml and click add. I named mine app_description and added the value 'This app says hello to the world.' Save your png icon to your workspace/res/drawable folder and open the AndoidManifest.xml file. This file contains all the information about your app, and makes it easy for you to edit it. Go to the Application tab and click browse next to the icon field. Browse for the icon you saved and set enabled to true. Now do the same for the description and browse to values > strings > app_description. Save everything and run it. And you should see your shiny new icon for your app! Thoughts Google has taken care to make this really easy to do. I guess now it's time for me learn some more Java before I dive head first into development. Hopefully the other API's are just as easy to access as the textview. You can do quite a bit with just textview, drawables, and sql. Since we at Oxavi are considering developing a game for this platform I'll have to find out before we start if these API's will be enough, in the next post. This is part two of our Programming for Android series. See part one: A Look at the Android SDK. http://www.oxavi.com/blog/A_Look_at_the_Android_SDK_In_Linux/23 This is part one of our Programming for Android series. See part two: Programming for Android with Eclipse. Setting up the Emulator Today I decided to crack open the Android SDK and mess around a little bit to see if I wanted to try to develop for it. I'm running Ubuntu 8.04 so I went over to the android site and downloaded it for Linux. My main goal for today was to set up the emulator and have a look around the phone. Make sure you have JDK 5 or 6. The SDK is surprisingly easy to get going, just extract it to any folder. I chose ~/Programs/android-sdk-linux_x86-1.0_r1/ Getting the emulator to run was really easy. First you have to set the directory where the image is kept. I just made a folder called android in ~/Programs then ran this code: [code]~/Programs/android-sdk-linux_x86-1.0_r1/tools/emulator -datadir ~/Programs/android[/code] Every time you want to run it after you don't need to set the data directory. Now you should see it booting up. It took me a good minute before it popped up, on a friends old laptop it took at least fifteen minutes. Here is a picture of the phone when it first boots. It shows that I have no service (of course), the time, the date, and the charge left (which always stays at 50%). Click menu and you are in! Here is the home screen. A Look Around You can mess around with all the applications and test stuff out, as well as get access to some of the development tools. Here is a screen of the menu going up. The browser works and the sites look nice in it. It doesn't try to resize anything, but will fit the text to the width of your screen. I like it better than most phone browsers I've used. Setting Up An SD Card Next I made an SD card for the device. I did that by running the following code: [code]~/Programs/android-sdk-linux_x86-1.0_r1/tools/mksdcard -l myfirstcard 1000mb ~/Programs/android/myfirstcard[/code] This named it myfirstcard, set it to be 1000 megabytes, and put the file to store it all in ~/Programs/android/. Now you can save pictures, music, and anything else to the emulation. Next post I'll install Eclipse and the development plugins and run a hello world. So far, Google has made this pretty easy to set up. If that continues to be true maybe I'll start a new project for it. This is part one of our Programming for Android series. See part two: Programming for Android with Eclipse. http://www.oxavi.com/blog/A_Short_Function_to_Format_Phone_Numbers/22 I found this somewhere and thought it was useful. If you need to automatically format phone numbers, this is a small lightweight function to do it. [code] [/code] http://www.oxavi.com/blog/Original_Models/21 I finally got a copy of our original game and an old copy of 3dsmax, so now I will begin converting the old models to use as placeholders until the new models are complete. http://www.oxavi.com/blog/Flashpoint_Balkans_Blog_is_Now_Live/20 Flashpoint Balkans is now live. Flashpoint Balkans has been successfully compiled for the first time. First things todo: set up controls set up money/buy system set up teams http://www.oxavi.com/blog/Code_Highlight_The_Easy_Way/5 This is a small function we use on this site for code highlighting. It takes content and highlights anything between [ code ] and [ /code ] tags. [code]