The first thing to do to make something draggable in HTML5 is to append the draggable
attribute to the element. This signals to the web browser to create a ghost image of the element that will appear and follow the mouse pointer when the user triggers a mouse down event, effectively "dragging" the element, and disappearing when the mouse button is released.
Change this line in displayShowtimes
where we are displaying the showtime:
if (movie.showtime[i]) movieHTML+='<div class="showtime" title="'+movie.title+' @ '+movie.theater.title+' ('+movie.theater.address+')" data-movie= "'+movie.theater.id+':'+movie.id+':'+movie.showtime[i]+'">'+that.formatTime(movie.showtime[i])+'</div> ';
It should now include the draggable="true"
attribute:
if (movie.showtime[i]) movieHTML+='<div class="showtime" draggable="true" title="'+movie.title+' @ '+movie.theater.title+' ('+movie.theater.address+')" data-movie= "'+movie.theater.id+':'+movie.id+':'+movie.showtime[i]+'">'+that.formatTime...