// plugins
this.g.plugins({
    tooltip: true,
    grouping: true,
    critical_path: true,
    auto_scheduling: true,
    multiselect: true,
    marker: true,
    fullscreen: true
});

// configures the "locale" structure
this.initLocale();

// enables auto scheduling
this.g.config.auto_scheduling = true; // Autoscheduling necessary for coloring unsatisfied *individual* dependency constraint => block *individual* autoscheduling via onBeforeTaskAutoSchedule 

// disables usage of time contraints for tasks
// added in version 6.1
this.g.config.auto_scheduling_compatibility = true;

// allows or forbids creation of links from parent tasks (projects) to their children
this.g.config.auto_scheduling_descendant_links = false; // even if same OT, should not be allowed

// defines whether Gantt will do autoscheduling on data loading
this.g.config.auto_scheduling_initial = _StringUtils.getValue(aCfg.scheduling.dependencial.bExecuteOnLoad, false);

// defines whether the whole project will be moved (see the details below)
// added in version 4.1
this.g.config.auto_scheduling_move_projects = true;

// enables the auto scheduling mode, in which tasks will always be rescheduled to the earliest possible date
this.g.config.auto_scheduling_strict = _StringUtils.getValue(aCfg.scheduling.dependencial.bStrict, false);

// automatically converts tasks with subtasks to projects and projects without subtasks back to tasks
// added in version 
this.g.config.auto_types = true;

// enables automatic adjusting of the grid's columns to the grid's width
this.g.config.autofit = false;

// enables autoscrolling while dragging a task or link out of the current browser screen
// added in version 4.2
this.g.config.autoscroll = true;

// defines the speed of autoscrolling (in ms) while dragging a task or link out of the current browser screen
// added in version 4.2
this.g.config.autoscroll_speed = 50;

// forces the Gantt chart to automatically change its size to show all tasks without scrolling
this.g.config.autosize = false;

// sets the minimum width (in pixels) that the Gantt chart can take in the horizontal 'autosize' mode
this.g.config.autosize_min_width = 0;

// enables the dynamic loading in the Gantt chart
this.g.config.branch_loading = true;

// specifies that the task has children that are not yet loaded from the backend
// added in version 5
this.g.config.branch_loading_property = "bHasChildren";

// stores a collection of buttons resided in the left bottom corner of the lightbox
this.g.config.buttons_left = [];

// stores a collection of buttons resided in the right bottom corner of the lightbox
this.g.config.buttons_right = [];

// changes the name of the property that affects binding of a calendar to a task/group of tasks
// added in version 4.2
this.g.config.calendar_property = "calendar_id";

// enables cascade deleting of nested tasks and links
// added in version 4.2
this.g.config.cascade_delete = false;

// enables advanced drag-n-drop
// added in version 6
this.g.config.click_drag = {
    // (string) sets a custom CSS class for a selected element
    className: "clSelected",
    // (function) a function that creates an element rendered during dragging. Takes two parameters:
    // aStartPoint - (object) - an object of the type:
    // {absolute: {left: number, top: number}, relative: {left: number, top: number} }, 
    // where absolute - the coordinates of the left top corner of the document, and relative - the coordinates of the left top element used as a viewPort
    // aEndPoint - (object) an object of the type: 
    // {absolute: {left: number, top: number}, relative: {left: number, top: number} }, 
    // where absolute - the coordinates of the left top corner of the document, and relative - the coordinates of the left top element used as a viewPort
    render: function (aStartPoint, aEndPoint) {
        //
    },
    // (HTMLElement) the element to attach an event to and select
    viewPort: {},
    // (boolean) defines whether requestAnimationFrame is used during rendering
    useRequestAnimationFrame: false,
    // (function) - a function that will be called when the mouse button is released. Takes 6 parameters:
    // - aStartPoint - (object) - an object of the type: 
    // {absolute: {left: number, top: number}, relative: {left: number, top: number} }, 
    // where absolute - the coordinates of the left top corner of the document, and relative - the coordinates of the left top element used as a viewPort
    // - aEndPoint - (object) an object of the type: 
    // {absolute: {left: number, top: number}, relative: {left: number, top: number} }, 
    // where absolute - the coordinates of the left top corner of the document, and relative - the coordinates of the left top element used as a viewPort
    // - aStartDate - (Date) the date that corresponds to the starting point
    // - aEndDate - (Date) the date that corresponds to the ending point
    // - aTasksBetweenDates - (array) an array of tasks between the start and end date points
    // - aTasksInRows - (array) an array of tasks selected between the start and end coordinates vertically
    // - aSingleRow - (boolean) true to add selection only in one row equal to the height of a task
    callback: function (aStartPoint, aEndPoint, aStartDate, aEndDate, aTasksBetweenDates, aTasksInRows, aSingleRow) {
        //
    }
};

// configures the columns of the table 
// this.g.config.columns
this.initColumns();

// contains all available constraint types
// added in version 6.1
this.g.config.constraint_types = {
    // As Soon As Possible
    // ASAP: "asap",
    // As Late As Possible
    // ALAP: "alap",
    // Start No Earlier Than
    // SNET: "snet",
    // Start No Later Than
    // SNLT: "snlt",
    // Finish No Earlier Than
    // FNET: "fnet",
    // Finish No Later Than
    // FNLT: "fnlt",
    // Must Start On
    // MSO: "mso",
    // Must Finish On
    // MFO: "mfo"
};

// enables adjusting the task's start and end dates to the work time (while dragging)
this.g.config.correct_work_time = false; // DHTMLX bug around 'fixStart()' if activated, when using 'hour' unit but 'day' scale for example

// "halfday" custom time unit => (sub)scales
this.g.date.halfday_start = function (aDate) {
    return new Date(aDate).withoutTime().addHours(aDate.getHours() < 11 // 11 = noon
        ? 0
        : 12);
};
this.g.date.add_halfday = function (aDate, aIncrement) {
    return new Date(aDate).addHours(12 * aIncrement);
};

// "quarter" custom time unit => (sub)scales
this.g.date.quarter_start = function (aDate) {
    return new Date(this.getQuarterStart(aDate, true));
}.bind(this);
this.g.date.add_quarter = function (aDate, aIncrement) {
    return new Date(aDate).addMonths(3 * aIncrement);
};

// sets the date format that is used to parse data from a data set and to send dates back to the server
this.g.config.date_format = _StringUtils.getValue(aCfg.displaySettings.sDateTimeFormat, "%Y-%m-%d %H:%i");

// sets the format of dates in the "Start time" column of the table
this.g.config.date_grid = _StringUtils.getValue(aCfg.displaySettings.sDateTimeFormat, "%Y-%m-%d %H:%i");

// 'says' to open the lightbox while creating new events by clicking on the '+' button
this.g.config.details_on_create = true;

// 'says' to open the lightbox after double clicking on a task
this.g.config.details_on_dblclick = true;

// enables the possibility to drag the lightbox by the header
this.g.config.drag_lightbox = true;

// enables creating dependency links by drag-and-drop
this.g.config.drag_links = _StringUtils.getValue(aCfg.bAllowCreationOfDependency, false);

// stores the types of available drag-and-drop modes
this.g.config.drag_mode = {
    resize: "resize",
    progress: "progress",
    move: "move",
    ignore: "ignore"
};

// enables the possibility to move tasks by drag-and-drop
this.g.config.drag_move = true;

// enables the possibility to change the task progress by dragging the progress knob
this.g.config.drag_progress = _StringUtils.getValue(aCfg.displaySettings.bDisplayProgressKnob, false);

// enables drag and drop of items of the project type
// added in version 5
this.g.config.drag_project = true;

// enables the possibility to resize tasks by drag-and-drop
this.g.config.drag_resize = true;

// sets the number of 'config.duration_unit' units that will correspond to one unit of the 'duration' data property
this.g.config.duration_step = _StringUtils.getValue(aCfg.displaySettings.fDurationStep, aCfg.displaySettings.sTimeUnit == CPlanning.tuHalfDay ? 12 : 1);//config not implemented

// sets the duration unit
this.g.config.duration_unit = _StringUtils.getValue(CGantt.timeUnits[aCfg.displaySettings.sTimeUnit], this.g.config.scaleUnits.suHour);

// changes the name of a property that affects the editing ability of tasks/links in the read-only Gantt chart
this.g.config.editable_property = "bIsEditable";

// an object that contains definitions of inline editors
// added in version 6
this.g.config.editor_types = {
    // There are several predefined inline editors:
    // - text editor - for editing text columns, e.g. task name
    // - number editor - for editing number columns, e.g. task duration, order, etc.
    // - date editor - for editing date columns, e.g. start and end dates of the task
    // - select editor - for choosing an option from a list
    // - predecessor editor - for setting task-predecessor for the currently edited task. This editor gets the WBS codes of tasks to set connection with the predecessor task.
    txEditor: {
        // called when input is displayed, put html markup of the editor into placeholder 
        // and initialize your editor if needed:
        // function (id, column, config, placeholder) {
        //  var html = "<div><input type='text' name='" + column.name + "'></div>";
        //  placeholder.innerHTML = html;
        // },
        show: function (aId, aColumn, aConfig, aPlaceholder) {
            //
        },
        // called when input is displayed, put html markup of the editor into placeholder 
        // and initialize your editor if needed:
        hide: function () {
            //
        },
        // set input value
        set_value: function (aValue, aId, aColumn, aNode) {
            //
        },
        // return input value
        get_value: function (id, column, node) {
            //
        },
        // called before save/close. Return true if new value differs from the original one
        // returning true will trigger saving changes, returning false will skip saving 
        is_changed: function (aValue, aId, aColumn, aNode) {
            //
        },
        // validate, changes will be discarded if the method returns false
        is_valid: function (aValue, aId, aColumn, aNode) {
            //
        },
        // only for inputs with map_to:auto. complex save behavior goes here
        save: function (aId, aColumn, aNode) {
            //
        },
        focus: function (aNode) {
            //
        }
    }
};

// sets the end value of the time scale
this.g.config.end_date = new Date(this.resourceEndDate);

// 'says' the Gantt chart to re-render the scale each time a task doesn't fit into the existing scale interval
this.g.config.fit_tasks = _StringUtils.getValue(aCfg.displaySettings.bFitTasks, true); // config not implemented

// sets the name of the attribute of the grid resizer's DOM element
this.g.config.grid_resizer_attribute = "sGridResizer";

// sets the name of the attribute of the column resizer's DOM element. The attribute presents the column's index
this.g.config.grid_resizer_column_attribute = "iColumnIndex";

// sets the maximum width of the grid
this.g.config.grid_width = _StringUtils.getValue(aCfg.displaySettings.iColumnWidth, 425);

// shows the critical path in the chart
this.g.config.highlight_critical_path = false;

// defines whether tasks should inherit work calendars from their summary parents
// added in version 6
this.g.config.inherit_calendar = false;

// specifies whether sub-scales shall use the scale_cell_class template by default
this.g.config.inherit_scale_class = false;

// sets whether the timeline area will be initially scrolled to display the earliest task
this.g.config.initial_scroll = false;

// keeps the duration of a task unchanged during editing of the start/end of a task
// added in version 6
this.g.config.inline_editors_date_processing = "keepDuration";

// 'says' to preserve the initial grid's width during resizing the columns within
this.g.config.keep_grid_width = true;

// enables keyboard navigation in Gantt
this.g.config.keyboard_navigation = true;

// enables keyboard navigation by cells
this.g.config.keyboard_navigation_cells = false;

// sets the name of the attribute of the task layer's DOM element
this.g.config.layer_attribute = "sDataLayer";

// specifies the layout object
// added in version 5
this.g.config.layout = {
    css: "gantt_container",
    rows: [
        {
            cols: [
                { view: "grid", group: "grids", scrollY: "scrollVer" },
                { resizer: true, width: 1 },
                { view: "timeline", scrollX: "scrollHor", scrollY: "scrollVer" },
                { view: "scrollbar", id: "scrollVer", group: "vertical" }
            ]
        },
        { view: "scrollbar", id: "scrollHor" }
    ]
};

// specifies the lightbox object
this.g.config.lightbox = {
    sections: [
        { name: "description", height: 38, map_to: "text", type: "textarea", focus: true },
        { name: "priority", height: 22, map_to: "priority", type: "select", options: [] },
        { name: "time", height: 72, type: "duration", map_to: "auto" }
    ]
};

// increases the height of the lightbox
this.g.config.lightbox_additional_height = 75

// sets the size of the link arrow
this.g.config.link_arrow_size = 8;

// sets the name of the attribute that will specify the id of the link's HTML element
this.g.config.link_attribute = "idLink";

// sets the width of dependency links in the timeline area
this.g.config.link_line_width = 2;

// sets the width of the area (over the link) sensitive to clicks
this.g.config.link_wrapper_width = 20;

// stores the types of links dependencies
this.g.config.links = {
    finish_to_start: "0",
    start_to_start: "1",
    finish_to_finish: "2",
    start_to_finish: "3"
};

// sets the minimum width for a column in the timeline area
this.g.config.min_column_width = this.iDefaultColumnWidth;

this.g.config.time_step = _StringUtils.getValue(aCfg.iDatePrecisionInMn, 30);
// sets the minimum duration (in milliseconds) that can be set for a task during resizing.
this.g.config.min_duration = this.g.config.time_step * 60 * 1000;

// sets the minumum width for the grid (in pixels) while being resized
this.g.config.min_grid_column_width = _StringUtils.getValue(aCfg.displaySettings.iMinGridColWidthInPx, 20);

// enables/disables multi-task selection in the Gantt chart
this.g.config.multiselect = true;

// specifies whether multi-task selection will be available within one or any level
this.g.config.multiselect_one_level = false;

// enables the possibility to expand/collapse split tasks by clicking the +/- button
// added in version 6
this.g.config.open_split_tasks = true;

// openes all branches initially
this.g.config.open_tree_initially = false;

// activates the 'branch' mode that allows dragging tasks only within the parent branch
this.g.config.order_branch = _StringUtils.getValue(aCfg.displaySettings.bAllowDragDropInTree, true);

// activates the 'branch' mode that allows dragging tasks within the whole Gantt
this.g.config.order_branch_free = _StringUtils.getValue(aCfg.displaySettings.bAllowDragDropInTree, true);

// adds an empty row into the end of the list of tasks to simplify tasks editing via keyboard
// added in version 6
this.g.config.placeholder_task = false;

// preserves the current position of the vertical and horizontal scrolls while re-drawing the Gantt chart
this.g.config.preserve_scroll = true;

// specifies whether the Gantt container should block the mousewheel event, or should it be propagated up to the window element
this.g.config.prevent_default_scroll = false;

// enables/disables parsing of the resource assignments
// added in v7.1
this.g.config.process_resource_assignments = false;

// specifies the end date of a project
// added in version 6
this.g.config.project_end = null;

// specifies the start date of a project
// added in version 6
this.g.config.project_start = null;

// defines whether the task form will appear from the left/right side of the screen or near the selected task
this.g.config.quick_info_detached = true;

// stores a collection of buttons resided in the pop-up task's details form
this.g.config.quickinfo_buttons = ["icon_delete", "icon_edit"];

// activates the read-only mode for the Gantt chart
this.g.config.readonly = _StringUtils.getValue(aCfg.bReadOnlyMode, false);

// changes the name of a property that affects the read-only behaviour of tasks/links
this.g.config.readonly_property = "bReadOnly";

// enables the Redo functionality for the Gantt
this.g.config.redo = true;

// defines a set of working calendars that can be assigned to a specific resource, e.g. a user
// added in version 4.2
/*this.g.config.resource_calendars = {
    "user": {
        1: this.g.addCalendar({
            worktime: {
                days: [0, 1, 1, 1, 1, 1, 0]
            }
        })
    }
};*/

// specifies a property of the task object which stores a resource id associated with resourceGrid/resourceTimeline
// added in version 5
this.g.config.resource_property = "assignments";

// tells the resource timeline to render elements and call templates for non-allocated cells
// added in version 6
this.g.config.resource_render_empty_cells = true;

// specifies the name of the dataStore connected to the resourceGrid/resourceTimeline
// added in version 5
this.g.config.resource_store = "resourceLists";

// sets the id of the virtual root element
this.g.config.root_id = 0;

// enables rounding the task's start and end dates to the nearest scale marks
this.g.config.round_dnd_dates = _StringUtils.getValue(aCfg.bMagneticGrid, false);

// sets the default height for rows of the table
this.g.config.row_height = 22;

// switches Gantt to the right-to-left mode
// added in version 5
this.g.config.rtl = false;

this.g.config.scale_height = 35;

// sets the minimal scale unit (in case multiple scales are used) as the interval of leading/closing empty space
this.g.config.scale_offset_minimal = true;

// defines configuration settings of the time scale
// added in version 6
// this.g.config.scales
// => switchScale();

// enables backward scheduling
// added in version 6
this.g.config.schedule_from_end = false;

// specifies whether the timeline area shall be scrolled while selecting to display the selected task
// Warning : do not activate to not scroll all the time. The scroll is control in event "onBeforeTaskSelected"
this.g.config.scroll_on_click = false;

// set the sizes of the vertical (width) and horizontal (height) scrolls
// added in version 5
this.g.config.scroll_size = 20;

// enables selection of tasks in the Gantt chart
this.g.config.select_task = true;

// enables converting server-side dates from UTC to a local time zone (and backward) while sending data to the server
this.g.config.server_utc = false;

// shows the chart (timeline) area of the Gantt chart
this.g.config.show_chart = true;

// enables showing error alerts in case of unexpected behavior
this.g.config.show_errors = true;

// shows the grid area of the Gantt chart
this.g.config.show_grid = true;

// enables/disables displaying links in the Gantt chart
this.g.config.show_links = true;

// shows/hides markers on the page
this.g.config.show_markers = true;

// enables displaying of the progress inside the task bars
this.g.config.show_progress = true;

// activates/disables the 'quick_info' extension (pop-up task's details form)
this.g.config.show_quick_info = true;

// enables/disables displaying column borders in the chart area
this.g.config.show_task_cells = true;

// enables showing tasks that are outside the specified date range in the Gantt chart
// added in v6.3
this.g.config.show_tasks_outside_timescale = true;

// enables showing unscheduled tasks
this.g.config.show_unscheduled = true; // always true displaySettings.bDisplayUnscheduledTasks -> bIsDefaultSchedule

// hides non-working time from the time scale
this.g.config.skip_off_time = !_StringUtils.getValue(aCfg.displaySettings.bDisplayOfftime, false);

// enables the smart rendering mode for Gantt's tasks and links rendering
this.g.config.smart_rendering = true;

// specifies that only visible part of the time scale is rendered on the screen
this.g.config.smart_scales = true;

// enables sorting in the table
this.g.config.sort = !_StringUtils.getValue(aCfg.displaySettings.bAllowDragDropInTree, true);

// sets the start value of the time scale
this.g.config.start_date = new Date(this.resourceStartDate);

// sets the start day of weeks
this.g.config.start_on_monday = true;

// generates a background image for the timeline area instead of rendering actual columns' and rows' lines
this.g.config.static_background = true;

// enables rendering of highlighted cells in the static_background mode
// added in version 6
this.g.config.static_background_cells = true;

// sets the name of the attribute that will specify the id of the task's HTML element
this.g.config.task_attribute = "sTaskId";

// sets the format of the date label in the 'Time period' section of the lightbox. see https:// docs.dhtmlx.com/gantt/desktop__date_format.html
this.g.config.task_date = "%d %F %Y";

// sets the height of task bars in the timeline area
this.g.config.task_height = Math.floor(this.g.config.row_height * 5 / 6); // to avoid any problem with infinite decimal such as 18,33333...

// sets the offset (in pixels) of the nearest task from the left border in the timeline
this.g.config.task_scroll_offset = 100;

// sets the format of the time drop-down selector in the lightbox. see https:// docs.dhtmlx.com/gantt/desktop__date_format.html
this.g.config.time_picker = "%H:%i";

// sets the minimum step (in minutes) for the task's time values
// this.g.config.time_step
// => above

// sets the length of time, in milliseconds, before the tooltip hides
this.g.config.tooltip_hide_timeout = 50;

// sets the the right (if positive) offset of the tooltip's position
this.g.config.tooltip_offset_x = 10;

// sets the the top (if positive) offset of the tooltip's position
this.g.config.tooltip_offset_y = 20;

// sets the timeout in milliseconds before the tooltip is displayed for a task
this.g.config.tooltip_timeout = 10;

// enables/disables the touch support for the Gantt chart. true / 'force' / false 
this.g.config.touch = false;

// defines the time period in milliseconds that is used to differ the long touch gesture from the scroll gesture
this.g.config.touch_drag = 500;

// returns vibration feedback before/after drag and drop on touch devices
this.g.config.touch_feedback = true;

// defines the duration of vibration feedback before/after drag and drop on touch devices (in milliseconds)
this.g.config.touch_feedback_duration = 1;

// redefines functions responsible for displaying different types of tasks
this.g.config.type_renderers = {};

// stores the names of lightbox's structures (used for different types of tasks)
//this.g.config.types => CGantt

// enables the Undo functionality for the Gantt
// added in version 4.0
this.g.config.undo = true;

// sets the actions that the Undo operation will revert
// added in version 4.0
this.g.config.undo_actions = {
    update: "update",
    remove: "remove",
    add: "add"
};

// sets the number of steps that should be reverted by the undo method
// added in version 4.0
this.g.config.undo_steps = 100;

// sets the types of entities for which the Undo operation will be applied
// added in version 4.0
this.g.config.undo_types = {
    link: "link",
    task: "task"
};

// enables WAI-ARIA support to make the component recognizable for screen readers
// added in version 4.1
this.g.config.wai_aria_attributes = false;

// enables calculating the duration of tasks in working time instead of calendar time
this.g.config.work_time = this.initWorktime(aCfg); // enable if at least one of the worktime calendars isn't 24/7