How to use @deja-js/component - 10 common examples

To help you get started, we’ve selected a few @deja-js/component examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DSI-HUG / dejajs-components / projects / deja-js / component / tiles / tile-group-style-editor-config.ts View on Github external
constructor() {
        super();

        this.toolbarType = 'window';
        this.title = 'Modifier l\'apparence du groupe'; // TODO Lang
        this.actions = [
            new DejaPopupButton('confirm', 'Ok', 'done'), // TODO Lang
            new DejaPopupButton('cancel', 'Cancel', 'cancel'), // TODO Lang
        ];
        this.fullscreen = false;
        this.hasBackdrop = true;
        this.disableClose = true;
        this.contentComponentRef = TileGroupStyleEditorComponent;
    }
}
github DSI-HUG / dejajs-components / projects / deja-js / component / tiles / tile-group-style-editor-config.ts View on Github external
constructor() {
        super();

        this.toolbarType = 'window';
        this.title = 'Modifier l\'apparence du groupe'; // TODO Lang
        this.actions = [
            new DejaPopupButton('confirm', 'Ok', 'done'), // TODO Lang
            new DejaPopupButton('cancel', 'Cancel', 'cancel'), // TODO Lang
        ];
        this.fullscreen = false;
        this.hasBackdrop = true;
        this.disableClose = true;
        this.contentComponentRef = TileGroupStyleEditorComponent;
    }
}
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public showPopUp() {
        const config = new DejaPopupConfig();
        config.title = `Movable ${DejaPopupConfig.dialogCount + 1}`;
        config.content = '<h2>Movable Popup No Modal</h2>';
        config.content = [
            '<p></p><h3>First</h3> html line<p></p>',
            '<p></p><h3>Second</h3> html line<p></p><br><div> One More Line</div>',
        ];
        config.padding = true;
        config.actions = [
            new DejaPopupButton('close', 'Close', 'close'),
        ];
        config.width = '500px';
        config.height = '400px';
        config.toolbarColor = 'warn';

        this.dejaPopupService.openPopUp(config)
            // .filter((resp: DejaPopupReponse) =&gt; !!resp)
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public showUrlPdfFullscreen() {
        const conf = new DejaPopupConfig();
        conf.fullscreen = true;
        // conf.buttonFullscreenExit = false;
        this.showUrlPdf(conf);
    }
github DSI-HUG / dejajs-components / src / app / tiles / tiles-demo.ts View on Github external
map((country) => {
                const tile = new DejaTile();
                tile.percentBounds = new Rect(x1, y1, 15, 15);
                tile.color = country.color;
                tile.templateModel = country;

                x1 += 15;
                if (x1 + 15 > 100) {
                    x1 = 0;
                    y1 += 15;
                }

                // Map for drag and drop
                this.countriesMap.set(tile.id, country);

                return tile;
            }),
            reduce((acc: DejaTile[], cur: DejaTile) => [...acc, cur], []));
github DSI-HUG / dejajs-components / src / app / date-picker / date-picker-demo.ts View on Github external
templateUrl: './date-picker-demo.html',
})
export class DejaDatePickerDemoComponent implements OnInit {
    public tabIndex = 1;

    public theDate: Date = new Date();
    public theDateSelected: Date = new Date();

    public disabledDate = [0, 6, new Date(2016, 9, 12)];

    public dateRangeFrom: Date;
    public dateRangeTo: Date;
    public dateMin: Date;
    public dateMax: Date;

    public myLayout = DateComponentLayout.timeonly;

    constructor() {
    }

    public ngOnInit() {
        const now: Date = new Date();
        this.dateMin = new Date(now.getFullYear(), now.getMonth(), now.getDate() - 7);
        this.dateMax = new Date(now.getFullYear(), now.getMonth(), now.getDate());
        this.theDateSelected = new Date(now.getFullYear(), now.getMonth(), now.getDate() - 1);
        console.log(this.dateMin);
        console.log(this.dateMax);
    }

    public dateChange(date: Date) {
        console.log('dateChange', date);
    }
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public askConfirmationCustom() {

        const config = new DejaPopupConfig();
        config.data = { test: 'abcde' };
        config.toolbarIconName = 'accessibility';
        config.toolbarColor = 'accent';
        config.title = 'Dialog custom';

        config.actions = [
            new DejaPopupButton('confirm', 'Confirm', 'done'),
            new DejaPopupButton('undo', 'Undo', 'undo'),
            new DejaPopupButton('cancel', 'Cancel', 'cancel'),
        ];

        this.dejaPopupService.openCustom(
            DejaPopupCustomDemoComponent,
            config,
        )
            .subscribe((response: DejaPopupReponse) => {
                this.showResponse(response);
            });
    }
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public askConfirmation2() {

        const config = new DejaPopupConfig();

        config.width = '530px';
        const pos: DialogPosition = { bottom: '50px', right: '50px' };
        config.position = pos;
        config.disableClose = true;
        config.toolbarColor = 'danger';

        const title = 'System failure!';

        const body = '<p>You don\'t want to <b>Cancel</b> the operation.<br> Or you don\'t? </p>';

        const butYes = new DejaPopupButton('yes', 'Yes', 'check');
        const butNo = new DejaPopupButton('no', 'No', 'not_interested');
        const butCancel = new DejaPopupButton('cancel', 'Cancel', 'cancel');

        const actions = [butYes, butNo, butCancel];

        this.dejaPopupService
            .openInline(title, body, actions, config)
            .subscribe((response: DejaPopupReponse) =&gt; {
                this.showResponse(response);
            });
    }
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public showPopUpPdf() {
        const config = new DejaPopupConfig();
        config.title = `Pdf ${DejaPopupConfig.dialogCount}`;
        config.url = this.dummyPdfUrl;
        config.padding = false;
        config.toolbarIconName = 'photo_camera';
        config.toolbarColor = 'accent';

        config.toolbarActions = [
            new DejaPopupButton('account', 'User', 'account_circle', false),
            new DejaPopupButton('view', 'Show', 'visibility', false),
        ];

        config.ensureDimension();

        this.dejaPopupService.openPopUp(config).pipe(
            filter((resp: DejaPopupReponse) => !!resp))
            .subscribe((response: DejaPopupReponse) => {
                this.showResponse(response);
            });
    }
github DSI-HUG / dejajs-components / src / app / popup / popup-demo.ts View on Github external
public askConfirmation1() {
        const butSave = new DejaPopupButton('save', 'Save', 'save');
        const butCancel = new DejaPopupButton('cancel', 'Cancel', 'cancel');
        this.dejaPopupService
            .openInline(
            'Inscription à la formation',
            'Etes-vous sure de vouloir faire cela ?',
            [butSave, butCancel])
            .subscribe((response: DejaPopupReponse) => {
                this.showResponse(response);
            });
    }