Giter Site home page Giter Site logo

yiyuezhuo / hex-wargame-javascript Goto Github PK

View Code? Open in Web Editor NEW
31.0 6.0 5.0 1.06 MB

A classic hex wargame written by JavaScript. And the scenario can be created by web-page editor

Home Page: http://yiyuezhuo.github.io/Hex-Wargame-JavaScript/

License: MIT License

JavaScript 79.15% HTML 6.18% Python 8.41% CSS 6.26%
wargame

hex-wargame-javascript's Introduction

Classic hex based wargame project - javascript

Introduction

This is a project that want to develope a classic hex based wargame by javascript.

Code is cheap ,show me the image:

Alt image

play it online(GitHub page)

or you can clone this repo and open index.html file to enjoy it.

Customized scenario development by editor (under development)

Editor

Customized scenario development by script

I write a Python script to merge some .csv file into a *.js scenario file so that engine can run it.

However I found .csv file can be used to edit data in visualization table software (eg. Excel) very easily. It's familiar with program newbie and a lot of wargame player who want to develop their unique game.

scenario_maker.py

Usage

$ python scenario_maker.py scenario_dir output.js

.csv scenario define document structure

Map configuration

  • block.csv
  • capture.csv
  • label.csv
  • terrain.csv
  • VP.csv

For example,if ,in terrain.csv , grid of (2,3) (line 2,column 3) is "open", it mean that the terrain of hex(2,3) in game map will be "open".

The style is motivated by HPS & JT games.

Unit setup

  • unit.csv Unit list
  • place.csv Set unit location

Other csv file

  • AI.csv Guide AI how to attack
  • CRT.csv Combat result table
  • player.csv Player level information.
  • setting.csv Some setting.
  • terrain_type.csv Attributions of terrain movement cost, moveable etc.

Other configure file

  • script.js This use a special format. Allowing you trigger some event in game without dive in detail. But some knowledge about intrinsic system will be helpful.
  • unit.css Set counter color .
  • hex.css Set hex and color .

The configurations handled by two *.css files was handled by *.csv files in old version, but those style configure being in *.css will be more reasonable since you can dynamic modify them without running the python script again and again to see the final effect of new art.

Advanced configuration

Counter shape

domplot.js: The counter is plotted by pure DOM. For example, infantry symbol, a pair of cross lines in NOTA notations, is plotted by:

     'infantry' : function(){
      var pad,line1,line2,unit;
      
      unit  = this.unitBase();
      
      pad   = unit.els.pad;
      // following code paint a cross representing infantry in NATO Joint Military Symbology
      line1 = this.brush.draw_line(0,0,26,16);
      line2 = this.brush.draw_line(0,16,26,0);
      line1.addClass('line');
      line2.addClass('line');
      line1.appendTo(pad);
      line2.appendTo(pad);
      unit.els.line=[line1,line2];
      return unit;
    },

hex-wargame-javascript's People

Contributors

yiyuezhuo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

hex-wargame-javascript's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.