Skip to content

Commit

Permalink
Merge pull request boknows#17 from alistair-marshall/save-simulations
Browse files Browse the repository at this point in the history 
Save simulations
  • Loading branch information
@alistair-marshall
alistair-marshall authored Apr 3, 2020
2 parents a02beb5 + 72766d5 commit eaa07f2
Show file tree
Hide file tree
Showing 3 changed files with 163 additions and 119 deletions.
31 changes: 0 additions & 31 deletions getData.php
View file

This file was deleted.

120 changes: 115 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,98 @@
.ot_banner_output a {
color: #23568f;
}

/**
* Reset button styles
* It takes some work to achieve a “blank slate” look.
*/
button {
padding: 0;
border: none;
font: inherit;
color: inherit;
background-color: transparent;
/* show a hand cursor on hover; some argue that we
should keep the default arrow cursor for buttons */
cursor: pointer;
}

/**
* Button component
*/
input[type=button], .custom-file-upload{
/* default for <button>, but needed for <a> */
display: inline-block;
text-align: center;
text-decoration: none;
font-size: 0.8rem;

/* create a small space when buttons wrap on 2 lines */
margin: 2px 0;

/* invisible border (will be colored on hover/focus) */
border: solid 1px currentColor; /*transparent;*/
border-radius: 4px;

/* button size comes from text + padding, avoid height */
padding: 0.5em 1em;

/* make sure colors have enough contrast! */
color: #666;
background-color: #FFFFFF;
}

/* old-school "down" effect on clic + color tweak */
input[type=button]:active, .custom-file-upload:active {
transform: translateY(1px);
filter: saturate(150%);
}

/* inverse colors on hover */
input[type=button]:hover, .custom-file-upload:hover {
color: #FFFFFF;
border-color: transparent;
background-color: #999;
}

/* gray out disabled buttons*/
input[type=button]:disabled{
color: #666;
background-color: #ccc;
border-color: currentColor
}

/* Firefox: remove the inner border shown on focus */
input[type=button]::-moz-focus-inner {
border: none;
}

/* make sure we have a visible focus ring */
input[type=button]:focus, .custom-file-upload:focus {
outline: none;
box-shadow: 0 0 0 1px #eb989b,
0 0 0 1px #eb989b;
border-color: #ec1d24;
}

/* hide focus style if not from keyboard navigation */
.js-focus-visible input[type=button]:focus:not(.focus-visible),
.js-focus-visible .custom-file-upload:focus:not(.focus-visible) {
box-shadow: none;
}

input.highlight {
color: #ec1d24;
}

input.highlight:hover {
background-color: #ec1d24;
}

input[type="file"] {
display: none;
}

</style>
<script src='https://code.jquery.com/jquery-1.11.3.min.js' language='Javascript' type='text/javascript'></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dygraph/2.1.0/dygraph.min.js"></script>
Expand Down Expand Up @@ -127,10 +219,7 @@ <h1 class="text-center">The Crowdsourced FIRE Simulator (cFIREsim) - Open Source
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><button type="button" class="btn btn-default navbar-btn" id="saveSimBtn">Save Simulation Inputs</button></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Load Saved Sim <span class="caret"></span></a>
<ul class="dropdown-menu" id="savedSimsDropdown"></ul>
</li>;
<li><button type="button" class="btn btn-default navbar-btn" id="loadSimBtn">Load Saved Sim</button></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
Expand Down Expand Up @@ -1444,7 +1533,7 @@ <h4 class="modal-title">Save Simulation Inputs</h4>
<div class="modal-body">
<div class="input-group">
<span class='input-group-addon'>Saved Simulation Name:</span><input type='text' size='12' class='form-control' id='simNameInput'>
</div>
</div><br>
<button type="button" class="btn btn-success" id="confirmSaveSim">Save Sim</button>
</div>
<div class="modal-footer">
Expand All @@ -1453,6 +1542,27 @@ <h4 class="modal-title">Save Simulation Inputs</h4>
</div>
</div>
</div> <!-- End Save Sim Modal -->
<!-- Load Sim Modal -->
<div class="modal fade" id="loadSimPopup" tabindex="" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Load Simulation Inputs</h4>
</div>
<div class="modal-body">
<div class="input-group">
<label for="file" clas="custom-file-upload">Select File</label>
<input id="file" type="file" accept=".FIREsim"/>
</div><br>
<button type="button" class="btn btn-success" id="confirmLoadSim">Load Sim</button>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div> <!-- End Save Sim Modal -->

<div id="saveSimSuccess" style="display:none" class="popup small">
<p>Your simulation was successfully saved</p>
Expand Down
131 changes: 48 additions & 83 deletions js/cFIREsimOpen.js
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,22 @@
function download(filename, content) {
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(new Blob([content], {
type: 'text/json;charset=utf-8;'
}), filename);
} else {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/json;charset=utf-8,' + encodeURIComponent(content));
element.setAttribute('download', filename);

element.style.display = 'none';
document.body.appendChild(element);

element.click();

document.body.removeChild(element);
}
}

$(document).ready(function() {

//Full-screen modals
Expand All @@ -22,29 +41,33 @@ $(document).ready(function() {
}
});

//Populate Saved Sims dropdown if user is logged in
if ($("#username").html() != undefined) {
Simulation.getQueries();

//Open the Save Sim input field containing simName input and submit/cancel buttons
$('#saveSimBtn').click(function(e) {
$('#saveSimPopup').modal('show');
});
//Open the Save Sim input field containing simName input and submit/cancel buttons
$('#saveSimBtn').click(function(e) {
$('#saveSimPopup').modal('show');
});

//When Saved Sim is submitted, save to DB
$('#confirmSaveSim').click(function(e) {
e.stopImmediatePropagation();
Simulation.saveSim($("#username").html());
});
//When Saved Sim is submitted, save to file
$('#confirmSaveSim').click(function(e) {
e.stopImmediatePropagation();
Simulation.saveSim();
});

//Close Save Sim success popup
$('#closeSaveSuccess').click(function(e) {
$('#saveSimSuccess').hide();
});
}
//Open the Load Sim input field containing file input and submit/cancel buttons
$('#loadSimBtn').click(function(e) {
$('#loadSimPopup').modal('show');
});

$("#signInBtn").click(function() {
window.location.href = "../phpBB3/login.php";
//When Load Sim is submitted, load data from file
$('#confirmLoadSim').click(function(e) {
e.stopImmediatePropagation();
f = $('#file').prop('files')[0];
var reader = new FileReader();
reader.onload = function(e){
var data = e.target.result;
console.log(data)
Simulation.loadSavedSim(data);
}
reader.readAsText(f);
});

});
Expand All @@ -53,50 +76,6 @@ var Simulation = {
sim: [],
tabs: 0,
g: [], //dygraph object
getQueries: function() {
var username = $("#username").html();
$.ajax({
url: "getData.php",
type: "POST",
dataType: 'JSON',
data: {
param: "getNames",
username: username,
},
}).success(function(data) {
var html = "";
for (var i = 0; i < data.qid.length; i++) {
html += "<li><a href='#' id='" + data.qid[i] + "' class='savedSim'>ID:" + data.qid[i] + " - " + data.simName[i] + "</a></li>"
}
$("#savedSimsDropdown").html(html);
$('.dropdown-menu a').click(function() {
var id = $(this).attr('id');
Simulation.getSavedSim(id);
});
});
},
getSavedSim: function(qid) {
$.ajax({
url: "getData.php",
type: "POST",
dataType: "JSON",
data: {
param: "getSavedSim",
qid: qid,
}
}).success(function(data) {
if (data == null) {
var html = "<p>Could not load ID:" + Simulation.getUrlVars(['id']) + ". There is no data for that ID.</p>";
$("#loadedSimFailText").html(html);
$("#loadedSimFail").show();
} else {
Simulation.loadSavedSim(data.data);
var html = "<p>Successfully loaded ID#" + data.qid + " - '" + data.simName + "'</p>";
$("#loadedSimHeaderText").html(html);
$("#loadedSimHeader").show();
}
});
},
loadSavedSim: function(data) {
//Load in angular scope from outside the controller
var scope = angular.element($("#input")).scope();
Expand All @@ -106,30 +85,16 @@ var Simulation = {
scope.refreshDataForm();
scope.refreshSpendingForm();
scope.refreshInvestigateForm();
scope.refreshConstantAllocationOptions();
scope.refreshRebalanceAnnuallyOptions();
$('#loadSimPopup').modal('hide');
});
},
saveSim: function(username) {
saveSim: function() {
var scope = angular.element($("#input")).scope();
scope.$apply(function() {
var json_savedSim = JSON.stringify(scope.data, null, 2);
$.ajax({
url: "getData.php",
type: "POST",
dataType: 'JSON',
data: {
param: "saveSim",
json: json_savedSim,
username: username,
simName: $('#simNameInput').val(),
},
}).success(function() {
$('#saveSimPopup').modal('hide');
console.log("Save Success!");
$('#saveSimSuccess').fadeIn(300, "linear");
Simulation.getQueries();
});
download($('#simNameInput').val()+'.FIREsim',json_savedSim)
$('#saveSimPopup').modal('hide');
});
},
runSimulation: function(form) {
Expand Down Expand Up @@ -764,7 +729,7 @@ var Simulation = {
/*
//Random number generator for supplying a CSV of only 1 random cycle. Disabled for debugging purposes.
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min)) + min;
return Math.floor(Math.random() * (max - min)) + min;
}
var num = getRandomInt(0, results.length);
*/
Expand Down

0 comments on commit eaa07f2

Please sign in to comment.