What technology do you use for the one-page checkout in KonaKart ?
How can I change the one-page checkout code ?
What technology do you use for the one-page checkout in KonaKart ?
It's AJAX to give an improved user experience in this critical area where you don't want your customers to leave your shop!. We use Google's Web Toolkit (http://code.google.com/webtoolkit) embedded inside the Struts application.
How can I change the one-page checkout code
All the source code for the one-page checkout is freely available for you to modify as you see fit.
To get you started with this, especially if you're unfamiliar with Google's "GWT", we provide a simple one-page checkout developers toolkit. This allows you to modify the one-page checkout code, recompile and run, quickly and easily, without needing the rest of the application running.
The one-page checkout developers toolkit is included in every KonaKart download and can be found under the custom directory where KonaKart was installed. On Windows the default location is:
C:\Program Files\KonaKart\custom\onepagecheckout.
One-page Checkout Step-by-Step Guide:
1) Create a command shell window and change directory to the onepagecheckout directory inside your KonaKart installation. eg:
| C:\> cd C:\Program Files\KonaKart\custom\onepagecheckout C:\Program Files\KonaKart\custom\onepagecheckout> rem C:\Program Files\KonaKart\custom\onepagecheckout> rem Check that that your directory contains the following files: C:\Program Files\KonaKart\custom\onepagecheckout> rem C:\Program Files\KonaKart\custom\onepagecheckout> dir Directory of C:\Program Files\KonaKart\custom\onepagecheckout 16/07/2007 11:19 <DIR> . 16/07/2007 11:19 <DIR> .. 16/07/2007 10:12 702 .classpath 16/07/2007 10:12 425 .project 16/07/2007 10:12 475 build.properties 16/07/2007 10:12 4,482 build.xml 16/07/2007 11:19 <DIR> lib 16/07/2007 11:19 <DIR> src 4 File(s) 6,084 bytes |
2) Ensure that you have a java installation installed. KonaKart requires the Java 2 Standard Edition Runtime Environment (JRE) version 5.0 or later. Download the Java 2 Standard Edition Runtime Environment (JRE), release version 5.0 or later from http://java.sun.com/j2se. (You will have to done this to run KonaKart itself, so you've probably already done this).
3) Ensure that you have installed Apache ANT (this is used by the supplied ANT build file that compiles and runs the code). (Alternatively, you can use the ant that's provided under the custom/bin directory).
4) Modify the build.properties file to suit your environment. You have to define your database connection parameters because the code that you run will need to access the database. Use the database connection parameters that you have set up for your KonaKart application.
| #
-------------------------------------------------------------------------------------- # konakart_gwt build properties # # Set the parameters in this file to suit your environment # -------------------------------------------------------------------------------------- # Database Parameters adapter=mysql user=dbuser password=dbpassword url=jdbc:mysql://localhost:3306/oscommerce?zeroDateTimeBehavior=convertToNull driver=com.mysql.jdbc.Driver validationQuery=select 1 |
4) Add an item to your shopping cart. Run the KonaKart application and add an item (or many items) to a user's shopping cart. You need to do this to access the one-page checkout when it's run.
5) Finally, you are ready to build and run the code as follows:
| C:\Program Files\KonaKart\custom\onepagecheckout> rem C:\Program Files\KonaKart\custom\onepagecheckout> rem Simply type ant - it will build and then run the one-page checkout C:\Program Files\KonaKart\custom\onepagecheckout> rem C:\Program Files\KonaKart\custom\onepagecheckout>ant Buildfile: build.xml clean: [echo] Cleanup... compile: [echo] Compile the sources [mkdir] Created dir: C:\Program Files\KonaKart\custom\onepagecheckout\bin [mkdir] Created dir: C:\Program Files\KonaKart\custom\onepagecheckout\log [mkdir] Created dir: C:\Program Files\KonaKart\custom\onepagecheckout\www [javac] Compiling 58 source files to C:\Program Files\KonaKart\custom\onepagecheckout\bin [javac] Note: Some input files use or override a deprecated API. [javac] Note: Recompile with -Xlint:deprecation for details. [javac] Note: C:\Program Files\KonaKart\custom\onepagecheckout\src\com\konakart\client\ChooseAddrBody.java uses uncheck ed or unsafe operations. [javac] Note: Recompile with -Xlint:unchecked for details. [echo] GWT-Compile the sources setConfigs: [echo] Set Configs to: [echo] adapter = mysql [echo] driver = com.mysql.jdbc.Driver [echo] user = root [echo] password = [echo] url = jdbc:mysql://localhost:3306/oscommerce?zeroDateTimeBehavior=convertToNull [echo] validationQuery = select 1 run: [java] Should only see this message in debug mode. [java] Should only see this message in debug mode. [java] Should only see this message in debug mode. [java] Should only see this message in debug mode. [java] Should only see this message in debug mode. [java] Should only see this message in debug mode. build: BUILD SUCCESSFUL Total time: 1 minute 45 seconds |
When the one-page checkout code runs it will launch the GWT "hosted mode" shell which allows you to test your code changes.
You have to set up a KonaKart application user (or use the default John Doe account which has email address: "root@localhost" and password "password"). To run the one-page checkout in the GWT shell enter your user's credentials as instructed: First the username (which is an email address):
Next enter the password:
If successful, and your user has a product in their shopping cart, you will see the following:
Notes:
- You will notice that the configurable text strings (for labels and headings etc) are shown with their properties file references and not their translated names. This should help you locate the messages in the message catalogues, especially if you need to translate them.
- To test your one-page checkout in a fully-integrated fashion (and with the message catalog references translated) you will have to copy the generated javascript files into position (under the konakart webapp) .
- GWT has an extremely useful debugging system that integrates with Eclipse. This allows you to debug both client and server code in the Eclipse debugger. This is highly-recommended if you expect to be writing anything more than the most trivial modifications to the one-page checkout.
If you have questions on using the KonaKart GWT one page checkout development kit please post these on our forum.