File

src/smart-developer-tools/abl-dojo/abl-dojo.component.ts

Extends

AbstractFormChild

Implements

OnInit AfterViewInit

Metadata

selector abl-dojo
styleUrls ./abl-dojo.component.css
templateUrl ./abl-dojo.component.html

Index

Properties
Methods

Constructor

constructor(serviceAdapter: SmartServiceAdapter, smartHttp: SmartHttpService, errorHandler: SmartErrorHandlerService, injector: Injector)
Parameters :
Name Type Optional
serviceAdapter SmartServiceAdapter No
smartHttp SmartHttpService No
errorHandler SmartErrorHandlerService No
injector Injector No

Methods

executeAbl
executeAbl()
Returns : void
handleLayoutChange
handleLayoutChange(newLayout: literal type)
Parameters :
Name Type Optional
newLayout literal type No
Returns : void
Public onFileDrop
onFileDrop(file: NgxFileDropEntry[])
Parameters :
Name Type Optional
file NgxFileDropEntry[] No
Returns : void

Properties

ablResult
Type : string
Default value : ''
ablSource
Type : string
Default value : 'BLOCK-LEVEL ON ERROR UNDO, THROW.\n\n'
container
Type : ElementRef<HTMLElement>
Decorators :
@ViewChild('container', {read: ElementRef})
Public fileIsOver
Default value : false
height
Type : number
Public serviceAdapter
Type : SmartServiceAdapter
<div class="container-fluid" #container>
    <form class="form-horizontal">
      <div class="form-group">
        <ngx-file-drop dropZoneLabel="Drop files here" (onFileDrop)="onFileDrop($event)" 
        (onFileOver)="fileIsOver=true" (onFileLeave)="fileIsOver=false">
            <ng-template ngx-file-drop-content-tmp let-openFileSelector="openFileSelector">
              <abl-editor [(ablSource)]="ablSource" (ctrlXPressed)="executeAbl()" [ngClass]="{'file-is-over': fileIsOver, 'file-is-outside': !fileIsOver}"></abl-editor>
            </ng-template>  
        </ngx-file-drop>
      </div>
      <div class="form-group">
          <div class="col-12">

            <button (click)="executeAbl()" class="k-button">
                <i class="fa fa-play-circle"></i>
                <span>&nbsp;Execute (CTRL-X)</span>
            </button>
            &nbsp;&nbsp;&nbsp;
            <a href="help.consultingwerkcloud.com/smartcomponent_library/release/" target="_blank">Class Reference</a>

          </div>
      </div>
      <div class="form-group">
          <div class="col-12">
            <textarea class="k-textbox" placeholder="Result" readonly
                      name="inputAblResult" id="inputAblResult" [(ngModel)]="ablResult"></textarea>
          </div>
      </div>
  </form>
</div>

./abl-dojo.component.css

textarea {
    font-family: Courier;
    font-size: inherit;
    font-weight: bold !important;
 }
 
 #inputAblResult {
   width: 100%;
   height: 200px;
 }
 
 ::ng-deep abl-editor {
   width: 100% !important;
   height: 100% !important;
 }
 
 ::ng-deep abl-editor.file-is-over {
   border-width: 1px !important;
   border-style: solid !important;
   border-color: red !important;
   border-style: dashed !important;
 }
 ::ng-deep abl-editor.file-is-outside {
   border: none !important;
 }
 
 ::ng-deep div.ngx-file-drop {
   width: 100% !important;
   height: 100% !important;
 }
 
 ::ng-deep div.ngx-file-drop__drop-zone {
   width: 100% !important;
   height: 400px !important;
   border: none !important;
 }
 ::ng-deep div.ngx-file-drop__drop-zone--over {
   background-color: transparent !important;
 }
 ::ng-deep div.ngx-file-drop__content {
   width: 100% !important;
   height: 100% !important;
 }
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""