Play from a specific point
This commit is contained in:
parent
d00b676ad8
commit
3e06356edc
6 changed files with 85 additions and 16 deletions
|
@ -349,6 +349,18 @@ class HugveyState(object):
|
|||
|
||||
if event['event'] == 'change_language':
|
||||
self.setLanguage(event['lang_code'])
|
||||
if event['event'] == 'play_msg':
|
||||
self.logger.info("DO PLAY :-)")
|
||||
if not self.story:
|
||||
self.logger.critical("No story to play message in")
|
||||
else:
|
||||
msg = self.story.get(event['msg_id'])
|
||||
# if not msg or isinstance(msg, hugvey.story.Message):
|
||||
# self.logger.critical("Invalid ID to play: {}".format(event['msg_id']))
|
||||
self.restart()
|
||||
await asyncio.sleep(.1)
|
||||
self.story.setCurrentMessage(msg)
|
||||
# self.resume() # don't reset a finished story
|
||||
|
||||
self.eventQueue = None
|
||||
|
||||
|
@ -375,6 +387,7 @@ class HugveyState(object):
|
|||
self.status = self.STATE_PAUSE
|
||||
|
||||
def resume(self):
|
||||
""" Start playing without reset"""
|
||||
self.logger.info('Resume')
|
||||
if self.google:
|
||||
self.google.resume()
|
||||
|
@ -384,6 +397,7 @@ class HugveyState(object):
|
|||
self.status = self.STATE_RUNNING
|
||||
|
||||
def restart(self):
|
||||
""" Start playing with reset"""
|
||||
self.logger.info('Restart')
|
||||
if self.story:
|
||||
self.story.stop()
|
||||
|
|
|
@ -55,6 +55,8 @@ def getWebSocketHandler(central_command):
|
|||
self.msgRestart(msg['hugvey'])
|
||||
elif msg['action'] == 'change_language':
|
||||
self.msgChangeLanguage(msg['hugvey'], msg['lang_code'])
|
||||
elif msg['action'] == 'play_msg':
|
||||
self.msgPlayMsg(msg['hugvey'], msg['msg_id'])
|
||||
else:
|
||||
self.send({'alert': 'Unknown request: {}'.format(message)})
|
||||
logger.warn('Unknown request: {}'.format(message))
|
||||
|
@ -97,6 +99,9 @@ def getWebSocketHandler(central_command):
|
|||
def msgChangeLanguage(self, hv_id, lang_code):
|
||||
central_command.hugveys[hv_id].eventQueue.put_nowait({'event': 'change_language', 'lang_code': lang_code})
|
||||
|
||||
def msgPlayMsg(self, hv_id, msg_id):
|
||||
central_command.hugveys[hv_id].eventQueue.put_nowait({'event': 'play_msg', 'msg_id': msg_id})
|
||||
|
||||
return WebSocketHandler
|
||||
|
||||
class NonCachingStaticFileHandler(tornado.web.StaticFileHandler):
|
||||
|
|
|
@ -154,13 +154,19 @@ img.icon {
|
|||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 30%;
|
||||
width: 420px;
|
||||
max-height: 100%;
|
||||
overflow-y: auto; }
|
||||
#story #msg .msg__info, #story #msg .directions > div {
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
background: lightgray; }
|
||||
#story #msg h1 {
|
||||
margin: 0; }
|
||||
#story #msg .play {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 10px; }
|
||||
#story #msg .direction {
|
||||
position: relative; }
|
||||
#story #msg .direction h3 {
|
||||
|
|
|
@ -64,6 +64,7 @@
|
|||
</div>
|
||||
<div id='story'>
|
||||
<div id="controls">
|
||||
<span id="current_hv">{{selectedId}}</span>
|
||||
<span id="current_lang"></span>
|
||||
<div id="btn-save" class="btn">Save</div>
|
||||
<div id="btn-addMsg" class="btn">Create message</div>
|
||||
|
|
|
@ -4,13 +4,14 @@ class Panopticon {
|
|||
constructor() {
|
||||
console.log( "Init panopticon" );
|
||||
this.languages = []
|
||||
this.selectedHugvey = null;
|
||||
// this.selectedHugvey = null;
|
||||
this.hugveys = new Vue( {
|
||||
el: "#status",
|
||||
el: "#interface",
|
||||
data: {
|
||||
uptime: 0,
|
||||
languages: [],
|
||||
hugveys: []
|
||||
hugveys: [],
|
||||
selectedId: null,
|
||||
},
|
||||
methods: {
|
||||
time_passed: function( hugvey, property ) {
|
||||
|
@ -21,6 +22,7 @@ class Panopticon {
|
|||
return panopticon.stringToHHMMSS( hugvey[property] );
|
||||
},
|
||||
loadNarrative: function( code, file ) {
|
||||
panopticon.hugveys.selectedId = null;
|
||||
return panopticon.loadNarrative( code, file );
|
||||
},
|
||||
pause: function(hv) {
|
||||
|
@ -40,7 +42,7 @@ class Panopticon {
|
|||
return panopticon.change_language(hv.id, lang_code);
|
||||
},
|
||||
showHugvey: function(hv) {
|
||||
panopticon.selectedHugvey = hv.id;
|
||||
panopticon.hugveys.selectedId = hv.language ? hv.id : null;
|
||||
panopticon.updateSelectedHugvey();
|
||||
}
|
||||
}
|
||||
|
@ -78,7 +80,7 @@ class Panopticon {
|
|||
this.hugveys.languages = msg['languages'];
|
||||
this.languages = msg['languages'];
|
||||
this.hugveys.hugveys = msg['hugveys'];
|
||||
if(this.selectedHugvey) {
|
||||
if(this.hugveys.selectedId) {
|
||||
this.updateSelectedHugvey();
|
||||
}
|
||||
break;
|
||||
|
@ -87,13 +89,12 @@ class Panopticon {
|
|||
}
|
||||
|
||||
updateSelectedHugvey() {
|
||||
if(! this.selectedHugvey) {
|
||||
return;
|
||||
}
|
||||
console.log('showNOW', this.selectedHugvey);
|
||||
let hv = this.getHugvey(this.selectedHugvey);
|
||||
if(this.graph.language_code != hv.language) {
|
||||
this.loadNarrative(hv.language);
|
||||
let hv = null;
|
||||
if(this.hugveys.selectedId) {
|
||||
hv = this.getHugvey(this.hugveys.selectedId);
|
||||
if(hv.language && this.graph.language_code != hv.language) {
|
||||
this.loadNarrative(hv.language);
|
||||
}
|
||||
}
|
||||
this.graph.updateHugveyStatus(hv);
|
||||
}
|
||||
|
@ -166,6 +167,14 @@ class Panopticon {
|
|||
change_language( hv_id, lang_code ) {
|
||||
this.send( { action: 'change_language', hugvey: hv_id, lang_code: lang_code } );
|
||||
}
|
||||
|
||||
playFromSelected(msg_id) {
|
||||
if(!this.hugveys.selectedId) {
|
||||
alert('No hugvey selected');
|
||||
} else {
|
||||
this.send({ action: 'play_msg', hugvey: this.hugveys.selectedId, msg_id: msg_id })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
@ -264,6 +273,28 @@ class Graph {
|
|||
showMsg( msg ) {
|
||||
let msgEl = document.getElementById( 'msg' );
|
||||
msgEl.innerHTML = "";
|
||||
|
||||
if(panopticon.hugveys.selectedId) {
|
||||
let playEl = crel(
|
||||
'div',
|
||||
{'class': 'play'},
|
||||
crel(
|
||||
'div', {
|
||||
'class': 'btn btn--play',
|
||||
'on': {
|
||||
'click': function (e) {
|
||||
panopticon.playFromSelected(msg['@id']);
|
||||
}
|
||||
}
|
||||
},
|
||||
"Save & play on #" + panopticon.hugveys.selectedId
|
||||
)
|
||||
);
|
||||
msgEl.appendChild(playEl);
|
||||
}
|
||||
|
||||
|
||||
|
||||
let startAttributes = {
|
||||
'name': msg['@id'] + '-start',
|
||||
'disabled': true,
|
||||
|
@ -359,12 +390,10 @@ class Graph {
|
|||
'class': 'direction ' + (direction['source'] == msg ? 'dir-to' : 'dir-from'),
|
||||
'on': {
|
||||
'mouseover': function(e) {
|
||||
console.log('over', direction['@id']);
|
||||
directionEl.classList.add('dir-highlight');
|
||||
document.getElementById(direction['@id']).classList.add('dir-highlight');
|
||||
},
|
||||
'mouseout': function(e) {
|
||||
console.log('& out ', direction['@id']);
|
||||
directionEl.classList.remove('dir-highlight');
|
||||
document.getElementById(direction['@id']).classList.remove('dir-highlight');
|
||||
}
|
||||
|
@ -752,6 +781,10 @@ class Graph {
|
|||
while(els.length > 0) {
|
||||
els[0].classList.remove('beenHit');
|
||||
}
|
||||
if(!hv || typeof hv['history'] == 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
for(let msg of hv['history']['messages']) {
|
||||
document.getElementById(msg[0]['id']).classList.add('beenHit');
|
||||
}
|
||||
|
|
|
@ -255,7 +255,7 @@ img.icon{
|
|||
position: absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width: 30%;
|
||||
width: 420px;
|
||||
max-height:100%;
|
||||
overflow-y: auto;
|
||||
|
||||
|
@ -265,6 +265,16 @@ img.icon{
|
|||
background:lightgray;
|
||||
}
|
||||
|
||||
h1{
|
||||
margin:0;
|
||||
}
|
||||
|
||||
.play {
|
||||
position:absolute;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.direction{
|
||||
position: relative;
|
||||
h3{
|
||||
|
|
Loading…
Reference in a new issue