prefix=":) {{dynamicTitleText}}"
suffix="Sandbox">
</eg-title>
-
+<eg-help-popover [placement]="'right'" helpText="This page is for random ng stuff!"></eg-help-popover>
<div class="row flex pt-2">
<div i18n> Modify Page Title: </div>
<div class="col-lg-2">
(ngModelChange)="record[field.name]($event)">
</textarea>
</ng-template>
+ <!-- note: fieldOptions would be best defined in the .ts file, but
+ want to demostrate it can be set in the template as well -->
<eg-fm-record-editor #fmRecordEditor
idlClass="cmrcfld" mode="create"
- [customFieldTemplates]="{description:{template:descriptionTemplate,context:{'hello':'goodbye'}}}"
+ [fieldOptions]="{marc_record_type:{customValues:[{id:'biblio'},{id:'serial'},{id:'authority'}]},description:{customTemplate:{template:descriptionTemplate,context:{'hello':'goodbye'}}}}"
recordId="1" orgDefaultAllowed="owner">
</eg-fm-record-editor>
- <button class="btn btn-dark" (click)="fmRecordEditor.open({size:'lg'})">
+ <button class="btn btn-dark" (click)="openEditor()">
Fm Record Editor
</button>
</div>
<div class="row mb-3">
<div class="col-lg-3">
<button class="btn btn-outline-danger" (click)="progress.increment()">Increment Inline</button>
+ <eg-help-popover [placement]="'bottom'" helpText="Exercise your clicking finger by clicking the button above.">
+ </eg-help-popover>
</div>
<div class="col-lg-3">
<eg-progress-inline [max]="100" [value]="1" #progress></eg-progress-inline>
<button class="btn btn-light" (click)="showProgress()">Test Progress Dialog</button>
</div>
<div class="col-lg-3">
+ <eg-help-popover helpLink="https://www.youtube.com/watch?v=dQw4w9WgXcQ" helpText="This popover is supposed to help or something...!"></eg-help-popover>
<eg-combobox [allowFreeText]="true"
placeholder="Combobox with static data"
[entries]="cbEntries"></eg-combobox>
</div>
<div class="col-lg-3">
+ <eg-help-popover helpText="You have to type to see any options in this dropdown."></eg-help-popover>
<eg-combobox
placeholder="Combobox with dynamic data"
[asyncDataSource]="cbAsyncSource"></eg-combobox>
</div>
<div class="row mb-3">
<div class="col-lg-4">
+ <eg-help-popover helpText="If you like Toast you must click below!" placement="'auto'"></eg-help-popover>
<button class="btn btn-info" (click)="testToast()">Test Toast Message</button>
</div>
<div class="col-lg-2">
<button class="btn btn-secondary" (click)="doPrint()">Test Print</button>
<ng-template #printTemplate let-context>Hello, {{context.world}}!</ng-template>
+<button class="btn btn-secondary" (click)="printWithDialog()">Print with dialog</button>
+
<br/><br/>
<div class="row">
<div class="col-lg-3">
</div>
<br/><br/>
+<div>
+ <h4>Cross-tab communications example</h4>
+ <p>To test, open this sandbox in a second browser tab. Enter something in the input box below, then switch to the other tab and click anywhere on the page.
+ You should see the message that you sent to the other browser tab.</p>
+</div>
+<div class="row">
+ <div class="col-lg-3">
+ <input type="text" #sendSbMessage placeholder="message to send to another tab" size="40" (change)="sendMessage($event)">
+ </div>
+ <div class="col-lg-3">
+ message received: {{sbChannelText}}
+ </div>
+</div>
+
<!-- grid stuff -->
<ng-template #cellTmpl let-row="row" let-col="col" let-userContext="userContext">
HELLO {{userContext.hello}}
[cellClassCallback]="btGridCellClassCallback"
[sortable]="true">
<eg-grid-toolbar-action label="Action that needs a single row" i18n-label
- [action]="complimentEvergreen" [disableOnRows]="notOneSelectedRow">
+ (onClick)="complimentEvergreen($event)" [disableOnRows]="notOneSelectedRow">
+ </eg-grid-toolbar-action>
+ <eg-grid-toolbar-action [isSeparator]="true">
+ </eg-grid-toolbar-action>
+ <eg-grid-toolbar-action label="Another Action" i18n-label
+ (onClick)="complimentEvergreen2($event)">
</eg-grid-toolbar-action>
<eg-grid-column name="test" [cellTemplate]="cellTmpl"
[cellContext]="btGridTestContext" [sortable]="false">