@pineapplegr/fm-bryntum-driver NPM

Fm-Bryntum-Driver

Overview

fmBryntumDriver is a JavaScript library designed to provide seamless integration with Bryntum components. The library is compiled and bundled into dist/index.js.

Installation

To install the library, you can use npm or yarn:

npm install @pineapplegr/fm-bryntum-driver

yarn add @pineapplegr/fm-bryntum-driver

Usage

To use the library in your project, import it as follows:

import { ... } from '@pineapplegr/fm-bryntum-driver';

The module uses environment variables for some constansts. Adding a .env file will change the values to ones you want

Development data path.
- VITE_FMBRYNTUM_DRIVER_DEV_DATA_PATH
- Default value: /data/data.json
FMGofer script name
- VITE_FMBRYNTUM_DRIVER_FMGOFER_SCRIPT_NAME
- Default value: FMGofer

Features

Component Integration: Easily integrate Bryntum components into your FileMaker application.
FileMaker-Bryntum Data Integration: Simplify the way data is synced with FileMaker
Customizable dataStoreKeys: Get the data in the way you need. Users have the ability to customize the dataStoreSchema to conform with any changes made in Bryntum

Example

Here is a basic example of how to use fmBryntumDriver:

import { fetchProjectData } from '@pineapplegr/fm-bryntum-driver';
import { getFmProps } from '/fm/fmProps.js'

async function initializeScheduler() {
    // Get FM Props
    const props = getFmProps();
    window._UpdatePhantomIds = updatePhantomIds;
    const projectData = await fetchProjectData();

    const myScheduler = new SchedulerPro({
        appendTo: 'app',
        startDate: '2024-03-11T06:00',
        endDate: '2024-03-11T20:00',
        project: {
            autoLoad: true,
            addConstraintOnDateSet: false,
            eventStore: {
                useRawData: false,
            },
        },
    });
    // Called for data changes that are persistable
    myScheduler.project.on({
        hasChanges() {
            let { changes } = this;

            // Remove resourceTimeRanges from the changes if it exists
            if (changes.resourceTimeRanges) {
                delete changes.resourceTimeRanges;
            }

            // If there are other changes left, call updateProjectData
            if (Object.keys(changes).length > 0) {
                const response = updateProjectData(changes);
                this.acceptChanges();
            }
        },
    });

    // Load the project data
    await myScheduler.project.loadInlineData(projectData);
}

document.addEventListener('DOMContentLoaded', initializeScheduler);