Browse Source

added interaction via click and timeline, random or chronologically

master
Victor Giers 1 year ago
parent
commit
a10816701a
5 changed files with 96 additions and 18 deletions
  1. 60
    0
      Interaction.pde
  2. 11
    3
      Slide.pde
  3. 1
    1
      Timer.pde
  4. 1
    1
      data/save.sav
  5. 23
    13
      notizheftanzeiger.pde

+ 60
- 0
Interaction.pde View File

@@ -0,0 +1,60 @@
void mousePressed() {
interactive = true;
startInteractionTime = millis();
if (timeline.hovering()) {
timeline.clicked = true;
timelinectrl();
} else {
nextSlide(interactMode);
}
}
void mouseReleased() {
timeline.clicked = false;
}
int currentYear;
void mouseDragged() {
if (timeline.clicked) {
timelinectrl();
}
}
void timelinectrl() {
if (interactiveTimeline && displayTimeline) {
int toYear = (int)constrain(map(mouseX, timeline.x, timeline.x + timeline.l, 1966, 2012), 1966, 2012);
if (toYear != currentYear) {
timeline.cursorPos = constrain(mouseX, timeline.x, timeline.x +timeline.l);
for (int i = 0; i < notebooks.size(); i ++) {
if (notebooks.get(i).year == toYear) {
nextSlide(i, 0);
break;
}
}
}
}
}

class Timeline { //currently timeline has to be from left to right to work
int x, y, l, cursorPos;
boolean clicked;
Timeline(int x_, int y_, int l_) {
x = x_;
y = y_;
l = l_;
}
boolean hovering() {
if (mouseX > x - 20 && mouseX < x + l + 20 && mouseY > y - 20 && mouseY < y + 20) {
return true;
} else {
return false;
}
}
void update() {
cursorPos = (int)map(notebooks.get(currentNotebookNo).year, 1966, 2012, 50, width-50);
}
void display() {
stroke(255, 127);
strokeWeight(4);
line(x, y, l+x, y);
ellipse(cursorPos, height-30, 20, 20);
if (displayText) text(notebooks.get(currentNotebookNo).year, cursorPos, y-20);
}
}

+ 11
- 3
Slide.pde View File

@@ -13,7 +13,7 @@ PImage Slide(int notebookID, int pageNumber) {
}


void nextSlide() {
void nextSlide(int mode) {
transition = true;
startTransitionTime = millis();
@@ -31,7 +31,15 @@ void nextSlide() {
currentSlideNo -= 1;
}
}
currentYear = notebooks.get(currentNotebookNo).year;
nextSlide = Slide(currentNotebookNo, currentSlideNo);
//currentSlide = Slide(currentNotebookNo, currentSlideNo);
}

void nextSlide(int bookNo, int pageNo){
transition = true;
startTransitionTime = millis();
currentNotebookNo = bookNo;
currentSlideNo = pageNo;
currentYear = notebooks.get(bookNo).year;
nextSlide = Slide(bookNo, pageNo);
}

+ 1
- 1
Timer.pde View File

@@ -10,7 +10,7 @@ class Timer {
if (millis() - starttime >= lasttime + time) {
lasttime = millis();
//runs once every time "time" (millis as float) passed:
nextSlide();
nextSlide(autoplayMode);
}
}
}

+ 1
- 1
data/save.sav View File

@@ -1,2 +1,2 @@
168
95
0

+ 23
- 13
notizheftanzeiger.pde View File

@@ -2,20 +2,26 @@ import java.util.*;

//////// Config

int mode = RANDOM; //NORMAL or RANDOM order
float timerTime = 250; //in milliseconds how long slide is shown
float transitionTime = 100; //how long it takes to fade the next slide in. must not be greater than "timerTime"
int autoplayMode = RANDOM; //NORMAL or RANDOM order
int interactMode = NORMAL;

float timerTime = 5000; //in milliseconds how long slide is shown
float transitionTime = 1000; //how long it takes to fade the next slide in. must not be greater than "timerTime"
float continueAutoplayTime = 60000; //how long until the app goes back to autoplay after a user interacted with it

boolean displayText = true; //if the "date" should be written on screen
boolean displayTimeline = true; //if the timeline should be drawn on screen
boolean interactiveTimeline = true; //if the user can select a year via timeline

//

Timer timer;
Timeline timeline;
ArrayList<Notebook> notebooks = new ArrayList<Notebook>();
PImage currentSlide, nextSlide;
int currentNotebookNo, currentSlideNo;
int startTransitionTime;
boolean transition;
int startTransitionTime, startInteractionTime;
boolean transition, interactive;
float transitionProgress;
final static int NORMAL = 0;
final static int RANDOM = 1;
@@ -36,13 +42,20 @@ void setup() {
textSize(20);
}
timer = new Timer(timerTime);
timeline = new Timeline(50, height-30, width-100);
createNotebooks();
currentSlide = Slide(currentNotebookNo, currentSlideNo);
//if (mode == RANDOM) nextSlide();
}

void draw() {
timer.update();
if (!interactive) {
timer.update();
} else {
if (millis() > startInteractionTime + continueAutoplayTime) {
interactive = false;
}
}

tint(255, 255);
image(currentSlide, 0, 0, width, height);

@@ -62,13 +75,10 @@ void draw() {
}
}


if (displayTimeline) {
stroke(255, 127);
strokeWeight(4);
line(50, height-30, width-50, height-30);
int xPos = (int)map(notebooks.get(currentNotebookNo).year, 1966, 2012, 50, width-50);
ellipse(xPos, height-30, 20, 20);
if (displayText) text(notebooks.get(currentNotebookNo).year, xPos, height-50);
timeline.update();
timeline.display();
} else {
if (displayText) text(notebooks.get(currentNotebookNo).dateText, 20, 40);
}

Loading…
Cancel
Save