///download comic book pages from graphicly
/// by tonto


function checkChild(e,e2) {
  var children = e2.childNodes;
// check if element is child of e2
  for(var i=0; i < children.length; i++) {
    if(e == children[i]) {
      return true;
    }
  }
  return false;
}

var x, y;
var width, height;
var img = new Image;
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');

// this is the name of the list
var ulist = document.getElementsByClassName('spread-images spread-images-small');
var ul=ulist[0];


var elements = document.getElementsByTagName('img');
var eleli = document.getElementsByTagName('li');


x=0;
y=0;
var images=new Array();
images[0] = new Array();
var bflag=false;

/// add images to a list by checking if img is child of list elements
for(var i = 0,j=0,m=0; i < elements.length; i++) {
  if(checkChild(elements[i],eleli[j])) {
    j++;
    images[m].push(elements[i].src);
    if(bflag) {
      bflag=false;
      m++;
    }
    if(eleli[j].className=='lastcol') {
      images.push(new Array());
      bflag=true;
    }
  }
}


x=0;
y=0;
/// calculate dimensions of canvas
alert(images.length+' '+images[0].length);
for(var i = 0; i < images.length; i++) {
  x=0;
  for(var j = 0; j < images[i].length; j++) {
    img.src=images[i][j];
    x+= img.width;
  }
  y+= img.height;
}

// clear document
document.body.innerHTML = "";
canvas.width=x;
canvas.height=y;
document.body.appendChild(canvas);

x=0;
y=0;
// draw image
for(var i = 0; i < images.length; i++) {
  for(var j = 0; j < images[i].length; j++) {
    img.src=images[i][j];
    ctx.drawImage(img, x,y);
    x+=img.width;
  }
  y+=img.height;
  x=0;
}