2023-11-23 17:00:57 +09:00
< span id = "successAlert" class = "m-0 p-0 d-block" style = "height: 1px;" > < / span >
2023-08-26 09:52:55 +02:00
< div class = "row" * ngIf = "showSuccess" >
2023-11-23 17:00:57 +09:00
< div class = "col" >
2023-08-26 09:52:55 +02:00
< div class = "alert alert-success" >
2023-11-19 17:23:46 +09:00
Transaction has now been < a class = "alert-link" routerLink = "/services/accelerator/history" > submitted< / a > to mining pools for acceleration.
2023-08-26 09:52:55 +02:00
< / div >
< / div >
< / div >
2023-11-23 17:00:57 +09:00
< span id = "mempoolError" class = "m-0 p-0 d-block" style = "height: 1px;" > < / span >
2023-08-26 09:52:55 +02:00
< div class = "row" * ngIf = "error" >
2023-11-23 17:00:57 +09:00
< div class = "col" >
< app-mempool-error [ error ] = " error " [ alertClass ] = " error = == ' waitlisted ' ? ' alert-mempool ' : ' alert-danger ' " > < / app-mempool-error >
2023-08-26 09:52:55 +02:00
< / div >
< / div >
2023-08-29 21:20:36 +09:00
< div class = "accelerate-cols" >
2023-08-30 17:16:39 +09:00
< ng-container * ngIf = "!isMobile" >
< app-accelerate-fee-graph
[tx]="tx"
[estimate]="estimate"
[maxRateOptions]="maxRateOptions"
[maxRateIndex]="selectFeeRateIndex"
(setUserBid)="setUserBid($event)"
>< / app-accelerate-fee-graph >
< / ng-container >
2023-08-26 09:52:55 +02:00
2023-08-29 21:20:36 +09:00
< ng-container * ngIf = "estimate" >
< div [ class ] = " { estimateDisabled: error } " >
2023-08-30 16:49:54 +09:00
< h5 > Your transaction< / h5 >
< div class = "row" >
2023-08-29 21:20:36 +09:00
< div class = "col" >
2023-08-30 16:49:54 +09:00
< small * ngIf = "hasAncestors" class = "form-text text-muted mb-2" >
Plus {{ estimate.txSummary.ancestorCount - 1 }} unconfirmed ancestor{{ estimate.txSummary.ancestorCount > 2 ? 's' : ''}}.
< / small >
2023-08-29 21:20:36 +09:00
< table class = "table table-borderless table-border table-dark table-accelerator" >
< tbody >
2023-08-30 16:49:54 +09:00
< tr class = "group-first" >
< td class = "item" >
Virtual size
2023-08-29 21:20:36 +09:00
< / td >
2023-11-23 15:47:28 +09:00
< td style = "text-align: end;" [ innerHTML ] = " ' & lrm ; ' + ( estimate . txSummary . effectiveVsize | vbytes: 2 ) " > < / td >
2023-08-29 21:20:36 +09:00
< / tr >
2023-08-30 16:49:54 +09:00
< tr class = "info" >
2023-11-23 14:54:50 +09:00
< td class = "info" colspan = 3 >
2023-08-30 16:49:54 +09:00
< i > < small > Size in vbytes of this transaction< span * ngIf = "hasAncestors" > and its unconfirmed ancestors< / span > < / small > < / i >
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
< tr >
2023-08-30 16:49:54 +09:00
< td class = "item" >
In-band fees
2023-08-29 21:20:36 +09:00
< / td >
2023-11-23 15:47:28 +09:00
< td style = "text-align: end;" >
2023-08-30 16:49:54 +09:00
{{ estimate.txSummary.effectiveFee | number : '1.0-0' }} < span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
2023-08-30 16:49:54 +09:00
< tr class = "info group-last" >
2023-11-23 14:54:50 +09:00
< td class = "info" colspan = 3 >
2023-08-30 16:49:54 +09:00
< i > < small > Fees already paid by this transaction< span * ngIf = "hasAncestors" > and its unconfirmed ancestors< / span > < / small > < / i >
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
< / tbody >
< / table >
< / div >
< / div >
2023-08-30 16:49:54 +09:00
< br >
< h5 > How much more are you willing to pay?< / h5 >
2023-08-29 21:20:36 +09:00
< div class = "row" >
< div class = "col" >
< small class = "form-text text-muted mb-2" >
2023-08-30 16:49:54 +09:00
Choose the maximum extra transaction fee you're willing to pay to get into the next block.< br >
If the estimated next block rate rises beyond this limit, we will automatically cancel your acceleration request.
2023-08-29 21:20:36 +09:00
< / small >
< div class = "form-group" >
< div class = "fee-card" >
2023-08-30 16:49:54 +09:00
< div class = "d-flex mb-0" >
2023-08-29 21:20:36 +09:00
< ng-container * ngFor = "let option of maxRateOptions" >
< button type = "button" class = "btn btn-primary flex-grow-1 btn-border btn-sm feerate" [ class ] = " { active: selectFeeRateIndex = == option . index } " ( click ) = " setUserBid ( option ) " >
2023-11-22 16:38:58 +09:00
< span class = "fee" > {{ option.fee + estimate.mempoolBaseFee + estimate.vsizeFee | number }} < span class = "symbol" i18n = "shared.sats|sats" > sats< / span > < / span >
2023-09-03 16:05:12 +03:00
< span class = "rate" > ~< app-fee-rate [ fee ] = " option . rate " rounding = "1.0-0" > < / app-fee-rate > < / span >
2023-08-29 21:20:36 +09:00
< / button >
< / ng-container >
< / div >
2023-08-26 09:52:55 +02:00
< / div >
< / div >
< / div >
< / div >
2023-08-29 21:20:36 +09:00
2023-08-30 16:49:54 +09:00
< h5 > Acceleration summary< / h5 >
2023-08-29 21:20:36 +09:00
< div class = "row mb-3" >
< div class = "col" >
< table class = "table table-borderless table-border table-dark table-accelerator" >
< tbody >
2023-08-30 16:49:54 +09:00
<!-- ESTIMATED FEE -->
2023-11-22 16:38:58 +09:00
< ng-container >
2023-08-30 16:49:54 +09:00
< tr class = "group-first" >
< td class = "item" >
Next block market rate
< / td >
2023-11-23 14:54:50 +09:00
< td class = "amt" style = "font-size: 16px" >
2023-08-30 16:49:54 +09:00
{{ estimate.targetFeeRate | number : '1.0-0' }}
< / td >
< td class = "units" > < span class = "symbol" i18n = "shared.sat-vbyte|sat/vB" > sat/vB< / span > < / td >
< / tr >
< tr class = "info" >
< td class = "info" >
< i > < small > Estimated extra fee required< / small > < / i >
< / td >
< td class = "amt" >
{{ math.max(0, estimate.nextBlockFee - estimate.txSummary.effectiveFee) | number }}
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" > < app-fiat [ value ] = " math . max ( 0 , estimate . nextBlockFee - estimate . txSummary . effectiveFee ) " > < / app-fiat > < / span >
2023-08-30 16:49:54 +09:00
< / td >
< / tr >
< / ng-container >
2023-08-29 21:20:36 +09:00
<!-- MEMPOOL BASE FEE -->
< tr >
2023-08-30 16:49:54 +09:00
< td class = "item" >
Mempool Accelerator™ fees
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
2023-08-30 16:49:54 +09:00
< tr class = "info" >
< td class = "info" >
2023-08-29 21:20:36 +09:00
< i > < small > mempool.space fee< / small > < / i >
< / td >
2023-08-30 16:49:54 +09:00
< td class = "amt" >
+{{ estimate.mempoolBaseFee | number }}
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" > < app-fiat [ value ] = " estimate . mempoolBaseFee " > < / app-fiat > < / span >
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
2023-11-22 16:38:58 +09:00
< tr class = "info group-last" >
2023-08-30 16:49:54 +09:00
< td class = "info" >
2023-08-29 21:20:36 +09:00
< i > < small > Transaction vsize fee< / small > < / i >
< / td >
2023-08-30 16:49:54 +09:00
< td class = "amt" >
+{{ estimate.vsizeFee | number }}
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" > < app-fiat [ value ] = " estimate . vsizeFee " > < / app-fiat > < / span >
2023-08-29 21:20:36 +09:00
< / td >
< / tr >
2023-08-30 16:49:54 +09:00
2023-08-29 21:20:36 +09:00
<!-- NEXT BLOCK ESTIMATE -->
2023-11-22 16:38:58 +09:00
< ng-container >
< tr class = "group-first" style = "border-top: 1px dashed grey; border-collapse: collapse;" >
2023-08-30 16:49:54 +09:00
< td class = "item" >
< b style = "background-color: #5E35B1" class = "p-1 pl-0" > Estimated acceleration cost< / b >
< / td >
< td class = "amt" >
< span style = "background-color: #5E35B1" class = "p-1 pl-0" >
{{ estimate.cost + estimate.mempoolBaseFee + estimate.vsizeFee | number }}
< / span >
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" > < app-fiat [ value ] = " estimate . cost + estimate . mempoolBaseFee + estimate . vsizeFee " > < / app-fiat > < / span >
2023-08-30 16:49:54 +09:00
< / td >
< / tr >
2023-11-22 16:38:58 +09:00
< tr class = "info group-last" style = "border-bottom: 1px solid lightgrey" >
2023-11-23 14:54:50 +09:00
< td class = "info" colspan = 3 >
2023-08-30 16:49:54 +09:00
< i > < small > If your tx is accelerated to < / small > < small > {{ estimate.targetFeeRate | number : '1.0-0' }} < span class = "symbol" i18n = "shared.sat-vbyte|sat/vB" > sat/vB< / span > < / small > < / i >
< / td >
< / tr >
< / ng-container >
2023-08-29 21:20:36 +09:00
<!-- MAX COST -->
2023-11-22 16:38:58 +09:00
< ng-container >
2023-08-30 16:49:54 +09:00
< tr class = "group-first" >
< td class = "item" >
< b style = "background-color: #105fb0;" class = "p-1 pl-0" > Maximum acceleration cost< / b >
< / td >
< td class = "amt" >
< span style = "background-color: #105fb0" class = "p-1 pl-0" >
{{ maxCost | number }}
< / span >
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" >
2023-08-30 16:49:54 +09:00
< app-fiat [ value ] = " maxCost " [ colorClass ] = " estimate . userBalance < maxCost ? ' red-color ' : ' green-color ' " > < / app-fiat >
< / span >
< / td >
< / tr >
< tr class = "info group-last" >
2023-11-23 14:54:50 +09:00
< td class = "info" colspan = 3 >
2023-08-30 16:49:54 +09:00
< i > < small > If your tx is accelerated to < / small > < small > ~{{ ((estimate.txSummary.effectiveFee + userBid) / estimate.txSummary.effectiveVsize) | number : '1.0-0' }} < span class = "symbol" i18n = "shared.sat-vbyte|sat/vB" > sat/vB< / span > < / small > < / i >
< / td >
< / tr >
< / ng-container >
2023-08-29 21:20:36 +09:00
<!-- USER BALANCE -->
2023-09-03 12:20:30 +03:00
< ng-container * ngIf = "isLoggedIn() && estimate.userBalance < maxCost" >
2023-08-31 00:15:09 +09:00
< tr class = "group-first group-last" style = "border-top: 1px dashed grey" >
< td class = "item" >
Available balance
< / td >
< td class = "amt" >
{{ estimate.userBalance | number }}
< / td >
< td class = "units" >
< span class = "symbol" i18n = "shared.sats|sats" > sats< / span >
2023-11-23 14:54:50 +09:00
< span class = "fiat ml-1" >
2023-08-31 00:15:09 +09:00
< app-fiat [ value ] = " estimate . userBalance " [ colorClass ] = " estimate . userBalance < maxCost ? ' red-color ' : ' green-color ' " > < / app-fiat >
< / span >
< / td >
< / tr >
< / ng-container >
2023-09-03 12:20:30 +03:00
<!-- LOGIN CTA -->
< ng-container * ngIf = "!isLoggedIn()" >
< tr class = "group-first group-last" style = "border-top: 1px dashed grey" >
< td class = "item" > < / td >
< td class = "amt" > < / td >
< td class = "units d-flex" >
< a [ routerLink ] = " [ ' / login ' ] " [ queryParams ] = " { redirectTo: ' / tx / ' + tx . txid + ' # accelerate ' } " class = "btn btn-purple flex-grow-1" > Login< / a >
< / td >
< / tr >
< / ng-container >
2023-08-29 21:20:36 +09:00
< / tbody >
< / table >
< / div >
2023-08-26 09:52:55 +02:00
< / div >
2023-08-29 21:20:36 +09:00
< div class = "row mb-3" * ngIf = "isLoggedIn()" >
< div class = "col" >
< div class = "d-flex justify-content-end" >
< button class = "btn btn-sm btn-primary btn-success" style = "width: 150px" ( click ) = " accelerate ( ) " > Accelerate< / button >
< / div >
2023-08-26 09:52:55 +02:00
< / div >
< / div >
2023-08-29 21:20:36 +09:00
2023-08-26 09:52:55 +02:00
< / div >
2023-08-29 21:20:36 +09:00
< / ng-container >
< / div >