decred.org/dcrdex@v1.0.3/client/webserver/site/src/html/mmsettings.tmpl (about) 1 {{define "mmsettings"}} 2 {{template "top" .}} 3 <div id="main" data-handler="mmsettings" class="flex-grow-1 flex-stretch-column stylish-overflow"> 4 <div class="w-100 flex-center p-2 fs28 d-flex d-md-none border-bottom">[[[Market Maker Settings]]]</div> 5 <div id="noMarket" class="flex-grow-1 flex-center"> 6 <button id="noMarketBttn" class="large">[[[Select a Market]]]</button> 7 </div> 8 <div id="marketLoading" class="flex-grow-1 flex-center d-hide"> 9 <div class="flex-center position-relative me-2 fs16"> 10 <div class="ico-spinner spinner"></div> 11 </div> 12 <span class="fs18">[[[Loading market data]]]</span> 13 </div> 14 <div id="missingFiatRates" class="flex-column flex-center flex-grow-1"> 15 <div class="flex-center"> 16 <span class="text-warning fs28 demi me-2">!</span> 17 <span class="fs22">Missing fiat exchange rates</span> 18 </div> 19 <div class="mt-2 mw-425"> 20 Enable external fiat rate sources in 21 <a href="/settings">settings</a> 22 </div> 23 </div> 24 <div id="botSettingsContainer" class="flex-grow-1 d-flex flex-wrap d-hide"> 25 26 {{- /* PLACEMENTS */ -}} 27 <div class="col-24 col-md-12 col-xl-8 col-xxl-6"> 28 <section class="p-3"> 29 <div class="position-relative"> 30 <div id="mmTitle" class="flex-center fs28 d-none d-md-block lh1">[[[Market Maker Settings]]]</div> 31 <div id="marketBox" class="flex-stretch-column flex-grow-1 d-hide"> 32 <div class="d-flex"> 33 {{- /* MARKET NAME DISPLAY */ -}} 34 <div id="marketHeader" class="flex-grow-1 d-flex flex-column align-items-start hoverbg pointer"> 35 <div class="d-flex align-items-center fs24 lh1 pb-1"> 36 <img class="mini-icon" data-base-logo><img class="mx-1 mini-icon" data-quote-logo> 37 <span data-base-ticker></span>–<span data-quote-ticker></span> 38 </div> 39 <div class="fs14 grey"> 40 <span class="me-1">@</span> 41 <span data-host></span> 42 </div> 43 </div> 44 {{- /* BOT TYPE DISPLAY */ -}} 45 <div id="botTypeHeader" class="flex-grow-1 d-flex flex-column align-items-end pointer hoverbg"> 46 <div class="d-flex align-items-center lh1 pb-1"> 47 <div id="botTypeDisplay" class="fs20"></div> 48 </div> 49 <div class="d-flex align-items-center" data-cex-show> 50 <img class="micro-icon greyscale me-1" data-cex-logo> 51 <span class="grey fs15" data-cex-name></span> 52 </div> 53 </div> 54 </div> 55 </div> 56 </div> 57 {{- /* MANUAL CONFIG */ -}} 58 <div id="advancedConfig" class="d-hide"> 59 {{- /* VIEW-ONLY MODE */ -}} 60 <div id="viewOnlyRunning" class="w-100 d-flex flex-center pb-2 mb-3 fs18 border-bottom"> 61 <span id="onIndicator" class="on-indicator on me-2"></span> [[[bots_running_view_only]]] 62 </div> 63 {{- /* STRATEGY SELECTION */ -}} 64 <div id="gapStrategyBox" class="w-100"> 65 <div class="d-flex flex-column align-items-stretch pb-2"> 66 <label class="text-nowrap me-2 mb-1 fs18 demi">[[[gap_strategy]]]</label> 67 <select id="gapStrategySelect" class="form-select fs18"> 68 <option value="percent-plus">[[[gap_strategy_percent_plus]]]</option> 69 <option value="percent">[[[gap_strategy_percent]]]</option> 70 <option value="absolute-plus"> 71 [[[gap_strategy_absolute_plus]]] 72 </option> 73 <option value="absolute">[[[gap_strategy_absolute]]]</option> 74 <option value="multiplier">[[[gap_strategy_multiplier]]]</option> 75 </select> 76 </div> 77 {{- /* STRATEGY DESCRIPTIONS */ -}} 78 <div id="percentPlusInfo" class="w-100 pb-2 border-bottom fs16 text-justify"> 79 [[[strategy_percent_plus]]] 80 </div> 81 <div id="percentInfo" class="w-100 pb-2 border-bottom fs16 text-justify d-hide"> 82 [[[strategy_percent]]] 83 </div> 84 <div id="absolutePlusInfo" class="w-100 pb-2 border-bottom fs16 text-justify d-hide"> 85 [[[strategy_absolute_plus]]] 86 </div> 87 <div id="absoluteInfo" class="w-100 pb-2 border-bottom fs16 text-justify d-hide"> 88 [[[strategy_absolute]]] 89 </div> 90 <div id="multiplierInfo" class="w-100 pb-2 border-bottom fs16 text-justify d-hide"> 91 [[[strategy_multiplier]]] 92 </div> 93 </div> 94 95 <div id="profitSelectorBox" class="d-flex align-items-stretch py-2 my-2 border-top border-bottom d-hide"> 96 <div class="flex-grow-1 d-flex flex-column pe-2"> 97 <span id="profitPrompt" class="fs18">[[[bot_profit_title]]]</span> 98 <span class="fs14 mt-1"> 99 [[[bot_profit_explainer]]] 100 </span> 101 </div> 102 <div class="w-100 d-flex flex-column align-items-stretch"> 103 <div class="flex-center p-3 border-left"> 104 <input type="number" id="profitInput" class="p-2 text-center fs24 me-1"> 105 <span class="fs24">%</span> 106 </div> 107 <div id="profitInputErr" class="flex-center fs16 text-danger"></div> 108 </div> 109 </div> 110 111 <div id="buyPlacementsBox"> 112 <div class="d-flex align-items-center fs18 mt-3 demi"> 113 [[[buy_placements]]] 114 <span class="ico-info fs12 ms-1" data-tooltip="[[[buy_placements_tooltip]]]"></span> 115 </div> 116 <div class="d-flex flex-column" id="buyPlacementsTableWrapper"> 117 <table class="cell-border compact"> 118 <thead> 119 <th class="no-stretch">[[[priority]]]</th> 120 <th>[[[Lots]]]</th> 121 <th id="buyGapFactorHdr"></th> 122 <th></th> 123 </thead> 124 <tbody id="buyPlacementsTableBody"> 125 <tr id="placementRowTmpl"> 126 <td data-tmpl="priority"></td> 127 <td data-tmpl="lots"></td> 128 <td data-tmpl="gapFactor"></td> 129 <td class="no-stretch text-start text-nowrap"> 130 <span data-tmpl="removeBtn" class="ico-cross fs15 pointer px-2"></span> 131 <span data-tmpl="upBtn" class="ico-arrowup fs15 pointer px-2"></span> 132 <span data-tmpl="downBtn" class="ico-arrowdown fs15 pointer px-2"></span> 133 </td> 134 </tr> 135 <tr id="addBuyPlacementRow"> 136 <td></td> 137 <td><input id="addBuyPlacementLots" class="lots-input p-2" step="1" type="number"></td> 138 <td><input id="addBuyPlacementGapFactor" class="gap-factor-input p-2" type="number"></td> 139 <td class="no-stretch text-start"> 140 <span id="addBuyPlacementBtn" class="ico-plus fs15 pointer p-2"></span> 141 </td> 142 </tr> 143 </tbody> 144 </table> 145 <span id="buyPlacementsErr" class="fs15 pt-3 text-center d-hide text-danger text-break"></span> 146 </div> 147 </div> 148 149 <div id="sellPlacementsBox"> 150 <div class="d-flex align-items-center fs18 mt-3 demi"> 151 [[[sell_placements]]] 152 <span class="ico-info fs12 ms-1" data-tooltip="[[[sell_placements_tooltip]]]"></span> 153 </div> 154 <div class="d-flex flex-column" id="sellPlacementsTableWrapper"> 155 <table class="cell-border compact"> 156 <thead> 157 <th class="no-stretch">[[[priority]]]</th> 158 <th>[[[Lots]]]</th> 159 <th id="sellGapFactorHdr"></th> 160 <th></th> 161 </thead> 162 <tbody id="sellPlacementsTableBody"> 163 <tr id="addSellPlacementRow"> 164 <td></td> 165 <td><input id="addSellPlacementLots" class="lots-input p-2" step="1" type="number"></td> 166 <td><input id="addSellPlacementGapFactor" class="gap-factor-input p-2" type="number"></td> 167 <td class="no-stretch"> 168 <span id="addSellPlacementBtn" class="ico-plus fs15 pointer p-2"></span> 169 </td> 170 </tr> 171 </tbody> 172 </table> 173 <span id="sellPlacementsErr" class="fs15 pt-3 text-center d-hide text-danger text-break"></span> 174 </div> 175 </div> 176 <div id="switchToQuickConfig" class="flex-center p-2 hoverbg pointer border rounded3 mt-3"> 177 <span class="ico-settings fs14 me-1"></span> 178 <span class="fs15">[[[Quick Placements]]]</span> 179 </div> 180 </div> 181 182 {{- /* QUICK CONFIG */ -}} 183 <div id="quickConfig" class="d-hide"> 184 <div class="d-flex justify-content-between lh1 pt-2 mt-2 border-top"> 185 <span class="fs20 pt-pt5">[[[Quick Placements]]]</span> 186 <button id="switchToAdvanced" class="small"> 187 <span class="ico-settings fs14 me-1"></span> 188 <span class="fs15">[[[Configure manually]]]</span> 189 </button> 190 </div> 191 192 <div class="d-flex align-items-stretch flex-wrap"> 193 194 {{- /* LEVELS PER SIDE */ -}} 195 <div id="qcLevelPerSideBox" class="col-12 d-flex flex-column align-items-stretch pt-2 mt-2 border-top"> 196 <div class="fs17 pb-1">[[[Price levels per side]]]</div> 197 <div id="qcLevelsPerSide" class="d-flex align-items-stretch"> 198 <input type="number" class="fs18 text-center p-2 fs20" step="1"> 199 <div class="d-flex flex-column align-items-stretch"> 200 <div class="flex-grow-1 flex-center px-2 hoverbg pointer user-select-none lh1 ico-arrowup"></div> 201 <div class="flex-grow-1 flex-center px-2 hoverbg pointer user-select-none lh1 ico-arrowdown"></div> 202 </div> 203 </div> 204 </div> 205 206 {{- /* LOTS PER LEVEL */ -}} 207 <div id="qcLotsBox" class="col-12 d-flex flex-column align-items-stretch pt-2 mt-2 border-top"> 208 <div class="d-flex align-items-center mb-1"> 209 <div id="lotsPerLevelLabel" class="fs17 ">[[[Lots per level]]]</div> 210 <div id="arbLotsLabel" class="fs17 d-hide">[[[Lots per side]]]</div> 211 <span id="switchToUSDPerSide" class="fs12 lh1 grey p-1 ms-1 hoverbg pointer"> 212 <span class="ico-arrowleft"></span><span class="ico-arrowright"></span> 213 </span> 214 </div> 215 216 <div id="qcLotsPerLevel" class="d-flex align-items-stretch"> 217 <input type="number" class="fs18 text-center p-2 fs20" step="1"> 218 <div class="d-flex flex-column align-items-stretch"> 219 <div class="flex-grow-1 flex-center px-2 hoverbg pointer lh1 user-select-none ico-arrowup"></div> 220 <div class="flex-grow-1 flex-center px-2 hoverbg pointer lh1 user-select-none ico-arrowdown"></div> 221 </div> 222 </div> 223 <span class="fs15 grey mt-1"> 224 <span>~</span> 225 <span id="qcUSDPerSideEcho"></span> 226 <span>USD per side</span> 227 </span> 228 </div> 229 230 {{- /* USD PER SIDE */ -}} 231 <div id="qcUSDPerSideBox" class="col-12 d-flex flex-column align-items-stretch pt-2 mt-2 border-top"> 232 <div class="d-flex align-items-center mb-1"> 233 <div class="fs17">USD per side</div> 234 <span id="switchToLotsPerLevel" class="fs12 lh1 grey p-1 ms-1 hoverbg pointer"> 235 <span class="ico-arrowleft"></span><span class="ico-arrowright"></span> 236 </span> 237 </div> 238 <div id="qcUSDPerSide" class="d-flex align-items-stretch"> 239 <input type="number" class="fs18 text-center p-2 fs20" step="1"> 240 <div class="d-flex flex-column align-items-stretch"> 241 <div class="flex-grow-1 flex-center px-2 hoverbg pointer lh1 user-select-none ico-arrowup"></div> 242 <div class="flex-grow-1 flex-center px-2 hoverbg pointer lh1 user-select-none ico-arrowdown"></div> 243 </div> 244 </div> 245 <span class="fs15 grey mt-1"> 246 <span>~</span> 247 <span id="qcLotsPerLevelEcho"></span> 248 <span>lots per level</span> 249 </span> 250 </div> 251 252 {{- /* PROFIT */ -}} 253 <div class="col-12 d-flex flex-column align-items-start pt-2 mt-2 border-top"> 254 <div class="fs17 pb-1">[[[Profit threshold]]]</div> 255 <div class="d-flex flex-column align-items-stretch"> 256 <div class="d-flex align-items-center"> 257 <input id="qcProfit" type="number" class="fs18 text-center p-2 fs20" step="1"> 258 <span class="fs28 ms-1">%</span> 259 </div> 260 <div id="qcProfitSlider" class="mini-slider flex-grow-1 mt-2"></div> 261 </div> 262 </div> 263 264 {{- /* RATE INCREMENT */ -}} 265 <div id="levelSpacingBox" class="col-12 d-flex flex-column align-items-stretch pt-2 mt-2 border-top"> 266 <div class="fs17 pb-1">[[[Price increment]]]</div> 267 <div class="d-flex align-items-center"> 268 <input id="qcLevelSpacing" type="number" class="fs18 text-center p-2 fs20" step="1"> 269 <span class="fs28 ms-1">%</span> 270 </div> 271 <div id="qcLevelSpacingSlider" class="mini-slider flex-grow-1 mt-2"></div> 272 </div> 273 274 {{- /* MATCH MULTIPLIER */ -}} 275 <div id="matchMultiplierBox" class="col-12 d-flex flex-column align-items-start pt-2 mt-2 border-top"> 276 <div class="fs17 pb-1">[[[Match buffer]]]</div> 277 <div class="d-flex flex-column align-items-stretch"> 278 <div class="d-flex align-items-center"> 279 <input id="qcMatchBuffer" type="number" class="fs18 text-center p-2 fs20" step="1"> 280 <span class="fs28 ms-1">%</span> 281 </div> 282 <div id="qcMatchBufferSlider" class="mini-slider flex-grow-1 mt-2"></div> 283 </div> 284 </div> 285 </div> 286 <div id="qcError" class="pt-2 text-danger"></div> 287 </div> 288 289 <div id="buttonsBox" class="d-flex mt-2"> 290 <button id="createButton" class="flex-grow-1 feature">[[[create_bot]]]</button> 291 <button id="resetButton" class="flex-grow-1 me-1">[[[reset_settings]]]</button> 292 <button id="updateButton" class="flex-grow-1 ms-1 feature">[[[update_settings]]]</button> 293 </div> 294 295 <div id="placementsChartBox" class="pt-2"> 296 <div id="placementsChart" class="border position-relative"></div> 297 <span id="placementChartLegend" class="fs16 grey mt-1">δ = [[[remote exchange gap]]]</span> 298 </div> 299 300 {{- /* ORACLES */ -}} 301 <div class="flex-stretch-column mt-2 pt-2 border-top"> 302 <div id="oraclesLoading"> 303 [[[loading_oracles]]] 304 <div class="ico-spinner spinner fs14 d-inline-block" data-tmpl="syncSpinner"></div> 305 </div> 306 <div id="oraclesErr" class="d-hide p-2"> 307 <span class="text-danger" id="oraclesErrMsg"></span> 308 </div> 309 <div id="noOracles" class="d-hide p-2"> 310 [[[no_oracles]]] 311 </div> 312 313 <table id="oraclesTable" class="mb-4 d-hide row-border"> 314 <thead> 315 <tr> 316 <th>[[[Oracles]]]</th> 317 <th colspan="2" class="text-end">avg: <span id="avgPrice"></span></th> 318 </tr> 319 </thead> 320 <tbody id="oracles"> 321 <tr id="oracleTmpl"> 322 <td><span class="d-flex align-items-center"><img data-tmpl="logo" class="xclogo micro-icon me-1"><span data-tmpl="host"></span></span></td> 323 <td><span data-tmpl="volume"></span> USD</td> 324 <td data-tmpl="price" class="text-end"></td> 325 </tr> 326 </tbody> 327 </table> 328 329 <table id="fiatRates" class="mb-3 d-hide row-border"> 330 <thead> 331 <tr> 332 <th colspan="2">[[[fiat_rates]]]</th> 333 </tr> 334 </thead> 335 <tbody> 336 <tr> 337 <td><img class="xclogo micro-icon me-1" data-base-logo><span data-base-ticker></span></td> 338 <td class="text-end"><span id="baseFiatRate"></span> USD</td> 339 </tr> 340 <tr> 341 <td><img class="xclogo micro-icon me-1" data-quote-logo><span data-quote-ticker></span></td> 342 <td class="text-end"><span id="quoteFiatRate"></span> USD</td> 343 </tr> 344 </tbody> 345 </table> 346 347 <div id="deleteBttnBox" class="d-flex flex-column pt-2"> 348 <div> 349 <button id="deleteBttn" class="danger">Delete This Program</button> 350 </div> 351 <div id="deleteErr" class="text-warning pt-2 d-hide"></div> 352 </div> 353 </div> 354 </section> 355 </div> 356 357 {{- /* ASSET SETTINGS */ -}} 358 <div class="d-flex flex-wrap col-24 col-md-12 col-xl-16 col-xxl-18"> 359 <div id=assetPaneBox class="d-flex flex-wrap col-24 col-xxl-19"> 360 <div id="basePane" class="flex-stretch-column col-24 col-xl-12"> 361 <section class="flex-stretch-column"> 362 363 {{- /* LOGO AND TOTAL ALLOCATION */ -}} 364 <div class="d-flex align-items-start justify-content-between px-3 pt-3 pb-2 border-bottom"> 365 <div class="d-flex align-items-center lh1"> 366 <img class="me-1 mini-icon" data-logo> 367 <span class="fs26" data-name></span> 368 </div> 369 <div class="d-flex flex-column align-items-end"> 370 <div class="d-flex align-items-end lh1"> 371 <span data-tmpl="commitTotal" class="fs18 demi"></span> 372 <span class="fs15 grey ms-1" data-ticker></span> 373 </div> 374 <div class="fs14 grey demi"> 375 ~ <span data-tmpl="commitTotalFiat"></span> USD 376 </div> 377 </div> 378 </div> 379 380 {{- /* ALLOCATIONS */ -}} 381 <div class="d-flex align-items-stretch border-bottom"> 382 383 {{- /* ASSET ALLOCATIONS */ -}} 384 <div class="col-12 flex-stretch-column ps-3 py-2 pe-2"> 385 {{- /* DEX BOOKING */ -}} 386 <div class="flex-stretch-column"> 387 <div class="d-flex align-items-center justify-content-between"> 388 <span class="me-1 fs16">Order Inventory</span> 389 <span class="d-flex align-items-end"> 390 <span data-tmpl="bookLots" class="fs16"></span> 391 <span class="fs14 grey ms-1">lots</span> 392 393 </span> 394 </div> 395 <div class="d-flex align-items-end justify-content-end"> 396 <span class="fs14 grey me-1">x</span> 397 <span data-tmpl="bookLotSize" class="fs16"></span> 398 <span class="fs14 grey ms-1"> 399 <span data-ticker></span> per lot 400 </span> 401 </div> 402 <div class="d-flex align-items-end justify-content-end"> 403 <span class="fs14 grey me-1">=</span> 404 <span data-tmpl="bookCommitment" class="fs16"></span> 405 <span class="fs14 grey ms-1" data-ticker></span> 406 </div> 407 </div> 408 409 {{- /* CEX COUNTER INVENTORY */ -}} 410 <div data-tmpl="cexMinInvBox" class="d-flex align-items-center justify-content-between border-top pt-2 mt-2"> 411 <span class="me-1 fs16">CEX Inventory</span> 412 <div class="d-flex align-items-end"> 413 <span data-tmpl="cexMinInv" class="fs16"></span> 414 <span class="fs14 grey ms-1" data-ticker></span> 415 </div> 416 </div> 417 418 {{- /* ORDER RESERVES */ -}} 419 <div data-tmpl="orderReservesBox" class="flex-stretch-column border-top pt-2 mt-2"> 420 <div class="d-flex align-items-center justify-content-between"> 421 <span class="me-1 fs16">Order Reserves</span> 422 <div data-tmpl="orderReservesSlider" class="mini-slider flex-grow-1 ms-2"></div> 423 </div> 424 <div class="d-flex align-items-center justify-content-end"> 425 <input type="number" data-tmpl="orderReservesFactor" class="fs16 micro text-end"> 426 </div> 427 <div class="d-flex align-items-end justify-content-end"> 428 <span class="fs14 grey me-1">x</span> 429 <span data-tmpl="orderReservesBasis" class="fs16"></span> 430 <span class="fs14 grey ms-1" data-ticker></span> 431 </div> 432 <div class="d-flex align-items-end justify-content-end"> 433 <span class="fs14 grey me-1">=</span> 434 <span data-tmpl="orderReserves" class="fs16"></span> 435 <span class="fs14 grey ms-1" data-ticker></span> 436 </div> 437 </div> 438 439 {{- /* QUOTE SLIPPAGE BUFFER */ -}} 440 <div data-tmpl="slippageBufferBox" class="flex-stretch-column border-top pt-2 mt-2"> 441 <div class="d-flex align-items-center justify-content-between"> 442 <span class="me-1 fs16">Slippage Buffer</span> 443 <div data-tmpl="slippageBufferSlider" class="mini-slider flex-grow-1 ms-2"></div> 444 </div> 445 <div class="d-flex align-items-center justify-content-end"> 446 <input type="number" data-tmpl="slippageBufferFactor" class="fs16 micro text-end"> 447 </div> 448 <div class="d-flex align-items-end justify-content-end"> 449 <span class="fs14 grey me-1">x</span> 450 <span data-tmpl="slippageBufferBasis" class="fs16"></span> 451 <span class="fs14 grey ms-1" data-ticker></span> 452 </div> 453 <div class="d-flex align-items-end justify-content-end"> 454 <span class="fs14 grey me-1">=</span> 455 <span data-tmpl="slippageBuffer" class="fs16"></span> 456 <span class="fs14 grey ms-1" data-ticker></span> 457 </div> 458 </div> 459 </div> 460 461 {{- /* FEE ALLOCATIONS */ -}} 462 <div class="col-12 flex-stretch-column ps-2 my-2 pe-3 border-left"> 463 464 {{- /* TOKEN FEE RESERVES */ -}} 465 <div data-tmpl="feeTotalBox" class="d-flex align-items-start justify-content-between mb-2 pb-2 border-bottom"> 466 <div class="flex-center lh1"> 467 <img class="me-1 micro-icon" data-fee-logo> 468 <span class="fs16">Fee Reserves</span> 469 </div> 470 <div class="d-flex flex-column align-items-end"> 471 <div class="d-flex align-items-end lh1"> 472 <span data-tmpl="feeTotal" class="fs16 demi"></span> 473 <span class="fs14 grey ms-1" data-fee-ticker></span> 474 </div> 475 <div class="fs14 grey demi"> 476 ~ <span data-tmpl="feeTotalFiat"></span> USD 477 </div> 478 </div> 479 </div> 480 481 {{- /* BOOKING FEES */ -}} 482 <div class="flex-stretch-column"> 483 <div class="d-flex align-items-center justify-content-between"> 484 <span class="me-1 fs16">Booking Fees</span> 485 <span class="d-flex align-items-end"> 486 <span data-tmpl="bookingFeesLots" class="fs16"></span> 487 <span class="fs14 grey ms-1">lots</span> 488 </span> 489 </div> 490 <div class="d-flex align-items-end justify-content-end"> 491 <span class="fs14 grey me-1">x</span> 492 <span data-tmpl="bookingFeesPerLot" class="fs16"></span> 493 <span class="fs14 grey ms-1"> 494 <span data-fee-ticker></span> per lot 495 </span> 496 </div> 497 <div class="d-flex align-items-end justify-content-end"> 498 <span class="fs14 grey me-1">x</span> 499 <span data-tmpl="swapReservesFactor" class="fs16"></span> 500 <span class="fs14 grey ms-1">reserves</span> 501 </div> 502 <div data-tmpl="redemptionFeesBox" class="flex-stretch-column"> 503 <div class="d-flex align-items-end justify-content-end"> 504 <span class="fs14 grey me-1">+</span> 505 <span data-tmpl="redemptionFeesLots" class="fs16"></span> 506 <span class="fs14 grey ms-1">redeems</span> 507 </div> 508 <div class="d-flex align-items-end justify-content-end"> 509 <span class="fs14 grey me-1">x</span> 510 <span data-tmpl="redemptionFeesPerLot" class="fs16"></span> 511 <span class="fs14 grey ms-1"> 512 <span data-fee-ticker></span> per redeem 513 </span> 514 </div> 515 <div class="d-flex align-items-end justify-content-end"> 516 <span class="fs14 grey me-1">x</span> 517 <span data-tmpl="redeemReservesFactor" class="fs16"></span> 518 <span class="fs14 grey ms-1">reserves</span> 519 </div> 520 </div> 521 <div class="d-flex align-items-end justify-content-end"> 522 <span class="fs14 grey me-1">=</span> 523 <span data-tmpl="bookingFees" class="fs16"></span> 524 <span class="fs14 grey ms-1" data-fee-ticker></span> 525 </div> 526 </div> 527 528 {{- /* SWAP RESERVES */ -}} 529 <div data-tmpl="feeReservesBox" class="flex-stretch-column border-top pt-2 mt-2"> 530 <div class="d-flex align-items-center"> 531 <span class="me-1 fs16">Swap Fee Reserves</span> 532 <div data-tmpl="nSwapFeesSlider" class="mini-slider flex-grow-1 ms-2 mt-1"></div> 533 </div> 534 <div class="d-flex align-items-end justify-content-end"> 535 <div data-tmpl="nSwapFees" class="d-flex align-items-stretch"> 536 <input type="number" step="1" class="fs16 micro text-end"> 537 <div class="flex-stretch-column border user-select-none"> 538 <span class="ico-arrowup fs8 grey border-bottom px-1 flex-grow-1 flex-center ml2px pointer hoverbg"></span> 539 <span class="ico-arrowdown fs8 grey px-1 flex-grow-1 flex-center pointer hoverbg"></span> 540 </div> 541 </div> 542 <span class="fs14 grey ms-1">swaps</span> 543 </div> 544 <div class="d-flex align-items-end justify-content-end"> 545 <span class="fs14 grey me-1">x</span> 546 <span data-tmpl="feeReservesPerSwap" class="fs16"></span> 547 <span class="fs14 grey ms-1"> 548 <span data-fee-ticker></span> per swap 549 </span> 550 </div> 551 <div class="d-flex align-items-end justify-content-end"> 552 <span class="fs14 grey me-1">=</span> 553 <span data-tmpl="feeReserves" class="fs16"></span> 554 <span class="fs14 grey ms-1" data-fee-ticker></span> 555 </div> 556 </div> 557 </div> 558 559 </div> 560 561 {{- /* ASSET SETTINGS */ -}} 562 <div class="d-flex align-items-stretch mt-1 border-top"> 563 {{- /* WALLET SETTINGS */ -}} 564 <!-- <div class="d-flex align-items-center"> 565 <span class="ico-settings me-2 fs16"></span> 566 <span class="fs20">[[[wallet_settings]]]</span> 567 </div> --> 568 <div class="col-12 px-3 py-2 flex-stretch-column"> 569 <div class="d-flex align-items-center"> 570 <span class="ico-settings fs15 pe-2"></span> 571 <span class="fs18">[[[Wallet Options]]]</span> 572 </div> 573 <div data-tmpl="walletSettingsNone" class="text-center p-2 my-2 border-top border-bottom rounded3">no settings available</div> 574 <div data-tmpl="walletSettings" class="flex-stretch-column fs15"> 575 <div data-tmpl="boolSettingTmpl" class="d-flex align-items-center pt-2 mt-2 border-top"> 576 <input type="checkbox" data-tmpl="input" class="form-check-input me-2 mt-0"> 577 <span data-tmpl="name"></span> 578 <span data-tmpl="tooltip" class="ico-info fs12"></span> 579 </div> 580 <div data-tmpl="rangeSettingTmpl" class="pt-2 mt-2 border-top"> 581 <div class="d-flex align-items-center justify-content-between"> 582 <span data-tmpl="name"></span> 583 <span data-tmpl="tooltip" class="ico-info fs12"></span> 584 </div> 585 <div class="d-flex align-items-center"> 586 <div data-tmpl="slider" class="mini-slider flex-grow-1 me-2"></div> 587 <input type="number" data-tmpl="value" class="micro wide text-end"> 588 <div data-tmpl="unit" class="fs14 grey ms-1"></div> 589 </div> 590 </div> 591 </div> 592 </div> 593 594 <div class="col-12 flex-stretch-column py-2 px-3 border-left"> 595 {{- /* BALANCES */ -}} 596 <div class="d-flex align-items-center justify-content-between fs16"> 597 <div class="flex-center"> 598 <img class="micro-icon" data-logo> 599 <span class="ms-1">[[[Available]]]</span> 600 </div> 601 <div class="flex-center"> 602 <span data-tmpl="avail"></span> 603 <span class="fs14 grey ms-1" data-ticker></span> 604 </div> 605 </div> 606 <div class="d-flex justify-content-between"> 607 <div> 608 <div data-tmpl="balanceBreakdown"> 609 <div class="d-flex align-items-center"> 610 <span class="fs16 lh1">├─</span> 611 <img class="logo-square micro-icon mx-1"> 612 <span data-tmpl="dexAvail" class="fs14"></span> 613 </div> 614 <div class="d-flex align-items-center fs14"> 615 <span class="fs16 lh1">└─</span> 616 <img class="micro-icon mx-1" data-cex-logo> 617 <span data-tmpl="cexAvail" class="fs14"></span> 618 </div> 619 </div> 620 </div> 621 <div data-tmpl="showBalance" class="ico-qrcode fs16 pointer hoverbg"></div> 622 </div> 623 <div data-tmpl="feeBalances" class="d-flex align-items-center justify-content-between fs16 mt-2"> 624 <div class="flex-center"> 625 <img class="micro-icon" data-fee-logo> 626 <span class="ms-1">[[[Available]]]</span> 627 </div> 628 <div class="flex-center"> 629 <span data-tmpl="feeAvail"></span> 630 <span class="fs14 grey ms-1" data-fee-ticker></span> 631 </div> 632 </div> 633 634 {{- /* REBALANCE SETTINGS */ -}} 635 <div data-tmpl="rebalanceOpts" class="flex-stretch-column mt-2 pt-2 border-top"> 636 <div class="d-flex align-items-center"> 637 <img class="micro-icon me-2" data-cex-logo> 638 <span class="fs18">[[[cex_rebalance]]]</span> 639 </div> 640 <div class="fs16 mt-2 pt-2 border-top d-flex align-items-center justify-content-between"> 641 <span>[[[Minimum Transfer]]]</span> 642 <span class="ico-info fs12" data-tooltip="[[[arb_transfer_tooltip]]]"></span> 643 </div> 644 <div class="d-flex align-items-center my-2"> 645 <div data-tmpl="minTransferSlider" class="mini-slider flex-grow-1 me-2"></div> 646 <input type="number" data-tmpl="minTransfer" class="micro wide text-end"> 647 <span class="fs14 grey ms-1" data-ticker></span> 648 </div> 649 </div> 650 </div> 651 </div> 652 </section> 653 </div> 654 </div> 655 {{- /* GENERAL SETTINGS */ -}} 656 <div class="col-24 col-xxl-5 flex-stretch-column"> 657 <section class="flex-stretch-column py-2 px-3"> 658 <div class="d-flex align-items-center"> 659 <span class="ico-lever fs20 pe-2"></span> 660 <span class="fs22">Knobs</span> 661 </div> 662 {{- /* CEX REBALANCE CHECKBOX */ -}} 663 <label id="cexRebalanceSettings" for="cexRebalanceCheckbox" class="fs16 d-flex align-items-center justify-content-between mt-2 pt-2 border-top"> 664 <div class="flex-center"> 665 <input type="checkbox" id="cexRebalanceCheckbox" class="form-check-input me-2 mt-0" checked> 666 <span>[[[Arbitrage Rebalance]]]</span> 667 </div> 668 <span class="ico-info fs12" data-tooltip="[[[enable_rebalance_tooltip]]]"></span> 669 </label> 670 671 {{- /* DRIFT TOLERANCE */ -}} 672 <div id="driftToleranceBox" class="flex-stretch-column"> 673 <div class="d-flex align-items-center justify-content-between mt-2 pt-2 border-top"> 674 <span class="fs16"> 675 [[[Drift tolerance]]] 676 </span> 677 <span class="ico-info fs12" data-tooltip="[[[drift_tolerance_tooltip]]]"></span> 678 </div> 679 <div class="d-flex align-items-center"> 680 <div id="driftToleranceSlider" class="mini-slider flex-grow-1 me-2"></div> 681 <input type="number" id="driftToleranceInput" class="micro text-end"> 682 <span class="fs14 grey ms-1">%</span> 683 </div> 684 </div> 685 686 {{- /* ORDER PERSISTENCE */ -}} 687 <div id="orderPersistenceBox" class="flex-stretch-column mt-2 pt-2 border-top"> 688 <div class="fs16 mb-2 d-flex align-items-center justify-content-between"> 689 <span>[[[Order persistence]]]</span> 690 <span class="ico-info fs12" data-tooltip="[[[order_persistence_tooltip]]]"></span> 691 </div> 692 <div class="d-flex align-items-center"> 693 <div id="orderPersistenceSlider" class="mini-slider flex-grow-1 me-2"></div> 694 <input type="number" id="orderPersistence" class="micro thin text-end"> 695 <span class="fs14 grey ms-1">epochs</span> 696 </div> 697 </div> 698 </section> 699 </div> 700 </div> 701 </div> 702 703 <div id="forms" class="d-hide"> 704 <form class="position-relative mw-425 d-hide" id="cexConfigForm" autocomplete="off"> 705 {{template "cexConfigForm"}} 706 </form> 707 708 {{- /* NEW WALLET */ -}} 709 <form class="position-relative d-hide" id="newWalletForm" autocomplete="off"> 710 {{template "newWalletForm"}} 711 </form> 712 713 {{- /* BOT TYPE FORM */ -}} 714 <form id="botTypeForm" class="position-relative mw-425 d-hide" autocomplete="off"> 715 <div class="form-closer"><span class="ico-cross"></span></div> 716 <header> 717 <img class="mini-icon me-1" data-base-logo> 718 <img class="mini-icon me-2" data-quote-logo> 719 <span id="botTypeBaseSymbol" class="fs20"></span>-<span id="botTypeQuoteSymbol" class="fs20"></span> 720 <span id="botTypeChangeMarket" class="p-2 fs14 ico-edit hoverbg pointer"></span> 721 </header> 722 723 <div class="flex-center"> 724 <span class="fs35 ico-robot me-2"></span> 725 <span class="fs22 pt-1">[[[Choose Your Bot]]]</span> 726 </div> 727 728 <div id="noCexesConfigured" class="fs18"> 729 [[[only_basic_mm_no_more_cexes]]] 730 </div> 731 732 <div id="noCexMarket" class="fs18"> 733 [[[only_basic_mm_more_cexes]]] 734 <span id="noCexMarketConfigureMore">[[[configure_more_cexes]]]</span> 735 </div> 736 737 <div id="botSelect"> 738 <div id="botTypeBasicMM" data-bot-type="basicMM" class="bot-type-selector mt-2"> 739 <div class="flex-center fs24 p-2">[[[Basic Market Maker]]]</div> 740 <div class="flex-center fs16 px-3 pb-2 d-hide"> 741 Keep orders on both sides of a DEX market with a configurable spread. If a buy and a sell order both match with minimal market movement in between, you profit. 742 </div> 743 </div> 744 745 <div id="botTypeARbMM" data-bot-type="arbMM" class="bot-type-selector mt-2"> 746 <div class="flex-center fs24 p-2">[[[mm_plus_arb]]]</div> 747 <div class="flex-center fs16 px-3 pb-2 d-hide"> 748 Maintain orders on a DEX market placed at positions calculated for matching profitable existing orders 749 orders on CEX. When the DEX order matches, the CEX order is placed immediately for a profit. 750 Unlike basic arbitrage, MM+arb doesn't wait for conditions to be just right, 751 it creates the right conditions and waits for action to occur. 752 </div> 753 </div> 754 755 <div id="botTypeBasicArb" data-bot-type="basicArb" class="bot-type-selector mt-2"> 756 <div class="flex-center fs24 p-2">[[[Basic Arbitrage]]]</div> 757 <div class="flex-center fs16 px-3 pb-2 d-hide"> 758 Watch both CEX and DEX order books and wait for conditions favorable to place 759 a pair of orders such that when both match, a profit is made. Basic Arbitrage 760 profits when order books (inevitably) get out of sync. 761 </div> 762 </div> 763 </div> 764 765 <div id="cexSelection" class="d-flex flex-wrap justify-content-between"> 766 <div id="cexOptTmpl" class="position-relative p-2 col-11 flex-center flex-column border rounded3 cex-selector"> 767 <div data-tmpl="reconfig" class="fs14 ico-settings p-2 hoverbg pointer reconfig"></div> 768 <div class="flex-center lh1"> 769 <img data-tmpl="logo" class="mini-icon me-1 xclogo medium-icon"> 770 <span data-tmpl="name" class="me-1 fs20 text-nowrap"></span> 771 </div> 772 <span data-tmpl="needsconfig" class="fs14 grey flex-center"> 773 <span class="ico-settings fs12 me-1"></span> 774 <span>[[[Configure]]]</span> 775 </span> 776 <span data-tmpl="disconnected" class="flex-center"> 777 <span class="ico-disconnected fs16 text-danger me-1"></span> 778 <span class="fs14 grey">[[[Fix errors]]]</span> 779 </span> 780 <span data-tmpl="unavailable" class="fs14 grey">[[[Market not available]]]</span> 781 </div> 782 </div> 783 784 <div id="botTypeErr" class="flex-center text-danger d-hide"></div> 785 786 <div class="flex-stretch-column"> 787 <button id="botTypeSubmit" type="button" class="feature">[[[Submit]]]</butt> 788 </div> 789 </form> 790 791 <form id="marketSelectForm"> 792 <div class="form-closer"><span class="ico-cross"></span></div> 793 <header> 794 <span class="me-2 ico-robot fs35 pb-1"></span> 795 <span class="fs26">[[[Select a Market]]]</span> 796 </header> 797 798 <div id="marketFilterBox" class="flex-center"> 799 <div class="position-relative"> 800 <input id="marketFilterInput" type="text"> 801 <span id="marketFilterIcon" class="fs22 ico-search"></span> 802 </div> 803 </div> 804 805 <div id="marketSelectionTable"> 806 <table class="row-border"> 807 <thead> 808 <tr> 809 <th>[[[Market]]]</th> 810 <th>[[[Host]]]</th> 811 <th>[[[Arb]]]</th> 812 </tr> 813 </thead> 814 <tbody id="marketSelect"> 815 <tr id="marketRowTmpl" class="hoverbg pointer"> 816 <td> 817 <img data-tmpl="baseIcon" class="mini-icon me-1"> 818 <img data-tmpl="quoteIcon" class="mini-icon me-1"> 819 <span data-tmpl="baseSymbol"></span>-<span data-tmpl="quoteSymbol"></span> 820 </td> 821 <td data-tmpl="host"></td> 822 <td data-tmpl="arbs"> 823 <img id="arbBttnTmpl" class="mini-icon me-1"> 824 </td> 825 </tr> 826 </tbody> 827 </table> 828 </div> 829 <div id="noMarkets" class="flex-center"> 830 [[[No markets available]]] 831 </div> 832 <div id="needRegBox" class="flex-stretch-column pt-0 d-hide"> 833 <button type="button" id="needRegTmpl" class="mt-3"> 834 [[[register_to_enable_mm]]] 835 </button> 836 </div> 837 </form> 838 839 <form id="approveTokenForm" class="mw-425 position-relative flex-center flex-column fs20 d-hide"> 840 {{template "tokenApprovalForm"}} 841 </form> 842 843 <form class="mw-425 d-hide" id="walletAddrForm"> 844 {{template "depositAddress"}} 845 </form> 846 </div> 847 848 <div id="vOrderOpts">{{template "orderOptionTemplates"}}</div> 849 </div> 850 {{template "bottom"}} {{end}}