Add show all toggle for redeem scripts
This commit is contained in:
		
							parent
							
								
									9b9aaed757
								
							
						
					
					
						commit
						f840ac951b
					
				| @ -142,7 +142,16 @@ | ||||
|                         <ng-template #p2wsh> | ||||
|                           <td i18n="transactions-list.p2wsh-witness-script">P2WSH witness script</td> | ||||
|                         </ng-template> | ||||
|                         <td style="text-align: left;" [innerHTML]="vin.inner_witnessscript_asm | asmStyler"></td> | ||||
|                         <td style="text-align: left;"> | ||||
|                           <div [innerHTML]="vin.inner_witnessscript_asm | asmStyler:showFullScript[vindex]"></div> | ||||
|                           <div *ngIf="vin.inner_witnessscript_asm.length > 1000" style="display: flex;"> | ||||
|                             <span *ngIf="!showFullScript[vindex]">...</span> | ||||
|                             <label class="btn btn-sm btn-primary mt-2" (click)="toggleShowFullScript(vindex)" style="margin-left: auto;"> | ||||
|                               <span *ngIf="!showFullScript[vindex]" i18n="show-all">Show all</span> | ||||
|                               <span *ngIf="showFullScript[vindex]" i18n="show-less">Show less</span> | ||||
|                             </label> | ||||
|                           </div> | ||||
|                         </td> | ||||
|                       </tr> | ||||
|                       <tr> | ||||
|                         <td i18n="transactions-list.nsequence">nSequence</td> | ||||
|  | ||||
| @ -48,6 +48,7 @@ export class TransactionsListComponent implements OnInit, OnChanges { | ||||
|   transactionsLength: number = 0; | ||||
|   inputRowLimit: number = 12; | ||||
|   outputRowLimit: number = 12; | ||||
|   showFullScript: { [vinIndex: number]: boolean } = {}; | ||||
| 
 | ||||
|   constructor( | ||||
|     public stateService: StateService, | ||||
| @ -300,7 +301,9 @@ export class TransactionsListComponent implements OnInit, OnChanges { | ||||
|   toggleDetails(): void { | ||||
|     if (this.showDetails$.value === true) { | ||||
|       this.showDetails$.next(false); | ||||
|       this.showFullScript = {}; | ||||
|     } else { | ||||
|       this.showFullScript = this.transactions[0] ? this.transactions[0].vin.reduce((acc, _, i) => ({...acc, [i]: false}), {}) : {}; | ||||
|       this.showDetails$.next(true); | ||||
|     } | ||||
|   } | ||||
| @ -352,6 +355,10 @@ export class TransactionsListComponent implements OnInit, OnChanges { | ||||
|     return limit; | ||||
|   } | ||||
| 
 | ||||
|   toggleShowFullScript(vinIndex: number): void { | ||||
|     this.showFullScript[vinIndex] = !this.showFullScript[vinIndex]; | ||||
|   } | ||||
| 
 | ||||
|   ngOnDestroy(): void { | ||||
|     this.outspendsSubscription.unsubscribe(); | ||||
|     this.currencyChangeSubscription?.unsubscribe(); | ||||
|  | ||||
| @ -5,13 +5,18 @@ import { Pipe, PipeTransform } from '@angular/core'; | ||||
| }) | ||||
| export class AsmStylerPipe implements PipeTransform { | ||||
| 
 | ||||
|   transform(asm: string): string { | ||||
|   transform(asm: string, showAll = true): string { | ||||
|     const instructions = asm.split('OP_'); | ||||
|     let out = ''; | ||||
|     let chars = -3; | ||||
|     for (const instruction of instructions) { | ||||
|       if (instruction === '') { | ||||
|         continue; | ||||
|       } | ||||
|       if (!showAll && chars > 1000) { | ||||
|         break; | ||||
|       } | ||||
|       chars += instruction.length + 3; | ||||
|       out += this.addStyling(instruction); | ||||
|     } | ||||
|     return out; | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user