​

let entries = null;

let displayEntries = [];

​

const oneHourInMs = 3600000;

const oneDayInMs = 86400000;

​

const maxSize = 600 / 7;

​

let bg = null;

​

let isBlocked = false;

let selectedType = '';

​

function preload() {

  entries = loadJSON('csvjson.json');

}

​

function setup() {

  createCanvas(600, 600);

  bg = color(250);

​

  for (const index in entries) {

    const chair = entries[index];

​

    // set day into int

    let day = 0;

    switch (chair.Day) {

      case 'Mon':

        day = 6;

        break;

      case 'Tue':

        day = 7;

        break;

      case 'Wed':

        day = 1;

        break;

      case 'Thu':

        day = 2;

        break;

      case 'Fri':

        day = 3;

        break;

      case 'Sat':

        day = 4;

        break;

      case 'Sun':

        day = 5;

        break;

    }

​

    // let start = new Date( call['Start Time'] );

    let start = chair['Time On'];

    let end = chair['Time Off'];

​

    if (!start) {

      start = '0:00';

    }

    if (!end) {

      end = '23:59';

    }

​

    start = parseTime(start);

    end = parseTime(end);

​

    let type = chair.Where;

​

    let newSeating = new Chair(day, type, start, end);

    displayEntries.push(newSeating);

  }

  // noLoop();

}

​

function draw() {

​

  if (isBlocked) {

    background(isBlocked);

    push();

    textAlign(CENTER);

    textSize(18);

    switch (selectedType.toLowerCase()) {

      case 'kitchen chair':

      case 'purple sofa':

      case 'balkony':

      case 'bench':

        fill(255);

        break;

    }

    text(selectedType,width/2, height/2);

    pop();

  } else {

    background(bg);

​

    displayEntries.forEach((entry) => {

      entry.display();

    });

​

  }

}

​

class Chair {

  constructor(day, type, start, end) {

    this.type = type;

    this.day = day;

    this.start = start;

    this.end = end;

    this.duration = end - start;

    this.displayColor = 0;

    switch (this.type.toLowerCase()) {

      case 'bed':

        this.displayColor = color('#FFFFFF');

        // stroke('#E6E6E6');

        break;

      case 'white sofa':

        this.displayColor = color('#E2E2E2');

        break;

      case 'nicki chair':

      case 'office':

      case 'mama':

        this.displayColor = color('#FFD200');

        break;

      case 'desk chair':

        this.displayColor = color('#BF9362');

        break;

      case 'kitchen chair':

        this.displayColor = color('#222222');

        break;

      case 'purple sofa':

        this.displayColor = color('#695BA5');

        break;

      case 'balkony':

      case 'bench':

        this.displayColor = color('#5E8431');

        break;

    }

  }

  display() {

    push();

    noStroke();

​

    let left = map(this.start, 0, oneDayInMs, 0, width);

    let mappedDuration = map(this.duration, 0, oneHourInMs, 0, width / 24);

​

    if( this.type.toLowerCase() === 'bed' ){

      stroke('#E6E6E6');

    }

    let top = height / 7 * this.day - height / 7 / 2 - 10;

    translate(left, top);

    fill(this.displayColor);

    rect(0, 0, mappedDuration, 10);

​

    // inidcate new position

    noStroke();

    fill(200);

    circle(0, -4, 3);

​

    pop();

    this.isHighlight(left, top, mappedDuration, 10);

  }

​

  isHighlight(x, y, w, h) {

    if (mouseIsPressed) {

​

      if (mouseX >= x && mouseX <= (x + w) && mouseY >= y && mouseY <= (y + h)) {

        isBlocked = this.displayColor;

        selectedType = this.type;

        setTimeout( () => {

          isBlocked = false;

        }, 1000 );

      }

​

    }

    // push();

    // fill(0);

    // rect(x, y, w, h);

    // pop();

  }

}

​

// https://stackoverflow.com/questions/141348/how-to-parse-a-time-into-a-date-object-from-user-input-in-javascript

function parseTime(t) {

  var d = new Date();

  var time = t.match(/(\d+)(?::(\d\d))?\s*(p?)/);

  d.setHours(parseInt(time[1]) || 0);

  d.setMinutes(parseInt(time[2]) || 0);

  let startOfDay = new Date();

  startOfDay.setHours(0);

  startOfDay.setMinutes(0);

  d = d - startOfDay;

  return d;

}

​

// https://stackoverflow.com/questions/20474257/split-string-into-two-parts

function splitTimes(str) {

  let index = str.indexOf("-"); // Gets the first index where a space occours

  let start = str.substr(0, index); // Gets the first part

  let end = str.substr(index + 1); // Gets the text part

​

  return {

    start: parseTime(start),

    end: parseTime(end)

  }

}