|
 
Instructions For Installing ToonKit On Your website.
Installing ToonKit Cartoon Builder on your website is a fairly straightforward task. There are four basic steps which are outlined
in this section. These steps assume that your website is referenced using the URL "http://www.mysite.com/"
and that the root directory for your website is just "/". The library provided contains
all of the required code and automatically generates the Dynamic HTML required to place ToonKit Cartoon Builder
on the web document. The four installation steps are outlined below:
- Create a directory in your webspace called toonkit which is used to hold ToonKit Cartoon Builder library files and graphics. For
example, use the command "mkdir toonkit" (UNIX systems) or "MKDIR toonkit" (DOS or Windows 95/NT) if you are in the root
directory.
- If you are reading this file you may have extracted the file from the zipped archive. All files from the archive
should be put into the newly created "/toonkit" directory. Do not change the names of any of these files. All of the
graphics files (.GIF format) should be in uppercase. All other files should be in lowercase (.html and .js files). Currently
both gzip (UNIX) and WinZip (Windows 95/NT) format archives are avaialble from the ToonKit website:
www.toonkit.com.
- You must now modify all web documents which will contain a copy of ToonKit Cartoon Builder. These files may be
anywhere in your webspace. It is recommended that you do not place these files in the newly created "/toonkit" directory.
For example, if you wish to place a ToonKit Cartoon Builder in a file called "index.html" which resides in your root directory, then open the file with your favorite text editor (for example notepad
in Windows 95/NT or vi in UNIX), and insert the following lines of HTML into the document:
- In the <HEAD> section of the document insert the following line of HTML (note the the SRC attribute points to the
"toonkit.js" library now residing in the newly created "/toonkit" directory in your webspace):
<SCRIPT LANGUAGE="JavaScript1.2" SRC=" http://www.mysite.com/toonkit/toonkit.js"> </SCRIPT>
- In the <BODY> section of the document insert the following line of HTML (note the the parameters passed to the "StartToonKit()"
function shown declared in the "toonkit.js" specify the top-left location of ToonKit Cartoon Builder in the document,
and to start with the bigger logo specified by the parameter "bigLogo"):
<SCRIPT LANGUAGE="JavaScript1.2"> StartToonKit(100,100,bigLogo);</SCRIPT>
It is also possible to set the third parameter to "smlLogo" if you wish to use the smaller startup logo. The top-left positioning is absolute - it is not possible to place ToonKit Cartoon Builder in the flow of the HTML.
- Insert the following fragment of HTML/JavaScript in the <BODY> tag of the document:
onLoad="toonkitLoaded();"
Here are examples of before and after <BODY> tags
before: <BODY BGCOLOR="BLACK">
after: <BODY BGCOLOR="BLACK" onLoad="toonkitLoaded();">
-
Copy the file "resource.js" from the newly created "/toonkit" directory into the same directory as the documents
containing ToonKit Cartoon Builder (in this example in the file would be copied to the root directory).
Open the "resource.js" file with your favorite editor and make the following changes:
-
Locate the following line of the file
var myToonkit= "http://www.toonkit.com/index.html";
This line gives the name of the document containing ToonKit Cartoon Builder. When you send a ToonKard electronic
postcard to a friend, the recipient is informed that they may use this document to launch the ToonView electronic postcard
viewer. If you leave this line unchanged the recipient will be informed that they may view their electronic postcard at the
ToonKit website. To change the document replace the URL between the quotes with the URL of your document, for example,
var myToonkit= "http://www.mysite.com/index.html";
- Locate the following line line of the file
var myLibrary= "http://www.toonkit.com/toonkit/";
This line gives the location of ToonKit Cartoon Builder library. It is extremely important that the location
of the library is correctly specified otherwise the software will not work. The location is specified as the URL of the
newly created "/toonkit" directory in your webspace. To change the library location replace the URL between the quotes with
the URL of the newly created library, for example,
var myLibrary= "http://www.mysite.com/toonkit/";
In order to use ToonKit Cartoon Builder all the viewer has to do is load the document (index.html) with their favorite
DHTML enabled browser (either Microsoft Internet Explorer 4.0+ or Netscape Navigator 4.0+). If you wish to put a ToonKit Cartoon
Builder on another document, for example, "other.html" then it is only necessary to repeat step 3 above if "other.html " resides in the same directory as "resource.js". If
"other.html" is in a directory which does not already contain a "resource.js"
file, for example "/otherdir", then steps 3 - 4 must be completed.
Customising Your Personal Copy Of ToonKit Cartoon Builder
There are three ways in which to customise your personal copies of ToonKit Cartoon Builder. For example, it is possible,
for each ToonKit Cartoon Builder in your webspace to:
- Customise the default Welcome Message shown when ToonKit Cartoon Builder is first opened.
- Customise the default Toon shown when ToonKit Cartoon Builder is first opened.
- Customise the graphics used in each copy of ToonKit Cartoon Builder in your webspace.
Most of the customizations just require modification of parameters in the previously mentioned "resource.js"
file. The steps involved are shown below:
- In order to change the Welcome Message locate the following line in the "resource.js"
file in the directory containing the web document featuring a ToonKit Cartoon Builder:
- var myGreeting = "Welcome to ToonKit!";
Change the text between quotes to change the Welcome Message, for example,
- var myGreeting = "This is my ToonKit!";
- In order to customise the default Toon shown when ToonKit Cartoon Builder is first opened the following
steps must be undertaken:
- Design the Toon using the Cartoon Builder and when you are happy with your masterpiece press "Ctrl-t"
(the Control and t keys). A small window should open which contains
an automatically generated document which describes the current Toon (in fact the document is a JavaScript function which tells ToonKit
how to re-draw this toon). Using the mouse copy the entire contents of this window, or save it to disk as a text file.
- The "resource.js" contains a default function with the same structure that is used
to draw the default Toon. Replacing the functon in the "resource.js" file with the
code just copied from the automatically generated window changes the default Toon. Locate the following section of code
in the "resource.js" file and replace it with the code copied from the automatically
generated window:
function myToon() {
var s='_41._342=75%3B';
s+='_41._343=90%3B';
s+='_41._346=9%3B';
.
.
.
s+=''; _303(s,_52,_51,'this.')
}
replaced with contents of window
function myToon() {
var s='_41._342=45%3B';
s+='_41._343=70%3B';
s+='_41._346=9%3B';
.
.
.
s+=''; _303(s,_52,_51,'this.')
}
The next time ToonKit Cartoon Builder is opened it will start with the newly specified Toon as the default.
- Customising the style of graphics used in any particular copy of ToonKit Cartoon Builder is also possible. First
it is necessary to generate a set of graphic components which must be copied to the directory containing the ToonKit
library and graphics files. The component files are referred to as "Kontact Sheets" which describe the style of the heads,
hairstyles, eyes, eyebrows, pupils, ears and mouths. Making these Kontact Sheets is quite a task and is described elsewhere
(see the Kontact Sheet Submission Guidelines at the ToonKit website: www.toonkit.com/newcomp.html). ToonKit v1.0 is supplied with one set of Kontact Sheets (the CLASSIC Kontact Sheets - or the "C" Sheets). In order to
change the style of the graphics, perform the following steps:
- Design and make your ToonKit Kontact Sheets using the prodecures described in the Guidelines. This
procedure includes a step which assigns a name to the Kontact Sheet group, for example, "VALENTINE".
- Install the Kontact sheet group in the ToonKit library directory, for example, "/library",
for example, VALENTINE-EYES.GIF, VALENTINE-EYES.GIF, etc.
- Locate the following line in the "resource.js" file:
var myKontact = "C";
and replace the default Kontact Sheet name with the name of the new group, for example,
var myKontact = "VALENTINE";
The next time ToonKit Cartoon Builder is opened it will start with the newly specified Kontact Sheet group as the default.
 
|
|