Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Timo Heikkilä
PET-rating
Commits
f8d9a884
Commit
f8d9a884
authored
Apr 02, 2019
by
Ossi Laine
Browse files
Clear and save -methods for canvas
parent
5784ec04
Changes
6
Hide whitespace changes
Inline
Side-by-side
app/experiment/views.py
View file @
f8d9a884
...
...
@@ -306,7 +306,7 @@ def view_forced_id_list():
db
.
session
.
add
(
input_id
)
db
.
session
.
commit
()
return
redirect
(
url_for
(
'view_forced_id_list'
,
exp_id
=
exp_id
))
return
redirect
(
url_for
(
'
experiment.
view_forced_id_list'
,
exp_id
=
exp_id
))
return
render_template
(
'view_forced_id_list.html'
,
exp_id
=
exp_id
,
id_list
=
id_list
)
...
...
app/static/css/main.css
View file @
f8d9a884
...
...
@@ -18,4 +18,8 @@ body {
margin
:
0
auto
;
margin-bottom
:
30px
;
}
.clear-button
{
margin
:
10px
;
}
\ No newline at end of file
app/static/js/canvas.js
View file @
f8d9a884
const
url
=
'
http://127.0.0.1:8000/
'
;
$
(
document
).
ready
(
function
()
{
try
{
var
canvas
=
$
(
"
#embody-canvas
"
)
var
context
=
document
.
getElementById
(
"
embody-canvas
"
).
getContext
(
"
2d
"
);
$
(
"
#canvas-data
"
).
val
(
"
hello world
"
);
var
canvas
=
$
(
"
#embody-canvas
"
)
var
context
=
document
.
getElementById
(
"
embody-canvas
"
).
getContext
(
"
2d
"
);
// Base image
var
img
=
document
.
getElementById
(
"
baseImage
"
);
console
.
log
(
img
)
console
.
log
(
canvas
)
}
catch
(
e
)
{
console
.
log
(
e
)
if
(
e
instanceof
TypeError
)
{
return
}
}
// Init draw variables
var
clickX
=
new
Array
();
var
clickY
=
new
Array
();
var
clickDrag
=
new
Array
();
var
paint
;
var
drawRadius
=
15
;
// Click handlers
canvas
.
mousedown
(
function
(
e
){
var
mouseX
=
e
.
pageX
-
this
.
offsetLeft
;
var
mouseY
=
e
.
pageY
-
this
.
offsetTop
;
paint
=
true
;
addClick
(
e
.
pageX
-
this
.
offsetLeft
,
e
.
pageY
-
this
.
offsetTop
);
redraw
();
if
(
pointInsideBaseImage
([
mouseX
,
mouseY
]))
{
addClick
(
mouseX
,
mouseY
);
redraw
();
}
});
canvas
.
mousemove
(
function
(
e
){
if
(
paint
){
addClick
(
e
.
pageX
-
this
.
offsetLeft
,
e
.
pageY
-
this
.
offsetTop
,
true
);
var
mouseX
=
e
.
pageX
-
this
.
offsetLeft
;
var
mouseY
=
e
.
pageY
-
this
.
offsetTop
;
if
(
paint
&&
pointInsideBaseImage
([
mouseX
,
mouseY
])){
addClick
(
mouseX
,
mouseY
,
true
);
redraw
();
}
});
...
...
@@ -31,16 +56,10 @@ $(document).ready(function() {
paint
=
false
;
});
var
clickX
=
new
Array
();
var
clickY
=
new
Array
();
var
clickDrag
=
new
Array
();
var
paint
;
var
drawRadius
=
15
;
// TODO: changing drawradius doesnt affect to the saved datapoints !!!
// Bigger brush should make more datapoints compared to smaller ones.
$
(
"
.canvas-container
"
).
bind
(
'
DOMMouseScroll
'
,
function
(
event
)
{
event
.
preventDefault
()
//
event.preventDefault()
// Change brush size
if
(
event
.
originalEvent
.
detail
>=
0
){
...
...
@@ -63,13 +82,20 @@ $(document).ready(function() {
}
})
function
addClick
(
x
,
y
,
dragging
)
$
(
"
.clear-button
"
).
on
(
'
click
'
,
function
()
{
clearCanvas
()
})
$
(
"
.next-page
"
).
click
(
function
()
{
saveData
()
})
// Draw methods
function
addClick
(
x
,
y
,
dragging
=
false
)
{
clickX
.
push
(
x
);
clickY
.
push
(
y
);
// ClickDrag array is unnecessary beacause all the coordinates are saved to
// X & Y -arrays
clickDrag
.
push
(
dragging
);
}
...
...
@@ -79,6 +105,26 @@ $(document).ready(function() {
context
.
fill
()
}
function
isWhite
(
color
)
{
if
(
color
===
255
)
return
true
return
false
}
// Method for checking if cursor is inside human body before creating brush stroke
function
pointInsideBaseImage
(
point
)
{
var
imageData
=
context
.
getImageData
(
point
[
0
],
point
[
1
],
1
,
1
)
startR
=
imageData
.
data
[
0
];
startG
=
imageData
.
data
[
1
];
startB
=
imageData
.
data
[
2
];
if
(
isWhite
(
startB
)
&&
isWhite
(
startG
)
&&
isWhite
(
startR
))
{
return
false
;
}
return
true
;
}
function
redraw
(){
...
...
@@ -105,13 +151,6 @@ $(document).ready(function() {
// Draw circle with gradient
drawPoint
(
lastX
,
lastY
,
drawRadius
)
/*
drawPoint(lastX + 3, lastY, drawRadius)
drawPoint(lastX - 3, lastY, drawRadius)
drawPoint(lastX, lastY + 3, drawRadius)
drawPoint(lastX, lastY - 3, drawRadius)
*/
drawMaskToBaseImage
()
/*
OLD version, where line is drawn continuously (not needed probably)
...
...
@@ -131,9 +170,9 @@ $(document).ready(function() {
context.stroke();
}
*/
}
// This is not needed, because canvas dont allow to draw on white points (mask points)
function
drawMaskToBaseImage
()
{
var
img
=
document
.
getElementById
(
"
baseImageMask
"
);
...
...
@@ -143,9 +182,8 @@ $(document).ready(function() {
function
drawBaseImage
()
{
var
img
=
document
.
getElementById
(
"
baseImage
"
);
var
width
=
img
.
clientWidth
;
var
height
=
img
.
clientHeight
;
var
width
=
img
.
width
;
var
height
=
img
.
height
;
context
.
canvas
.
height
=
height
context
.
canvas
.
width
=
width
...
...
@@ -153,6 +191,34 @@ $(document).ready(function() {
img
.
classList
.
add
(
"
hidden
"
)
}
function
clearCanvas
()
{
// Clear canvas
img
.
classList
.
remove
(
"
hidden
"
)
context
.
clearRect
(
0
,
0
,
context
.
canvas
.
width
,
context
.
canvas
.
height
);
drawBaseImage
()
// Remove saved coordinates
clickX
=
[]
clickY
=
[]
clickDrag
=
[]
}
function
saveData
()
{
var
points
=
{
x
:
clickX
,
y
:
clickY
}
points
=
JSON
.
stringify
(
points
)
console
.
log
(
points
)
$
(
"
#canvas-data
"
).
val
(
points
);
$
(
"
#canvas-form
"
).
submit
();
}
drawBaseImage
()
});
\ No newline at end of file
app/task/templates/task.html
View file @
f8d9a884
...
...
@@ -105,14 +105,18 @@
<img
id=
"baseImage"
class=
""
src=
{{
url_for
('
static
',
filename=
'img/dummy_600.png'
)
}}
/>
<img
id=
"baseImageMask"
class=
"hidden"
src=
{{
url_for
('
static
',
filename=
'img/dummy_600_mask.png'
)
}}
/>
<form
class=
"form-group mt-5"
action=
"/task/embody/{{ page_num }}"
method=
"post"
>
<form
id=
"canvas-form"
class=
"form-group mt-5"
action=
"/task/embody/{{ page_num }}"
method=
"post"
>
<input
id=
"canvas-data"
type=
"hidden"
value=
""
name=
"text"
>
<input
id=
"canvas-data"
type=
"hidden"
value=
""
name=
"coordinates"
>
<div
class=
"row justify-content-md-center"
>
<button
type=
"button"
class=
"btn btn-primary clear-button"
>
Clear
</button>
</div>
<div
class=
"form-row text-center"
>
<div
class=
"col-12"
>
<div
class=
"
centered
col-12"
>
<a
class=
"btn btn-primary"
href=
{{
url_for
('
task.quit
')
}}
role=
"button"
>
{{ _('Quit task') }}
</a>
<button
type=
"
submit
"
class=
"btn btn-primary"
>
{{ _('Next page') }}
</button>
<button
type=
"
button
"
class=
"btn btn-primary
next-page
"
>
{{ _('Next page') }}
</button>
</div>
<div
class=
"col-12"
>
<br>
...
...
app/task/views.py
View file @
f8d9a884
...
...
@@ -2,6 +2,7 @@
import
math
import
json
from
datetime
import
datetime
from
flask
import
(
...
...
@@ -95,9 +96,15 @@ def task_embody(page_num):
if
form
.
validate
():
data
=
request
.
form
.
to_dict
()
for
key
,
value
in
data
.
items
():
print
(
key
)
print
(
value
)
coordinates
=
json
.
loads
(
data
[
'coordinates'
])
print
(
"x:"
,
coordinates
[
'x'
])
print
(
"y:"
,
coordinates
[
'y'
])
# Test that everything OK
return
json
.
dumps
(
coordinates
)
# Check if there are unanswered slider questions
if
slider_question_has_answers
(
session
[
'user'
],
page_id
):
...
...
@@ -265,7 +272,7 @@ def continue_task():
#If participant has done just the registration redirect to the first page of the experiment
if
participant
.
answer_counter
==
0
:
#flash("Ei vastauksia ohjataan ekalle sivulle")
return
redirect
(
url_for
(
'task'
,
page_num
=
1
))
return
redirect
(
url_for
(
'task
.task
'
,
page_num
=
1
))
redirect_to_page
=
participant
.
answer_counter
+
1
...
...
create_rating_db.txt
deleted
100644 → 0
View file @
5784ec04
CREATE TABLE background_question (
idbackground_question INTEGER NOT NULL AUTO_INCREMENT,
background_question VARCHAR(120),
experiment_idexperiment INTEGER,
PRIMARY KEY (idbackground_question)
);
CREATE TABLE experiment (
idexperiment INTEGER NOT NULL AUTO_INCREMENT,
name VARCHAR(120),
instruction MEDIUMTEXT,
directoryname VARCHAR(120),
language VARCHAR(120),
status VARCHAR(120),
randomization VARCHAR(120),
short_instruction MEDIUMTEXT,
single_sentence_instruction MEDIUMTEXT,
is_archived VARCHAR(120),
creator_name VARCHAR(120),
research_notification_filename VARCHAR(120),
creation_time DATETIME,
stimulus_size VARCHAR(120),
consent_text MEDIUMTEXT,
use_forced_id VARCHAR(120),
PRIMARY KEY (idexperiment)
);
CREATE TABLE trial_randomization (
idtrial_randomization INTEGER NOT NULL AUTO_INCREMENT,
page_idpage INTEGER,
randomized_idpage INTEGER,
answer_set_idanswer_set INTEGER,
experiment_idexperiment INTEGER,
PRIMARY KEY (idtrial_randomization)
);
CREATE TABLE user (
id INTEGER NOT NULL AUTO_INCREMENT,
username VARCHAR(64),
email VARCHAR(120),
password_hash VARCHAR(128),
PRIMARY KEY (id)
);
INSERT INTO user VALUES(1,'Yngwie',NULL,'pbkdf2:sha256:50000$QioS5ICE$17a468394e72aef1243576aa80d29c296c6482ada48be9d25bd7c3b6e8129b40');
CREATE TABLE answer_set (
idanswer_set INTEGER NOT NULL AUTO_INCREMENT,
experiment_idexperiment INTEGER,
session VARCHAR(120),
agreement VARCHAR(120),
answer_counter INTEGER,
registration_time DATETIME,
last_answer_time DATETIME,
PRIMARY KEY (idanswer_set),
FOREIGN KEY(experiment_idexperiment) REFERENCES experiment (idexperiment)
);
CREATE TABLE background_question_option (
idbackground_question_option INTEGER NOT NULL AUTO_INCREMENT,
background_question_idbackground_question INTEGER,
option VARCHAR(120),
PRIMARY KEY (idbackground_question_option),
FOREIGN KEY(background_question_idbackground_question) REFERENCES background_question (idbackground_question)
);
CREATE TABLE forced_id (
idforced_id INTEGER NOT NULL AUTO_INCREMENT,
experiment_idexperiment INTEGER,
pregenerated_id VARCHAR(120),
PRIMARY KEY (idforced_id),
FOREIGN KEY(experiment_idexperiment) REFERENCES experiment (idexperiment)
);
CREATE TABLE page (
idpage INTEGER NOT NULL AUTO_INCREMENT,
experiment_idexperiment INTEGER,
type VARCHAR(120),
text VARCHAR(120),
media VARCHAR(120),
PRIMARY KEY (idpage),
FOREIGN KEY(experiment_idexperiment) REFERENCES experiment (idexperiment)
);
CREATE TABLE question (
idquestion INTEGER NOT NULL AUTO_INCREMENT,
experiment_idexperiment INTEGER,
question VARCHAR(120),
`left` VARCHAR(120),
`right` VARCHAR(120),
PRIMARY KEY (idquestion),
FOREIGN KEY(experiment_idexperiment) REFERENCES experiment (idexperiment)
);
CREATE TABLE answer (
idanswer INTEGER NOT NULL AUTO_INCREMENT,
question_idquestion INTEGER,
answer_set_idanswer_set INTEGER,
answer VARCHAR(120),
page_idpage INTEGER,
PRIMARY KEY (idanswer),
FOREIGN KEY(answer_set_idanswer_set) REFERENCES answer_set (idanswer_set),
FOREIGN KEY(page_idpage) REFERENCES page (idpage),
FOREIGN KEY(question_idquestion) REFERENCES question (idquestion)
);
CREATE TABLE background_question_answer (
idbackground_question_answer INTEGER NOT NULL AUTO_INCREMENT,
answer_set_idanswer_set INTEGER,
answer VARCHAR(120),
background_question_idbackground_question INTEGER,
PRIMARY KEY (idbackground_question_answer),
FOREIGN KEY(answer_set_idanswer_set) REFERENCES answer_set (idanswer_set),
FOREIGN KEY(background_question_idbackground_question) REFERENCES background_question (idbackground_question)
);
CREATE INDEX ix_experiment_consent_text ON experiment (consent_text);
CREATE INDEX ix_experiment_creation_time ON experiment (creation_time);
CREATE UNIQUE INDEX ix_experiment_directoryname ON experiment (directoryname);
CREATE INDEX ix_experiment_instruction ON experiment (instruction);
CREATE INDEX ix_experiment_name ON experiment (name);
CREATE INDEX ix_experiment_short_instruction ON experiment (short_instruction);
CREATE INDEX ix_experiment_single_sentence_instruction ON experiment (single_sentence_instruction);
CREATE UNIQUE INDEX ix_user_email ON user (email);
CREATE UNIQUE INDEX ix_user_username ON user (username);
CREATE INDEX ix_answer_set_last_answer_time ON answer_set (last_answer_time);
CREATE INDEX ix_answer_set_registration_time ON answer_set (registration_time);
CREATE INDEX ix_page_media ON page (media);
CREATE INDEX ix_page_text ON page (text);
CREATE INDEX ix_page_type ON page (type);
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment