Crusading Coder
...with the courage to conquer any conquest
Anthology
This is a listing of all the various projects i have worked on and some examples of how they look and a description of what they do.
Procedural Object Generator

This is an in house application responsible for calling functions that make parameterized 3D Models and saves them in a custom format i created for use in the program.

The 3D panel renders the actual 3D object geometry so you, as a developer, can verify your function is creating the polygons correctly and make sure your design looks good.

The 2D panel has 2 items, a 2D preview which is also generated based on the parameters for the 3D Model. This is to give the user a better idea of what the model will look like in the object browser. The other item in the 2D panel is an icon, which again is generated based on parameters. This icon is used in the design view (which is a top down, blue print style view) to give users an understanding of what the object represents.

In the bottom panel some of the meta data that goes along with the object is displayed, as well as the ability to select colors for certain sections of the model.

Here is also where you select the function that you wish to execute, and the select a range of parameters from another drop down that the function supports. Once you have the function and the parameters set, you can select if you wish to just debug it, save it to a file, or save every supported parameter set, for that function, to file.

You can also select Generate All which goes through every function, and every set of parameters for that function and generates the necessary files for the 3D models.

3D Object Browser

This is the object browser i created, it incorporates a tree view control, on the left, as well as a Datagrid control, on the right. There are also sorting and filtering options applied to the lists to help the user get to their desired object faster.

The tree view offers a listing of all objects in 2 modes, categorized or not. Categorized will group common objects together under a folder hierarchy based on certain paces of meta data. For example it could be Doors being sorted by type and sub categorized by brand. The other option is to list all objects under one heading.

The Datagrid offers a 2D preview of the objects so the user has a clear idea of style and type of the object being selected. This grid is populated based on what you have selected in the tree view.

The filtering options at the top are dynamically filled to present the user with relevant information in the drop downs. Once filter options have been selected the tree view and grid view adjust to only show the objects that meet the specified requirements placed by the user.

This browser is very handy for getting down to exactly what you as a user want to see by setting some filtering options and with the 2D previews so you know that you are selecting.

Texter/Material Browser

This is the material/texture browser i created. It is very similar to the object browser i created but instead of objects it presents the user with materials based from a texture pool. The textures are annotated with meta data specifying what it is so the browser can intelligently know what to display to the user based on what they selected.

It is laid out almost identical to the object browser in that it has a tree view on the left, filtering options on the top and the right is where the information is presented to the user. The information that is presented is in the form of a image preview of the texture, its name and description and if applicable the options to colorize the material with a color palette.

Again this is a very handy tool for finding the desired material based on the sorting and filtering options.

Plan View

This is where i spend the majority of my time working on the house estimator. It is called the plan view and it is designed to mimic the look and feel of a blue print.

Most of the functionality is not visible here but this is where all the designing and property setting of the house takes place. Users can manipulate walls, add/ remove new ones, add/remove windows and doors and so on. Each element is associated to another one so there is a lot of behind the scenes intelligence taking place. Such as stretching/ contracting all connected walls when moving another one, propagation effects that affect other levels, and others. The whole purpose of this complicated system of validity checking is to ensure that the end user has a "viable" house at all times, meaning that it makes scene to the construction people. We do allow for structures that are not structurally sound, as in would fall over with out proper support, because the software is only for estimating not structural analysis.

Everything drawn here is also applied meta data, to help the estimating and rendering portions understand exactly what is being represented. All of these objects behind the scenes are line segments and polygons, so in the back end it is all 3D vector math to achieve these results which are "easy" for use to understand but complicated to get a computer to properly understand them.

It is and will always be a work in progress as bugs are fixed and new features are added but the core functionality of the system will always be intact and able to handle these changes.

If you wish a more detailed explanation please contact me and i can provide one.

Texture Manager

This was a feature I created to help us easily maintain our texture files without having to ship thousands of individual image files with the project. The bases behind the manager is that it lumps every texture image file into one binary file with a header section that contains relevant meta data.

The header section of this file is small, only a few mega bytes, and is loaded into memory when the program is launched. It contains all the information for using and accessing the textures in the blob. Some of the meta data it contains is the name of the texture, the textures start and end position in the binary file, the textures dimensions, what rendering techniques to use for this texture and a thumbnail of the texture. For use in the material browser

With the header file loaded we are able to access any of the textures meta data and get the actual texture image and pass it off to the graphics card with minimal foot print increase of the program. This is done by opening the blob file, reading the bytes from the start and end position supplied by the header and closing the file.

The manager itself allows us developers to easily add a new texture to the blob or edit existing textures inside the blob, upon hitting ok the blob is re-computed to accommodate the changes and the new version of the blob is ready to be consumed.

This is beneficial in many ways, it reduces the potential thousands of files and folders into 1 file for easy updating, it is quick to load and retrieve the desired textures and it prevents exposing your textures to your end users who could copy and use them if they are in the raw image format.

This was a interesting project to do and after implementation of it, the speed and memory benefits were immediately noticeable. So overall it was a fun mini project to do to improve the overall program.

Rich Text Editor

This is an example of a rich text editor i created. It is handy for people who are unfamiliar with HTML coding and wish to format text input in a certain way. This displays their formatted changes to them as it would appear without the HTML tags.

The options across the top are set up in such a way that you, as a developer, can specify which you wish to be presented to the user and in what order. So in that sense it is customizable to your needs. The main HTML based input is handled behind the scenes in a developer labeled hidden input but displayed to the end user as it would appear on the web page.

The input area also support copy and pasting from Microsoft Word and other text editors. When pasted the format and layout is preserved as best as it can be for HTML rendering allowing minimal editing by the user after a paste.

This script is multi browser supported (IE 6+, FireFox, Safari, Chrome, Opera), as well as it is able to have as many instances of it on one page as needed.

This is one i enjoyed making, it was a challenge but fun. I hope to further improve it and add new functionality to it as time goes by.

Animated Slider
Toggle Blue Example Toggle Purple Example Toggle Red Example Toggle Green Example Toggle Orange Example
This is an example of the vertical slider



This is an example of the horizontal slider



This is an example of the box slider




This is an example of the vertical then horizontal slider

This is an example of the horizontal then vertical slider

This is a JavaScript function I created that allows me to animate the opening and closing of HTML elements to give the appearance that it is sliding open or closed. You have probably noticed this as I use it on this page when switching between demos.

There are currently five different animations that this script supports. They are:

  • Vertical Slider - This is a simple animation that will expand or contract an element vertically on the screen. The blue example above.

  • Horizontal Slider - This is a simple animation that will expand or contract an element horizontally on the screen. The purple example above.

  • Box Slider - This is an animation that will grow or shrink the element both horizontally and vertcally at the same time, giving it the appearance of a box growing or shrinking in size. The red example above.

  • Vertical Then Horizontal Slider - This is an animation that when expanding an element will set the height to a user defined amount (default 20px) and expand the element horizontally until the full width is achived then expand it vertically. When contracting it shrinks the element vertically until the height is at the user defined value then it contracts it horazontally. The green example above.

  • Horizontal Then Vertical Slider - This is an animation that when expanding an element will set the width to a user defined amount (default 20px) and expand the element vertically until the full height is achived then expand it horizontally. When contracting it shrinks the element horizontally until the width is at the user defined value then it contracts it vertically. The orange example above.

This was a fun script to make as I have always wanted to create some custom animation for opening and closing elements and this allows me to do this.

Calendar Schedular

This is an example of an training scheduler i created for internal use. It works by allowing a user to drag the colored squares which represent the course on to the calendar and they are then added to that day(s) as a course.

Each course can be a varying number of days, and it will be reflected on the calendar properly. There is a hard limit of a maximum of 2 courses per day, per the companies requirements, and when you add it to the calendar you are required to fill out certain pieces of required information in order to officially add it to that day. Each course can have a custom color and title that is accurately reflected on the calendar when added. The pop up windows that contain that courses relevant information are also colored to reflect this. The weekends are grayed out as the company did not offer training on those days.

Once added the course information can be edited or the course can be removed by clicking the red x in the upper right corner. The months are navigational, the number of months shown is customizable, the number of courses is unlimited and the entire thing can be custom styled to fit any theme.

This is not demonstrated here but there are also means of saving and retrieving scheduled dates from a database by posting certain pieces of information to a php script and having another php script read the database and make certain JavaScript function calls to populate the calendar.

Overall this was a fun and challenging tool to create, it is not perfect but it is functional and i hope to make it better and more functional in the future as i can see this as being a handy tool for other applications.

My Web Site

This is of course the web site you are currently on. I have spent a lot of time working on this site and creating different features and functionality. It is my test bed for new ideas and techniques. It is also a place for users of any of the scripts I create to come and get updates or use.

The majority of the features and functions on this site are publically accessible but there is a user log in where there will be features only available to users. At the moment there is very few things a user can do so I am currently the only one.

Some of these features are simple stuff like changing of your password and contact email but one of the neat functions that I spent a bit of time working on is the ability to select a theme for the site. There are 3 different themes at the moment, the default one which is what everyone sees when they are not logged in, the default one for the AE Bits web pages and one I call ninja attack which is a ninja type theme. Other than the setting of themes there is currently no other features for members

There are a few Admin features used to maintain and update the site. Such as posting news, changing the links on the useful links page or adding/editing users. But these are only available to admins which is me.

Overall this site is a fun and exciting way for me to grow and expand on my skills and try to make it an interesting place to visit.

CEP 829 Union

This is a web site I was contracted to build. They are a union who wanted to have a place for their members to be able to view specific information about the union. Such as: meeting minutes, important news updates, and member information.

They site is built with this in mind and the majority of the features are visible only to members.

The members have access to an array of different functions, depending on their access level. These functions range from adding meeting minutes and updating new posts to adding and editing members.

Feel free to check out the site, it is functional in IE 6+, Fire Fox 1+, Safari, Chrome and Opera. http://cep829.ca

AE Bits

This is a script I create for a game called Astro Empires (AE). This is a JavaScript which is run against certain web pages after they are loaded to add extra features that are not currently present in the game. I have been developing and maintaining this script since May 2009 and will continue to do so until it is no longer used or needed.

The script has lots of different features and settings that really enhance the game play and make the overall experience of the game more enjoyable. For a full listing of features and more info about the script it self check out the AE Bits page.