Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
375 lines (334 sloc) 18.1 KB
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html' charset='UTF-8' />
<title>MathProg</title>
<style>
html, body {
width: 100%;
height: 100%;
overflow: hidden;
}
#container {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: scroll;
}
table, th,td { font-size: 13px; }
td { width: auto; min-width: 200px; }
td+td { min-width: 50px; width: auto; }
.mathprog, .exercise { visibility: hidden; display: none; }
#container { margin: auto; }
#linkTextArea {height: 80px; width: 490px;}
#content{ clear: left; width: 750; padding-top: 0px; padding-left: 15px; padding-right: 15px; }
#output { font-family: Consolas, Monaco, "Courier New", monospace; font-size: 13px; width: 100%; }
#log { font-family: Consolas, Monaco, "Courier New", monospace; font-size: 13px; width: 100%; }
#instructionContent {width: 100%;}
#instructionContent > h1 { font-size: 20pt; }
#instructionContent > h2 { font-size: 18pt; }
#instructionContent > h3 { font-size: 16pt; }
#instructionContent > h4 { font-size: 14pt; }
#instructionContent > h5 { font-size: 12pt; }
#instructionContent > h6 { font-size: 10pt; }
#instructionContent > blockquote { font-size: 10pt; }
</style>
<script src="libs/jQuery/2.2.3/jquery-2.2.3.min.js"></script>
<script src="libs/jQuery-UI/1.11.4/jquery-ui.min.js"></script>
<link href="libs/jQuery-UI/1.11.4/jquery-ui.css" rel="stylesheet">
<script src="libs/Bootstrap/3.3.4/bootstrap.min.js"></script>
<script src="libs/smartmenus-1.0.0/jquery.smartmenus.min.js"></script>
<script src="libs/smartmenus-1.0.0/addons/bootstrap/jquery.smartmenus.bootstrap.min.js"></script>
<link href="libs/Bootstrap/3.3.4/bootstrap.min.css" rel="stylesheet">
<link href="libs/smartmenus-1.0.0/addons/bootstrap/jquery.smartmenus.bootstrap.css" rel="stylesheet">
<style>
pre {
font-family: Consolas, Monoco, "Courier New";
font-size: 13px;
line-height: 1.45em;
}
</style>
<script src="libs/CodeMirror/5.13.4/codemirror.min.js"></script>
<link href="libs/CodeMirror/5.13.4/codemirror.min.css" rel="stylesheet" >
<script src="libs/CodeMirror/codemirror_mathprog.js"></script>
<style>
.CodeMirror {
font-size: 13px;
font-family: Consolas, Monaco,"Courier New", monospace;
line-height: 1.45em;
width: 100%;
margin: 0px;
border: solid 1px;
}
</style>
<!--<script src="libs/Marked/0.3.5/marked.min.js"></script> -->
<script src="libs/markdown-it/6.0.1/markdown-it.min.js"></script>
<link href="libs/KaTeX/0.5.1/katex.min.css" rel="stylesheet" >
<script src="libs/KaTeX/0.5.1/katex.min.js"></script>
<script src="libs/KaTeX/0.5.1/auto-render.min.js"></script>
<script src="libs/filepicker.js"></script>
<script src="libs/jsapi.js"></script>
<script src='libs/glpk.min.js'></script>
</head>
<body>
<!-- modal About... -->
<div id="modalAbout" class="modal" role="dialog">
<div class="modal-dialog">
<div class="model-content" style="background: #fff; border-radius:20px;">
<div class="modal-header" style="padding-top: 10px;">
<h3>About ...</h3>
</div>
<div class="modal-body">
<p>
<b>MathProg Solver</b> is a Chrome application for linear and discrete optimization
in GNU MathProg, the modeling language of the open source GLPK project.
The syntax is similar to <a href = "http://www.ampl.com/" target = '_blank'>AMPL</a>.
Calculations are performed in the App using the glpk.js solver.
</p>
<p>
The application uses code from a number of open source projects including
</p>
<ul>
<li> <a href = 'http://www.gnu.org/software/glpk/' target = '_blank'>GNU GLPK project</a></li>
<li> <a href = 'https://github.com/hgourvest/glpk.js' target = '_blank'>glpk.js</a></li>
<li> <a href = 'http://jquery.com/' target = '_blank'>jQuery</a></li>
<li> <a href = 'http://twitter.github.com/bootstrap/' target = '_blank'>Bootstrap</a></li>
<li> <a href = 'https://khan.github.io/KaTeX/' target = '_blank'>KaTeX</a></li>
</ul>
<p>
See the <a href = "https://github.com/jckantor/MathProg-Solver" target="_blank">MathProg
Solver Github repository</a> for additional documentation and complete source code.
</p>
</div>
<div class="modal-footer">
<button class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- modal Confirm Clear All -->
<div id="modalConfirmClearAll" class="modal" role="dialog">
<dif class="modal-dialog">
<div class="modal-content" style="width: 75%; background: #fff; border-radius:20px;">
<div class="modal-header" style="padding-top: 10px;">
<h3>You have unsaved changes ...</h3>
</div>
<div class="modal-body">
<p>
Confirm you wish to clear the editor and lose unsaved changes.
</p>
</div>
<div class="modal-footer">
<button id='btnModalConfirmClearAll' class="btn" data-dismiss="modal" style='margin-right:100px;'>Do Not Save Changes</button>
<button class="btn btn-primary" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
<!-- container -->
<div id='container'>
<!-- Navigation Menu Bar -->
<nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
<div class="container-fluid" style="background:#003b7b;">
<div class="navbar-header">
<a class="navbar-brand" href="#" style="color:#ffffff;">MathProg Solver</a>
</div>
<!-- Models menu -->
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" style="background: #003b7b; color: #dddddd;">Model <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#" id="menuNew">New</a></li>
<li><a href="#" id="menuOpen">Open ...</a></li>
<li><a href="#" id="menuSave">Save</a></li>
<li><a href="#" id="menuSaveAs">Save As ...</a></li>
</ul>
</li>
</ul>
<!-- Examples menu -->
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" style="background:#003b7b;color: #dddddd;">Examples <span class="caret"></span></a>
<ul class="dropdown-menu">
<li class="dropdown-submenu">
<a href="#">MathProg Basics <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="HelloWorld">Hello, World</a></li>
<li><a href='#' class="example" id="lpTwoVars">Linear Program in Two Variables</a></li>
<li><a href='#' class="example" id="linearEqns">Linear Equations</a></li>
<li><a href='#' class="example" id="Sets">Sets</a></li>
<li><a href='#' class="example" id="Parameters">Parameters</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href="#">Tables and Charts <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="ChartTools">Google Charts</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Mixture Problems <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="giapetto">Giapetto's Workshop</a></li>
<li><a href='#' class="example" id="change">Making Change</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Scheduling <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="ProjectCPM">Project Management with CPM</a></li>
<li><a href='#' class="example" id="Bottleneck">Machine Bottleneck</a></li>
<li><a href='#' class="example" id="JobShop">Job Shop Scheduling</a></li>
<li><a href='#' class="example" id="TaskOrder">Linear Ordering of Tasks</a></li>
<li><a href='#' class="example" id="JesuitVols">Jesuit Volunteers Corps</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Transportation/Assignment <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="TransportNet">Transportation Network</a></li>
<li><a href='#' class="example" id="StockCutting">Stock Cutting</a></li>
<li><a href='#' class="example" id="TableSeating">Table Seating</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Route Optimization <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="tsptw">Traveling Salesman with Time Windows</a></li>
<li><a href='#' class="example" id="vrp">Vehicle Routing</a></li>
<li><a href='#' class="example" id="vrptw">Vehicle Routing with Time Windows</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Stochastic Programming <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="Newsvendor">Newsvendor Problem</a></li>
<li><a href='#' class="example" id="PlantExpansion">Scenario Analysis for a Plant Expansion</a></li>
<li><a href='#' class="example" id="RNGambling">Stochastic Dynamic Programming: Risk Neutral Gambler</a></li>
<li><a href='#' class="example" id="RAGambling">Stochastic Dynamic Programming: Risk Averse Gambler</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href='#'>Engineering <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="DataReconciliation">Data Reconciliation</a></li>
<li><a href='#' class="example" id="Solvay">Generation/Consumption Analysis</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Finance <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="retirement">Saving for Retirement</a></li>
<li><a href='#' class="example" id="PortfolioMAD">Portfolio Optimization (MAD)</a></li>
<li><a href='#' class="example" id="AmericanCall">American Call Option</a></li>
<li><a href='#' class="example" id="AmericanPut">American Put Option</a></li>
<li><a href='#' class="example" id="EuropeanCall">European Call Option</a></li>
<li><a href='#' class="example" id="EuropeanPut">European Put Option</a></li>
<li><a href='#' class="example" id="PoliticalArb">Arbitrage in Political Markets</a></li>
<li><a href='#' class="example" id="RiskNeutralAI">Risk Neutral Probabilities for American Idol</a></li>
</ul>
</li>
<li class="dropdown-submenu">
<a href = '#'>Advanced Techniques <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href='#' class="example" id="MVNormal">Sampling a Multivariate Normal Distribution</a></li>
<li><a href='#' class="example" id="PiecewiseLinearInterpolation">Piecewise Linear Interpolation</a></li>
<li><a href='#' class="example" id="Sorting">Sorting</a></li>
</ul>
</li>
</ul>
</li>
</ul>
<!-- MathProg Resources menu -->
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" style="color: #dddddd;">Resources <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a rel="external" href = 'https://github.com/jckantor/MathProg-Solver/blob/master/libs/glpk-4.60/doc/gmpl.pdf'>GNU MathProg Reference</a></li>
<li><a rel="external" href = 'http://en.wikibooks.org/wiki/GLPK/GMPL_(MathProg)'>MathProg Wikibook</a></li>
<li><a rel="external" href = 'http://www.ampl.com/BOOK/download.html'>AMPL Book</a></li>
<li><a rel="external" href = 'http://iuuk.mff.cuni.cz/~bohm/texts/mathprog_intro.html'>MathProg in 60</a></li>
</ul>
</li>
</ul>
<!-- About... menu -->
<ul class="nav navbar-nav">
<li class="active">
<a id='menuAbout' href="#" style="background: #003b7b; color: #dddddd;">About...</a>
</li>
</ul>
</div> <!-- /.navbar-inner -->
</nav> <!-- /.navbar-->
<div id='content' style="padding-top: 40px;">
<!-- Instruction -->
<div id='instructionContent' style="padding-top: 40px;"></div>
<br>
<!-- Model Editor -->
<h4 id='modelFileName'></h4>
<textarea id='editor'></textarea><br>
<!-- Button Bar -->
<div id='btnBar' style='width:100%;margin-top:-5px;'>
<div class="btn-group" style="float:left;">
<button class="btn" id='btnNewModel' title='Clear description, model, and output.'>New Model</button>
<button class="btn" id='btnOpenModel' title='Open model from file.'>Open Model...</button>
<button class="btn" id='btnSaveModel' title='Save model to file.'>Save Model...</button>
</div>
<button class="btn btn-success" id='btnSolveModel' style='float: right;' title='Compute a solution to the model.'>Solve</button>
</div>
<br>
<!-- Message Panel -->
<div id="messagePanel" style="min-height:38px;">
<div id="message" class="alert" style="margin-top: 18px; margin-right: 0px;"></div>
</div>
<!-- Output Tabs -->
<div class="tabbable" style="width: 100%; margin-top:0px; margin-bottom:0px;">
<ul class="nav nav-tabs">
<li class="active"><a href="#tab1" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Dashboard</h4></a></li>
<li><a href="#outputTab" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Output</h4></a></li>
<li><a href="#dataTab" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Data</h4></a></li>
<li><a href="#variableTab" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Variables</h4></a></li>
<li><a href="#constraintTab" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Constraints</h4></a></li>
<li><a href="#tab5" data-toggle="tab"><h4 style="margin-top:3px; margin-bottom:3px;">Log</h4></a></li>
</ul>
<div class="tab-content">
<!-- Dashboard Pane -->
<div class="tab-pane active" id="tab1">
<div id='dashboardPanel' style="min-height: 380px;">
<table id='dashboardTable' class="table table-condensed table-bordered table-hover" style="width: 100%">
<tr><td>Problem Type</td><td id="dashboardProb" class="dashboardCell"></td></tr>
<tr><td>Objective</td><td id="dashboardObj" class="dashboardCell"></td></tr>
<tr><td>Objective Value</td><td id="dashboardObjVal" class="dashboardCell"></td></tr>
<tr><td>Continuous Variables</td><td id="dashboardNvars" class="dashboardCell"></td></tr>
<tr><td>Non-binary Integer Variables</td><td id="dashboardNints" class="dashboardCell"></td></tr>
<tr><td>Binary Variables</td><td id="dashboardNbins" class="dashboardCell"></td></tr>
<tr><td>Number of Variables</td><td id="dashboardNcols" class="dashboardCell"></td></tr>
<tr><td>Number of Constraints</td><td id="dashboardNrows" class="dashboardCell"></td></tr>
<tr><td>Number of Nonzero Coefficients</td><td id="dashboardNnz" class="dashboardCell"></td></tr>
</table>
</div>
</div>
<!-- Model Output Pane -->
<div class="tab-pane" id="outputTab" style="min-height: 380px;"></div>
<!-- Data Sources Pane -->
<div class="tab-pane" id="dataTab" style="min-height: 380px;"></div>
<!-- Variables Pane -->
<div class="tab-pane" id="variableTab" style="min-height: 380px; width: 100%;">
<table class="table table-striped table-condensed" id="variableTableDiv"></table>
</div>
<!-- Constraints Pane -->
<div class="tab-pane" id="constraintTab" style="min-height: 380px; width: 100%;">
<table class="table table-striped table-condensed" id="constraintTableDiv"></table>
</div>
<!-- GLPK Log Pane-->
<div class="tab-pane" id="tab5" style="min-height: 380px;">
<pre id='logContent' style="width: 730px;min-height: 200px;"></pre><br>
</div>
</div> <!-- end of tab-content -->
</div> <!-- end of tabtable -->
</div> <!-- end of content -->
</div> <!-- end of container -->
<script src="js/main.js"></script>
</body>
</html>