src/app/shared/file-drop/component/file-drop.component.stories.ts

/********************************************************************************
 * Copyright (c) 2020 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 *
 * SPDX-License-Identifier: EPL-2.0
 ********************************************************************************/

import {action} from "@storybook/addon-actions";
import {boolean, number, withKnobs} from "@storybook/addon-knobs";
import {moduleMetadata, storiesOf} from "@storybook/angular";
import {FileDropModule} from "../file-drop.module";

storiesOf("Shared", module)
    .addDecorator(withKnobs)
    .addDecorator(moduleMetadata({imports: [FileDropModule]}))
    .add("FileDropComponent", () => ({
        template: `
            <app-file-drop
                #fileDrop
                style="margin: 1em;"
                [appDisabled]="appDisabled"
                (appValueChange)="appValueChange($event)"
                (appValueDelete)="appValueDelete($event)"
                >
            </app-file-drop>
            <div>
                <button (click)="fileDrop.openDialog();" class="openk-button" style="margin: 0 1em;">
                    Open Dialog
                </button>
            </div>
        `,
        props: {
            getFiles: (length) => getFiles(length),
            appDisabled: boolean("appDisabled", false),
            numberOfFiles: number("Number of files", 2, {min: 0, max: 30, step: 1, range: true}),
            appValueChange: action("appValueChange"),
            appValueDelete: action("appValueDelete")
        }
    }));

function getFiles(length): File[] {
    return Array(length)
        .fill(0)
        .map((_, id) => {
            const fileBits = Array((id + 1) * 1024)
                .fill(0)
                .map(() => "" + Math.floor(Math.random() * 8));
            return new File(fileBits, `New File (${id}).txt`);
        });
}