joe/OptiTrainer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

some cosmetics and usability in progress...

Browse Source
This commit is contained in:
Joe Tretter
2020-03-10 21:46:30 -05:00
parent 34ff5ec68f
commit 7300f999f4
4 changed files with 85 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
js/optiTrainer.js
View File

@@ -1,5 +1,6 @@
var costAmount=0;
var allCombinations;
var optionChainContext={};
$(document).ready(_=>{
dta=fakeDta;
@@ -55,8 +56,14 @@ let dta={};
let datesOut=(dateInp)=>{
let date=dateInp.split(':')[0];
let days=dateInp.split(':')[1];
return `<li><a href="#" onclick="fillChainTable('${dateInp}')">${date}<br><center>(DTE: ${days})</center></a></li>`
let dte=dateInp.split(':')[1];
let attrActive="";
if (optionChainContext.selectedDte === dte) {
attrActive="active";
//fillChainTable(dateInp,date);
}
return `<li class="nav-item ${attrActive}"><a href="#" id="TAB_${date}" role="tab" class="nav-link" onclick="fillChainTable('${dateInp}','${dte}')">${date}<br><center>(DTE: ${dte})</center></a></li>`
}
let getCallArtifact=(callData,allColumns)=>{
@@ -127,11 +134,18 @@ let clearChainTable=()=>{
}
}
let fillChainTable=(expirationDate)=>{
let fillChainTable=(expirationDate,dteOnly)=>{
// Maintain Active Tab
$(".nav a").on("click", function(){
$(".nav").find(".active").removeClass("active");
$(this).parent().addClass("active");
});
clearChainTable();
optionChainContext.selectedDte=dteOnly;
let allCalls=dta.callExpDateMap[expirationDate];
let allPuts=dta.putExpDateMap[expirationDate];
console.log(expirationDate,allCalls,allPuts);
//console.log(expirationDate,allCalls,allPuts);
let allStrikes=Object.keys(allCalls);
for (let i=0;i<allStrikes.length;i++){
@@ -140,43 +154,43 @@ let fillChainTable=(expirationDate)=>{
let singleStrikePut=allPuts[theStrike][0];
let rowData={strike:theStrike,call:singleStrikeCall,put:singleStrikePut}
fillChainRow(rowData);
}
}
}
let displayOptionChain=()=>{
let app=window.document.getElementById('app');
$("#wrapperOptionChain").remove();
let newNode=document.createElement("div");
newNode.setAttribute("id","wrapperOptionChain");
newNode.innerHTML=`
<div class="container-fluid " id="frmOptionChainMain">
<div class="col-md-12">
<div class="tabbable">
<h1>${dta.symbol}</h1>
<hr>
<ul class="nav nav-tabs">
${Object.keys(dta.callExpDateMap).map(datesOut).join('')}
</ul
</div>
</div>
<div class="col-md-12">
<table id='tblOptionChain' class="table table-sm table-hover">
<thead>
<tr>
<th colspan="4" class='center'>CALLS</th><th></th><th colspan="4" class='center'>PUTS</th>
</tr>
<tr>
<th class='ralign'>Delta</th><th class='ralign'>Theta</th><th class='ralign'>Bid</th><th class='ralign'>Ask</th><th class='center'>Strike</th><th class='ralign'>Delta</th><th class='ralign'>Theta</th><th class='ralign'>Bid</th><th class='ralign'>Ask</th>
</tr>
</thead>
<tbody>
<tr><!-- Dummy row --></tr>
</tbody>
</table>
</div>
</div>
`;
let app=window.document.getElementById('app');
$("#wrapperOptionChain").remove();
let newNode=document.createElement("div");
newNode.setAttribute("id","wrapperOptionChain");
newNode.innerHTML=`
<div class="container-fluid " id="frmOptionChainMain">
<div class="col-md-12">
<ul class="nav nav-tabs">
${Object.keys(dta.callExpDateMap).map(datesOut).join('')}
</ul>
</div>
<div class="col-md-12">
<table id='tblOptionChain' class="table table-sm table-hover">
<thead>
<tr>
<th colspan="4" class='center'>CALLS</th><th></th><th colspan="4" class='center'>PUTS</th>
</tr>
<tr>
<th class='ralign'>Delta</th><th class='ralign'>Theta</th><th class='ralign'>Bid</th><th class='ralign'>Ask</th><th class='center'>Strike</th><th class='ralign'>Delta</th><th class='ralign'>Theta</th><th class='ralign'>Bid</th><th class='ralign'>Ask</th>
</tr>
</thead>
<tbody>
<tr><!-- Dummy row --></tr>
</tbody>
</table>
</div>
</div>
`;
app.appendChild(newNode)
app.appendChild(newNode)
// "click" the date if it's the context dte
if ($(".nav").find(".active").children().length > 0){
$(".nav").find(".active").children()[0].click();
}
}