Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Maintenance break at Thu 2.2. 13:00, ETA 30 minutes.
Open sidebar
Timo Heikkilä
PET-rating
Commits
ea560971
Commit
ea560971
authored
Apr 10, 2019
by
Ossi Laine
Browse files
Show progress bar when creating embody -drawing
parent
ccd10549
Changes
6
Hide whitespace changes
Inline
Side-by-side
app/__init__.py
View file @
ea560971
...
...
@@ -8,7 +8,7 @@ from flask_sqlalchemy import SQLAlchemy
from
flask_migrate
import
Migrate
from
flask_login
import
LoginManager
from
flask_babel
import
Babel
from
flask_socketio
import
SocketIO
from
config
import
Config
app
=
Flask
(
__name__
)
...
...
@@ -63,6 +63,10 @@ def get_locale():
"""
# Run flask app with socketIO
socketio
=
SocketIO
()
socketio
.
init_app
(
app
)
#mariabd mysql portti 3306 tarkista?
Bootstrap
(
app
)
...
...
app/experiment/templates/experiment_statistics.html
View file @
ea560971
...
...
@@ -107,6 +107,12 @@
</tbody>
</table>
<div
class=
"progress hidden"
>
<div
id=
"image-loading-progress"
class=
"progress-bar progress-bar-striped progress-bar-animated"
role=
"progressbar"
aria-valuenow=
"50"
aria-valuemin=
"0"
aria-valuemax=
"100"
style=
"width: 0%"
>
<!-- Creating image... -->
</div>
</div>
<img
class=
"embody-image-container"
>
...
...
@@ -165,6 +171,7 @@
</tbody>
</table>
<script
src=
"{{ url_for('static', filename='lib/js/socket.io.js') }}"
></script>
<script
src=
"{{ url_for('static', filename='js/getDrawing.js') }}"
></script>
{% endblock %}
\ No newline at end of file
app/experiment/views.py
View file @
ea560971
...
...
@@ -851,14 +851,46 @@ def statistics():
import
embody_plot
from
flask_cors
import
CORS
,
cross_origin
from
flask_socketio
import
emit
from
app
import
socketio
@
experiment_blueprint
.
route
(
'/create_embody'
,
methods
=
[
'POST'
])
@
cross_origin
()
def
create_embody
():
'''
Old method
#@experiment_blueprint.route('/create_embody', methods=['POST'])
#@cross_origin()
def create_embody():
#page = request.args.get("page")
page = request.form["page"]
img_path = embody_plot.get_coordinates(page)
#return send_file('static/' + img_path, 'test')
return json.dumps({'path':img_path})
'''
# (https://flask-socketio.readthedocs.io/en/latest/)
# TODO: Using nginx as a WebSocket Reverse Proxy
# TODO: Gunicorn Web Server
@
cross_origin
()
@
socketio
.
on
(
'connect'
,
namespace
=
"/create_embody"
)
def
create_embody
():
print
(
"connection succesful"
)
emit
(
'success'
,
{
'connection'
:
'on'
})
@
cross_origin
()
@
socketio
.
on
(
'draw'
,
namespace
=
"/create_embody"
)
def
create_embody
(
page_id
):
page
=
page_id
[
"page"
]
img_path
=
embody_plot
.
get_coordinates
(
page
)
print
(
img_path
)
emit
(
'end'
,
{
'path'
:
img_path
})
'''
@socketio.on('end', namespace="/create_embody")
def create_embody():
print("connection end")
emit('end', {'connection': 'off'})
'''
# EOF
app/static/css/main.css
View file @
ea560971
...
...
@@ -49,3 +49,12 @@ body {
display
:
none
;
}
.progress-bar
{
height
:
2em
;
}
.progress
{
height
:
2em
;
background-color
:
rgb
(
248
,
249
,
250
);
-webkit-box-shadow
:
none
;
box-shadow
:
none
;
}
app/static/js/getDrawing.js
View file @
ea560971
const
baseURI
=
'
http://127.0.0.1:8000/
'
;
var
getDrawingURI
=
baseURI
+
'
experiment/
create_embody
'
;
var
getDrawingURI
=
baseURI
+
'
create_embody
'
;
//var getDrawingURI = baseURI + 'experiment/create_embody';
$
(
document
).
ready
(
function
()
{
var
drawButtons
=
$
(
"
.embody-get-drawing
"
);
var
imageContainer
=
$
(
"
.embody-image-container
"
)
var
source
=
''
var
progressBarContainer
=
$
(
"
.progress
"
)
var
progressBar
=
$
(
"
#image-loading-progress
"
)
// With sockets
function
initConnection
(
socket
)
{
socket
.
on
(
'
success
'
,
function
(
msg
)
{
console
.
log
(
msg
)
});
socket
.
on
(
'
progress
'
,
function
(
data
)
{
progressBar
.
width
(
100
*
(
data
.
done
/
data
.
from
)
+
'
%
'
)
});
socket
.
on
(
'
end
'
,
function
(
img
)
{
socket
.
disconnect
()
// Draw image to statistic -page
var
source
=
img
.
path
d
=
new
Date
()
imageContainer
.
attr
(
"
src
"
,
"
/static/
"
+
source
+
"
?
"
+
d
.
getTime
())
// Remove progress bar
progressBarContainer
.
addClass
(
"
hidden
"
)
progressBar
.
width
(
'
0%
'
)
});
}
drawButtons
.
click
(
function
(
event
)
{
event
.
preventDefault
()
var
spinner
=
$
(
event
.
target
.
firstElementChild
)
spinner
.
removeClass
(
"
hidden
"
)
// Init socket
var
socket
=
io
.
connect
(
getDrawingURI
);
initConnection
(
socket
)
//
var
pageId
=
this
.
dataset
.
value
socket
.
emit
(
'
draw
'
,
{
page
:
pageId
})
progressBarContainer
.
removeClass
(
"
hidden
"
)
/*
With AJAX -calls
var spinner = $(event.target.firstElementChild)
spinner.removeClass("hidden")
$.ajax({
url: getDrawingURI,
...
...
@@ -29,6 +64,7 @@ $(document).ready(function() {
imageContainer.attr("src", "/static/" + source + "?" +d.getTime())
spinner.addClass("hidden")
})
*/
})
...
...
embody_plot.py
View file @
ea560971
...
...
@@ -164,8 +164,14 @@ def format_coordinates(cursor):
"coordinates"
:
list
(
map
(
map_coordinates
,
x
,
y
,
r
))
}
from
flask_socketio
import
emit
from
app
import
socketio
def
plot_coordinates
(
coordinates
):
# Total amount of points
points_count
=
len
(
coordinates
[
'coordinates'
])
# Load image to a plot
image
=
mpimg
.
imread
(
IMAGE_PATH
)
image_mask
=
mpimg
.
imread
(
IMAGE_PATH_MASK
)
...
...
@@ -183,12 +189,17 @@ def plot_coordinates(coordinates):
ax2
.
set_title
(
"gaussian disk around points"
)
frame
=
np
.
zeros
((
HEIGHT
,
WIDTH
))
for
point
in
coordinates
[
"coordinates"
]:
for
idx
,
point
in
enumerate
(
coordinates
[
"coordinates"
]
)
:
frame
[
point
[
1
],
point
[
0
]]
=
1
point
=
ndimage
.
gaussian_filter
(
frame
,
sigma
=
5
)
ax2
.
imshow
(
point
,
cmap
=
'hot'
,
interpolation
=
'none'
)
# TODO: send progress information to frontend
# Try to send progress information to socket.io
try
:
socketio
.
sleep
(
0
)
emit
(
'progress'
,
{
'done'
:
idx
+
1
/
points_count
,
'from'
:
points_count
})
except
RuntimeError
as
err
:
continue
ax2
.
imshow
(
image_mask
)
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new 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