SummaryUpdating, SummaryBackgroundColors samples (JS)

GanttChartHyperLibraryDemos/Demos/Demos.csproj

@@ -454,6 +454,46 @@
     <Content Include="Samples\JavaScript\GanttChartView\Styling\index.html" />
     <Content Include="Samples\JavaScript\GanttChartView\Styling\templates.js" />
     <Content Include="Samples\JavaScript\GanttChartView\Styling\themes.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\app.css" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\app.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\index.html" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\bridge.min.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.Data.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.Data.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.HierarchicalData.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.Extras.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.React.Components.jsx" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.Vue.Components.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.React.Components.jsx" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.Vue.Components.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.UndoManagementLibrary.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.UndoManagementLibrary.min.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\templates.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\themes.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\app.css" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\app.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\index.html" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\bridge.min.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.Data.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.Data.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.HierarchicalData.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.Extras.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.React.Components.jsx" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.Vue.Components.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.Angular.Directives.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.HTML.Controls.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.React.Components.jsx" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.Vue.Components.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.UndoManagementLibrary.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.UndoManagementLibrary.min.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\templates.js" />
+    <Content Include="Samples\JavaScript\GanttChartView\SummaryUpdating\themes.js" />
     <Content Include="Samples\JavaScript\GanttChartView\TimeConstraints\app.css" />
     <Content Include="Samples\JavaScript\GanttChartView\TimeConstraints\app.js" />
     <Content Include="Samples\JavaScript\GanttChartView\TimeConstraints\index.html" />
@@ -1475,6 +1515,24 @@
     <None Include="Samples\Angular\ScheduleChartView\MainFeatures\Project\src\test.ts" />
     <TypeScriptCompile Include="Samples\Angular\PertChartView\MainFeatures\app.ts" />
     <TypeScriptCompile Include="Samples\Angular\ScheduleChartView\MainFeatures\app.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\bridge.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.Data.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.HierarchicalData.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.Angular.Components.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.Extras.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.Angular.Components.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.ProjectData.PertChart.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryBackgroundColors\Scripts\DlhSoft.UndoManagementLibrary.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\bridge.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.Data.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.HierarchicalData.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.Angular.Components.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.GanttChart.HTML.Controls.Extras.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.Angular.Components.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.ProjectData.PertChart.HTML.Controls.d.ts" />
+    <TypeScriptCompile Include="Samples\JavaScript\GanttChartView\SummaryUpdating\Scripts\DlhSoft.UndoManagementLibrary.d.ts" />
     <TypeScriptCompile Include="Samples\TypeScript\GanttChartView\Interruptions\app.ts" />
     <TypeScriptCompile Include="Scripts\bridge.d.ts" />
     <TypeScriptCompile Include="Scripts\DlhSoft.Data.HTML.Controls.d.ts" />

GanttChartHyperLibraryDemos/Demos/Samples/JavaScript/GanttChartView/SummaryBackgroundColors/Scripts/DlhSoft.Data.Angular.Directives.js

@@ -0,0 +1,243 @@
+// Version 1.1.0.0.
+var module = angular.module("DlhSoft.Data.Directives", []);
+dsDefineDDirective(module, "ContentControl");
+dsDefineDIDirective(module, "ItemsControl");
+dsDefineDDirective(module, "Button", ["click"]);
+dsDefineDDirective(module, "ToggleButton", ["toggle"]);
+dsDefineDDirective(module, "TextBox", undefined, true);
+dsDefineDDirective(module, "CalendarSelector", ["selectedTime"]);
+dsDefineDDirective(module, "Calendar", ["selectedDate"]);
+dsDefineDVDirective(module, "DatePicker");
+dsDefineDDirective(module, "CalendarDay", ["selectedTime", "header"]);
+dsDefineDVDirective(module, "TimePicker", ["header"]);
+dsDefineDVDirective(module, "DateTimePicker");
+dsDefineDCVDirective(module, "MultiSelectorComboBox");
+dsDefineDCVDirective(module, "ComboBox");
+dsDefineDCVDirective(module, "DropDownList");
+dsDefineDCDirective(module, "ToolTip");
+dsDefineDGDirective(module, "Grid");
+function dsDefineDDirective(module, directiveName, appendedScope, isChangeHandler, controlName) {
+    module.directive("ds" + directiveName, function () {
+        return {
+            restrict: "EAC",
+            replace: true,
+            transclude: true,
+            scope: getScope({
+                settings: "=",
+                license: "="
+            }, appendedScope, isChangeHandler),
+            template: "<div><ng-transclude></ng-transclude></div>",
+            link: function (scope, element) {
+                var controlElement = element[0];
+                var valueProperty = null;
+                var initialization = function () {
+                    var settings = scope.settings;
+                    if (!settings)
+                        settings = {};
+                    var license = scope.license;
+                    if (isChangeHandler) {
+                        valueProperty = appendedScope ? (appendedScope.indexOf("value") < 0 ? appendedScope[0] : "value") : "value";
+                        var changeHandler = settings.valueChangeHandler;
+                        if (!changeHandler)
+                            changeHandler = settings.changeHandler;
+                        settings.changeHandler = settings.valueChangeHandler = function (value) {
+                            if (changeHandler)
+                                changeHandler(value);
+                            scope[valueProperty] = value;
+                            scope.$apply();
+                            if (scope.change)
+                                scope.change(value);
+                        }
+                    }
+                    var component = DlhSoft.Controls[controlName ? controlName : directiveName].initialize.apply(this, getArguments([controlElement, settings, license], appendedScope, scope));
+                    if (isChangeHandler && component.setValue)
+                        component.setValue(valueProperty && scope[valueProperty] ? scope[valueProperty] : element.text());
+                }
+                initialization();
+                if (valueProperty) {
+                    scope.$watch(valueProperty, function (nv, ov) {
+                        if (nv == ov)
+                            return;
+                        var component = DlhSoft.Controls[controlName ? controlName : directiveName].get(controlElement);
+                        var newValue = scope[valueProperty];
+                        if (component.setValue && component.getValue && newValue != component.getValue())
+                            setTimeout(function () { component.setValue(newValue); });
+                    });
+                }
+            }
+        };
+    });
+}
+function dsDefineDVDirective(module, directiveName, appendedScope, controlName) {
+    dsDefineDDirective(module, directiveName, combineScopes(["value"], appendedScope), true, controlName);
+}
+function dsDefineDIDirective(module, directiveName, appendedScope, controlName) {
+    dsDefineDDirective(module, directiveName, combineScopes(["items"], appendedScope), true, controlName);
+}
+function dsDefineDCVDirective(module, directiveName, appendedScope, controlName) {
+    dsDefineDDirective(module, directiveName, combineScopes(["availableChoices", "value"], appendedScope), true, controlName);
+}
+function dsDefineDCDirective(module, directiveName, appendedScope, controlName) {
+    module.directive("ds" + directiveName, function () {
+        return {
+            restrict: "EAC",
+            replace: true,
+            transclude: true,
+            scope: getScope({
+                settings: "=",
+                license: "="
+            }, appendedScope),
+            template: "<div><ng-transclude></ng-transclude></div>",
+            link: function (scope, element) {
+                var controlElement = element[0];
+                var parent = element.parent();
+                var targetElement = parent[0];
+                var initialization = function () {
+                    var settings = scope.settings;
+                    if (!settings)
+                        settings = {};
+                    var license = scope.license;
+                    DlhSoft.Controls[controlName ? controlName : directiveName].initialize.apply(this, getArguments([controlElement, targetElement, settings, license], appendedScope, scope, 1));
+                }
+                initialization();
+            }
+        };
+    });
+}
+function dsDefineDGDirective(module, directiveName, controlName) {
+    module.directive("ds" + directiveName, function () {
+        return {
+            restrict: "EAC",
+            replace: true,
+            transclude: true,
+            scope: {
+                items: "=",
+                settings: "=",
+                change: "=",
+                autoRefresh: "@",
+                license: "="
+            },
+            template: "<div><ng-transclude></ng-transclude></div>",
+            link: function (scope, element) {
+                var controlElement = element[0];
+                var initialization = function () {
+                    var items = scope.items;
+                    if (!items)
+                        items = [];
+                    var settings = scope.settings;
+                    if (!settings)
+                        settings = {};
+                    var license = scope.license;
+                    var changeHandler = settings.itemPropertyChangeHandler;
+                    DlhSoft.Controls[controlName ? controlName : directiveName].initialize(controlElement, items, settings, license);
+                    if (scope.change) {
+                        settings.itemPropertyChangeHandler = function (item, propertyName, isDirect, isFinal) {
+                            if (changeHandler)
+                                changeHandler(item, propertyName, isDirect, isFinal);
+                            scope.change(item, propertyName, isDirect, isFinal);
+                        }
+                    }
+                }
+                initialization();
+                var isWaitingToRefresh = false;
+                var refresh = function () {
+                    if (isWaitingToRefresh)
+                        return;
+                    isWaitingToRefresh = true;
+                    setTimeout(function () {
+                        initialization();
+                        isWaitingToRefresh = false;
+                    });
+                }
+                setTimeout(function () {
+                    scope.$watch("items", refresh);
+                    scope.$watch("settings", refresh);
+                    if (scope.autoRefresh == "true")
+                        scope.$watch(refresh);
+                }, 0);
+            }
+        };
+    });
+}
+function combineScopes(scope, appendedScope) {
+    if (appendedScope) {
+        for (var i = 0; i < appendedScope.length; i++)
+            scope.push(appendedScope[i]);
+    }
+    return scope;
+}
+function getScope(scope, appendedScope, isChangeHandler) {
+    if (appendedScope) {
+        for (var i = 0; i < appendedScope.length; i++)
+            scope[appendedScope[i]] = "=";
+    }
+    else if (isChangeHandler)
+        scope["value"] = "=";
+    if (isChangeHandler)
+        scope["change"] = "=";
+    return scope;
+}
+function getArguments(arguments, appendedScope, scope, injectionIndex) {
+    if (typeof injectionIndex === "undefined")
+        injectionIndex = 0;
+    if (appendedScope) {
+        for (var i = 0; i < appendedScope.length; i++)
+            arguments.splice(i + injectionIndex + 1, 0, scope[appendedScope[i]]);
+    }
+    return arguments;
+}
+function dsDefineHDDirective(module, directiveName, controlName) {
+    module.directive("ds" + directiveName, function () {
+        return {
+            restrict: "EAC",
+            replace: true,
+            transclude: true,
+            scope: {
+                items: "=",
+                settings: "=",
+                change: "=",
+                autoRefresh: "@",
+                license: "="
+            },
+            template: "<div><ng-transclude></ng-transclude></div>",
+            link: function (scope, element) {
+                var controlElement = element[0];
+                var initialization = function () {
+                    var items = scope.items;
+                    if (!items)
+                        items = [];
+                    var settings = scope.settings;
+                    if (!settings)
+                        settings = {};
+                    var license = scope.license;
+                    var changeHandler = settings.itemPropertyChangeHandler;
+                    DlhSoft.Controls[controlName ? controlName : directiveName].initialize(controlElement, items, settings, license);
+                    if (scope.change) {
+                        settings.itemPropertyChangeHandler = function (item, propertyName, isDirect, isFinal) {
+                            if (changeHandler)
+                                changeHandler(item, propertyName, isDirect, isFinal);
+                            scope.change(item, propertyName, isDirect, isFinal);
+                        }
+                    }
+                }
+                initialization();
+                var isWaitingToRefresh = false;
+                var refresh = function() {
+                    if (isWaitingToRefresh)
+                        return;
+                    isWaitingToRefresh = true;
+                    setTimeout(function () {
+                        initialization();
+                        isWaitingToRefresh = false;
+                    });
+                }
+                setTimeout(function () {
+                    scope.$watch("items", refresh);
+                    scope.$watch("settings", refresh);
+                    if (scope.autoRefresh == "true")
+                        scope.$watch(refresh);
+                }, 0);
+            }
+        };
+    });
+}