Skip to content

Commit 1ade91c

Browse files
jimmyt857jimmyt857
committed
Add rotations tab
Also removes hasted rotations tab.
1 parent bc8867e commit 1ade91c

File tree

3 files changed

+109
-121
lines changed

3 files changed

+109
-121
lines changed

‎ui/index.html

Lines changed: 49 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ <h4>Standard Elemental Build</h4>
167167
<div id="calcdiv" style="height: calc(50% - 100px)">
168168
<ul id="calctabs" uk-tab="connect: #calcs">
169169
<li class="uk-active"><a href="#">Sim</a></li>
170-
<li><a href="#">Hasted Rotations</a></li>
170+
<li><a href="#">Rotations</a></li>
171171
<li><a href="#">Gear & Stat Weights</a></li>
172172
<li><a href="#">Sim Logs</a></li>
173173
</ul>
@@ -177,11 +177,11 @@ <h4>Standard Elemental Build</h4>
177177
Iterations: <input id="iters" type="text" value="1000" style="width: 60px"></input>
178178
Duration: <input id="dur" type="text" value="300" style="width: 60px"></input>
179179
# Cl Targets:
180-
<select id="numClTargets" class="buffdrop" style="width: 50px" value="1">
181-
<option class="buffdrop" selected>1</option>
182-
<option class="buffdrop">2</option>
183-
<option class="buffdrop">3</option>
184-
</select>
180+
<select id="numClTargets" class="buffdrop" style="width: 50px" value="1">
181+
<option class="buffdrop" selected>1</option>
182+
<option class="buffdrop">2</option>
183+
<option class="buffdrop">3</option>
184+
</select>
185185
<button id="simrunbut">Run Simulation</button>
186186
</div>
187187
<div id="simout" style="width: 99%;height: calc(100% - 40px);border:1px solid black;margin-top: 10px;">
@@ -192,48 +192,56 @@ <h4>Standard Elemental Build</h4>
192192
</div>
193193
<div id="rotout" style="float: left;width: calc(100% - 130px);height: 100%;">
194194
<div id="rotstats" style="height: 30px;width: 100%;border-bottom: 1px solid black;"></div>
195-
<div id="rotchart">
196-
</div>
195+
<div id="rotchart"></div>
197196
</div>
198197
</div>
199198
</li>
200199
<li>
201200
<div style="text-align: right;">
202-
<button id="hastebut">Optimize Haste Rotation</button>
201+
Rotation:
202+
<select id="rotationRotation" class="buffdrop">
203+
<option class="buffdrop" value="ADAPTIVE" selected title="Dynamically adapts based on available mana.">Adaptive</option>
204+
<option class="buffdrop" value="CL_ON_CLEARCAST" title="Casts CL only after Clearcast procs.">CL On Clearcast</option>
205+
<option class="buffdrop" value="FIXED_CL_ON_CD" title="Casts CL if off CD, otherwise LB.">CL On CD</option>
206+
<option class="buffdrop" value="FIXED_LB_ONLY" title="Only casts LB.">LB Only</option>
207+
<option class="buffdrop" value="FIXED_3LB_1CL" title="Casts CL followed by 3 LBs.">CL + 3LB</option>
208+
<option class="buffdrop" value="FIXED_4LB_1CL" title="Casts CL followed by 4 LBs.">CL + 4LB</option>
209+
<option class="buffdrop" value="FIXED_5LB_1CL" title="Casts CL followed by 5 LBs.">CL + 5LB</option>
210+
<option class="buffdrop" value="FIXED_6LB_1CL" title="Casts CL followed by 6 LBs.">CL + 6LB</option>
211+
<option class="buffdrop" value="FIXED_7LB_1CL" title="Casts CL followed by 7 LBs.">CL + 7LB</option>
212+
<option class="buffdrop" value="FIXED_8LB_1CL" title="Casts CL followed by 8 LBs.">CL + 8LB</option>
213+
<option class="buffdrop" value="FIXED_9LB_1CL" title="Casts CL followed by 9 LBs.">CL + 9LB</option>
214+
<option class="buffdrop" value="FIXED_10LB_1CL" title="Casts CL followed by 10 LBs.">CL + 10LB</option>
215+
</select>
216+
Iterations: <input id="rotationIters" type="text" value="1000" style="width: 60px"></input>
217+
Duration: <input id="rotationDur" type="text" value="300" style="width: 60px"></input>
218+
# Cl Targets:
219+
<select id="rotationNumClTargets" class="buffdrop" style="width: 50px" value="1">
220+
<option class="buffdrop" selected>1</option>
221+
<option class="buffdrop">2</option>
222+
<option class="buffdrop">3</option>
223+
</select>
224+
<button id="rotationRunButton">Run Simulation</button>
203225
</div>
204-
<ul style="float:right">
205-
<li>Does not use bloodlust (ignores BL settings above)</li>
206-
<li>Uses all other options, but replaces the haste stat.</li>
207-
<li>Do not recommend using Quags Eye</li>
208-
<li>Not mana optimized, this is showing max dps for a 60s fight</li>
209-
<li>Even a very small amount of haste like 20 makes CL / 4LB > CL / 3LB</li>
210-
</ul>
211-
<div id="hasterots" style="float:left">
212-
<table class="hastetable" style="margin-top: 0px">
213-
<tr><th>Haste</th><th>Rotation</th><th>DPS</th></tr>
214-
<tr><td></td><td></td><td></td></tr>
215-
<tr><td></td><td></td><td></td></tr>
216-
<tr><td></td><td></td><td></td></tr>
217-
<tr><td></td><td></td><td></td></tr>
218-
<tr><td></td><td></td><td></td></tr>
219-
<tr><td></td><td></td><td></td></tr>
220-
<tr><td></td><td></td><td></td></tr>
221-
<tr><td></td><td></td><td></td></tr>
222-
<tr><td></td><td></td><td></td></tr>
223-
<tr><td></td><td></td><td></td></tr>
224-
</table>
226+
<div id="rotationOut" style="width: 99%;height: calc(100% - 40px);border:1px solid black;margin-top: 10px;">
227+
<div id="rotationToplineResults" style="height: 100%;float: left;width: 125px;border-right: 1px solid black;">
228+
</div>
229+
<div id="rotationDetailedResults" style="float: left;width: calc(100% - 130px);height: 100%;">
230+
<div id="rotationStats" style="height: 30px;width: 100%;border-bottom: 1px solid black;"></div>
231+
<div id="rotationChart" style="height: 100%;width: 100%"></div>
232+
</div>
225233
</div>
226234
</li>
227235
<li>
228236
<div style="text-align: right">
229237
<label>Iterations:<input id="switer" type="text" value="1000" style="width: 60px"></input></label>
230238
<label>Duration:<input id="swdur" type="text" value="300" style="width: 60px"></input></label>
231239
# Cl Targets:
232-
<select id="swnumClTargets" class="buffdrop" style="width: 50px" value="1">
233-
<option class="buffdrop" selected>1</option>
234-
<option class="buffdrop">2</option>
235-
<option class="buffdrop">3</option>
236-
</select>
240+
<select id="swnumClTargets" class="buffdrop" style="width: 50px" value="1">
241+
<option class="buffdrop" selected>1</option>
242+
<option class="buffdrop">2</option>
243+
<option class="buffdrop">3</option>
244+
</select>
237245
<button id="calcstatweight">Calculate</button>
238246
</div>
239247
<table id="statweights" style="width: 60%;margin: 0px auto;">
@@ -272,11 +280,11 @@ <h4>Standard Elemental Build</h4>
272280
<div style="text-align: right">
273281
Duration: <input id="logdur" type="text" value="300" style="width: 60px"></input>
274282
# Cl Targets:
275-
<select id="lognumClTargets" class="buffdrop" style="width: 50px" value="1">
276-
<option class="buffdrop" selected>1</option>
277-
<option class="buffdrop">2</option>
278-
<option class="buffdrop">3</option>
279-
</select>
283+
<select id="lognumClTargets" class="buffdrop" style="width: 50px" value="1">
284+
<option class="buffdrop" selected>1</option>
285+
<option class="buffdrop">2</option>
286+
<option class="buffdrop">3</option>
287+
</select>
280288
<button id="simlogrun">Run Simulation</button>
281289
</div>
282290
<pre id="simlogs" class="dtd" style="width: 99%;border:1px solid black;">
@@ -288,7 +296,7 @@ <h4>Standard Elemental Build</h4>
288296
<div id="pullout">
289297
<div class="dtl" style="height:100%;width:100%;padding:10px">
290298
<div id="themetoggle" style="height:20px; bottom: 10px; cursor: pointer;" onclick="toggletheme()">
291-
<text>v1.1.13</text>
299+
<text>v1.1.14</text>
292300
<img id="themebulb" style="height: 20px; width: 20px" src="icons/light-bulb.svg"></img>
293301
</div>
294302
<div style="margin-top:10px">

‎ui/ui.css

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
right: -200;
66
top: 0;
77
}
8-
#rotstats text {
8+
#rotstats text, #rotationStats text {
99
border-right: 3px solid #1e87f0;
1010
border-left: 3px solid #1e87f0;
1111
padding-left: 2px;
@@ -170,18 +170,6 @@ h4 {
170170
background-color: #E0E0E0;
171171
}
172172

173-
.hastetable {
174-
margin: 15px auto;
175-
border-collapse: collapse;
176-
/* background-color: #505050; */
177-
border:1px solid #D0D0D0;
178-
}
179-
180-
.hastetable td {
181-
padding: 10px;
182-
border:1px solid #D0D0D0;
183-
}
184-
185173
#root {
186174
height: 100%;
187175
}

‎ui/ui.js

Lines changed: 59 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -470,6 +470,62 @@ function runSim(gearSpec) {
470470
});
471471
}
472472

473+
// Populates the 'Rotation' tab in the results pane.
474+
function runRotationSim(gearSpec) {
475+
const simRequest = {
476+
Options: getOptions(),
477+
Gear: gearSpec,
478+
Iterations: parseInt(document.getElementById("rotationIters").value),
479+
};
480+
simRequest.Options.AgentType = AGENT_TYPES[document.getElementById("rotationRotation").value];
481+
simRequest.Options.Encounter = {
482+
Duration: parseInt(document.getElementById("rotationDur").value),
483+
NumClTargets: parseInt(document.getElementById("rotationNumClTargets").value),
484+
};
485+
486+
const pendingMetricHTML = `<div id="runningsim" uk-spinner="ratio: 1.5" style="margin:26%"></div>`;
487+
488+
const resultsElem = document.getElementById("rotationToplineResults");
489+
resultsElem.innerHTML = pendingMetricHTML;
490+
491+
const rotStatsElem = document.getElementById("rotationStats");
492+
rotStatsElem.innerHTML = "";
493+
494+
const start = new Date();
495+
workerPool.runSimulation(simRequest).then(simResult => {
496+
const end = new Date();
497+
console.log(`The sim took ${end - start} ms`);
498+
console.log("AI Stats: ", simResult);
499+
resultsElem.innerHTML = `<div><h3>Average</h3><text class="simnums">${Math.round(simResult.DpsAvg)}</text> +/- ${Math.round(simResult.DpsStDev)} dps<br /></div>`
500+
501+
Object.entries(simResult.Casts).forEach(castEntry => {
502+
const castID = castEntry[0];
503+
const cast = castEntry[1];
504+
if (cast.Count == 0) {
505+
return;
506+
}
507+
rotStatsElem.innerHTML += `<text style="cursor:pointer" title="Avg Dmg: ${Math.round(cast.Dmg / cast.Count)} Crit: ${Math.round(cast.Crits / cast.Count * 100)}%">${castIDToName[castID]}: ${Math.round(cast.Count / simRequest.Iterations)}</text>`;
508+
});
509+
const percentOom = simResult.NumOom / simRequest.Iterations;
510+
if (percentOom > 0.02) {
511+
var dangerStyle = "";
512+
if (percentOom > 0.05 && percentOom <= 0.25) {
513+
dangerStyle = "border-color: #FDFD96;"
514+
} else if (percentOom > 0.25) {
515+
dangerStyle = "border-color: #FF6961;"
516+
}
517+
rotStatsElem.innerHTML += `<text title="Downranking is not currently implemented." style="${dangerStyle};cursor: pointer">${Math.round(percentOom * 100)}% of simulations went OOM.`
518+
}
519+
520+
const chartDiv = document.getElementById("rotationChart");
521+
const bounds = chartDiv.getBoundingClientRect();
522+
const chartCanvas = createDpsChartFromSimResult(simResult, bounds);
523+
524+
chartDiv.innerHTML = "";
525+
chartDiv.appendChild(chartCanvas);
526+
});
527+
}
528+
473529
function createDpsChartFromSimResult(simResult, chartBounds) {
474530
const chartCanvas = document.createElement("canvas");
475531
const ctx = chartCanvas.getContext('2d');
@@ -521,70 +577,6 @@ function createDpsChartFromSimResult(simResult, chartBounds) {
521577
return chartCanvas;
522578
}
523579

524-
// Populates the 'Hasted Rotations' tab in results pane.
525-
function hastedRotations(gearSpec) {
526-
const sharedOptions = getOptions();
527-
sharedOptions.NumBloodlust = 0;
528-
sharedOptions.NumDrums = 0;
529-
sharedOptions.Encounter.Duration = 40;
530-
sharedOptions.Buffs.Custom[STAT_IDX.HASTE] = 0;
531-
532-
const sharedSimRequest = {
533-
Options: sharedOptions,
534-
Gear: gearSpec,
535-
Iterations: 1000,
536-
};
537-
538-
const hastes = [0, 50, 100, 200, 300, 400, 500, 600, 700, 788];
539-
const agentTypes = [
540-
AGENT_TYPES.FIXED_4LB_1CL,
541-
AGENT_TYPES.FIXED_5LB_1CL,
542-
AGENT_TYPES.FIXED_6LB_1CL,
543-
];
544-
545-
// TODO: Fix this to match the new return values now that process is done in go WASM code.
546-
547-
workerPool.computeStats({
548-
Options: sharedOptions,
549-
Gear: gearSpec,
550-
}).then(computeStatsResult => {
551-
const finalHasteValue = computeStatsResult.FinalStats[STAT_IDX.HASTE];
552-
const rows = document.getElementById("hasterots").firstElementChild.firstElementChild.children;
553-
hastes.forEach((haste, i) => {
554-
// Subtract haste from gear/etc
555-
const hasteValue = haste - finalHasteValue;
556-
557-
const row = rows[i];
558-
row.children[1].innerHTML = "<div uk-spinner=\"ratio: 0.5\"></div>";
559-
row.children[2].innerText = "";
560-
561-
const batchSimRequest = {
562-
Requests: agentTypes.map(agentType => {
563-
const simRequest = deepCopy(sharedSimRequest);
564-
simRequest.Options.AgentType = agentType;
565-
simRequest.Options.Buffs.Custom[STAT_IDX.HASTE] = hasteValue;
566-
return simRequest;
567-
}),
568-
};
569-
workerPool.runBatchSimulation(batchSimRequest).then(batchSimResult => {
570-
let maxIdx = 0;
571-
let bestResult = null;
572-
batchSimResult.Results.forEach((simResult, idx) => {
573-
if (!bestResult || simResult.DpsAvg > bestResult.DpsAvg) {
574-
maxIdx = idx;
575-
bestResult = simResult;
576-
}
577-
});
578-
579-
const rotTitle = "CL / " + (maxIdx + 4).toString() + "xLB";
580-
row.children[0].innerText = haste;
581-
row.children[1].innerText = rotTitle;
582-
row.children[2].innerText = Math.round(bestResult.DpsAvg) + " +/- " + Math.round(bestResult.DpsStDev);
583-
});
584-
});
585-
});
586-
}
587-
588580
function stDevToConf90(stDev, N) {
589581
return 1.645 * stDev / Math.sqrt(N);
590582
}
@@ -806,9 +798,9 @@ function popgear(gearList) {
806798
runSim(toGearSpec(gearUI.currentGear));
807799
});
808800

809-
var hastebut = document.getElementById("hastebut");
810-
hastebut.addEventListener("click", (event) => {
811-
hastedRotations(toGearSpec(gearUI.currentGear));
801+
var rotationRunButton = document.getElementById("rotationRunButton");
802+
rotationRunButton.addEventListener("click", (event) => {
803+
runRotationSim(toGearSpec(gearUI.currentGear));
812804
});
813805

814806
var caclweights = document.getElementById("calcstatweight");

0 commit comments

Comments
 (0)