xxxxxxxxxx
221
/*
BubbleView (http://bubbleview.namwkim.org) is cool, not only because it seems quite usefull (for an overview of more methods see http://turkeyes.mit.edu) but I also like the interface. You can also do some more creative things with it.
This P5 sketch was made by penis man,
*/
var sharpR1, sharpR2, sharpR3, sharpR4, sharpR5, sharpR6, sharpR7, sharpR8, sharpR9, sharpR10, sharpR11, blurR1, blurR2, blurR3, blurR4, blurR5, blurR6, blurR7, blurR8, blurR9, blurR10, blurR11, sharpF1, sharpF2, sharpF3, sharpF4, sharpF5, sharpF6, sharpF7, sharpF8, sharpF9, sharpF10, sharpF11, blurF1, blurF2, blurF3, blurF4, blurF5, blurF6, blurF7, blurF8, blurF9, blurF10, blurF11;
var imgname;
let order = ['R1', 'R2', 'R3', 'R4', 'R5', 'R6', 'R7', 'R8', 'R9', 'R10' , 'R11', 'F1', 'F2', 'F3', 'F4', 'F5', 'F6', 'F7' , 'F8', 'F9' , 'F10', 'F11']
let orderplace = 0;
let choiceclick = true;
let game="off"
let blacktime;
let currentblur;
let currentsharp;
let aperture;
let mwidth,mheight;
let margin=50;
let marginy=150;
let explanation1 = "You will be shown a series of blurred landscapes,"
let explanation2 = "some are real photos, and some are generated by an AI."
let explanation3 = "For each photo, please indicate whether you think it is real or not with the"
let explanation4 = "buttons below."
let explanation5 = "The images will be blurry, but you can sharpen an area by clicking on it,"
let explanation6 = "feel free to do this as much as you want"
let explanation7 = "The time limit per image is 30 seconds"
let explanation8 = "please click start when you are ready to begin"
// radius of the aperture
let radius=75;
//let data=[];
let trial=0;
let data;
// Everything is scaled to the width you want to present the sketch in. Aspectratios are maintained.
let sketchwidth=500;
let aspectratio,sketchheight;
let clicked=false;
let startbutton;
function preload(){
//THIS REALLY DIDNT SAVE AS MUCH TIME AS I HOPED IT WOULD
for (i = 1; i < 12; i++) {
imgname = "sharpR" + i;
window[imgname] = loadImage('photos/r' + i + '.jpg');}
for (i = 1; i < 12; i++) {
imgname = "blurR" + i;
window[imgname] = loadImage('photos/r' + i + '.jpg');}
for (i = 1; i < 12; i++) {
imgname = "sharpF" + i;
window[imgname] = loadImage('photos/f' + i + '.jpg');}
for (i = 1; i < 12; i++) {
imgname = "blurF" + i;
window[imgname] = loadImage('photos/f' + i + '.jpg');}
}
function setup() {
//RANDOMIZES THE ORDER OF IMAGES
for (var i = order.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = order[i];
order[i] = order[j];
order[j] = temp;
}
aspectratio=1
sketchheight=sketchwidth*aspectratio;
createCanvas(sketchwidth, sketchheight);
for (i = 1; i < 12; i++) {
imgname = "sharpR"+i;
window[imgname].resize(sketchwidth, sketchheight);}
for (i = 1; i < 12; i++) {
imgname = "sharpF"+i;
window[imgname].resize(sketchwidth, sketchheight);}
for (i = 1; i < 12; i++) {
imgname = "blurR"+i;
window[imgname].resize(sketchwidth, sketchheight);
window[imgname].filter(BLUR, 10);}
for (i = 1; i < 12; i++) {
imgname = "blurF"+i;
window[imgname].resize(sketchwidth, sketchheight);
window[imgname].filter(BLUR, 10);}
createButton('Real photo').position(50, 550)
.mousePressed(function() {
choice('R');
})
createButton('AI generated photo').position(200, 550)
.mousePressed(function() {
choice('F');
})
startbutton = createButton('start').position(margin, marginy+140)
.mousePressed(function() {
startgame();
})
aperture=createImage(2*radius,2*radius);
data = new p5.Table();
data.addColumn('x');
data.addColumn('y');
data.addColumn('r');
}
function draw() {
if(game=="on"){
currentblur = "blur"+order[orderplace];
currentsharp = "sharp"+order[orderplace];
imageMode(CORNER);
image(window[currentblur],0,0);
imageMode(CENTER);
if(clicked){
image(aperture,data.getNum(trial-1, "x"),data.getNum(trial-1, "y"));
}
noFill();
stroke(255,0,0);
ellipse(mouseX,mouseY,2*radius,2*radius);
}
else if(game=="black"){
background(0,0,0);
}
else{
background(0,0,0);
textSize(13);
fill(255,255,255);
text(explanation1, margin, marginy + 0);
text(explanation2, margin, marginy + 15);
text(explanation3, margin, marginy + 35);
text(explanation4, margin, marginy + 50);
text(explanation5, margin, marginy + 70);
text(explanation6, margin, marginy + 85);
text(explanation7, margin, marginy + 105);
text(explanation8, margin, marginy + 120);
}
}
function mouseClicked(){
if(choiceclick){
trial++
sharpR1.loadPixels();
aperture.loadPixels();
let c;
for (let i = 0; i < aperture.width; i++) {
for (let j = 0; j < aperture.height; j++) {
if(dist(i, j, aperture.width/2, aperture.height/2)<aperture.width/2){
c=window[currentsharp].get(mouseX+i-aperture.width/2,mouseY+j-aperture.height/2);
aperture.set(i, j, c);
}else{
aperture.set(i, j, color(0, 0, 0, 0));
}
}
}
aperture.updatePixels();
let newRow = data.addRow();
newRow.setNum('x', int(mouseX));
newRow.setNum('y', int(mouseY));
newRow.setNum('r', radius);
if(clicked){
clicked=true;
}else{
clicked=true;
}
}
else{
choiceclick=true;
}
}
function choice(guess){
let correct = guess == order[orderplace][0];
game = "on";
clearTimeout(blacktime);
blacktime = setTimeout(blackOut, 30000);
choiceclick=false;
clicked = false;
let newRow = data.addRow();
newRow.setString('x', order[orderplace]);
newRow.setString('y', correct)
trial++;
if(orderplace<order.length-1){orderplace++;}
else {
saveTable(data, 'results.csv');
}
}
function blackOut(){
game="black";
}
function startgame() {
startbutton.remove();
noCursor();
game="on";
blacktime = setTimeout(blackOut, 30000);
}