B.E.C. Shop
|
About BECShop...
This page shows how
BECShop operates, and also provides an example of how to set up BECShop in
your web pages. Each class is described below, with a list of
parameters that can be used to customise the Applet. In addition,
example code is shown (as actually used on this page) so that you can see
exactly how to code your pages. In addition, each Applet is included
on this page (except for the checkout page, which is shown on a page of
its own) so that you can actually see the shopping cart in action.
Use the Add and Remove button, and see how it affects the shopping basket.
Using BECShop...
To use BECShop, download
the classes and put them all into the /becnetworks/webapps/becshop2_1 directory on your web
site. Then simply add the Applets to your web
pages, using standard HTML. Use the examples below for more
information, or lookup Java Applets in your HTML guide.
Mailto Mode...
If you use BECShop in mailto mode, then
any web server can be used to contain your HTML and .class files. Note that because
HTML mailto is used to send the
information, it relies on the users client mail application,
and browser support. All of the information from the
order (number of items ordered, item reference numbers and
names, total cost, and customer details from the page) is
included within the body of the mail message. Note
however, that many browsers have a maximum link size for mailto, meaning
that often, information is left of the mailto body message. You can
decide what the title of the main message is, using the
optional parameter. You should include on your web page
that the user must send the email in order for the order to be
submitted.
Server Backend Email Ordering (servlet)...
If
you wish to use the backend servlet option (where a web server submits the
order), then you need a server that supports Java servlets and the
JavaMail API. Note that the HTML pages can remain
on your normal server, it is only the .class files that must reside on the
same Java servlet supporting server as the BECShopServletMailer.class
file. For more details on using servlets, contact your system
administrator, or B.E.C.
Networks. This page uses a test Java server for demonstration
purposes. It is recommended that you download
the class files, and host them on your own server (all of the required
files are in the download).
Important note:
-
BECShop uses email
for sending the order details (either via mailto: or backend servlet), all
information included within the order (including item summary and customer
details) will not be encrypted, and is potentially at risk from eavesdropping.
- BECShop is provided 'as is', and is
not guaranteed to be accurate or correct in any way. B.E.C.
Networks accepts no responsibility to the use of this product, or to
the accuracy of any of the information provided by it.
Link directly to each class or set of classes:
BECShopAddButton.class
BECShopRemoveButton.class
BECShopBasket.class
BECShopCounter.class
BECShopCheckout.class
BECShopOrder.class
BECShopCustomer.class
BECShopItem.class
BECShopEngine.class
BEC.JPG
BECShopAddButton.class
This Applet is used to create an add button onto your web page. This can be placed anywhere within your page, in any frame. Typically, you would have an add button for each item you wish to sell. Size the Applet to fit you page, and the add button will use that size. The BECShopAddButton class accepts the following parameters, to customise the button:
butlab |
REQUIRED
- the text you want to appear on the button |
ref |
REQUIRED
- the reference string that you identify this item by |
name |
REQUIRED
- a brief text description you wish the item to be known by |
desc |
REQUIRED
- a description of the item |
cost |
REQUIRED
- the cost for the item |
|
Example Add
button items:
Java Book
Music CD
B.E.C. T-Shirt
|
e.g. (for Java Book button)
<applet width="90" height="30" code="becnetworks.webapps.becshop2_1.BECShopAddButton.class"
codebase="http://www.becnetworks.kattare.com/applets/">
<param name="butlab" value="Add Book">
<param name="cost" value="55.00">
<param name="desc" value="Learning
Java - Book">
<param name="name" value="Java
Book">
<param name="ref" value="BKJAV">
</applet> |
|
[return to top]
BECShopRemoveButton.class
This Applet is used to create a Remove button onto your web page. This can be placed anywhere within your page, in any frame. Typically, you would have a remove button for each item you wish to sell, and usually appear next to the add button. Size the Applet to fit your page, and the remove button will use that size. The BECShopRemoveButton class accepts the following parameters, to customise the button (note that BECShop uses the reference code (param ref) to identify items, as such corresponding add and remove buttons must have the same ref parameter):
butlab |
REQUIRED
- the text you want to appear on the button |
ref |
REQUIRED
- the reference string that you identify this item by |
|
Example Remove
button items:
Java Book
Music CD
B.E.C. T-Shirt
|
e.g. (for Java Book button)
<applet width="90" height="30" code="becnetworks.webapps.becshop2_1.BECShopRemoveButton.class"
codebase="http://www.becnetworks.kattare.com/applets/">
<param name="butlab" value="Remove Book">
<param name="ref" value="BKJAV">
</applet> |
|
[return to top]
BECShopBasket.class
This Applet is used to create a shopping basket view of the items that you have ordered, using the add buttons. This can be placed anywhere within your page, in any frame. You can use the basket on the same page as your ordering, a separate page, or choose not to use it at all. The basket allows the user to select items and remove them (you can configure whether or not to allow them to select multiple items from the list - see the parameters below).
As the web designer, you can specify the size of the Applet in your HTML
page. In addition, you can specify the location for each column (reference, name, description and cost), as well as the names to use for those column headings. These are configured using the Applet parameters (see below). If you do not provide them, default values are
used. Note that the columns will always be shown in the
order Ref, Name, Description, Cost.
There is also a checkout button included in the shopping basket area, which will link the user to the checkout page (you could also include your own HTML link to the page if you wanted). As the web designer, you select the page (and frame if relevant) that the Checkout button should link to. You can also specify the name of the button. All of these are configured using Applet parameters (see below). The BECShopBasket class accepts the following parameters:
checkout_url |
REQUIRED
- URL of the page to go to when the checkout button is clicked (can be absolute or relative) |
checkout_url_target |
OPTIONAL - the target frame for the browser to link to the checkout
(accepts any standard HTML frame type, e.g. _self) |
font_size |
OPTIONAL - point size to use for the display font (always a
Courier font) |
currency_symbol |
OPTIONAL - symbol or character to use as the currency symbol |
name_offset |
OPTIONAL - offset
(column position) for the name heading |
desc_offset |
OPTIONAL - offset
(column position) for the description
heading |
cost_offset |
OPTIONAL - offset
(column position) for the cost heading |
ref_heading |
OPTIONAL - heading to use for the reference field |
name_heading |
OPTIONAL - heading to use for the name field |
desc_heading |
OPTIONAL - heading to use for the description field |
cost_heading |
OPTIONAL - heading to use for the cost field |
total_cost_label |
OPTIONAL - label for the total cost |
pixel_height |
OPTIONAL - height for the display window (in pixels) |
multiple_select |
OPTIONAL - determines whether or not multiple items can be selected from the display list
(true/false) |
button_width |
OPTIONAL - width (in pixels) for the buttons that appear on the shopping basket |
button_height |
OPTIONAL - height (in pixels) for the buttons that appear on the shopping basket |
remove_button_label |
OPTIONAL - the text for the remove
button |
checkout_button_label |
OPTIONAL - the text for the checkout
button |
|
Example Shopping
Basket:
|
e.g.
<applet width="520"
height="150" code="becnetworks.webapps.becshop2_1.BECShopBasket.class"
codebase="http://www.becnetworks.kattare.com/applets/">
<param name="button_height" value="30">
<param name="button_width" value="110">
<param name="checkout_button_label" value="Checkout">
<param name="checkout_url" value="checkout.htm">
<param name="cost_heading" value="Cost">
<param name="cost_offset" value="70">
<param name="currency_symbol" value="£">
<param name="desc_offset" value="35">
<param name="font_size" value="10">
<param name="multiple_select" value="false">
<param name="name_offset" value="20">
<param name="pixel_height" value="200">
<param name="ref_offset" value="0">
</applet> |
|
[return to top]
BECShopCounter.class
This Applet can be used if you wish to provide a counter on
your page that dynamically changes to shown the number of
items in the shopping basket. Set the Applet to any size
on your page, and the count will be shown in the middle,
centre of the Applet. The BECShopCounter class accepts the following
parameter:
font_size |
OPTIONAL - point size to use for the display font
(default is 12 point) |
|
Example
Counter:
|
e.g.
<applet width="50" height="50" code="becnetworks.webapps.becshop2_1.BECShopCounter"
codebase="http://www.becnetworks.kattare.com/applets/">
<param name="font_size" value="30">
</applet> |
|
[return to top]
BECShopCheckout.class
This Applet provides the user of your site with the ability to
input their contact details to send the order to you. It
will automatically have a list of all of the items that they
have ordered from your site, along with a confirmation of the
total. You can also specify some customised text to
appear at the end of the order confirmation (such as an
"additional cost for postage" notice).
The Applet sends the purchase
information to you via an email, either using mailto, or by
the backend servlet, depending on how you have set it
up. An email will not be sent to the purchaser, unless
you specify both the confirmation_subject
and confirmation_message
parameters.
When putting the
BECShopCheckout.class Applet into your web page, it must
be using the dimensions 420 wide x 635 high. The
class accepts the following parameters:
email_address |
REQUIRED
- EMail address to send the order details to |
email_subject |
REQUIRED
- EMail subject for the order details |
send_type |
REQUIRED
- set to either mailto or servlet_mailer to
determine how the order should be processed |
servlet_address |
REQUIRED
(if
send_type set to servlet_mailer)
- the URL of the BECShopServletMailer.class |
continue_url |
OPTIONAL - URL of the page to go to when the continue button is clicked (can be absolute or relative) |
continue_url_target |
OPTIONAL - the target frame for the browser to link to the checkout
(accepts any standard HTML frame type, e.g. _self) |
bg_colour |
OPTIONAL - specify the background colour (in RRGGBB hex value) |
input_bg_colour |
OPTIONAL - specify the input field background colour (in RRGGBB hex value) |
input_text_colour |
OPTIONAL - specify the input field text colour (in RRGGBB hex value) |
label_text_colour |
OPTIONAL - specify the label text colour (in RRGGBB hex value) |
name_text |
OPTIONAL - text to display for the name field |
address_text |
OPTIONAL - text to display for the address field |
email_text |
OPTIONAL - text to display for the email field |
tel_text |
OPTIONAL - text to display for the telephone field |
order_text |
OPTIONAL - text to display for the order field |
total_text |
OPTIONAL - text to display for the total field |
comments_text |
OPTIONAL - text to display for the comments field |
web_author_text |
OPTIONAL - text to display for the web author comments - appears towards the bottom of the window |
submit_button_text |
OPTIONAL - text display for the submit button |
currency_symbol |
OPTIONAL - symbol or character to use as the currency symbol |
instant_no_item_warning |
OPTIONAL - determines
if a warning message should display immediately when the checkout starts, if not items ordered (default is false) |
continue_button_text |
OPTIONAL - text display for the submit button
(default is Continue) |
confirmation_subject |
OPTIONAL - the
subject of the message sent to the customer once they have
placed an order (confirmation_subject and confirmation_message
must be specified, or no confirmation is sent to the
customer). |
confirmation_message |
OPTIONAL - the
body of the message sent to the customer once they have placed
an order (confirmation_subject and confirmation_message must
be specified, or no confirmation is sent to the customer). |
generate_ref |
OPTIONAL - determines whether or not to add
" Ref: <generated reference>" (without quotes)
to the subject line for the email messages that are sent as part of the order process
(set to true or false - the default is false) |
|
Click
here to see the checkout Applet, or click on the Checkout
button in the BECShopBasket
Applet. |
e.g.
<applet width="420" height="635"
code="becnetworks.webapps.becshop2_1.BECShopCheckout.class"
codebase="http://www.becnetworks.kattare.com/applets/">
<param name="send_type" value="servlet_mailer">
<param name="servlet_address" value="http://www.becnetworks.kattare.com/servlet/becnetworks.webapps.becshop2_1.BECShopServletMailer">
<param name="continue_button_text" value="Keep Shopping">
<param name="continue_url" value="BECShop.htm">
<param name="web_author_text" value="Please note that the price shown and quoted is subject to change, and does not include postage. Thank you for shopping with us.">
<param name="email_address" value="sales@example.co.uk">
<param name="email_subject" value="Test Order From Web
Site">
<param name="confirmation_subject" value="Confirmation
of your order from B.E.C. Networks">
<param name="confirmation_message" value="Thank you
for your order from B.E.C. Networks. This email is to
confirm that we have received your order, and will be in touch
shortly with more details.">
<param name="generate_ref" value="true">
</applet> |
|
[return to top]
BECShopOrder.class
BECShopCustomer.class
BECShopItem.class
BECShopEngine.class
BEC.JPG
These three files are not Applets, but are support modules used by the other BECShop classes. These must be present in the same directory as the other .class files for BECShop to function correctly. |
|
[return to top]
BECShop
Version
History
Version
2.1 |
|
- changed applet sleep time to 250ms from 25ms (Checkout still at 500ms)
|
|
Version
2.0 |
|
- inclusion of
servlet backend support for sending order details
-
status window in checkout
-
cursor change whilst order being submitted
(servlet)
-
made the continue_url an optional parameter for
the checkout (no continue button is shown if no
parameter)
-
order items removed on success (for servlet only), but leaves user details
-
after 3 failed servlet submissions, it will try mailto
|
|
Version
1.3 |
|
- general change of application design and tidy up
- the order form remembers information entered information, even if leaving the page
- added a Continue button to the checkout
- thread enabled the checkout to allow for changes to the order form, to ensure
that it is kept up to date (in case order modified in another frame)
- fixed the logo from disappearing in checkout
- centred the checkout/remove buttons from the shopping basket
- checks for and requires an @ to appear in the email address in the checkout
|
|
Version
1.2 |
|
- changed the way
the checkout class gets the BEC logo (previously it could hang the browser if a slow link for the image)
|
|
Version
1.1 |
|
- fixed issue with total cost not being updated correctly in the checkout
under certain circumstances
- added a warning message if there are no items in the checkout when hitting
Submit
- gave the parameter option to allow this warning to pop up as
soon as the applet starts
|
|
Version
1.0 |
|
|
|
|
|
|