afonso/core-extra
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

web app, fleshed out delete sessions, updated sessions dialog to use selection and buttons for joining/deletion

Browse source
This commit is contained in:
Blake J. Harnden 2018-05-18 12:39:45 -07:00
parent aa55daf2e8
commit 98e8e2d627
4 changed files with 63 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
webapp/static/corerest.js
View file

@ -36,6 +36,11 @@ async function putJson(url, data) {
return await sendJson(url, data, 'PUT');
}
async function deleteJson(url, data) {
console.log('DELETE: ', url);
return await sendJson(url, data, 'DELETE');
}
class CoreRest {
constructor() {
this.currentSession = null;
@ -65,6 +70,10 @@ class CoreRest {
return await putJson(`/sessions/${this.currentSession}/state`, {state});
}
async deleteSession(sessionId) {
return await deleteJson(`/sessions/${sessionId}`);
}
async getEmaneModels() {
return await $.getJSON(`/sessions/${this.currentSession}/emane/models`);
}

48
webapp/static/coreui.js
View file

@ -264,30 +264,59 @@ class ServicesModal {
}
class SessionsModal {
constructor(coreRest, coreNetwork, onJoin) {
constructor(coreRest, coreNetwork, onJoin, deleteCurrent) {
this.coreRest = coreRest;
this.coreNetwork = coreNetwork;
this.onJoin = onJoin;
this.deleteCurrent = deleteCurrent;
this.$modal = $('#sessions-modal');
this.$modal.on('shown.bs.modal', this.onShow.bind(this));
this.$table = $('#sessions-table');
this.$table.on('click', 'td', this.onClick.bind(this));
this.$table.on('click', 'tbody tr', this.sessionClick.bind(this));
this.$joinButton = $('#session-join');
this.$joinButton.click(this.joinClicked.bind(this));
this.$deleteButton = $('#session-delete');
this.$deleteButton.click(this.deleteClicked.bind(this));
this.selectedSession = null;
}
async onClick(event) {
const sessionId = $(event.target).parent('tr').data('session');
console.log('clicked session to join: ', sessionId);
if (sessionId === this.coreRest.currentSession) {
async joinClicked() {
console.log('joining session: ', this.selectedSession);
if (this.selectedSession === this.coreRest.currentSession) {
console.log('same session, not changing');
} else {
const session = await this.coreNetwork.joinSession(sessionId);
const session = await this.coreNetwork.joinSession(this.selectedSession);
this.onJoin(session);
this.$modal.modal('hide');
}
this.$modal.modal('hide');
return false;
}
async deleteClicked(event) {
console.log('deleting session: ', this.selectedSession);
await this.coreRest.deleteSession(this.selectedSession);
if (this.selectedSession === this.coreRest.currentSession) {
this.deleteCurrent();
}
this.$modal.modal('hide');
return false;
}
async sessionClick(event) {
this.$table.find('tr').removeClass('table-active');
console.log('event: ', event);
const $row = $(event.currentTarget);
$row.addClass('table-active');
this.selectedSession = $row.data('session');
this.$joinButton.removeAttr('disabled');
this.$deleteButton.removeAttr('disabled');
console.log('selected session: ', this.selectedSession);
}
async onShow() {
console.log('show sessions');
this.$joinButton.attr('disabled', 'disabled');
this.$deleteButton.attr('disabled', 'disabled');
this.$table.find('tbody tr').remove();
const response = await this.coreRest.getSessions();
const sessions = response.sessions;
@ -297,7 +326,8 @@ class SessionsModal {
const $nodeCell = $('<td>', {text: session.nodes});
const stateName = this.coreRest.getStateName(session.state);
const $stateCell = $('<td>', {text: stateName});
const $row = $('<tr>', {class: 'session-join', 'data-session': session.id});
const $row = $('<tr>', {class: 'session-join'});
$row.data('session', session.id);
$row.append([$idCell, $nodeCell, $stateCell]);
this.$table.find('tbody').append($row);
}

22
webapp/templates/index.html
View file

@ -181,7 +181,7 @@
const coreNetwork = new CoreNetwork('core-network', coreRest);
const serviceModal = new ServiceModal(coreRest);
const servicesModal = new ServicesModal(coreRest, coreNetwork, serviceModal);
const sessionsModal = new SessionsModal(coreRest, coreNetwork, joinSession);
const sessionsModal = new SessionsModal(coreRest, coreNetwork, joinSession, initialSetup);
const nodeEditModal = new NodeEditModal(coreNetwork, coreRest);
const nodeContext = new NodeContext(coreNetwork, coreRest, nodeEditModal, servicesModal);
const edgeEditModal = new EdgeEditModal(coreNetwork, coreRest);
@ -189,13 +189,15 @@
const infoPanel = new InfoPanel(coreNetwork);
const configModal = new ConfigModel(coreRest);
coreNetwork.initialSession()
.then(function (session) {
joinSession(session);
})
.catch(function (err) {
console.log('initial session error: ', err);
});
function initialSetup() {
coreNetwork.initialSession()
.then(function (session) {
joinSession(session);
})
.catch(function (err) {
console.log('initial session error: ', err);
});
}
function setRunButton(start) {
console.log('set run button: ', start);
@ -222,6 +224,8 @@
$sessionSaveButton.attr('download', true);
}
initialSetup();
// handle network clicks
coreNetwork.network.on('click', function (properties) {
console.log('click properties: ', properties);
@ -252,7 +256,7 @@
const nodeId = coreNetwork.network.getNodeAt(location);
if (nodeId) {
nodeContext.show(nodeId, x, y)
.catch(function(err) {
.catch(function (err) {
console.log('error showing node context: ', err);
});
} else {

2
webapp/templates/sessions_modal.html
View file

@ -21,6 +21,8 @@
</table>
</div>
<div class="modal-footer">
<button id="session-join" type="button" class="btn btn-primary">Join</button>
<button id="session-delete" type="button" class="btn btn-danger">Delete</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>