Skip to content

Instantly share code, notes, and snippets.

@pointbazaar

pointbazaar/rltt.html

Created August 3, 2017 19:26
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save pointbazaar/64a8d81ddf27d849ef418b1047a2272d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save pointbazaar/64a8d81ddf27d849ef418b1047a2272d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. pointbazaar created this gist Aug 3, 2017.
    127 changes: 127 additions & 0 deletions rltt.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,127 @@
    <html><head></head><body>
    <canvas id="canvas" width="800" height="400"></canvas>


    <script>
    var canvas = document.getElementById("canvas");
    var ctx = canvas.getContext("2d");

    var text = ctx.measureText("hello"); //measures text width
    text.width;

    ctx.fillStyle = "green";
    //ctx.fillRect(10,10,100,100);

    var tl = {} //list of all technologies, as a dict for easy lookup
    var tierdict = {} //list of tier number for technologies


    function Tech(newname, newdepends){ //createTech
    t = [];
    t.push(newname);
    t.push(newdepends); //the technologies this tech depends upon
    console.log("created" + t[0]);
    return t;
    }
    function getTierOfTech(tech){ //accepts a string
    if(!(tech in tierdict)){
    var tobj = tl[tech]
    if(tobj[1].length == 0){
    tierdict[tech] = 0;
    }else{
    var tierlist = [];
    var deplist = tobj[1];
    for(var x =0;x<deplist.length;x++){
    depobj = tl[deplist[x]];
    deptier = getTierOfTech(depobj[0]);
    tierlist.push(deptier);
    }
    techtier = Math.max(tierlist);
    tierdict[tech]=techtier;
    }
    }
    return tierdict[tech]
    }


    ctx.fillText("hello world", 10,10);

    //adding technologies
    tl["bark"]=Tech("bark",["wood"]);
    tl["wood"]=Tech("wood",[]);
    tl["stone"]=Tech("stone",[]);
    tl["water"]=Tech("water",[]);
    tl["clay"]=Tech("clay",[]);

    tl["fire"]=Tech("fire",["wood"]);
    tl["pottery"]=Tech("pottery",["clay","water","fire"]);
    tl["cordage"]=Tech("cordage",["bark"]);
    tl["bow"]=Tech("bow",["wood","cordage"]);

    function drawTech(){
    console.log("drawing tech");
    var ystep = 30;
    var xstep = 50;
    var yoffsetscolumns = [0,0,0,0,0,0,0,0];
    for(var key in tl){
    var x = tl[key]; //the value to that key
    console.log("drawing: "+x[0]);
    tier = getTierOfTech(key);
    xoff = tier * xstep;
    yoff = yoffsetscolumns[tier];

    x.push([xoff,yoff]); //inform the tech about its position on canvas

    ctx.fillText(x[0],xoff+30,yoff+30);
    yoffsetscolumns[tier]+=ystep;
    }
    }

    drawTech()

    function drawLinks(){
    console.log("drawing links");
    for(key in tl){
    var x = tl[key];
    var techname = x[0];
    console.log(" for: "+techname);
    mypos = x[2];
    var mx = mypos[0];
    var my = mypos[1];
    console.log(" "+mx+" "+my);
    if(x[1].length >0){
    console.log(" this tech has dependencies to draw");
    for(var x1=0;x1<x[1].length;x1++){
    console.log(" dependency "+x1);
    var dependency = tl[x[1][x1]];

    var depx = dependency[2][0];
    var depy = dependency[2][1];
    console.log(" "+depx +" "+depy);

    ctx.fillStyle = "red";
    ctx.beginPath();
    ctx.moveTo(mx,my);
    ctx.lineTo(depx,depy);
    ctx.fill();
    }
    }

    }
    }

    drawLinks();

    </script>











    </body></html>