var commandLine;
function setup() {
  createCanvas(window.innerWidth,window.innerHeight);
  textFont("Courier New");
  textSize(14);
  frameRate(12);
  loadAnimationTexts();
  commandLine = new CommandLine();
}

function draw() {
  background(0);
  stroke(255);
  strokeWeight(0);
  fill(255);
  push();
  translate(translateX, translateY);
  scale(scaleFactor);
//  image(fingers,0,0, gwidth, gheight); // draw the video frame to canvas
  pop();
  if(busy) runSequence();
  commandLine.show();
}

function CommandLine(){
  this.userInput = "";
  this.presentedLines = Array(60).fill("");

  this.getUserInput = function(code,c){
    if(!busy){
      if (code != 8 &&  code != 10 && code != 16 && code != 17 && code != 18 && code != 20) {
        this.userInput = this.userInput + c.toLowerCase();
      }
      if (code == 8 && this.userInput.length > 0) { //backspace
        this.userInput = this.userInput.substr(0, this.userInput.length-1);
      } else if (code == 13) { //enter
        this.compareUserInput(this.userInput);
        this.userInput = "";
      }
    }
  }
  this.pushLineStrings = function(bottomLines){
    for(var i = 0; i < bottomLines.length; i ++){
      this.presentedLines.splice(0, 0, bottomLines[i]);
    }
  }
 this.pushLineString = function(bottomLine) {
     for (var i = this.presentedLines.length-1; i > 0; i--) {
        this.presentedLines[i] = this.presentedLines[i-1];
      }
      this.presentedLines[0] = bottomLine;
  }
  this.changeLineString = function(bottomLine) {
       this.presentedLines[0] = bottomLine;
   }
  this.getInputLine = function(){
    if(!busy){
      this.inputString = frameCount % 2 == 0 ? "guest@iris ~ $ " + this.userInput + "_" : "guest@iris ~ $ " + this.userInput;
      this.presentedLines[0] = this.inputString;
    }
  }

  this.show = function(){
    console.log(this.presentedLines[0]);
    this.getInputLine();
    for (var i = 0; i < this.presentedLines.length; i++) {
      text(this.presentedLines[i], 13, window.innerHeight-150-(i*13));
    }
  }

  this.compareUserInput = function(userin){
    userin=userin.trim()
    if(this.presentedLines[0].charAt(this.presentedLines[0].length-1) == '_'){
      this.presentedLines[0] = this.presentedLines[0].substring (0, this.presentedLines[0].length-1);
    }
    if (userin === "gerkzeuk"){
      this.pushLineString("");
      PopupCenter('gerkzeuk/', 'gerkzeuk', 1024, screen.height);
    } else if (userin === "info"){
      printInfo();
    } else if (userin === "laserharp" || userin === "laserharfe"){
      this.pushLineString("");
      PopupCenter('laser/', 'laserharfe', screen.width, screen.height);
    } else if (userin === "dance"){
      this.pushLineString("");
      pfc = frameCount;
      busy = true;
      seqDance_b = true;
    } else if (userin === "fire"){
      this.pushLineString("");
      pfc = frameCount;
      busy = true;
      seqFire_b = true;
    } else if (userin === "t"){
      window.location.href = "t/index.html"
    } else if (userin === "electronic art"){
      this.pushLineString("");
      PopupCenter("https://www.youtube.com/watch?v=3-zyXnc2Xls", "Walter Giers - Electronic Art", screen.width, screen.height);
    } else if (userin === "genome"){
      pfc = frameCount;
      busy = true;
      seqGenome_b = true;
    } else if (userin === "blog"){
      this.pushLineString("");
      PopupCenter('http://giers.wordpress.com/', 'Neugier & Ästhetik', screen.width, screen.height);
    } else if (userin === "constructivism2"){
      pfc = frameCount;
      busy = true;
      seqConstructivism_b = true;
    } else if (userin === "go outside" || userin === "outside" || userin === "go" || userin === "street"){
      this.pushLineString("");
      pfc = frameCount;
      busy = true;
      seqOutside_b = true;
    } else if (userin === "maria"){
      this.pushLineString("");
      pfc = frameCount;
      busy = true;
      seqMaria_b = true;
    } else if (userin === "skip"){
      this.pushLineString("");
      pfc = frameCount;
      busy = true;
      seqSkip_b = true;
    } else if (userin === ""){
      this.pushLineString(this.inputString);
    } else {
      this.pushLineString("Unavailale or forbidden command.");
      this.pushLineString("Available commands are: [info] [maria] [gerkzeuk] [laserharp] [electronic art] [street] [dance] [t] [genome] [fire] [blog] [constructivism2] and [skip]");
      this.pushLineString("");
    }
  }
}

function PopupCenter(url, title, w, h) {
    // Fixes dual-screen position                         Most browsers      Firefox
    var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left;
    var dualScreenTop = window.screenTop != undefined ? window.screenTop : screen.top;

    var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
    var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;

    var left = ((width / 2) - (w / 2)) + dualScreenLeft;
    var top = ((height / 2) - (h / 2)) + dualScreenTop;
    var newWindow = window.open(url,title,'scrollbars=yes,width=' + w + ',height=' + h + ',top=' + top + ', left=' + left + ',resizable,scrollbars,toolbar,menubar');

    // Puts focus on the newWindow
    if (window.focus) {
        newWindow.focus();
    }
}

function runSequence(){
  if(busy){
    if (seqIntro_b){
      seqIntro();
    } else if(seqDance_b){
      seqDance();
    } else if(seqFire_b){
      seqFire();
    } else if(seqOutside_b){
      seqOutside();
    } else if(seqMaria_b){
      seqMaria();
    } else if(seqSkip_b){
      seqSkip();
    } else if(seqGenome_b){
      seqGenome();
    } else if(seqConstructivism_b){
      seqConstructivism();
    }
  }
}

var gwidth = window.innerWidth;
var gheight = window.innerHeight;
var zoomedState = false;
var scaleFactor = 1.0;
var translateX = 0.0;
var translateY = 0.0;

function reset() {
  scaleFactor = 1;
  translateX = 0.0;
  translateY = 0.0;
}

function collisionDetection() {
  while (translateX > 0.0) translateX--;
  while (translateY*scaleFactor > 0.0) translateY--;
  while (translateX+gwidth*scaleFactor < gwidth) translateX++;
  while (translateY+gheight*scaleFactor < gheight) translateY++;
}

function zoom(delta) {
  translateX -= mouseX;
  translateY -= mouseY;
  scaleFactor *= delta;
  translateX *= delta;
  translateY *= delta;
  translateX += mouseX;
  translateY += mouseY;
  collisionDetection();
}

function keyPressed(){
  commandLine.getUserInput(keyCode, key);
  return false;
}

function mousePressed() {
  if (mouseButton == CENTER) {
    if (!zoomedState && scaleFactor == 1.0) {
      zoom(3);
    } else {
      reset();
    }
    zoomedState = !zoomedState;
  }
}

function mouseDragged() {
  if (zoomedState) {
    translateX += (mouseX - pmouseX)/3; //this /3 shit is shit, drag n drop moves too fast, why
    translateY += (mouseY - pmouseY)/3;
    collisionDetection();
  }
}

function mouseWheel(event) {
  if(event.deltaY > 0){
    zoom(1.0/1.05);
  } else if(event.deltaY < 0){
    zoom(1.05);
  } else {
    zoom(1.0);
  }
  zoomedState = true;
  if (scaleFactor <= 1.0 && event.deltaY > 0){
    reset();
  }
}

//on backspace down + optional callback
function onBackspace(e, callback){
    var key;
    if(typeof e.keyIdentifier !== "undefined"){
        key = e.keyIdentifier;

    }else if(typeof e.keyCode !== "undefined"){
        key = e.keyCode;
    }
    if (key === 'U+0008' ||
        key === 'Backspace' ||
        key === 8) {
                    if(typeof callback === "function"){
                callback();
            }
            return true;
        }
    return false;
}

//event listener
window.addEventListener('keydown', function (e) {

    switch(e.target.tagName.toLowerCase()){
        case "input":
        case "textarea":
        break;
        case "body":
            onBackspace(e,function(){
                e.preventDefault();
            });

        break;
    }
}, true);