Merge pull request #3 from RamRajuE/ES-584128-update

584128: updated schedule-meeting-room-calendar
SyncfusionExamples · Apr 29, 2024 · 327ba89 · 327ba89
2 parents 34be961 + b5b8b01
commit 327ba89
Show file tree

Hide file tree

Showing 8 changed files with 171 additions and 187 deletions.
diff --git a/gulpfile.js b/gulpfile.js
@@ -2,53 +2,21 @@
 
 var gulp = require('gulp');
 
-/**
- * Load the sample in src/app/index
- */
-gulp.task('start', ['compile'], function(done) {
-    var browserSync = require('browser-sync');
-    var bs = browserSync.create('Essential JS 2');
-    var options = {
-        server: {
-            baseDir: ['./src', './']
-        },
-        ui: false
-    };
-    bs.init(options, done);
-
-    /**
-    * Watching typescript file changes
-    */
-    gulp.watch('src/**/*.ts', ['compile', bs.reload]).on('change', reportChanges);
-});
-
 /** 
  * Compile TypeScript to JS
  */
-gulp.task('compile', function(done) {
-    var ts = require('gulp-typescript');
-    // Default typescript config
-    var defaultConfig = {
-        typescript: require('typescript')
-    };
-    var tsProject, tsResult;
-    // Create the typescript project
-    tsProject = ts.createProject('tsconfig.json', defaultConfig);
-    // Get typescript result
-    tsResult = gulp.src(['./src/**/*.ts'], { base: '.' })
-        .pipe(ts(tsProject))
-        .pipe(gulp.dest('./'))
-        .on('error', function(e) {
-            done(e);
-            process.exit(1);
-        }).on('end', function() {
+gulp.task('compile', function (done) {
+    var webpack = require('webpack');
+    var webpackStream = require('webpack-stream');
+    gulp.src(['./src/app/app.ts']).pipe(webpackStream({
+        config: require('./webpack.config.js')
+    }, webpack))
+        .pipe(gulp.dest('./dist'))
+        .on('end', function () {
             done();
         });
 });
 
-function reportChanges(event) {
-    console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
-}
 /**
  * Testing spec files
  */
@@ -62,35 +30,33 @@ gulp.task('e2e-webdriver-update', webdriver_update({
     webdriverManagerArgs: ['--ie', '--edge']
 }));
 
-gulp.task('e2e-test', ['compile'], function(done) {
+gulp.task('e2e-test', gulp.series('compile', function (done) {
     var browserSync = require('browser-sync');
     var bs = browserSync.create('Essential JS 2');
     var options = {
         server: {
             baseDir: [
-                './src/app/',
-                './src/resource/',
-                './node_modules/@syncfusion/ej2/'
+                './dist/',
             ],
             directory: true
         },
         ui: false,
         open: false,
         notify: false
     };
-    bs.init(options, function() {
+    bs.init(options, function () {
         gulp.src(['./spec/**/*.spec.js'])
             .pipe(protractor({
                 configFile: 'e2e/protractor.conf.js'
             }))
-            .on('error', function(e) {
+            .on('error', function (e) {
                 console.error('Error: ' + e.message);
                 done();
                 process.exit(1);
             })
-            .on('end', function() {
+            .on('end', function () {
                 done();
                 process.exit(0);
             });
     });
-});
+}));
diff --git a/package.json b/package.json
@@ -1,29 +1,38 @@
 {
-    "name": "ej2-quickstart",
-    "version": "0.0.1",
-    "description": "Essential JS 2 typescript quick start application",
-    "author": "Syncfusion Inc.",
-    "license": "SEE LICENSE IN license",
-    "repository": {
-        "type": "git",
-        "url": "https://github.com/syncfusion/ej2-quickstart.git"
-    },
-    "dependencies": {
-        "@syncfusion/ej2": "*"
-    },
-    "devDependencies": {
-        "browser-sync": "^2.18.12",
-        "gulp": "^3.9.1",
-        "gulp-protractor": "^4.1.0",
-        "gulp-typescript": "^2.13.0",
-        "jasmine": "^2.6.0",
-        "systemjs": "^0.20.14",
-        "typescript": "2.3.4"
-    },
-    "scripts": {
-        "start": "gulp start",
-        "serve": "gulp e2e-serve",
-        "test": "gulp e2e-test",
-        "update-webdriver": "gulp e2e-webdriver-update"
-    }
+  "name": "ej2-quickstart",
+  "version": "0.0.1",
+  "description": "Essential JS 2 typescript quick start application",
+  "author": "Syncfusion Inc.",
+  "license": "SEE LICENSE IN license",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/syncfusion/ej2-quickstart.git"
+  },
+  "scripts": {
+    "start": "webpack-dev-server --mode development",
+    "build": "webpack --mode production",
+    "serve": "gulp e2e-serve",
+    "test": "gulp e2e-test",
+    "update-webdriver": "gulp e2e-webdriver-update"
+  },
+  "devDependencies": {
+    "ajv": "^8.11.2",
+    "browser-sync": "^2.18.12",
+    "gulp": "*",
+    "typescript": "*",
+    "gulp-protractor": "*",
+    "gulp-typescript": "*",
+    "jasmine": "^2.6.0",
+    "css-loader": "^6.7.2",
+    "ts-loader": "^9.4.1",
+    "mini-css-extract-plugin": "^2.7.0",
+    "html-webpack-plugin": "^5.5.0",
+    "webpack": "^5.75.0",
+    "webpack-cli": "^5.0.0",
+    "webpack-dev-server": "^4.11.1",
+    "webpack-stream": "^7.0.0"
+  },
+  "dependencies": {
+    "@syncfusion/ej2": "*"
+  }
 }
diff --git a/src/app/app.ts b/src/app/app.ts
@@ -15,15 +15,15 @@ interface TemplateFunction extends Window {
 }
 
 let isReadOnly: Function = (endDate: Date): boolean => {
-    return (endDate < new Date(2018, 6, 31, 0, 0));
+    return (endDate < new Date(2024, 6, 31, 0, 0));
 };
 
 let data: Object[] = <Object[]>extend([], roomData, null, true);
 let scheduleOptions: ScheduleModel = {
         width: '100%',
         height: '850px',
         currentView: "Day",
-        selectedDate: new Date(2018, 6, 31),
+        selectedDate: new Date(2024, 6, 31),
         resourceHeaderTemplate: '#resourceTemplate',
         showWeekend: false,
         group: {
@@ -58,13 +58,14 @@ let scheduleOptions: ScheduleModel = {
                 endTime: { title: 'To', name: 'EndTime' }
             }
         },
-        popupOpen: (args: PopupOpenEventArgs) => {
+    popupOpen: (args: PopupOpenEventArgs) => {
             let data: any = <any>args.data;
-            if(args.type === "QuickInfo" || args.type === "Editor" || args.type === "RecurrenceAlert" || args.type === "DeleteAlert"){
-                let target: HTMLElement = (args.type == "RecurrenceAlert" || args.type == "DeleteAlert") ? data.element[0] : args.target;
+        if (args.type === "QuickInfo" || args.type === "Editor" || args.type === "RecurrenceAlert" || args.type === "DeleteAlert") {
+
+                let target: Element = (args.type == "RecurrenceAlert" || args.type == "DeleteAlert") ? args.element  : args.target;
                 if(!isNullOrUndefined(target) && target.classList.contains('e-work-cells')){
-                    let endDate = data.endTime as Date;
-                    let startDate = data.startTime as Date;
+                    let endDate = data.EndTime as Date;
+                    let startDate = data.StartTime as Date;
                     let groupIndex = data.groupIndex as number;
                     if ((target.classList.contains('e-read-only-cells')) || (!scheduleObj.isSlotAvailable(startDate as Date, endDate as Date, groupIndex as number))) {
                         args.cancel = true;
@@ -78,7 +79,7 @@ let scheduleOptions: ScheduleModel = {
         renderCell: (args: RenderCellEventArgs) => {
             if (args.element.classList.contains('e-work-cells')) {
                 // To disable the past date cells
-                if(args.date < new Date(2018, 6, 31, 0, 0)) {
+                if(args.date < new Date(2024, 6, 31, 0, 0)) {
                     args.element.setAttribute('aria-readonly', 'true');
                     args.element.classList.add('e-read-only-cells');
                 }
@@ -99,11 +100,17 @@ let scheduleOptions: ScheduleModel = {
         },
         actionBegin: (args: ActionEventArgs) => {
             if(args.requestType == "eventCreate" || args.requestType == "eventChange"){
-                let data: any = <any>args.data;
-                let groupIndex = scheduleObj.eventBase.getGroupIndexFromEvent(data);
-                if(!scheduleObj.isSlotAvailable(data.StartTime as Date, data.EndTime as Date, groupIndex as number)) {
-                    args.cancel = true;
+                if (args.requestType === "eventCreate") {
+                    if(!scheduleObj.isSlotAvailable(args.addedRecords[0].StartTime as Date, args.addedRecords[0].EndTime as Date)) {
+                        args.cancel = true;
+                    }
+                }
+                else if (args.requestType === "eventChange") {
+                    if(!scheduleObj.isSlotAvailable(args.changedRecords[0].StartTime as Date, args.changedRecords[0].EndTime as Date)) {
+                        args.cancel = true;
+                    }
                 }
+
             }
         }
     };