var casper = require('casper').create({
  viewportSize: {
    width: 1070,
    height: 768
  },
  verbose: true,
  logLevel: "debug"
});

var options = casper.cli.options;
var isDebug = !!options['d'];

var rootUrl = isDebug ? 'http://localhost:5000/' : 'https://quay.io/';
var repo = isDebug ? 'complex' : 'r0';

var outputDir = "screenshots/";

casper.start(rootUrl);

casper.on("remote.message", function(msg, trace) {
    this.echo("Message: " + msg, "DEBUG");
});

casper.on("page.error", function(msg, trace) {
    this.echo("Page error: " + msg, "ERROR");
});

casper.then(function() {
  this.capture(outputDir + 'landing.png');
});

casper.thenOpen(rootUrl + 'signin', function () {
  this.fill('form', {
    'username': 'devtable',
    'password': isDebug ? 'password': 'C>K98%y"_=54x"<',
  }, true);
});

casper.then(function() {
  this.waitForText('Your Top Repositories');
});

casper.then(function() {
  this.capture(outputDir + 'user-home.png');
});

casper.thenOpen(rootUrl + 'repository/devtable/' + repo, function() {
  // Wait for the tree to initialize.
  this.waitForSelector('.image-tree', function() {
    // Wait for the tree's animation to finish.
    this.wait(4000);
  });
});

casper.then(function() {
  this.capture(outputDir + 'repo-view.png');
});

casper.thenOpen(rootUrl + 'repository/devtable/' + repo + '/admin', function() {
  this.waitForSelector('.repo-access-state');
});

casper.then(function() {
  this.capture(outputDir + 'repo-admin.png');
});

casper.run();