Skip to content

Commit

Permalink
Merge pull request #1118 from StochSS/presentation-system
Browse files Browse the repository at this point in the history
Presentation System
  • Loading branch information
seanebum authored Jul 23, 2021
2 parents 9faea53 + 9c1f29d commit ce40208
Show file tree
Hide file tree
Showing 40 changed files with 1,863 additions and 255 deletions.
39 changes: 39 additions & 0 deletions client/modals.js
Original file line number Diff line number Diff line change
Expand Up @@ -223,6 +223,40 @@ let templates = {
</div>
</div>
</div>`
},
presentationLinks : (modalID, title, name, headers, links) => {
return `
<div id=${modalID} class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content info">
<div class="modal-header">
<h5 class="modal-title"> ${title} </h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<h4><u>${headers[0]}</u></h4>
<div>
<a href="${links.presentation}" target="_blank"> View ${name} Presentation</a>
</div>
<hr>
<h4><u>${headers[1]}</u></h4>
<div>
<a href="${links.download}"> Download ${name} Presentation</a>
</div>
<hr>
<h4><u>${headers[2]}</u></h4>
<div>
<a href="${links.open}" target="_blank"> Open ${name} Presentation</a>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary box-shadow close-btn" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>`
}
}

Expand Down Expand Up @@ -541,5 +575,10 @@ module.exports = {
</div>
</div>
</div>`
},
presentationLinks : (title, name, headers, links) => {
let modalID = "presentationLinksModal"

return templates.presentationLinks(modalID, title, name, headers, links);
}
}
35 changes: 34 additions & 1 deletion client/pages/file-browser.js
Original file line number Diff line number Diff line change
Expand Up @@ -898,6 +898,22 @@ let FileBrowser = PageView.extend({
});
});
},
publishNotebookPresentation: function (o) {
let queryStr = "?path=" + o.original._path;
let endpoint = path.join(app.getApiPath(), "notebook/presentation") + queryStr;
app.getXHR(endpoint, {
success: function (err, response, body) {
let title = body.message;
let linkHeaders = ["Presentation Link", "Download Link", "Open Link"];
let links = body.links;
let name = o.original._path.split('/').pop().split('.ipynb')[0];
$(modals.presentationLinks(title, name, linkHeaders, links)).modal();
},
error: function (err, response, body) {
$(modals.newProjectModelErrorHtml(body.Reason, body.Message)).modal();
}
});
},
setupJstree: function () {
var self = this;
$.jstree.defaults.contextmenu.items = (o, cb) => {
Expand Down Expand Up @@ -1314,6 +1330,17 @@ let FileBrowser = PageView.extend({
}
}
}
let notebook = {
"publish" : {
"label" : "Publish",
"_disabled" : false,
"separator_before" : false,
"separator_after" : false,
"action" : function (data) {
self.publishNotebookPresentation(o);
}
}
}
if (o.type === 'root'){
return folder
}
Expand Down Expand Up @@ -1341,7 +1368,13 @@ let FileBrowser = PageView.extend({
if (o.text.endsWith(".zip")) {
return $.extend(open, extractAll, common)
}
if (o.type === 'notebook' || o.type === "other") {
if (o.type === 'notebook') {
if(app.getBasePath() === "/") {
return $.extend(open, common)
}
return $.extend(open, notebook, common)
}
if (o.type === 'other') {
return $.extend(open, common)
}
if (o.type === 'sbml-model') {
Expand Down
95 changes: 95 additions & 0 deletions client/pages/job-presentation.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
/*
StochSS is a platform for simulating biochemical systems
Copyright (C) 2019-2021 StochSS developers.
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

let $ = require('jquery');
let path = require('path');
let domReady = require('domready');
let bootstrap = require('bootstrap');
//support files
let app = require("../app");
//models
let Job = require("../models/job");
//views
let PageView = require('./base');
let ModelView = require('../views/model-viewer');
let ResultsView = require('../views/workflow-results');
let SettingsView = require('../views/settings-viewer');
//templates
let template = require('../templates/pages/jobPresentation.pug');

import bootstrapStyles from '../styles/bootstrap.css';
import styles from '../styles/styles.css';
import fontawesomeStyles from '@fortawesome/fontawesome-free/css/svg-with-js.min.css'

let JobPresentationPage = PageView.extend({
template: template,
initialize: function () {
PageView.prototype.initialize.apply(this, arguments);
console.log("TODO: get the path to the job from the url")
// let urlParams = new URLSearchParams(window.location.search)
// this.model = new Job({
// directory: urlParams.get("path")
// });
console.log("TODO: get job from file system using the app.getXHR function")
// let self = this;
// let queryStr = "?path=" + this.model.directory;
// let endpoint = path.join();
// app.getXHR(endpoint, {
// success: function (err, response, body) {
// self.model.set(body);
// self.model.type = body.titleType;
// self.renderSubviews();
// }
// });
console.log("TODO: generate the open link and store in this.open")
},
renderSubviews: function () {
PageView.prototype.render.apply(this, arguments);
this.renderResultsContainer();
this.renderSettingsContainer();
this.renderModelContainer();
},
renderModelContainer: function () {
let modelView = new ModelView({
model: this.model.model,
mode: "presentation"
});
app.registerRenderSubview(this, modelView, "job-model");
},
renderResultsContainer: function () {
let resultsView = new ResultsView({
model: this.model,
mode: "presentation"
});
app.registerRenderSubview(this, resultsView, "job-results");
},
renderSettingsContainer: function () {
let settingsView = new SettingsView({
model: this.model.settings,
mode: "presentation"
});
app.registerRenderSubview(this, settingsView, "job-settings");
}
});

domReady(() => {
let p = new JobPresentationPage({
el: document.body
});
p.render();
});
79 changes: 79 additions & 0 deletions client/pages/model-presentation.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
/*
StochSS is a platform for simulating biochemical systems
Copyright (C) 2019-2021 StochSS developers.
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

let $ = require('jquery');
let path = require('path');
let domReady = require('domready');
let bootstrap = require('bootstrap');
//support files
let app = require('../app');
//models
let Model = require('../models/model');
//views
let PageView = require('./base');
let ModelView = require('../model-view/model-view');
//templates
let template = require('../templates/pages/modelPresentation.pug');

import bootstrapStyles from '../styles/bootstrap.css';
import styles from '../styles/styles.css';
import fontawesomeStyles from '@fortawesome/fontawesome-free/css/svg-with-js.min.css'

let ModelPresentationPage = PageView.extend({
template: template,
initialize: function (attrs, options) {
PageView.prototype.initialize.apply(this, arguments);
let urlParams = new URLSearchParams(window.location.search);
let owner = urlParams.get("owner");
let file = urlParams.get("file");
this.model = new Model({
directory: file,
for: "presentation"
});
let self = this;
let queryStr = "?file=" + this.model.directory + "&owner=" + owner;
let endpoint = "api/file/json-data" + queryStr;
app.getXHR(endpoint, {
success: function (err, response, body) {
self.model.set(body);
self.renderSubviews();
}
});
let downloadStart = "https://live.stochss.org/stochss/download_presentation";
this.downloadLink = downloadStart + "/" + owner + "/" + file;
this.openLink = "https://open.stochss.org?open=" + this.downloadLink;
},
renderSubviews: function () {
PageView.prototype.render.apply(this, arguments);
this.renderModelView();
},
renderModelView: function () {
let modelView = ModelView({
model: this.model,
readOnly: true
});
app.registerRenderSubview(this, modelView, "model-view");
}
});

domReady(() => {
let p = new ModelPresentationPage({
el: document.body
});
p.render();
});
75 changes: 75 additions & 0 deletions client/pages/notebook-presentation.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
/*
StochSS is a platform for simulating biochemical systems
Copyright (C) 2019-2021 StochSS developers.
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

let $ = require('jquery');
let path = require('path');
let domReady = require('domready');
let bootstrap = require('bootstrap');
//support files
let app = require('../app');
//views
let PageView = require('./base');
//templates
let template = require('../templates/pages/notebookPresentation.pug');

import bootstrapStyles from '../styles/bootstrap.css';
import styles from '../styles/styles.css';
import fontawesomeStyles from '@fortawesome/fontawesome-free/css/svg-with-js.min.css'

let NotebookPresentationPage = PageView.extend({
template: template,
initialize: function (attrs, options) {
PageView.prototype.initialize.apply(this, arguments);
let urlParams = new URLSearchParams(window.location.search);
let owner = urlParams.get("owner");
let file = urlParams.get("file");
let self = this;
let queryStr = "?owner=" + owner + "&file=" + file;
let endpoint = "api/notebook/load" + queryStr;
app.getXHR(endpoint, {
success: function (err, response, body) {
self.name = body.file.split('/').pop().split('.ipynb')[0];
self.renderSubviews(body.html);
}
});
let downloadStart = "https://live.stochss.org/stochss/notebook/download_presentation";
this.downloadLink = downloadStart + "/" + owner + "/" + file;
this.openLink = "https://open.stochss.org?open=" + this.downloadLink;
},
renderSubviews: function (html) {
PageView.prototype.render.apply(this, arguments);
let iframe = document.getElementById('notebook');
let iframedoc = iframe.document;
if (iframe.contentDocument) {
iframedoc = iframe.contentDocument;
}else if (iframe.contentWindow) {
iframedoc = iframe.contentWindow.document;
}
if (iframedoc) {
iframedoc.write(html);
iframedoc.close();
}
}
});

domReady(() => {
let p = new NotebookPresentationPage({
el: document.body
});
p.render();
});
12 changes: 12 additions & 0 deletions client/styles/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -553,6 +553,13 @@ span.checkbox {
border-radius: 1.5rem;
}

.register-stochss-btn {
padding: 1.5rem 1.5rem;
font-size: 1.75rem;
line-height: 1;
border-radius: 1.5rem;
}

.user-home-btn {
padding: 1rem 1rem;
font-size: 1.5rem;
Expand Down Expand Up @@ -705,3 +712,8 @@ span.checkbox {
.card-header {
background-color: rgba(0, 0, 0, 0.1);
}

.presentation-header {
margin-top: 64px;
padding: 20px 16px;
}
Loading

0 comments on commit ce40208

Please sign in to comment.