Flash Flex Blog

Introducing the Hex Wars Display Engine!

Back in July of 2006, I arrived in New Delhi, India with my laptop and just about no other personal effects as they were being shipped by sea and would take about 3 months to arrive.  Actually my laptop docking station and computer monitor would arrive by air freight in about 6 weeks.  So I didn’t feel I could start any serious software-engineering work until the air-freight arrived.  So I could have relaxed by the pool or I could do something productive with my time!

In the space of six weeks I wrote the prototype version of the Hex Wars Display Engine in Actionscript 2.  It is essentially a sprite generation and management engine for creation of on-line war games in the tradition of the old Avalon Hill War Games of the 70’s and 80’s.  Do you remember those games?  I used to play them as a teen-ager and was absolutely enraptured for days (whole weekends) at a time.  They were so mentally stimulating and challenging.  For those who don’t know, these were BOARD GAMES - card-board boards representing a hexagonal map of terrain and card-board counters representing various military units.  My favorite games were Panzer Leader and Panzer Blitz representing historical World War II scenarios at the divisional level, and Squad Leader !  Remember that TOME of a rule-book(s), that came with Sqad Leader? You had to be a lawyer to play these games.  Yeah, that game took weeks to play correctly.  What those rule-books needed was a computer GAME Engine….

 I still love those games and have longed planned to reproduce the look and feel of them on the web some day.  Well over the last 7 days or so, I’ve ported that Actionscript 2 prototype into Actionscript 3.  First off, what a joy that was.  I can recall that when I stopped work on the game engine in 2006, I was aware that I was reaching the limits of what I could ask AS2 to do in terms of good software design.  Especially when I got down to the sprite generation of the menu system, all the hacks that I needed to make AS2 perform were beginning to become too complicated to continue supporting.   So in early August of 2006, I shelved the prototype until I had time to port it to AS3.  That time as arrived!  Actionscript 3 is a full-fledged object-oriented language.  If you are a developer coming from a Java, C++ or Delphi background, I guarantee you that you’ll be able to acquire this language in about 2 weeks.  No kidding.  If you are a procedural AS2 programmer with no object-oriented experience it could very well take you a few months to master AS3, but you really MUST so just do it and stop complaining that its hard.  (you know who your are…)

Ok, so what is it, exactly?

Glad you asked!  The Hex Wars Display Engine is the display module (consisting of several classes) for my Hex Wars Game Engine.  

1. There are many interesting features to this engine:
   1. All graphical elements are derived from the Sprite Class and are therefore vector graphics.  
   2. The game counters that you see are vector graphics drawn in real time by code against the AS3 Drawing API
   3. Even the text that you see is drawn.  Yep, you heard me right.  The text you see in this display engine are NOT fonts, they are drawn in real-time directly on the sprites along with all the other graphics.  Freaky, right?  And its FAST.  
   4. There are NO embedded resources in this engine.  No raster graphics and no FONTS.  Hence the size of the generated SWF file from the Flash IDE is 48 KB !!!  By comparison, the above graphic which is a screen shot of a small corner of the generated vector map is 307 KB, and that’s after I reduced its jpg quality to 75% !!!
   5. I need to mention again, this engine is fully object-oriented by design, and is very extensible as a result.  For those of you who think no serious engineering can by done with Flash, think again.  See the link to this engine’s UML diagram, right here.
   6. Since the entire display engine consists of PURE CODE, the codebase can easily serve both Flash and the Flex Framework.  
   7. I’ll keep adding more bullet points as I think of them

In case you missed it… the link to the engine’s UML DIAGRAM IS HERE…  Oh, and you’ll see “EA 7.5 Trial Verson” all over the background, because … well … I used the trial version…  First time I used Enterprise Architect, and I am very impressed.  I’ll be buying the EA Pro version shortly…

AND… Here is a link to the actual working Hex Wars Display Engine

OK, So How Do I Use It?

1.  Quick Tutorial
   1. You just drag the map around with your mouse.
   2. Or you can navigate the map with the scroll bars at the bottom and to the right of the map.
   3. If you click on a game counter it will get bigger….
   4. The display should resize itself to fit your screen resolution…
   5. Oh! I should mention that the map hex types and counters are randomly generated each time you load the page….
   6. NOTE: I generate the entire map and all the game counters on it before showing it so there will be a 20 to 30 second pause before you see something, so don’t panic.  (I will of course give you some sort of progress bar or status update on the screen in due course…)

• Map Legend: Hex Types 
  • Blue Hex: Ocean/Water
  • Yellow Hex: Desert
  • Light Green Hex: Plains
  • Dark Green Hex: Forest
  • Teal Hex: Marsh
  • Black Hex: Mountains

•  So what’s next? Here’s a quick list:
  • Game Logic, obviously.  Let’s call it the Hex Wars Logic Engine.  Yeah, that’s the ticket.  Better yet, let’s call it the Hex Wars A.I. Engine…  Ok, now I’ve got your attention, right?
  • More Hex Types: River and Stream Hexes - Ideally a hex itself will be able to generate its own stream or river art when called upon to do so.  This will enable me to write the stream/river generation logic, completely separate from the display.  I’ll then tell the display classes to draw a stream on a hex entering from one hex edge and exiting on another!  And Road Hexes -  same logic applies. Hmm. maybe SLOPE hexes surrounding mountains as in Panzer Leader.  It really depends on the map resolution level I want to achieve and what level of realism I’m after.  With the current design, the level of realism can only be described as ABSTRACT.
  • A Map Editor - sure why not?  All respectable game engines have one…
  • Internet Server Integration - This is a necessary component.  And non-trivial.  Let’s not leave it out.  Without  server integration we can have no multiplayer games.
  • Perhaps a Reference Book?  I’ve been contemplating how to make this work available to the public.  I think I may turn the step by step development of the game engine into a book on Game Development and Software Engineering with Flash/Flex.  As part of the bargain, I’ll release the game framework source code as well as a localhost license to my WebServer product, Electron Server with the server integration already built in…
  
  
  
  
  I’ll add more items as I think of them…

Let me know what you think…