diff --git a/Annotations/Add custom Data in Annotation/.gitignore b/Annotations/Add custom Data in Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Add custom Data in Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Add custom Data in Annotation/README.md b/Annotations/Add custom Data in Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Add custom Data in Annotation/e2e/index.spec.js b/Annotations/Add custom Data in Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Add custom Data in Annotation/e2e/protractor.conf.js b/Annotations/Add custom Data in Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Add custom Data in Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Add custom Data in Annotation/gulpfile.js b/Annotations/Add custom Data in Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Add custom Data in Annotation/license b/Annotations/Add custom Data in Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Add custom Data in Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Add custom Data in Annotation/package.json b/Annotations/Add custom Data in Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Add custom Data in Annotation/src/app/app.ts b/Annotations/Add custom Data in Annotation/src/app/app.ts new file mode 100644 index 0000000..4472500 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/src/app/app.ts @@ -0,0 +1,43 @@ +import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, Annotation, FormDesigner, FormFields } from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject(Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, Annotation, FormDesigner, FormFields); + +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + + // Text markup + highlightSettings: { author: 'QA', subject: 'Review', color: '#ffff00', opacity: 0.6, customData: { tag: 'needs-review', priority: 'high' } }, + strikethroughSettings: { author: 'QA', subject: 'Remove', color: '#ff0000', opacity: 0.6, customData: { tag: 'remove', priority: 'medium' } }, + underlineSettings: { author: 'Guest User', subject: 'Notes', color: '#00ffff', opacity: 0.9, customData: { tag: 'note', owner: 'guest' } }, + squigglySettings: { author: 'Guest User', subject: 'Corrections', color: '#00ff00', opacity: 0.9, customData: { tag: 'typo' } }, + + // Shapes + lineSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, customData: { id: 'ln-1', category: 'connector' } }, + arrowSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, customData: { id: 'ar-1', category: 'direction' } }, + rectangleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, customData: { id: 'rect-1', zone: 'content' } }, + circleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, customData: { id: 'circ-1', zone: 'highlight' } }, + polygonSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, customData: { id: 'poly-1', group: 'area' } }, + + // Measurements //Perimeter, area, volume no support for customData + distanceSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, customData: { units: 'cm', scale: 1 } }, + //perimeterSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, customData: { units: 'cm', calc: 'perimeter' } }, + //areaSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', customData: { units: 'cm^2', calc: 'area' } }, + radiusSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', customData: { units: 'cm', calc: 'radius' } }, + //volumeSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', customData: { units: 'cm^3', calc: 'volume' } }, + + // Others + freeTextSettings: { borderColor: '#222222', opacity: 1, customData: { template: 'comment', mentions: ['qa'] } }, + inkAnnotationSettings: { strokeColor: '#0000ff', thickness: 3, opacity: 0.8, customData: { tool: 'pen', userId: 12345 } }, + stampSettings: { opacity: 0.9, customData: { stampType: 'Approved', by: 'Manager' } }, + stickyNotesSettings: { author: 'QA', subject: 'Review', opacity: 1, customData: { channel: 'inbox', unread: true } } +}); + +pdfviewer.appendTo('#PdfViewer'); + +document.getElementById('CustomData')?.addEventListener('click', () => { + const annotations = pdfviewer.annotationCollection; + annotations.forEach((a: any) => { + console.log('Annotation', a.id, 'customData:', a.customData); + }); +}); \ No newline at end of file diff --git a/Annotations/Add custom Data in Annotation/src/index.html b/Annotations/Add custom Data in Annotation/src/index.html new file mode 100644 index 0000000..67b2e11 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/src/index.html @@ -0,0 +1,20 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + \ No newline at end of file diff --git a/Annotations/Add custom Data in Annotation/src/resources/favicon.ico b/Annotations/Add custom Data in Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Add custom Data in Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Add custom Data in Annotation/src/styles/styles.css b/Annotations/Add custom Data in Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Add custom Data in Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Add custom Data in Annotation/tsconfig.json b/Annotations/Add custom Data in Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Add custom Data in Annotation/webpack.config.js b/Annotations/Add custom Data in Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Add custom Data in Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Permissions/Common Permission/.gitignore b/Annotations/Annotation Permissions/Common Permission/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Permissions/Common Permission/README.md b/Annotations/Annotation Permissions/Common Permission/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Permissions/Common Permission/e2e/index.spec.js b/Annotations/Annotation Permissions/Common Permission/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Permissions/Common Permission/e2e/protractor.conf.js b/Annotations/Annotation Permissions/Common Permission/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Common Permission/gulpfile.js b/Annotations/Annotation Permissions/Common Permission/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Common Permission/license b/Annotations/Annotation Permissions/Common Permission/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Permissions/Common Permission/package.json b/Annotations/Annotation Permissions/Common Permission/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Permissions/Common Permission/src/app/app.ts b/Annotations/Annotation Permissions/Common Permission/src/app/app.ts new file mode 100644 index 0000000..d946883 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/src/app/app.ts @@ -0,0 +1,25 @@ +import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, + TextSelection, TextSearch, Print, Annotation, FormFields, FormDesigner, + AllowedInteraction} from '@syncfusion/ej2-pdfviewer'; + + PdfViewer.Inject(Toolbar,Magnification,Navigation, LinkAnnotation,ThumbnailView,BookmarkView, + TextSelection, TextSearch, Print, Annotation,FormFields, FormDesigner); + +let viewer: PdfViewer = new PdfViewer(); +viewer.resourceUrl= 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; +viewer.documentPath= 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; + +// Default annotation settings applied to annotations created via the UI +viewer.annotationSettings = { + author: 'XYZ', + minHeight: 10, + minWidth: 10, + maxWidth: 100, + maxHeight: 100, + isLock: false, // allow moving/resizing/editing by default + skipPrint: false, // include annotations when printing the document + skipDownload: true, // include annotations when downloading/exporting the document + allowedInteractions: [AllowedInteraction.Resize], +}; + +viewer.appendTo("#pdfViewer"); \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Common Permission/src/index.html b/Annotations/Annotation Permissions/Common Permission/src/index.html new file mode 100644 index 0000000..67cb38f --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/src/index.html @@ -0,0 +1,20 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Common Permission/src/resources/favicon.ico b/Annotations/Annotation Permissions/Common Permission/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Permissions/Common Permission/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Permissions/Common Permission/src/styles/styles.css b/Annotations/Annotation Permissions/Common Permission/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Common Permission/tsconfig.json b/Annotations/Annotation Permissions/Common Permission/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Permissions/Common Permission/webpack.config.js b/Annotations/Annotation Permissions/Common Permission/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Permissions/Common Permission/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Permissions/Individual Permission/.gitignore b/Annotations/Annotation Permissions/Individual Permission/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Permissions/Individual Permission/README.md b/Annotations/Annotation Permissions/Individual Permission/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Permissions/Individual Permission/e2e/index.spec.js b/Annotations/Annotation Permissions/Individual Permission/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Permissions/Individual Permission/e2e/protractor.conf.js b/Annotations/Annotation Permissions/Individual Permission/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Individual Permission/gulpfile.js b/Annotations/Annotation Permissions/Individual Permission/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Individual Permission/license b/Annotations/Annotation Permissions/Individual Permission/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Permissions/Individual Permission/package.json b/Annotations/Annotation Permissions/Individual Permission/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Permissions/Individual Permission/src/app/app.ts b/Annotations/Annotation Permissions/Individual Permission/src/app/app.ts new file mode 100644 index 0000000..c548895 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/src/app/app.ts @@ -0,0 +1,35 @@ +import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, Annotation, FormDesigner, FormFields } from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject(Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, Annotation, FormDesigner, FormFields); + +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: "https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib", + // Text markup defaults + highlightSettings: { author: 'QA', subject: 'Review', color: '#ffff00', opacity: 0.6 }, + strikethroughSettings: { author: 'QA', subject: 'Remove', color: '#ff0000', opacity: 0.6 }, + underlineSettings: { author: 'Guest User', subject: 'Points to be remembered', color: '#00ffff', opacity: 0.9 }, + squigglySettings: { author: 'Guest User', subject: 'Corrections', color: '#00ff00', opacity: 0.9 }, + + // Shapes + lineSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }, + arrowSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }, + rectangleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }, + circleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }, + polygonSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1, isLock: false, isPrint: true }, + + // Measurements + distanceSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }, + perimeterSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, isLock: false, isPrint: true }, + areaSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }, + radiusSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }, + volumeSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00', isLock: false, isPrint: true }, + + // Others + freeTextSettings: { borderColor: '#222222', opacity: 1, isLock: false, isPrint: true }, + inkAnnotationSettings: { strokeColor: '#0000ff', thickness: 3, opacity: 0.8, isLock: false, isPrint: true }, + stampSettings: { opacity: 0.9, isLock: false, isPrint: true }, + stickyNotesSettings: { author: 'QA', subject: 'Review', opacity: 1, isLock: false, isPrint: true } +}); + +pdfviewer.appendTo('#PdfViewer'); \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Individual Permission/src/index.html b/Annotations/Annotation Permissions/Individual Permission/src/index.html new file mode 100644 index 0000000..de9d905 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/src/index.html @@ -0,0 +1,20 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Individual Permission/src/resources/favicon.ico b/Annotations/Annotation Permissions/Individual Permission/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Permissions/Individual Permission/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Permissions/Individual Permission/src/styles/styles.css b/Annotations/Annotation Permissions/Individual Permission/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Permissions/Individual Permission/tsconfig.json b/Annotations/Annotation Permissions/Individual Permission/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Permissions/Individual Permission/webpack.config.js b/Annotations/Annotation Permissions/Individual Permission/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Permissions/Individual Permission/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Area Annotation/.gitignore b/Annotations/Annotation Types/Area Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Area Annotation/README.md b/Annotations/Annotation Types/Area Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Area Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Area Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Area Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Area Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Area Annotation/gulpfile.js b/Annotations/Annotation Types/Area Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Area Annotation/license b/Annotations/Annotation Types/Area Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Area Annotation/package.json b/Annotations/Annotation Types/Area Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Area Annotation/src/app/app.ts b/Annotations/Annotation Types/Area Annotation/src/app/app.ts new file mode 100644 index 0000000..61c2cf3 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/src/app/app.ts @@ -0,0 +1,79 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + AreaSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize viewer with defaults for Area + measurement +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + // Resource URL for Standalone + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + // Default Area appearance + areaSettings: { fillColor: 'yellow', opacity: 0.6, strokeColor: 'orange', thickness: 2 }, + // Default measurement scale/units + measurementSettings: { scaleRatio: 2, conversionUnit: 'cm', displayUnit: 'cm' } +}); + +pdfviewer.appendTo('#PdfViewer'); + +// 1) Enable Area drawing mode +document.getElementById('areaMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Area'); +}); + +// 2) Add an Area annotation programmatically +document.getElementById('addAreaAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Area', { + pageNumber: 1, + subject: 'Area calculation', // used below to find and edit + offset: { x: 200, y: 500 }, + vertexPoints: [ + { x: 200, y: 500 }, + { x: 288, y: 499 }, + { x: 289, y: 553 }, + { x: 200, y: 500 } + ] + } as AreaSettings); +}); + +// 3) Edit an existing Area annotation programmatically +document.getElementById('editAreaAnnotation')?.addEventListener('click', () => { + if (!pdfviewer || !pdfviewer.annotationCollection) return; + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const item = pdfviewer.annotationCollection[i]; + if (item.subject === 'Area calculation') { + item.annotationSelectorSettings.resizerShape = 'Circle'; + item.strokeColor = '#0000FF'; + item.thickness = 2; + item.fillColor = '#FFFF00'; + pdfviewer.annotation.editAnnotation(item); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Area Annotation/src/index.html b/Annotations/Annotation Types/Area Annotation/src/index.html new file mode 100644 index 0000000..a149401 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/src/index.html @@ -0,0 +1,25 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + +
+ +
+ + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Area Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Area Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Area Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Area Annotation/src/styles/styles.css b/Annotations/Annotation Types/Area Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Area Annotation/tsconfig.json b/Annotations/Annotation Types/Area Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Area Annotation/webpack.config.js b/Annotations/Annotation Types/Area Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Area Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Arrow Annotation/.gitignore b/Annotations/Annotation Types/Arrow Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Arrow Annotation/README.md b/Annotations/Annotation Types/Arrow Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Arrow Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Arrow Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Arrow Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Arrow Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Arrow Annotation/gulpfile.js b/Annotations/Annotation Types/Arrow Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Arrow Annotation/license b/Annotations/Annotation Types/Arrow Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Arrow Annotation/package.json b/Annotations/Annotation Types/Arrow Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Arrow Annotation/src/app/app.ts b/Annotations/Annotation Types/Arrow Annotation/src/app/app.ts new file mode 100644 index 0000000..50be3ac --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/src/app/app.ts @@ -0,0 +1,76 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + ArrowSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +const pdfviewer: PdfViewer = new PdfViewer(); +// Document source +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +// Standalone resource path +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +pdfviewer.appendTo('#PdfViewer'); + +// 1) Enable Arrow drawing mode (UI drawing) +document.getElementById('arrowMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Arrow'); +}); + +// 2) Add an Arrow programmatically +document.getElementById('addArrow')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Arrow', { + // basic geometry (two points → line with arrowhead) + vertexPoints: [{ x: 200, y: 370 }, { x: 350, y: 370 }], + offset: { x: 200, y: 370 }, + pageNumber: 1, + // optional style + strokeColor: '#0078D4', + fillColor: '#CCE4FF', + thickness: 2, + opacity: 0.8 + } as ArrowSettings); +}); + +// 3) Edit existing Arrow annotations +document.getElementById('editArrows')?.addEventListener('click', () => { + const annots = pdfviewer.annotationCollection || []; + for (let i = 0; i < annots.length; i++) { + const a = annots[i]; + if (a.subject === 'Arrow') { + // example edits + a.annotationSelectorSettings.resizerShape = 'Circle'; + a.strokeColor = '#0000FF'; + a.thickness = 3; + a.fillColor = '#FFFF99'; + a.opacity = 0.9; + pdfviewer.annotation.editAnnotation(a); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Arrow Annotation/src/index.html b/Annotations/Annotation Types/Arrow Annotation/src/index.html new file mode 100644 index 0000000..65003f4 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/src/index.html @@ -0,0 +1,24 @@ + + + + + Essential JS 2 + + + + + + + + + + + + + + + +
+ + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Arrow Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Arrow Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Arrow Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Arrow Annotation/src/styles/styles.css b/Annotations/Annotation Types/Arrow Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Arrow Annotation/tsconfig.json b/Annotations/Annotation Types/Arrow Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Arrow Annotation/webpack.config.js b/Annotations/Annotation Types/Arrow Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Arrow Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Circle Annotation/.gitignore b/Annotations/Annotation Types/Circle Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Circle Annotation/README.md b/Annotations/Annotation Types/Circle Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Circle Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Circle Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Circle Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Circle Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Circle Annotation/gulpfile.js b/Annotations/Annotation Types/Circle Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Circle Annotation/license b/Annotations/Annotation Types/Circle Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Circle Annotation/package.json b/Annotations/Annotation Types/Circle Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Circle Annotation/src/app/app.ts b/Annotations/Annotation Types/Circle Annotation/src/app/app.ts new file mode 100644 index 0000000..d597f72 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/src/app/app.ts @@ -0,0 +1,85 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + CircleSettings +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Create and configure the viewer +const pdfviewer: PdfViewer = new PdfViewer(); + +// Default circle settings during initialization +pdfviewer.circleSettings = { + fillColor: 'orange', + opacity: 0.6, + strokeColor: 'pink' +}; + +// Load a document (Standalone) +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Append to DOM +pdfviewer.appendTo('#PdfViewer'); + +// Button: Enable circle annotation mode +document.getElementById('circleMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Circle'); +}); + +// Button: Exit annotation mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Button: Add circle annotation programmatically +document.getElementById('addCircleAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Circle', { + offset: { x: 200, y: 620 }, + pageNumber: 1, + width: 90, + height: 90 + } as CircleSettings); +}); + +// Button: Edit existing circle annotations programmatically +document.getElementById('editCircleAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.subject === 'Circle') { + ann.strokeColor = '#0000FF'; + ann.thickness = 2; + ann.fillColor = '#FFFF00'; + if (ann.annotationSelectorSettings) { + ann.annotationSelectorSettings.resizerShape = 'Circle'; + } + pdfviewer.annotation.editAnnotation(ann); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Circle Annotation/src/index.html b/Annotations/Annotation Types/Circle Annotation/src/index.html new file mode 100644 index 0000000..cf5f30b --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/src/index.html @@ -0,0 +1,25 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Circle Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Circle Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Circle Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Circle Annotation/src/styles/styles.css b/Annotations/Annotation Types/Circle Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Circle Annotation/tsconfig.json b/Annotations/Annotation Types/Circle Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Circle Annotation/webpack.config.js b/Annotations/Annotation Types/Circle Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Circle Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Distance Annotation/.gitignore b/Annotations/Annotation Types/Distance Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Distance Annotation/README.md b/Annotations/Annotation Types/Distance Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Distance Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Distance Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Distance Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Distance Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/gulpfile.js b/Annotations/Annotation Types/Distance Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/license b/Annotations/Annotation Types/Distance Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Distance Annotation/package.json b/Annotations/Annotation Types/Distance Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Distance Annotation/src/app/app.ts b/Annotations/Annotation Types/Distance Annotation/src/app/app.ts new file mode 100644 index 0000000..421667c --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/src/app/app.ts @@ -0,0 +1,91 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + DistanceSettings +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Create viewer +const pdfviewer: PdfViewer = new PdfViewer(); + +// Standalone setup (no server) +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Default Distance and Measurement settings BEFORE appendTo +pdfviewer.distanceSettings = { + fillColor: 'blue', + opacity: 0.6, + strokeColor: 'green' +}; + +pdfviewer.measurementSettings = { + scaleRatio: 2, // 1 PDF unit = 2 display units + conversionUnit: 'cm', // Input unit for calibration dialog + displayUnit: 'cm' // Unit shown with measurement +}; + +// Mount viewer +pdfviewer.appendTo('#PdfViewer'); + +// UI actions +document.getElementById('distanceMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Distance'); +}); + +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +document.getElementById('addDistanceAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Distance', { + offset: { x: 200, y: 230 }, + pageNumber: 1, + vertexPoints: [{ x: 200, y: 230 }, { x: 350, y: 230 }] + } as DistanceSettings); +}); + +document.getElementById('editDistanceAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const item = pdfviewer.annotationCollection[i]; + if (item.subject === 'Distance calculation') { + item.strokeColor = '#0000FF'; + item.thickness = 2; + item.opacity = 0.8; + pdfviewer.annotation.editAnnotation(item); + } + } +}); + +/* +If you prefer Server-Backed mode, replace the Standalone setup with: +pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +(and remove resourceUrl) +*/ \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/src/index.html b/Annotations/Annotation Types/Distance Annotation/src/index.html new file mode 100644 index 0000000..7cd6f43 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/src/index.html @@ -0,0 +1,27 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Distance Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Distance Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Distance Annotation/src/resources/pdf-succinctly.json b/Annotations/Annotation Types/Distance Annotation/src/resources/pdf-succinctly.json new file mode 100644 index 0000000..24f4bf1 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/src/resources/pdf-succinctly.json @@ -0,0 +1 @@ +{"pdfAnnotation":{ "0":{"shapeAnnotation":[{"type":"Line","page":"0","start":"74.25,681","end":"153,761.25","title":"Guest","name":"9abdfca6-067f-4298-63fb-ca5ac669f574","subject":"Arrow","color":"#FF0000","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","head":"ClosedArrow","tail":"ClosedArrow","date":"D:20251217165951+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"caption":"false","caption-style":"Inline","leaderLength":"0","leaderExtend":"0","rect":{"x":"61.25","y":"672","width":"166","height":"770.25"}},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"9abdfca6-067f-4298-63fb-ca5ac669f574","rect":{"x":"98","y":"940","width":"205","height":"833"}},{"type":"Square","page":"0","title":"Guest","name":"2cb37334-7596-426a-d102-476974d61583","subject":"Rectangle","color":"#FF0000","FillOpacity":"0","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","date":"D:20251217165955+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"rect":{"x":"186.75","y":"660.75","width":"333.75","height":"749.25"},"N":"","appearance":"eyJhcCI6eyJOIjp7InN0cmVhbSI6eyJUeXBlIjp7Im5hbWUiOiJYT2JqZWN0In0sIlN1YnR5cGUiOnsibmFtZSI6IkZvcm0ifSwiQkJveCI6eyJhcnJheSI6W3siaW50IjoiMCJ9LHsiaW50IjoiMCJ9LHsiaW50IjoiMTQ3In0seyJmaXhlZCI6Ijg4LjUifV19LCJNYXRyaXgiOnsiYXJyYXkiOlt7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifSx7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifV19LCJSZXNvdXJjZXMiOnsiZGljdCI6eyJQcm9jU2V0Ijp7ImFycmF5IjpbeyJuYW1lIjoiUERGIn1dfX19LCJMZW5ndGgiOnsiaW50IjoiMTkwIn0sImRhdGEiOnsibW9kZSI6InJhdyIsImVuY29kaW5nIjoiaGV4IiwiYnl0ZXMiOiIyNTIwNDM2ODYxNkU2NzY1MjA2MzZGMkQ2RjcyNjQ2OTZFNjE3NDY1MjA3Mzc5NzM3NDY1NkQyMDc0NkYyMDZDNjU2Njc0MkY3NDZGNzAyRTBEMEEzMTJFMzAzMDIwMkUzMDMwMjAyRTMwMzAyMDMxMkUzMDMwMjAyRTMwMzAyMDM4MzgyRTM1MzAyMDIwNjM2RDBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNDM1MzBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNjM3MzBEMEE1QjVEMjAzMDIwNjQwRDBBMzEyRTMwMzAzMDIwNzcwRDBBMzAyMDZBMEQwQTMwMjA0QTBEMEEzMTJFMzAzMDMwMjAzMDJFMzAzMDMwMjAzMDJFMzAzMDMwMjA1MjQ3MEQwQTMwMkUzNTMwMzAyMDJEMzAyRTM1MzAzMDIwMzEzNDM2MkUzMDMwMzAyMDJEMzgzNzJFMzUzMDMwMjA3MjY1MEQwQTUzMEQwQSJ9fX19fQ=="},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"2cb37334-7596-426a-d102-476974d61583","rect":{"x":"186.75","y":"923.25","width":"333.75","height":"834.75"}}]},"2":{"shapeAnnotation":[{"type":"Link","page":"2","rect":{"x":"313.87","y":"544.57","width":"414.3","height":"559.75"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"87.75","y":"499.03","width":"188.18","height":"514.21"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"331.53","y":"483.86","width":"431.96","height":"499.03"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"}]},"3":{"shapeAnnotation":[{"type":"Link","page":"3","rect":{"x":"87.75","y":"667.05","width":"523.75","height":"679.7"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"654.4","width":"523.75","height":"667.05"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"641.76","width":"523.75","height":"654.4"},"width":"0","flags":"print","Dest":",XYZ,87,319,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"628.33","width":"523.75","height":"641.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"615.68","width":"523.75","height":"628.33"},"width":"0","flags":"print","Dest":",XYZ,87,219,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"603.03","width":"523.75","height":"615.68"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"590.38","width":"523.75","height":"603.03"},"width":"0","flags":"print","Dest":",XYZ,87,306,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"577.73","width":"523.75","height":"590.38"},"width":"0","flags":"print","Dest":",XYZ,87,187,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"565.08","width":"523.75","height":"577.73"},"width":"0","flags":"print","Dest":",XYZ,87,657,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"551.66","width":"523.75","height":"565.08"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"539.01","width":"523.75","height":"551.66"},"width":"0","flags":"print","Dest":",XYZ,87,494,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"526.36","width":"523.75","height":"539.01"},"width":"0","flags":"print","Dest":",XYZ,87,325,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"513.71","width":"523.75","height":"526.36"},"width":"0","flags":"print","Dest":",XYZ,87,218,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"501.06","width":"523.75","height":"513.71"},"width":"0","flags":"print","Dest":",XYZ,87,260,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"488.41","width":"523.75","height":"501.06"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"475.76","width":"523.75","height":"488.41"},"width":"0","flags":"print","Dest":",XYZ,87,460,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"463.11","width":"523.75","height":"475.76"},"width":"0","flags":"print","Dest":",XYZ,87,604,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"450.46","width":"523.75","height":"463.11"},"width":"0","flags":"print","Dest":",XYZ,87,401,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"437.81","width":"523.75","height":"450.46"},"width":"0","flags":"print","Dest":",XYZ,87,245,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"425.17","width":"523.75","height":"437.81"},"width":"0","flags":"print","Dest":",XYZ,87,590,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"412.52","width":"523.75","height":"425.17"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"399.87","width":"523.75","height":"412.52"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"387.22","width":"523.75","height":"399.87"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"374.57","width":"523.75","height":"387.22"},"width":"0","flags":"print","Dest":",XYZ,87,287,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"361.92","width":"523.75","height":"374.57"},"width":"0","flags":"print","Dest":",XYZ,87,670,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"348.49","width":"523.75","height":"361.92"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"335.84","width":"523.75","height":"348.49"},"width":"0","flags":"print","Dest":",XYZ,87,592,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"323.2","width":"523.75","height":"335.84"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"310.55","width":"523.75","height":"323.2"},"width":"0","flags":"print","Dest":",XYZ,87,645,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"297.9","width":"523.75","height":"310.55"},"width":"0","flags":"print","Dest":",XYZ,87,463,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"285.25","width":"523.75","height":"297.9"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"272.6","width":"523.75","height":"285.25"},"width":"0","flags":"print","Dest":",XYZ,87,341,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"259.95","width":"523.75","height":"272.6"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"247.3","width":"523.75","height":"259.95"},"width":"0","flags":"print","Dest":",XYZ,87,367,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"234.65","width":"523.75","height":"247.3"},"width":"0","flags":"print","Dest":",XYZ,87,127,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"222","width":"523.75","height":"234.65"},"width":"0","flags":"print","Dest":",XYZ,87,280,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"209.36","width":"523.75","height":"222"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"196.71","width":"523.75","height":"209.36"},"width":"0","flags":"print","Dest":",XYZ,87,400,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"184.06","width":"523.75","height":"196.71"},"width":"0","flags":"print","Dest":",XYZ,87,333,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"171.41","width":"523.75","height":"184.06"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"158.76","width":"523.75","height":"171.41"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"146.11","width":"523.75","height":"158.76"},"width":"0","flags":"print","Dest":",XYZ,87,251,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"133.46","width":"523.75","height":"146.11"},"width":"0","flags":"print","Dest":",XYZ,87,519,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"120.81","width":"523.75","height":"133.46"},"width":"0","flags":"print","Dest":",XYZ,87,517,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"108.16","width":"523.75","height":"120.81"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"94.736","width":"523.75","height":"108.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"82.087","width":"523.75","height":"94.736"},"width":"0","flags":"print","Dest":",XYZ,87,620,0"}]},"4":{"shapeAnnotation":[{"type":"Link","page":"4","rect":{"x":"97.75","y":"707.35","width":"523.75","height":"720"},"width":"0","flags":"print","Dest":",XYZ,87,311,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"694.7","width":"523.75","height":"707.35"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"682.05","width":"523.75","height":"694.7"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"669.4","width":"523.75","height":"682.05"},"width":"0","flags":"print","Dest":",XYZ,87,194,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"656.76","width":"523.75","height":"669.4"},"width":"0","flags":"print","Dest":",XYZ,87,358,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"644.11","width":"523.75","height":"656.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"631.46","width":"523.75","height":"644.11"},"width":"0","flags":"print","Dest":",XYZ,87,414,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"618.81","width":"523.75","height":"631.46"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"606.16","width":"523.75","height":"618.81"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"593.51","width":"523.75","height":"606.16"},"width":"0","flags":"print","Dest":",XYZ,87,389,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"580.86","width":"523.75","height":"593.51"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"568.21","width":"523.75","height":"580.86"},"width":"0","flags":"print","Dest":",XYZ,87,215,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"555.56","width":"523.75","height":"568.21"},"width":"0","flags":"print","Dest":",XYZ,87,457,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"542.92","width":"523.75","height":"555.56"},"width":"0","flags":"print","Dest":",XYZ,87,362,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"530.27","width":"523.75","height":"542.92"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"517.62","width":"523.75","height":"530.27"},"width":"0","flags":"print","Dest":",XYZ,87,668,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"504.97","width":"523.75","height":"517.62"},"width":"0","flags":"print","Dest":",XYZ,87,350,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"492.32","width":"523.75","height":"504.97"},"width":"0","flags":"print","Dest":",XYZ,87,371,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"479.67","width":"523.75","height":"492.32"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"467.02","width":"523.75","height":"479.67"},"width":"0","flags":"print","Dest":",XYZ,87,570,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"454.37","width":"523.75","height":"467.02"},"width":"0","flags":"print","Dest":",XYZ,87,471,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"441.72","width":"523.75","height":"454.37"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"429.07","width":"523.75","height":"441.72"},"width":"0","flags":"print","Dest":",XYZ,87,478,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"416.43","width":"523.75","height":"429.07"},"width":"0","flags":"print","Dest":",XYZ,87,454,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"403.78","width":"523.75","height":"416.43"},"width":"0","flags":"print","Dest":",XYZ,87,388,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"390.35","width":"523.75","height":"403.78"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"377.7","width":"523.75","height":"390.35"},"width":"0","flags":"print","Dest":",XYZ,87,481,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"365.05","width":"523.75","height":"377.7"},"width":"0","flags":"print","Dest":",XYZ,87,337,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"352.4","width":"523.75","height":"365.05"},"width":"0","flags":"print","Dest":",XYZ,87,243,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"339.75","width":"523.75","height":"352.4"},"width":"0","flags":"print","Dest":",XYZ,87,201,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"327.1","width":"523.75","height":"339.75"},"width":"0","flags":"print","Dest":",XYZ,87,363,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"314.46","width":"523.75","height":"327.1"},"width":"0","flags":"print","Dest":",XYZ,87,281,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"301.81","width":"523.75","height":"314.46"},"width":"0","flags":"print","Dest":",XYZ,87,444,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"289.16","width":"523.75","height":"301.81"},"width":"0","flags":"print","Dest":",XYZ,87,226,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"276.51","width":"523.75","height":"289.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"263.86","width":"523.75","height":"276.51"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"251.21","width":"523.75","height":"263.86"},"width":"0","flags":"print","Dest":",XYZ,87,334,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"238.56","width":"523.75","height":"251.21"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"225.91","width":"523.75","height":"238.56"},"width":"0","flags":"print","Dest":",XYZ,87,488,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"213.26","width":"523.75","height":"225.91"},"width":"0","flags":"print","Dest":",XYZ,87,268,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"200.62","width":"523.75","height":"213.26"},"width":"0","flags":"print","Dest":",XYZ,87,543,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"187.97","width":"523.75","height":"200.62"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"175.32","width":"523.75","height":"187.97"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"}]},"6":{"shapeAnnotation":[{"type":"Link","page":"6","rect":{"x":"114.65","y":"554.29","width":"286.81","height":"578.94"},"width":"0","flags":"print","URI":"mailto:succinctly-series@syncfusion.com"}]},"7":{"shapeAnnotation":[{"type":"Link","page":"7","rect":{"x":"236.94","y":"494.27","width":"265.29","height":"506.92"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/docs/install-pdftk/"},{"type":"Link","page":"7","rect":{"x":"91.413","y":"406.37","width":"185.79","height":"419.02"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"319.13","width":"316.02","height":"343.78"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly/"},{"type":"Link","page":"7","rect":{"x":"351.9","y":"262.38","width":"446.3","height":"275.03"},"width":"0","flags":"print","URI":"http://www.iso.org/iso/catalogue_detail.htm?csnumber=51502"},{"type":"Link","page":"7","rect":{"x":"329.28","y":"249.74","width":"524.25","height":"262.38"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"225.09","width":"107.54","height":"249.74"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]},"12":{"shapeAnnotation":[{"type":"Link","page":"12","rect":{"x":"217.35","y":"582.81","width":"270.76","height":"595.46"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/tools/pdftk-the-pdf-toolkit/"},{"type":"Link","page":"12","rect":{"x":"267.47","y":"519.24","width":"492.69","height":"531.89"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"50":{"shapeAnnotation":[{"type":"Link","page":"50","rect":{"x":"227.17","y":"569.51","width":"284.86","height":"582.16"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"50","rect":{"x":"284.04","y":"374.6","width":"416.32","height":"399.25"},"width":"0","flags":"print","URI":"http://api.itextpdf.com/itext"},{"type":"Link","page":"50","rect":{"x":"369.63","y":"293.21","width":"437.71","height":"314.86"},"width":"0","flags":"print","URI":"http://sourceforge.net/projects/itextsharp/files/itextsharp/"},{"type":"Link","page":"50","rect":{"x":"274.81","y":"174.52","width":"500.02","height":"199.17"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"57":{"shapeAnnotation":[{"type":"Link","page":"57","rect":{"x":"99.98","y":"568.8","width":"198.63","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/fonts/ChunkFive"},{"type":"Link","page":"57","rect":{"x":"267.5","y":"568.8","width":"355.76","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/"}]},"58":{"shapeAnnotation":[{"type":"Link","page":"58","rect":{"x":"117.7","y":"641.84","width":"212.82","height":"667.46"},"width":"0","flags":"print","Dest":",XYZ,87,198,0"},{"type":"Link","page":"58","rect":{"x":"277.29","y":"522.5","width":"303.8","height":"547.15"},"width":"0","flags":"print","URI":"http://mvc.syncfusion.com/sfmvcpdfsamplebrowser"}]},"59":{"shapeAnnotation":[{"type":"Link","page":"59","rect":{"x":"347.01","y":"532.21","width":"524.25","height":"544.86"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"59","rect":{"x":"87.75","y":"519.56","width":"146.06","height":"532.21"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]}}} \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/src/styles/styles.css b/Annotations/Annotation Types/Distance Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Distance Annotation/tsconfig.json b/Annotations/Annotation Types/Distance Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Distance Annotation/webpack.config.js b/Annotations/Annotation Types/Distance Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Distance Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Free Text Annotation/.gitignore b/Annotations/Annotation Types/Free Text Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Free Text Annotation/README.md b/Annotations/Annotation Types/Free Text Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Free Text Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Free Text Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Free Text Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Free Text Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Free Text Annotation/gulpfile.js b/Annotations/Annotation Types/Free Text Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Free Text Annotation/license b/Annotations/Annotation Types/Free Text Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Free Text Annotation/package.json b/Annotations/Annotation Types/Free Text Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Free Text Annotation/src/app/app.ts b/Annotations/Annotation Types/Free Text Annotation/src/app/app.ts new file mode 100644 index 0000000..ac6f266 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/src/app/app.ts @@ -0,0 +1,93 @@ +// app.ts +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + FreeTextSettings +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Create viewer +const pdfviewer: PdfViewer = new PdfViewer(); + +// Standalone setup (no server) +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Default Free Text settings BEFORE appendTo +pdfviewer.freeTextSettings = { + fillColor: 'green', + borderColor: 'blue', + fontColor: 'yellow', + fontFamily: 'Helvetica', + fontSize: 16, + opacity: 0.9 +}; + +// Mount viewer +pdfviewer.appendTo('#PdfViewer'); + +// UI actions +document.getElementById('addFreeTextAnnotation')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('FreeText'); +}); + +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +document.getElementById('addFreeTextProgram')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('FreeText', { + offset: { x: 120, y: 80 }, + pageNumber: 1, + width: 200, + height: 40, + isLock: false, + defaultText: 'Syncfusion', + fontFamily: 'Helvetica', + fontSize: 16 + } as FreeTextSettings); +}); + +document.getElementById('editFreeTextAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const item = pdfviewer.annotationCollection[i]; + if (item.subject === 'Text Box') { + item.dynamicText = 'Updated text'; + item.fontColor = '#ff0000'; + pdfviewer.annotation.editAnnotation(item); + } + } +}); + +/* +If you prefer Server-Backed mode, replace the Standalone setup with: +pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +(and remove resourceUrl) +*/ \ No newline at end of file diff --git a/Annotations/Annotation Types/Free Text Annotation/src/index.html b/Annotations/Annotation Types/Free Text Annotation/src/index.html new file mode 100644 index 0000000..e76cbd2 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Free Text Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Free Text Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Free Text Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Free Text Annotation/src/styles/styles.css b/Annotations/Annotation Types/Free Text Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Free Text Annotation/tsconfig.json b/Annotations/Annotation Types/Free Text Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Free Text Annotation/webpack.config.js b/Annotations/Annotation Types/Free Text Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Free Text Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Highlight Annotation/.gitignore b/Annotations/Annotation Types/Highlight Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Highlight Annotation/README.md b/Annotations/Annotation Types/Highlight Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Highlight Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Highlight Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Highlight Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Highlight Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Highlight Annotation/gulpfile.js b/Annotations/Annotation Types/Highlight Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Highlight Annotation/license b/Annotations/Annotation Types/Highlight Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Highlight Annotation/package.json b/Annotations/Annotation Types/Highlight Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Highlight Annotation/src/app/app.ts b/Annotations/Annotation Types/Highlight Annotation/src/app/app.ts new file mode 100644 index 0000000..269cdca --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/src/app/app.ts @@ -0,0 +1,89 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, + FormDesigner, PageOrganizer, HighlightSettings +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, + FormFields, FormDesigner, PageOrganizer +); + +// Create the viewer with default Highlight settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + // If using Standalone (no service), include the resourceUrl: + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + // Default Highlight settings at initialization + highlightSettings: { + author: 'Guest User', + subject: 'Important', + color: '#ffff00', + opacity: 0.9 + }, + // Show built-in toolbar (includes Edit Annotation group) + enableToolbar: true +}); + +// For Server-Backed mode, uncomment the following line and remove resourceUrl: +// pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; + +pdfviewer.appendTo('#PdfViewer'); + +// Enter Highlight mode +document.getElementById('btnHighlightMode')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('Highlight'); +}); + +// Exit Highlight mode (normal mode) +document.getElementById('btnNormalMode')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('None'); +}); + +// Add a Highlight programmatically +document.getElementById('btnAddHighlight')?.addEventListener('click', () => { + // Example values — adjust bounds to match your loaded document content + pdfviewer.annotation.addAnnotation('Highlight', { + bounds: [{ x: 97, y: 110, width: 350, height: 14 }], + pageNumber: 1 + } as HighlightSettings); +}); + +// Edit the first existing Highlight annotation (color + opacity) +document.getElementById('btnEditFirstHighlight')?.addEventListener('click', () => { + const annots = pdfviewer.annotationCollection || []; + for (let i = 0; i < annots.length; i++) { + const annot = annots[i]; + if (annot.textMarkupAnnotationType === 'Highlight') { + annot.color = '#000fff'; // Blue + annot.opacity = 0.8; + pdfviewer.annotation.editAnnotation(annot); + break; + } + } +}); + +// Undo last action +document.getElementById('btnUndo')?.addEventListener('click', () => { + pdfviewer.undo(); +}); + +// Redo last undone action +document.getElementById('btnRedo')?.addEventListener('click', () => { + pdfviewer.redo(); +}); + +// Toggle Disable/Enable Text Markup annotations (includes Highlight) +let textMarkupDisabled = false; +document.getElementById('btnToggleTextMarkup')?.addEventListener('click', (e) => { + textMarkupDisabled = !textMarkupDisabled; + pdfviewer.enableTextMarkupAnnotation = !textMarkupDisabled; + // Also exit highlight mode if disabling + if (textMarkupDisabled) { + pdfviewer.annotation.setAnnotationMode('None'); + } + const btn = e.currentTarget as HTMLButtonElement; + btn.textContent = textMarkupDisabled ? 'Enable Text Markup' : 'Disable Text Markup'; +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Highlight Annotation/src/index.html b/Annotations/Annotation Types/Highlight Annotation/src/index.html new file mode 100644 index 0000000..7bd3341 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/src/index.html @@ -0,0 +1,30 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Highlight Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Highlight Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Highlight Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Highlight Annotation/src/styles/styles.css b/Annotations/Annotation Types/Highlight Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Highlight Annotation/tsconfig.json b/Annotations/Annotation Types/Highlight Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Highlight Annotation/webpack.config.js b/Annotations/Annotation Types/Highlight Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Highlight Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Ink Annotation/.gitignore b/Annotations/Annotation Types/Ink Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Ink Annotation/README.md b/Annotations/Annotation Types/Ink Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Ink Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Ink Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Ink Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Ink Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Ink Annotation/gulpfile.js b/Annotations/Annotation Types/Ink Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Ink Annotation/license b/Annotations/Annotation Types/Ink Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Ink Annotation/package.json b/Annotations/Annotation Types/Ink Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Ink Annotation/src/app/app.ts b/Annotations/Annotation Types/Ink Annotation/src/app/app.ts new file mode 100644 index 0000000..b7e75f9 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/src/app/app.ts @@ -0,0 +1,82 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + InkAnnotationSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default ink settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + inkAnnotationSettings: { + author: 'Syncfusion', + strokeColor: 'green', + thickness: 3, + opacity: 0.6 + } +}); + +pdfviewer.appendTo('#PdfViewer'); + +// Enable ink mode (UI) +document.getElementById('addInkAnnotation')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Ink'); +}); + +// Exit ink mode (UI) +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Add ink programmatically +document.getElementById('addInkAnnotationProgram')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Ink', { + offset: { x: 150, y: 100 }, + pageNumber: 1, + width: 200, + height: 60, + path: + '[{"command":"M","x":244.83,"y":982.00},{"command":"L","x":250.83,"y":953.33}]' + } as InkAnnotationSettings); +}); + +// Edit existing ink annotations programmatically +document.getElementById('editInkAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.shapeAnnotationType === 'Ink') { + const { width, height } = ann.bounds; + ann.bounds = { x: 100, y: 100, width, height }; + ann.strokeColor = '#0000FF'; + ann.thickness = 2; + ann.annotationSelectorSettings.resizerShape = 'Circle'; + pdfviewer.annotation.editAnnotation(ann); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Ink Annotation/src/index.html b/Annotations/Annotation Types/Ink Annotation/src/index.html new file mode 100644 index 0000000..0fb409f --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Ink Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Ink Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Ink Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Ink Annotation/src/styles/styles.css b/Annotations/Annotation Types/Ink Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Ink Annotation/tsconfig.json b/Annotations/Annotation Types/Ink Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Ink Annotation/webpack.config.js b/Annotations/Annotation Types/Ink Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Ink Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Line Annotation/.gitignore b/Annotations/Annotation Types/Line Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Line Annotation/README.md b/Annotations/Annotation Types/Line Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Line Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Line Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Line Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Line Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Line Annotation/gulpfile.js b/Annotations/Annotation Types/Line Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Line Annotation/license b/Annotations/Annotation Types/Line Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Line Annotation/package.json b/Annotations/Annotation Types/Line Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Line Annotation/src/app/app.ts b/Annotations/Annotation Types/Line Annotation/src/app/app.ts new file mode 100644 index 0000000..a53b68d --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/src/app/app.ts @@ -0,0 +1,85 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + LineSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default Line settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + lineSettings: { + author: 'Syncfusion', + strokeColor: 'green', + thickness: 3, + opacity: 0.6, + // Fill color shows when arrowheads are used; lines without arrowheads won't render fill + fillColor: 'blue' + } +}); + +pdfviewer.appendTo('#PdfViewer'); + +// Enable line mode (UI) +document.getElementById('lineMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Line'); +}); + +// Exit line mode (UI) +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Add line programmatically +document.getElementById('addLineAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Line', { + pageNumber: 1, + // starting position info (optional for line, but harmless) + offset: { x: 200, y: 230 }, + // two points define the line + vertexPoints: [ + { x: 200, y: 230 }, + { x: 360, y: 260 } + ] + } as LineSettings); +}); + +// Edit existing line annotations programmatically +document.getElementById('editLineAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.shapeAnnotationType === 'Line' || ann.subject === 'Line') { + ann.strokeColor = '#0000FF'; + ann.thickness = 2; + // example: change resizer handle style + ann.annotationSelectorSettings.resizerShape = 'Circle'; + pdfviewer.annotation.editAnnotation(ann); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Line Annotation/src/index.html b/Annotations/Annotation Types/Line Annotation/src/index.html new file mode 100644 index 0000000..68af452 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Line Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Line Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Line Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Line Annotation/src/styles/styles.css b/Annotations/Annotation Types/Line Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Line Annotation/tsconfig.json b/Annotations/Annotation Types/Line Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Line Annotation/webpack.config.js b/Annotations/Annotation Types/Line Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Line Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Perimeter Annotation/.gitignore b/Annotations/Annotation Types/Perimeter Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Perimeter Annotation/README.md b/Annotations/Annotation Types/Perimeter Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Perimeter Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Perimeter Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Perimeter Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Perimeter Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Perimeter Annotation/gulpfile.js b/Annotations/Annotation Types/Perimeter Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Perimeter Annotation/license b/Annotations/Annotation Types/Perimeter Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Perimeter Annotation/package.json b/Annotations/Annotation Types/Perimeter Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Perimeter Annotation/src/app/app.ts b/Annotations/Annotation Types/Perimeter Annotation/src/app/app.ts new file mode 100644 index 0000000..bd21f73 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/src/app/app.ts @@ -0,0 +1,79 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, FormDesigner, PageOrganizer, PerimeterSettings + } from '@syncfusion/ej2-pdfviewer'; + + // Inject required modules + PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, FormDesigner, PageOrganizer + ); + + // Create viewer + const pdfviewer = new PdfViewer(); + + // Standalone setup + pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; + pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + + // Default Perimeter settings + pdfviewer.perimeterSettings = { + fillColor: 'green', + opacity: 0.6, + strokeColor: 'blue', + // Optional defaults + thickness: 2 + }; + + // Default measurement settings (scale ratio + units) + // Example: 2 cm in drawing equals 2 cm real-world (adjust for your use-case) + pdfviewer.measurementSettings = { + scaleRatio: 2, + conversionUnit: 'cm', + displayUnit: 'cm' + }; + + // Mount viewer + pdfviewer.appendTo('#PdfViewer'); + + // Enable Perimeter drawing mode + document.getElementById('perimeterMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Perimeter'); + }); + + // Add a Perimeter annotation programmatically + document.getElementById('addPerimeterAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Perimeter', { + // Give it a subject so we can find it later to edit + subject: 'Perimeter calculation', + pageNumber: 1, + offset: { x: 200, y: 350 }, + vertexPoints: [ + { x: 200, y: 350 }, + { x: 285, y: 350 }, + { x: 286, y: 412 } + ], + // You can override defaults here if needed: + // strokeColor: '#FF0000', fillColor: '#00FF00', thickness: 3, opacity: 0.7 + } as PerimeterSettings); + }); + + // Edit an existing Perimeter annotation programmatically + document.getElementById('editPerimeterAnnotation')?.addEventListener('click', () => { + if (!pdfviewer || !pdfviewer.annotationCollection) return; + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const annot = pdfviewer.annotationCollection[i]; + if (annot && annot.subject === 'Perimeter calculation') { + annot.annotationSelectorSettings = annot.annotationSelectorSettings || {}; + annot.annotationSelectorSettings.resizerShape = 'Circle'; + annot.strokeColor = '#0000FF'; + annot.thickness = 2; + annot.fillColor = '#FFFF00'; + pdfviewer.annotation.editAnnotation(annot); + } + } + }); + + // Notes: + // - To adjust scale ratio/units via UI, right-click a measurement annotation to open the context menu (Scale Ratio). + // - Supported units: Inch, Millimeter, Centimeter, Point, Pica, Feet. \ No newline at end of file diff --git a/Annotations/Annotation Types/Perimeter Annotation/src/index.html b/Annotations/Annotation Types/Perimeter Annotation/src/index.html new file mode 100644 index 0000000..640bcb2 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/src/index.html @@ -0,0 +1,25 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Perimeter Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Perimeter Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Perimeter Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Perimeter Annotation/src/styles/styles.css b/Annotations/Annotation Types/Perimeter Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Perimeter Annotation/tsconfig.json b/Annotations/Annotation Types/Perimeter Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Perimeter Annotation/webpack.config.js b/Annotations/Annotation Types/Perimeter Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Perimeter Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Polygon Annotation/.gitignore b/Annotations/Annotation Types/Polygon Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Polygon Annotation/README.md b/Annotations/Annotation Types/Polygon Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Polygon Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Polygon Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Polygon Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Polygon Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Polygon Annotation/gulpfile.js b/Annotations/Annotation Types/Polygon Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Polygon Annotation/license b/Annotations/Annotation Types/Polygon Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Polygon Annotation/package.json b/Annotations/Annotation Types/Polygon Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Polygon Annotation/src/app/app.ts b/Annotations/Annotation Types/Polygon Annotation/src/app/app.ts new file mode 100644 index 0000000..b88100f --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/src/app/app.ts @@ -0,0 +1,63 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, + LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, + TextSearch, FormFields, FormDesigner, PageOrganizer, PolygonSettings +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, + FormFields, FormDesigner, PageOrganizer +); + +// Create viewer instance +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath : 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl : 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + // default polygon style (optional) + polygonSettings: { fillColor: 'pink', opacity: 0.6, strokeColor: 'yellow' } +}); +pdfviewer.appendTo('#PdfViewer'); + +/* ---------------- Button actions ---------------- */ + +// 1. Enable polygon drawing mode +(document.getElementById('polygonMode') as HTMLButtonElement) + .addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Polygon'); + }); + +// 2. Exit annotation mode (back to normal) +(document.getElementById('setNone') as HTMLButtonElement) + .addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); + }); + +// 3. Add a polygon annotation programmatically +(document.getElementById('addPolygonAnnotation') as HTMLButtonElement) + .addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Polygon', { + pageNumber: 1, + offset: { x: 200, y: 800 }, + vertexPoints: [ + { x: 200, y: 800 }, { x: 242, y: 771 }, { x: 289, y: 799 }, + { x: 278, y: 842 }, { x: 211, y: 842 }, { x: 200, y: 800 } + ] + } as PolygonSettings); + }); + +// 4. Edit the first existing polygon annotation programmatically +(document.getElementById('editPolygonAnnotation') as HTMLButtonElement) + .addEventListener('click', () => { + for (const item of pdfviewer.annotationCollection) { + if (item.subject === 'Polygon') { + item.strokeColor = '#0000FF'; + item.thickness = 2; + item.fillColor = '#FFFF00'; + item.annotationSelectorSettings.resizerShape = 'Circle'; + pdfviewer.annotation.editAnnotation(item); + break; // edit only the first polygon + } + } + }); \ No newline at end of file diff --git a/Annotations/Annotation Types/Polygon Annotation/src/index.html b/Annotations/Annotation Types/Polygon Annotation/src/index.html new file mode 100644 index 0000000..35a68a8 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/src/index.html @@ -0,0 +1,28 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Polygon Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Polygon Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Polygon Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Polygon Annotation/src/styles/styles.css b/Annotations/Annotation Types/Polygon Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Polygon Annotation/tsconfig.json b/Annotations/Annotation Types/Polygon Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Polygon Annotation/webpack.config.js b/Annotations/Annotation Types/Polygon Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Polygon Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Radius Annotation/.gitignore b/Annotations/Annotation Types/Radius Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Radius Annotation/README.md b/Annotations/Annotation Types/Radius Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Radius Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Radius Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Radius Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Radius Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Radius Annotation/gulpfile.js b/Annotations/Annotation Types/Radius Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Radius Annotation/license b/Annotations/Annotation Types/Radius Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Radius Annotation/package.json b/Annotations/Annotation Types/Radius Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Radius Annotation/src/app/app.ts b/Annotations/Annotation Types/Radius Annotation/src/app/app.ts new file mode 100644 index 0000000..b86ba8d --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/src/app/app.ts @@ -0,0 +1,55 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, FormDesigner, + PageOrganizer, RadiusSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, ThumbnailView, + BookmarkView, TextSelection, TextSearch, FormFields, FormDesigner, PageOrganizer +); + +const pdfviewer: PdfViewer = new PdfViewer(); + +// Document + library URL +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Default settings before append +pdfviewer.radiusSettings = { fillColor: 'orange', opacity: 0.6, strokeColor: 'pink' }; +pdfviewer.measurementSettings = { scaleRatio: 2, conversionUnit: 'cm', displayUnit: 'cm' }; + +// Mount +pdfviewer.appendTo('#PdfViewer'); + +// UI: enable radius mode +document.getElementById('radiusMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Radius'); +}); + +// UI: exit mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Add radius annotation programmatically +document.getElementById('addRadiusAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Radius', { + offset: { x: 200, y: 630 }, + pageNumber: 1, + width: 90, + height: 90 + } as RadiusSettings); +}); + +// Edit an existing radius annotation programmatically +document.getElementById('editRadiusAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + if (pdfviewer.annotationCollection[i].subject === 'Radius calculation') { + pdfviewer.annotationCollection[i].strokeColor = '#0000FF'; + pdfviewer.annotationCollection[i].thickness = 2; + pdfviewer.annotationCollection[i].opacity = 0.8; + pdfviewer.annotation.editAnnotation(pdfviewer.annotationCollection[i]); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Radius Annotation/src/index.html b/Annotations/Annotation Types/Radius Annotation/src/index.html new file mode 100644 index 0000000..a852d36 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Radius Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Radius Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Radius Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Radius Annotation/src/styles/styles.css b/Annotations/Annotation Types/Radius Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Radius Annotation/tsconfig.json b/Annotations/Annotation Types/Radius Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Radius Annotation/webpack.config.js b/Annotations/Annotation Types/Radius Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Radius Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Rectangle Annotation/.gitignore b/Annotations/Annotation Types/Rectangle Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Rectangle Annotation/README.md b/Annotations/Annotation Types/Rectangle Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Rectangle Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Rectangle Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Rectangle Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Rectangle Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Rectangle Annotation/gulpfile.js b/Annotations/Annotation Types/Rectangle Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Rectangle Annotation/license b/Annotations/Annotation Types/Rectangle Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Rectangle Annotation/package.json b/Annotations/Annotation Types/Rectangle Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Rectangle Annotation/src/app/app.ts b/Annotations/Annotation Types/Rectangle Annotation/src/app/app.ts new file mode 100644 index 0000000..30477a3 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/src/app/app.ts @@ -0,0 +1,85 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + RectangleSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize viewer +const pdfviewer: PdfViewer = new PdfViewer(); + +// Default rectangle settings during initialization +pdfviewer.rectangleSettings = { + fillColor: 'yellow', + opacity: 0.6, + strokeColor: 'orange' +}; + +// Document source +pdfviewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +// Resource url for Standalone +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Mount +pdfviewer.appendTo('#PdfViewer'); + +// Enable rectangle mode +document.getElementById('rectangleMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Rectangle'); +}); + +// Exit rectangle mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Add rectangle annotation programmatically +document.getElementById('addRectangleAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Rectangle', { + offset: { x: 200, y: 480 }, + pageNumber: 1, + width: 150, + height: 75 + } as RectangleSettings); +}); + +// Edit existing rectangle annotations programmatically +document.getElementById('editRectangleAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const annot = pdfviewer.annotationCollection[i]; + if (annot.subject === 'Rectangle') { + annot.strokeColor = '#0000FF'; + annot.thickness = 2; + annot.fillColor = '#FFFF00'; + if (annot.annotationSelectorSettings) { + annot.annotationSelectorSettings.resizerShape = 'Circle'; + } + pdfviewer.annotation.editAnnotation(annot); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Rectangle Annotation/src/index.html b/Annotations/Annotation Types/Rectangle Annotation/src/index.html new file mode 100644 index 0000000..c7cbf7e --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Rectangle Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Rectangle Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Rectangle Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Rectangle Annotation/src/styles/styles.css b/Annotations/Annotation Types/Rectangle Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Rectangle Annotation/tsconfig.json b/Annotations/Annotation Types/Rectangle Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Rectangle Annotation/webpack.config.js b/Annotations/Annotation Types/Rectangle Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Rectangle Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Redaction Annotation/.gitignore b/Annotations/Annotation Types/Redaction Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Redaction Annotation/README.md b/Annotations/Annotation Types/Redaction Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Redaction Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Redaction Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Redaction Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Redaction Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Redaction Annotation/gulpfile.js b/Annotations/Annotation Types/Redaction Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Redaction Annotation/license b/Annotations/Annotation Types/Redaction Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Redaction Annotation/package.json b/Annotations/Annotation Types/Redaction Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Redaction Annotation/src/app/app.ts b/Annotations/Annotation Types/Redaction Annotation/src/app/app.ts new file mode 100644 index 0000000..85f37f8 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/src/app/app.ts @@ -0,0 +1,99 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, + LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, + TextSearch, FormFields, FormDesigner, PageOrganizer +} from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, + FormFields, FormDesigner, PageOrganizer +); + +// Create viewer (Standalone). For server-backed, set serviceUrl and omit resourceUrl. +const viewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib' +}); + +// Default redaction settings +viewer.redactionSettings = { + overlayText: 'Confidential', + markerFillColor: '#FF0000', + markerBorderColor: '#000000', + isRepeat: false, + fillColor: '#F8F8F8', + fontColor: '#333333', + fontSize: 14, + fontFamily: 'Symbol', + textAlign: 'Right' +}; + +viewer.appendTo('#PdfViewer'); + +/* --------------- Events --------------- */ +viewer.annotationAdd = (args) => { + console.log('Annotation added:', args); +}; + +/* --------------- Button actions --------------- */ + +// Add a redaction annotation programmatically +(document.getElementById('addRedactAnnot') as HTMLButtonElement) + .addEventListener('click', () => { + viewer.annotation.addAnnotation('Redaction', { + bound: { x: 200, y: 480, width: 150, height: 75 }, + pageNumber: 1, + markerFillColor: '#0000FF', + markerBorderColor: 'white', + fillColor: 'red', + overlayText: 'Confidential', + fontColor: 'yellow', + fontFamily: 'Times New Roman', + fontSize: 8, + beforeRedactionsApplied: false + }); + }); + +// Edit the first redaction annotation found +(document.getElementById('editRedactAnnotation') as HTMLButtonElement) + .addEventListener('click', () => { + for (const annot of viewer.annotationCollection) { + if (annot.subject === 'Redaction') { + annot.overlayText = 'EditedAnnotation'; + annot.markerFillColor = '#22FF00'; + annot.markerBorderColor = '#000000'; + annot.isRepeat = true; + annot.fillColor = '#F8F8F8'; + annot.fontColor = '#333333'; + annot.fontSize = 14; + annot.fontFamily = 'Symbol'; + annot.textAlign = 'Right'; + annot.beforeRedactionsApplied = false; + viewer.annotation.editAnnotation(annot); + break; + } + } + }); + +// Delete a redaction by id (deletes the first redaction it finds) +(document.getElementById('deleteAnnotationbyId') as HTMLButtonElement) + .addEventListener('click', () => { + const target = viewer.annotationCollection.find(a => a.subject === 'Redaction'); + if (target) { + viewer.annotationModule.deleteAnnotationById(target.annotationId); + } + }); + +// Add page redactions (marks pages; apply to finalize) +(document.getElementById('addPageRedactions') as HTMLButtonElement) + .addEventListener('click', () => { + viewer.annotation.addPageRedactions([1, 3, 5, 7]); + }); + +// Apply redaction (permanently removes content) +(document.getElementById('redact') as HTMLButtonElement) + .addEventListener('click', () => { + viewer.annotation.redact(); + }); \ No newline at end of file diff --git a/Annotations/Annotation Types/Redaction Annotation/src/index.html b/Annotations/Annotation Types/Redaction Annotation/src/index.html new file mode 100644 index 0000000..a9f8ecd --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/src/index.html @@ -0,0 +1,29 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Redaction Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Redaction Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Redaction Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Redaction Annotation/src/styles/styles.css b/Annotations/Annotation Types/Redaction Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Redaction Annotation/tsconfig.json b/Annotations/Annotation Types/Redaction Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Redaction Annotation/webpack.config.js b/Annotations/Annotation Types/Redaction Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Redaction Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Squiggly Annotation/.gitignore b/Annotations/Annotation Types/Squiggly Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Squiggly Annotation/README.md b/Annotations/Annotation Types/Squiggly Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Squiggly Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Squiggly Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Squiggly Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Squiggly Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Squiggly Annotation/gulpfile.js b/Annotations/Annotation Types/Squiggly Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Squiggly Annotation/license b/Annotations/Annotation Types/Squiggly Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Squiggly Annotation/package.json b/Annotations/Annotation Types/Squiggly Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Squiggly Annotation/src/app/app.ts b/Annotations/Annotation Types/Squiggly Annotation/src/app/app.ts new file mode 100644 index 0000000..a6c7727 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/src/app/app.ts @@ -0,0 +1,75 @@ +// app.ts +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + SquigglySettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default Squiggly settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + squigglySettings: { + author: 'Guest User', + subject: 'Corrections', + color: '#00ff00', + opacity: 0.9, + // optional: set by control internally when changed via UI + // modifiedDate: '' + } +}); +pdfviewer.appendTo('#PdfViewer'); + +// Buttons wiring +document.getElementById('squigglyMode')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('Squiggly'); +}); + +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('None'); +}); + +document.getElementById('addSquiggly')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Squiggly', { + bounds: [{ x: 97, y: 110, width: 350, height: 14 }], + pageNumber: 1 + } as SquigglySettings); +}); + +document.getElementById('editSquiggly')?.addEventListener('click', () => { + // Example: edit any squiggly whose author or subject matches defaults + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i] as any; + if (ann?.textMarkupAnnotationType === 'Squiggly' && (ann.author === 'Guest User' || ann.subject === 'Corrections')) { + ann.color = '#1be468ff'; + ann.opacity = 0.8; + pdfviewer.annotation.editAnnotation(ann); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Squiggly Annotation/src/index.html b/Annotations/Annotation Types/Squiggly Annotation/src/index.html new file mode 100644 index 0000000..4fe7f94 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + +
+
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Squiggly Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Squiggly Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Squiggly Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Squiggly Annotation/src/styles/styles.css b/Annotations/Annotation Types/Squiggly Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Squiggly Annotation/tsconfig.json b/Annotations/Annotation Types/Squiggly Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Squiggly Annotation/webpack.config.js b/Annotations/Annotation Types/Squiggly Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Squiggly Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Stamp Annotation/.gitignore b/Annotations/Annotation Types/Stamp Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Stamp Annotation/README.md b/Annotations/Annotation Types/Stamp Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Stamp Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Stamp Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Stamp Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Stamp Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Stamp Annotation/gulpfile.js b/Annotations/Annotation Types/Stamp Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Stamp Annotation/license b/Annotations/Annotation Types/Stamp Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Stamp Annotation/package.json b/Annotations/Annotation Types/Stamp Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Stamp Annotation/src/app/app.ts b/Annotations/Annotation Types/Stamp Annotation/src/app/app.ts new file mode 100644 index 0000000..e82b87c --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/src/app/app.ts @@ -0,0 +1,122 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + StampSettings, + DynamicStampItem, + SignStampItem, + StandardBusinessStampItem +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf' +}); + +// resourceUrl required for Standalone +pdfviewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; + +// Default stamp settings during initialization +pdfviewer.stampSettings = { opacity: 0.7, author: 'Guest User' }; + +pdfviewer.appendTo('#PdfViewer'); + +// Switch to specific stamp modes / actions +document.getElementById('dynamicStamp')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Stamp', DynamicStampItem.NotApproved); +}); + +document.getElementById('signStamp')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Stamp', undefined, SignStampItem.Witness); +}); + +document.getElementById('standardBusinessStamp')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Stamp', undefined, undefined, StandardBusinessStampItem.Approved); +}); + +document.getElementById('customStamp')?.addEventListener('click', () => { + // Custom stamp via addAnnotation + pdfviewer.annotation.addAnnotation('Stamp', { + offset: { x: 200, y: 240 }, + width: 46, + height: 100, + pageNumber: 1, + isLock: true, + author: 'Guest', + customStamps: [{ + customStampName: 'Image', + customStampImageSource:'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAIIAqwMBIgACEQEDEQH/xAAbAAEAAgMBAQAAAAAAAAAAAAAABQYBAwQHAv/EAEEQAAEDAwIEAwYDBAYLAAAAAAECAwQABREGIRIxQVETYXEHFCIygZEVQmIjUnKCJCUzU6HRFhc1c5KisbKzwvD/xAAVAQEBAAAAAAAAAAAAAAAAAAAAAf/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/APcaUpQKUpQKUpQKUpQKUpQKVzXGdFtsN2ZPfbYjNJ4nHHDgJFfEK5Q5ttbuUaQhcNxvxUPcklPfflQdlYJxURpe/salthuMNpxEYvuNtKc28VKVcPGB2JB577Vyz7pNuUxy26eWlCml8Mu4OI4kR/0oB2Wvp2T17EJK43qDbloakOqL7m6I7TanHVjOMhCQTjzxgVut89i4Mqdj8Y4VlC0OIKFIUOYKTuOn0INRZZtWkrVLuDpIIHHJlPK4nX1dOJR5kk4A5DYDArVoWbHuVgTPjvF5Ul5xx5zhIBc4jkJyBlI+UHqE0FjpSlApSlApSlApSlApSlApSlApSlArClAczgVmqr7QZLptkezxHi1KvD4ihxKsFprBU6v6IB+pFBTdUKf1uUuFa0WpyUIVoYBx706chchXdKEhZSPLNXXVTsOw6NdjNxkvJS0iLEidHnDhLaPME4z5ZzVHk6kTHu1vTpyE1Jf8L3Oww1ZDaGc4XJXjklXDhP6UlWd63ybrL1rq1mNa1hLcAKEeQgcTbbvyuScHnw5KGweZJPIVRYoDT6okfSlnfWhmCwlu43FGAUKxu2j9atyT+UHvirZBixLZBaiQ2kR4zCMIQnZKRWuz2yLZ7czBgo4GWh13KidypR6qJJJPevOvaFqCXqC4HSGmzxlxQbmvJJAPXwwe2M8R9R3FQc1xde9qOqEW+C44jTFuVxPvtnHvCvI+e4HYZPavV4sdmLGajxmktMtJCENpGAkDkBUbpixRNO2dm3Q0/Cj4lrPNazzUf/uWKlkkEZByKDNKUoFKUoFKUoFKUoFKwahZ2p7dFfMZhTs+ZnHu0FHirB/VjZHqogUE3WOIYzUApzUlwBKUxLOwQCFL/bv467DCEn6qr5i6btk5ht+ZOlXlCxlLkiTxtr8whGG8fy0HdK1FZorymHbjH8dPNlC+NY/lTk1XNTe0m12SCXBFnrkOpX7uh6ItkKUBzPGEnhzjcA1bokKLAZS1BjMx20jAQy2EjHoK85i6PuOovaFNv+pWPDt8J/ggMKUCXktq+BX8HNXmT2G9HLF1trSyW2GrUFgbluT3eCIRIS26tS/iSjwgCcDl35Z3qBlSb/edVcN58e4tojKafiW2MfDQpRBXF8X5UnZPGsq5ZAr0TV2j52oL9Anx7wqCxHYWypLbeXAFH4lNqz8KiNs8x0qy2e1QrNbmYFuZDUdkYSkHOT1JPUk7k0HhsG6u3SHPeisLFwnucE95hOPdmc8DUNhR/OrCR5Ak9NvX9F6cRp20IZIR706AX1I5DA2Qn9KRsPvzJqGmXG0N6pfk3KTEhW2ykBsLKUh2Y4nKlY6lKCAOuVmuafry5T5rFs0vaHQ5JSVIm3FBaQhvq7wfNwjurAPnQZ9pms1WtlVmtDqRcnxwrdK+ERknqT0Vj7DftUN7OA1BilywWx65TnU8PjOAtMsJJzlbhBypXMhPFgADbrF6B0sNSagkzrk+5cbTDeUQ5IHwy3T+bHbYE/y9yK9sabQ02lDSAhCRhKUjAAoIaFaZ8gh++zg8vIKYsUFphB+/Ev8AmONuVTYGBgcqzSoFKUoFKUoFKUoFcV4mOW+2yJbEN6Y40gqTHYGVuHsK7awRmg8rd/1gameJn2n8Ptv5YQn+78f+8cSFLI57AJ8/Oy2eyalhxkRo79htEVI2YgQ1uEH+JSgD68NW/FQ2r7yqxWCTNZR4knZqM1/ePLPChP3IoKRc4l91FqJ3TkfUst2Aygfiz7TDTaEA8mkEAnjPXfAH2NohaPehR2Y8bVF9QwygNttJMcJSkDAAAZru0hY02CyMxFK8SWv9rMfPN55W6lE9d9vQCpughmrLNZVxI1Fc19kupYUn/wAYP+NdQVMjD+khEhsfM40nhUPMp3z9D9K76xQRN/uNxjWj3qwW9F0krKfDa8YISUn83F25VVocf2kXdR/EJlrskZQxiM14ryR5ZJA9c/SrHo973m2SFjPhCfKSzn9wPLCceXbyxUpPmRrdDemTHUMx2UFbjizgJAoPGrbpyJBRPvEi53STfhc34MRCVMrckLSvCT8aFEEjBUQdhUlfbHcrcItuYvc+VqbUBDcpf7PgDSfnJPBxBCQcDBGcnlUn7Om4kly+aonhbPBPkeGiRsIqCEqUcHkSMZ9K5bRqqMbjJ1E5FkTrndFe72m2sAF1MVBI4iD8iVKyoqO2w7VRbrJpRdkt7MGDe56GGhgJ8Njn1P8AZ9fPNd5gXNKQEXt0q7uRmz/0AqFja29znGFq2EmxuqaLzDrkhK2XUj5gF7YUNvhqsX+66nvtqlarsrsmDa7aUvQIqQULuCUqHiLdGPk4c8I686g9BMK8/lu7IxyzCB/9q4bpJkWeP7xd9TQojGeHjdipRk9hlW5/yrF21raoEGM/HcM+TMSDEhwyFuv55YA5DfcnYVx2fTD9wm/jeskMS7goYYhY42IKeyQeajtlR68tqCUjtXWVHakQL/FejupC23PcwsLSeoKVgEVsLWomsFMm1yAM5C2HGir6hSsfY1B6ILViuV50utSWkRpHvNvQTgGO6OLCe/CviB7bVMXjVMC2vCG0VTrk4MtQIeHHleZHJCf1KwKDTcNSqskB2XqSCYjTQ3fYcDzSj0SOSgSdhlP1r50FqherbM5cVQVQwmQtkNlfFxBON8/XB8wa4JNsfUzJ1Jq/wXFQWnH4tvbPEzFCUk8RyPjd2+bkOQ7nHs0iSLRY7dBkKUoy4gnYV8yHFEFxPoCtOPU+VBdaUpQKUpQKqF4H4xry027YxrYyq4yB3cPwND/vV9BVvNVTRf8ATrhqC9KIUJU4x2T2aZHAB/xcZ+tBa6UpQKr+r7lIjRWrdaz/AFrcleBF2z4W3xOq8kDf1wOtSV5ukSz216fOc4GGhk4GSo9EpHVROwHU1DaWtst2S9qG+N8Nzlp4WWSc+6R85S0P1dVHqfSgm7Rb2bTbItvjcXhR2g2kqOVKx1J6k8zVbfP+leoSxkGx2h7LxztJlD8h6FCOZ/VjtXdq25ymWY9ptSv61uSi2yr+4Rj43T5JHLzIrRfHIujtCy/dthFiqQyD8zrqhgZ7qUo/40FJsbL2q7W/YYchUdqdMlXC5SEDJQhbq/CbHTKuEEj90edXfRWi4Gk4yvAUqTMdADsp35ikckj91I7Vn2e6bTpnTUaG5hUtweLJcHVw9PQch6VZ6Dhudot12aQ1dIEWa2hXEhEllLgSe4Cga7OBPBwYHDjGMbYr6pQRNp03ZrM669arVChuu/OphkJJ8tunlUt0pSgjLxYLVew2LtAYleEctqcT8SPRXMfevq0WO12VtTdpgRoiVHKy02AVnuo8z9akaUEBr2O9L0beI8dtx1xyMpIQ2kqUodQANycZrk07JVeLyq4R2HmrZCiiJFW62UF9SilS1AHfhHAgA7b8XlVqIzWMb0GaUpQKUpQc9wkCJAkyVcmWlOH6AmoL2bsqZ0LZi4SXHowfcUeZU58ZP3VUpqNlcjT1zYaGVuRHUJA6koIFcuiZDcnR9lea+RcFkgdvgG1BN1omS48GM7JluoZYaSVuOLOEpSOZJrXdLjEtUF2bcJLceM0MrccOAP8AP0qqR4czWk1qfd2HItgZWFxLe6MLlKHJ14dE9kH1NBttDEjVVzYvtxaUza4547ZCdThSz0kLHQ4+UdAc86tcmQzDjOyJLiW2WUFxxxWwSkDJJ+lbQAOVVPU6vx29xdLsqPgBKZdzIG3ghWEtE9CtX/Kk0GzSTDlwekamnNlL08BMNCs5ZijdAweRVniPqB0qsarce1XrezWlghVsiTCp3B/tFtDicPok8CP4lq7VedSzXYFr8OBwpmyVCPEyPhStQPxEfupAKj5JNVz2eW9t2RIvLJWqGlsQbetXN1pCsuPerjmVZ6gCqLyBis0pUClKUClKUClKUClKUClKUClKUGCMjFVNqw36yeOxpmbb/wAPdcU43GntLPuqlHJCFJO6ckkJI2zzq20oKtE0iZE5q46mnKu8to8TLSmwiMwe6G99/wBSiTVoGwrNcV4uUez2yTcJiiGY7ZWrAyT2AHUk7D1oMXq6R7PapNxlk+FHQVkAZKj0SB1JOAPWozRtqfhW5ybcf9qXJz3qZk54FEbNg9kDCfoT1qGi++alvEGJdGwlq2hE+e0FApTKVu0we4Qk8R7nhNXkcqCs6q0zK1DcIWbkqNbW23ESmWk4ceCsZAV+UEAgnngnvViix2okZqPHbS2y0kIbQkYCUjYAVtpQKUpQKUpQKUpQKUpQKUpQKUpQKUpQKUpQKouv7mwi7W2HJBdZiJNxXHSd5DoUER2gOpU4rI/gq9VxO2i3PXRu6OwmFz2m/DbkKQCtKck4B+p+9BxaTtblqtQEvhM+UtUqatO4U8vdW/YbJHkkVNVgDFZoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoP//Z' + }] + } as unknown as StampSettings); +}); + +// Add programmatically +document.getElementById('addDynamic')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Stamp', { + offset: { x: 200, y: 140 }, pageNumber: 1 + } as StampSettings, DynamicStampItem.Approved); +}); + +document.getElementById('addSign')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Stamp', { + offset: { x: 200, y: 240 }, pageNumber: 1 + } as StampSettings, undefined, SignStampItem.Witness); +}); + +document.getElementById('addStandard')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Stamp', { + offset: { x: 200, y: 340 }, pageNumber: 1 + } as StampSettings, undefined, undefined, StandardBusinessStampItem.Approved); +}); + +document.getElementById('addCustom')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Stamp', { + offset: { x: 100, y: 440 }, + width: 46, + height: 100, + pageNumber: 1, + isLock: true, + author: 'Guest', + customStamps: [{ + customStampName: 'Image', + customStampImageSource:'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAIIAqwMBIgACEQEDEQH/xAAbAAEAAgMBAQAAAAAAAAAAAAAABQYBAwQHAv/EAEEQAAEDAwIEAwYDBAYLAAAAAAECAwQABREGIRIxQVETYXEHFCIygZEVQmIjUnKCJCUzU6HRFhc1c5KisbKzwvD/xAAVAQEBAAAAAAAAAAAAAAAAAAAAAf/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/APcaUpQKUpQKUpQKUpQKUpQKVzXGdFtsN2ZPfbYjNJ4nHHDgJFfEK5Q5ttbuUaQhcNxvxUPcklPfflQdlYJxURpe/salthuMNpxEYvuNtKc28VKVcPGB2JB577Vyz7pNuUxy26eWlCml8Mu4OI4kR/0oB2Wvp2T17EJK43qDbloakOqL7m6I7TanHVjOMhCQTjzxgVut89i4Mqdj8Y4VlC0OIKFIUOYKTuOn0INRZZtWkrVLuDpIIHHJlPK4nX1dOJR5kk4A5DYDArVoWbHuVgTPjvF5Ul5xx5zhIBc4jkJyBlI+UHqE0FjpSlApSlApSlApSlApSlApSlApSlArClAczgVmqr7QZLptkezxHi1KvD4ihxKsFprBU6v6IB+pFBTdUKf1uUuFa0WpyUIVoYBx706chchXdKEhZSPLNXXVTsOw6NdjNxkvJS0iLEidHnDhLaPME4z5ZzVHk6kTHu1vTpyE1Jf8L3Oww1ZDaGc4XJXjklXDhP6UlWd63ybrL1rq1mNa1hLcAKEeQgcTbbvyuScHnw5KGweZJPIVRYoDT6okfSlnfWhmCwlu43FGAUKxu2j9atyT+UHvirZBixLZBaiQ2kR4zCMIQnZKRWuz2yLZ7czBgo4GWh13KidypR6qJJJPevOvaFqCXqC4HSGmzxlxQbmvJJAPXwwe2M8R9R3FQc1xde9qOqEW+C44jTFuVxPvtnHvCvI+e4HYZPavV4sdmLGajxmktMtJCENpGAkDkBUbpixRNO2dm3Q0/Cj4lrPNazzUf/uWKlkkEZByKDNKUoFKUoFKUoFKUoFKwahZ2p7dFfMZhTs+ZnHu0FHirB/VjZHqogUE3WOIYzUApzUlwBKUxLOwQCFL/bv467DCEn6qr5i6btk5ht+ZOlXlCxlLkiTxtr8whGG8fy0HdK1FZorymHbjH8dPNlC+NY/lTk1XNTe0m12SCXBFnrkOpX7uh6ItkKUBzPGEnhzjcA1bokKLAZS1BjMx20jAQy2EjHoK85i6PuOovaFNv+pWPDt8J/ggMKUCXktq+BX8HNXmT2G9HLF1trSyW2GrUFgbluT3eCIRIS26tS/iSjwgCcDl35Z3qBlSb/edVcN58e4tojKafiW2MfDQpRBXF8X5UnZPGsq5ZAr0TV2j52oL9Anx7wqCxHYWypLbeXAFH4lNqz8KiNs8x0qy2e1QrNbmYFuZDUdkYSkHOT1JPUk7k0HhsG6u3SHPeisLFwnucE95hOPdmc8DUNhR/OrCR5Ak9NvX9F6cRp20IZIR706AX1I5DA2Qn9KRsPvzJqGmXG0N6pfk3KTEhW2ykBsLKUh2Y4nKlY6lKCAOuVmuafry5T5rFs0vaHQ5JSVIm3FBaQhvq7wfNwjurAPnQZ9pms1WtlVmtDqRcnxwrdK+ERknqT0Vj7DftUN7OA1BilywWx65TnU8PjOAtMsJJzlbhBypXMhPFgADbrF6B0sNSagkzrk+5cbTDeUQ5IHwy3T+bHbYE/y9yK9sabQ02lDSAhCRhKUjAAoIaFaZ8gh++zg8vIKYsUFphB+/Ev8AmONuVTYGBgcqzSoFKUoFKUoFKUoFcV4mOW+2yJbEN6Y40gqTHYGVuHsK7awRmg8rd/1gameJn2n8Ptv5YQn+78f+8cSFLI57AJ8/Oy2eyalhxkRo79htEVI2YgQ1uEH+JSgD68NW/FQ2r7yqxWCTNZR4knZqM1/ePLPChP3IoKRc4l91FqJ3TkfUst2Aygfiz7TDTaEA8mkEAnjPXfAH2NohaPehR2Y8bVF9QwygNttJMcJSkDAAAZru0hY02CyMxFK8SWv9rMfPN55W6lE9d9vQCpughmrLNZVxI1Fc19kupYUn/wAYP+NdQVMjD+khEhsfM40nhUPMp3z9D9K76xQRN/uNxjWj3qwW9F0krKfDa8YISUn83F25VVocf2kXdR/EJlrskZQxiM14ryR5ZJA9c/SrHo973m2SFjPhCfKSzn9wPLCceXbyxUpPmRrdDemTHUMx2UFbjizgJAoPGrbpyJBRPvEi53STfhc34MRCVMrckLSvCT8aFEEjBUQdhUlfbHcrcItuYvc+VqbUBDcpf7PgDSfnJPBxBCQcDBGcnlUn7Om4kly+aonhbPBPkeGiRsIqCEqUcHkSMZ9K5bRqqMbjJ1E5FkTrndFe72m2sAF1MVBI4iD8iVKyoqO2w7VRbrJpRdkt7MGDe56GGhgJ8Njn1P8AZ9fPNd5gXNKQEXt0q7uRmz/0AqFja29znGFq2EmxuqaLzDrkhK2XUj5gF7YUNvhqsX+66nvtqlarsrsmDa7aUvQIqQULuCUqHiLdGPk4c8I686g9BMK8/lu7IxyzCB/9q4bpJkWeP7xd9TQojGeHjdipRk9hlW5/yrF21raoEGM/HcM+TMSDEhwyFuv55YA5DfcnYVx2fTD9wm/jeskMS7goYYhY42IKeyQeajtlR68tqCUjtXWVHakQL/FejupC23PcwsLSeoKVgEVsLWomsFMm1yAM5C2HGir6hSsfY1B6ILViuV50utSWkRpHvNvQTgGO6OLCe/CviB7bVMXjVMC2vCG0VTrk4MtQIeHHleZHJCf1KwKDTcNSqskB2XqSCYjTQ3fYcDzSj0SOSgSdhlP1r50FqherbM5cVQVQwmQtkNlfFxBON8/XB8wa4JNsfUzJ1Jq/wXFQWnH4tvbPEzFCUk8RyPjd2+bkOQ7nHs0iSLRY7dBkKUoy4gnYV8yHFEFxPoCtOPU+VBdaUpQKUpQKqF4H4xry027YxrYyq4yB3cPwND/vV9BVvNVTRf8ATrhqC9KIUJU4x2T2aZHAB/xcZ+tBa6UpQKr+r7lIjRWrdaz/AFrcleBF2z4W3xOq8kDf1wOtSV5ukSz216fOc4GGhk4GSo9EpHVROwHU1DaWtst2S9qG+N8Nzlp4WWSc+6R85S0P1dVHqfSgm7Rb2bTbItvjcXhR2g2kqOVKx1J6k8zVbfP+leoSxkGx2h7LxztJlD8h6FCOZ/VjtXdq25ymWY9ptSv61uSi2yr+4Rj43T5JHLzIrRfHIujtCy/dthFiqQyD8zrqhgZ7qUo/40FJsbL2q7W/YYchUdqdMlXC5SEDJQhbq/CbHTKuEEj90edXfRWi4Gk4yvAUqTMdADsp35ikckj91I7Vn2e6bTpnTUaG5hUtweLJcHVw9PQch6VZ6Dhudot12aQ1dIEWa2hXEhEllLgSe4Cga7OBPBwYHDjGMbYr6pQRNp03ZrM669arVChuu/OphkJJ8tunlUt0pSgjLxYLVew2LtAYleEctqcT8SPRXMfevq0WO12VtTdpgRoiVHKy02AVnuo8z9akaUEBr2O9L0beI8dtx1xyMpIQ2kqUodQANycZrk07JVeLyq4R2HmrZCiiJFW62UF9SilS1AHfhHAgA7b8XlVqIzWMb0GaUpQKUpQc9wkCJAkyVcmWlOH6AmoL2bsqZ0LZi4SXHowfcUeZU58ZP3VUpqNlcjT1zYaGVuRHUJA6koIFcuiZDcnR9lea+RcFkgdvgG1BN1omS48GM7JluoZYaSVuOLOEpSOZJrXdLjEtUF2bcJLceM0MrccOAP8AP0qqR4czWk1qfd2HItgZWFxLe6MLlKHJ14dE9kH1NBttDEjVVzYvtxaUza4547ZCdThSz0kLHQ4+UdAc86tcmQzDjOyJLiW2WUFxxxWwSkDJJ+lbQAOVVPU6vx29xdLsqPgBKZdzIG3ghWEtE9CtX/Kk0GzSTDlwekamnNlL08BMNCs5ZijdAweRVniPqB0qsarce1XrezWlghVsiTCp3B/tFtDicPok8CP4lq7VedSzXYFr8OBwpmyVCPEyPhStQPxEfupAKj5JNVz2eW9t2RIvLJWqGlsQbetXN1pCsuPerjmVZ6gCqLyBis0pUClKUClKUClKUClKUClKUClKUGCMjFVNqw36yeOxpmbb/wAPdcU43GntLPuqlHJCFJO6ckkJI2zzq20oKtE0iZE5q46mnKu8to8TLSmwiMwe6G99/wBSiTVoGwrNcV4uUez2yTcJiiGY7ZWrAyT2AHUk7D1oMXq6R7PapNxlk+FHQVkAZKj0SB1JOAPWozRtqfhW5ybcf9qXJz3qZk54FEbNg9kDCfoT1qGi++alvEGJdGwlq2hE+e0FApTKVu0we4Qk8R7nhNXkcqCs6q0zK1DcIWbkqNbW23ESmWk4ceCsZAV+UEAgnngnvViix2okZqPHbS2y0kIbQkYCUjYAVtpQKUpQKUpQKUpQKUpQKUpQKUpQKUpQKUpQKouv7mwi7W2HJBdZiJNxXHSd5DoUER2gOpU4rI/gq9VxO2i3PXRu6OwmFz2m/DbkKQCtKck4B+p+9BxaTtblqtQEvhM+UtUqatO4U8vdW/YbJHkkVNVgDFZoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoFKUoP//Z' + }] + } as unknown as StampSettings); +}); + +// Edit programmatically +document.getElementById('editStamp')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + if (pdfviewer.annotationCollection[i].shapeAnnotationType === 'stamp') { + const width = pdfviewer.annotationCollection[i].bounds.width; + const height = pdfviewer.annotationCollection[i].bounds.height; + pdfviewer.annotationCollection[i].bounds = { x: 100, y: 100, width, height }; + pdfviewer.annotationCollection[i].annotationSettings.isLock = true; + pdfviewer.annotation.editAnnotation(pdfviewer.annotationCollection[i]); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Stamp Annotation/src/index.html b/Annotations/Annotation Types/Stamp Annotation/src/index.html new file mode 100644 index 0000000..8f1e648 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/src/index.html @@ -0,0 +1,40 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + + +
+ +
+ + + + + +
+ +
+ + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Stamp Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Stamp Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Stamp Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Stamp Annotation/src/styles/styles.css b/Annotations/Annotation Types/Stamp Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Stamp Annotation/tsconfig.json b/Annotations/Annotation Types/Stamp Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Stamp Annotation/webpack.config.js b/Annotations/Annotation Types/Stamp Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Stamp Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/.gitignore b/Annotations/Annotation Types/Sticky Notes Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/README.md b/Annotations/Annotation Types/Sticky Notes Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Sticky Notes Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Sticky Notes Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/gulpfile.js b/Annotations/Annotation Types/Sticky Notes Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/license b/Annotations/Annotation Types/Sticky Notes Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/package.json b/Annotations/Annotation Types/Sticky Notes Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/src/app/app.ts b/Annotations/Annotation Types/Sticky Notes Annotation/src/app/app.ts new file mode 100644 index 0000000..3d50c5b --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/src/app/app.ts @@ -0,0 +1,62 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + StickyNotesSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default Sticky Notes settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + stickyNotesSettings: { author: 'Syncfusion' } // default settings +}); +//pdfviewer.enableStickyNotesAnnotation = false; // To disable Sticky Notes feature initially +pdfviewer.appendTo('#PdfViewer'); + +// Add Sticky Note programmatically +document.getElementById('stickyNote')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('StickyNotes', { + offset: { x: 100, y: 200 }, + pageNumber: 1, + isLock: false + } as StickyNotesSettings); +}); + +// Edit first Sticky Note’s bounds programmatically +document.getElementById('editSticky')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + if (pdfviewer.annotationCollection[i].shapeAnnotationType === 'sticky') { + const width = pdfviewer.annotationCollection[i].bounds.width; + const height = pdfviewer.annotationCollection[i].bounds.height; + pdfviewer.annotationCollection[i].bounds = { x: 100, y: 100, width, height }; + pdfviewer.annotation.editAnnotation(pdfviewer.annotationCollection[i]); + break; + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/src/index.html b/Annotations/Annotation Types/Sticky Notes Annotation/src/index.html new file mode 100644 index 0000000..ce00c1a --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/src/index.html @@ -0,0 +1,24 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Sticky Notes Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Sticky Notes Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/src/styles/styles.css b/Annotations/Annotation Types/Sticky Notes Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/tsconfig.json b/Annotations/Annotation Types/Sticky Notes Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Sticky Notes Annotation/webpack.config.js b/Annotations/Annotation Types/Sticky Notes Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Sticky Notes Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Strikethrough Annotation/.gitignore b/Annotations/Annotation Types/Strikethrough Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Strikethrough Annotation/README.md b/Annotations/Annotation Types/Strikethrough Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Strikethrough Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Strikethrough Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Strikethrough Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Strikethrough Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Strikethrough Annotation/gulpfile.js b/Annotations/Annotation Types/Strikethrough Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Strikethrough Annotation/license b/Annotations/Annotation Types/Strikethrough Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Strikethrough Annotation/package.json b/Annotations/Annotation Types/Strikethrough Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Strikethrough Annotation/src/app/app.ts b/Annotations/Annotation Types/Strikethrough Annotation/src/app/app.ts new file mode 100644 index 0000000..d2fa644 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/src/app/app.ts @@ -0,0 +1,79 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + StrikethroughSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default Strikethrough settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + strikethroughSettings: { + author: 'Guest User', + subject: 'Not Important', + color: '#ff00ff', + opacity: 0.9, + } +}); + +// If you want to use server-backed PDF Viewer, uncomment the line below: +// pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; + +pdfviewer.appendTo('#PdfViewer'); + +// Enter Strikethrough mode +document.getElementById('set')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('Strikethrough'); +}); + +// Exit to Normal mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('None'); +}); + +// Add a Strikethrough annotation programmatically +document.getElementById('strikethrough')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Strikethrough', { + bounds: [{ x: 97, y: 110, width: 350, height: 14 }], + pageNumber: 1 + } as StrikethroughSettings); +}); + +// Edit the first available Strikethrough annotation programmatically +document.getElementById('editStrikethroughAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.annotationType === 'Strikethrough') { + ann.color = '#ff0000'; + ann.opacity = 0.8; + pdfviewer.annotation.editAnnotation(ann); + break; + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Strikethrough Annotation/src/index.html b/Annotations/Annotation Types/Strikethrough Annotation/src/index.html new file mode 100644 index 0000000..5bfe1a0 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/src/index.html @@ -0,0 +1,29 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Strikethrough Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Strikethrough Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Strikethrough Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Strikethrough Annotation/src/styles/styles.css b/Annotations/Annotation Types/Strikethrough Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Strikethrough Annotation/tsconfig.json b/Annotations/Annotation Types/Strikethrough Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Strikethrough Annotation/webpack.config.js b/Annotations/Annotation Types/Strikethrough Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Strikethrough Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Underline Annotation/.gitignore b/Annotations/Annotation Types/Underline Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Underline Annotation/README.md b/Annotations/Annotation Types/Underline Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Underline Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Underline Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Underline Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Underline Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Underline Annotation/gulpfile.js b/Annotations/Annotation Types/Underline Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Underline Annotation/license b/Annotations/Annotation Types/Underline Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Underline Annotation/package.json b/Annotations/Annotation Types/Underline Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Underline Annotation/src/app/app.ts b/Annotations/Annotation Types/Underline Annotation/src/app/app.ts new file mode 100644 index 0000000..af3d593 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/src/app/app.ts @@ -0,0 +1,79 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer, + UnderlineSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + Annotation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + FormFields, + FormDesigner, + PageOrganizer +); + +// Initialize with default Underline settings +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + underlineSettings: { + author: 'Guest User', + subject: 'Points to be remembered', + color: '#00ffff', + opacity: 0.9 + } +}); + +// If you want the server-backed PDF Viewer, uncomment the line below: +// pdfviewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; + +pdfviewer.appendTo('#PdfViewer'); + +// Enter Underline mode +document.getElementById('set')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('Underline'); +}); + +// Exit to Normal mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotation.setAnnotationMode('None'); +}); + +// Add an Underline annotation programmatically +document.getElementById('underline')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Underline', { + bounds: [{ x: 97, y: 110, width: 350, height: 14 }], + pageNumber: 1 + } as UnderlineSettings); +}); + +// Edit the first available Underline annotation programmatically +document.getElementById('editUnderlineAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.textMarkupAnnotationType === 'Underline') { + ann.color = '#00aa00'; + ann.opacity = 0.8; + pdfviewer.annotation.editAnnotation(ann); + break; + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Underline Annotation/src/index.html b/Annotations/Annotation Types/Underline Annotation/src/index.html new file mode 100644 index 0000000..20d7613 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/src/index.html @@ -0,0 +1,28 @@ + + + + + Essential JS 2 + + + + + + + + + + +
+ + + + + + +
+
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Underline Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Underline Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Underline Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Underline Annotation/src/styles/styles.css b/Annotations/Annotation Types/Underline Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Underline Annotation/tsconfig.json b/Annotations/Annotation Types/Underline Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Underline Annotation/webpack.config.js b/Annotations/Annotation Types/Underline Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Underline Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Annotation Types/Volume Annotation/.gitignore b/Annotations/Annotation Types/Volume Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Annotation Types/Volume Annotation/README.md b/Annotations/Annotation Types/Volume Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Annotation Types/Volume Annotation/e2e/index.spec.js b/Annotations/Annotation Types/Volume Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Annotation Types/Volume Annotation/e2e/protractor.conf.js b/Annotations/Annotation Types/Volume Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Annotation Types/Volume Annotation/gulpfile.js b/Annotations/Annotation Types/Volume Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Annotation Types/Volume Annotation/license b/Annotations/Annotation Types/Volume Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Annotation Types/Volume Annotation/package.json b/Annotations/Annotation Types/Volume Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Annotation Types/Volume Annotation/src/app/app.ts b/Annotations/Annotation Types/Volume Annotation/src/app/app.ts new file mode 100644 index 0000000..44acc7d --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/src/app/app.ts @@ -0,0 +1,56 @@ +import { + PdfViewer, Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, FormDesigner, + PageOrganizer, VolumeSettings +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, + ThumbnailView, BookmarkView, TextSelection, TextSearch, FormFields, + FormDesigner, PageOrganizer +); + +// Initialize viewer with defaults (volume + measurement) +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + volumeSettings: { fillColor: 'pink', opacity: 0.6, strokeColor: 'yellow' }, + measurementSettings: { scaleRatio: 2, conversionUnit: 'cm', displayUnit: 'cm' } +}); + +pdfviewer.appendTo('#PdfViewer'); + +// Enable Volume drawing mode +document.getElementById('volumeMode')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('Volume'); +}); + +// Exit drawing mode +document.getElementById('setNone')?.addEventListener('click', () => { + pdfviewer.annotationModule.setAnnotationMode('None'); +}); + +// Add a Volume annotation programmatically +document.getElementById('addVolumeAnnotation')?.addEventListener('click', () => { + pdfviewer.annotation.addAnnotation('Volume', { + offset: { x: 200, y: 810 }, + pageNumber: 1, + vertexPoints: [ + { x: 200, y: 810 }, { x: 200, y: 919 }, { x: 320, y: 919 }, + { x: 320, y: 809 }, { x: 200, y: 810 } + ] + } as VolumeSettings); +}); + +// Edit existing Volume annotations programmatically +document.getElementById('editVolumeAnnotation')?.addEventListener('click', () => { + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + const ann = pdfviewer.annotationCollection[i]; + if (ann.subject === 'Volume calculation') { + ann.strokeColor = '#0000FF'; + ann.thickness = 2; + ann.opacity = 0.8; + pdfviewer.annotation.editAnnotation(ann); + } + } +}); \ No newline at end of file diff --git a/Annotations/Annotation Types/Volume Annotation/src/index.html b/Annotations/Annotation Types/Volume Annotation/src/index.html new file mode 100644 index 0000000..8e979e2 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/src/index.html @@ -0,0 +1,26 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Annotation Types/Volume Annotation/src/resources/favicon.ico b/Annotations/Annotation Types/Volume Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Annotation Types/Volume Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Annotation Types/Volume Annotation/src/styles/styles.css b/Annotations/Annotation Types/Volume Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Annotation Types/Volume Annotation/tsconfig.json b/Annotations/Annotation Types/Volume Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Annotation Types/Volume Annotation/webpack.config.js b/Annotations/Annotation Types/Volume Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Annotation Types/Volume Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Custom Tools in Annotation/.gitignore b/Annotations/Custom Tools in Annotation/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Custom Tools in Annotation/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Custom Tools in Annotation/README.md b/Annotations/Custom Tools in Annotation/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Custom Tools in Annotation/e2e/index.spec.js b/Annotations/Custom Tools in Annotation/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Custom Tools in Annotation/e2e/protractor.conf.js b/Annotations/Custom Tools in Annotation/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Custom Tools in Annotation/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/gulpfile.js b/Annotations/Custom Tools in Annotation/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/license b/Annotations/Custom Tools in Annotation/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Custom Tools in Annotation/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Custom Tools in Annotation/package.json b/Annotations/Custom Tools in Annotation/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Custom Tools in Annotation/src/app/app.ts b/Annotations/Custom Tools in Annotation/src/app/app.ts new file mode 100644 index 0000000..99ead69 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/src/app/app.ts @@ -0,0 +1,62 @@ +// app.ts +import { PdfViewer, Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, TextSearch } from '@syncfusion/ej2-pdfviewer'; +import { Toolbar as Tool, ClickEventArgs, ItemModel } from '@syncfusion/ej2-navigations'; + +PdfViewer.Inject(Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, ThumbnailView, BookmarkView, TextSelection, TextSearch); + +const pdfviewer: PdfViewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + enableToolbar: false, + enableAnnotation: true +}); +pdfviewer.appendTo('#PdfViewer'); + +const items: ItemModel[] = [ + { text: 'Highlight', id: 'annHighlight', tooltipText: 'Highlight', prefixIcon: 'e-pv-highlight-icon' }, + { text: 'Underline', id: 'annUnderline', tooltipText: 'Underline', prefixIcon: 'e-pv-underline-icon' }, + { text: 'Strike', id: 'annStrike', tooltipText: 'Strikethrough', prefixIcon: 'e-pv-strikethrough-icon' }, + { type: 'Separator' }, + { text: 'Rect', id: 'annRect', tooltipText: 'Rectangle', prefixIcon: 'e-pv-shape-rectangle-icon' }, + { text: 'Circle', id: 'annCircle', tooltipText: 'Circle', prefixIcon: 'e-pv-shape-circle-icon' }, + { text: 'Line', id: 'annLine', tooltipText: 'Line', prefixIcon: 'e-pv-shape-line-icon' }, + { text: 'Arrow', id: 'annArrow', tooltipText: 'Arrow', prefixIcon: 'e-pv-shape-arrow-icon' }, + { text: 'Polygon', id: 'annPolygon', tooltipText: 'Polygon', prefixIcon: 'e-pv-shape-pentagon' }, + { type: 'Separator' }, + { text: 'Free Text', id: 'annFreeText', tooltipText: 'Free Text', prefixIcon: 'e-pv-freetext-icon' }, + { text: 'Ink', id: 'annInk', tooltipText: 'Ink', prefixIcon: 'e-pv-inkannotation-icon' }, + { text: 'Note', id: 'annSticky', tooltipText: 'Sticky Note', prefixIcon: 'e-pv-sticky-notes' }, + { type: 'Separator' }, + { text: 'Distance', id: 'annDistance', tooltipText: 'Distance', prefixIcon: 'e-pv-calibrate-distance-icon' }, + { text: 'Perimeter', id: 'annPerimeter', tooltipText: 'Perimeter', prefixIcon: 'e-pv-calibrate-perimeter-icon' }, + { text: 'Area', id: 'annArea', tooltipText: 'Area', prefixIcon: 'e-pv-calibrate-area-icon' }, + { text: 'Radius', id: 'annRadius', tooltipText: 'Radius', prefixIcon: 'e-pv-calibrate-radius-icon' }, + { type: 'Separator' }, + { text: 'Exit', id: 'annNone', tooltipText: 'Exit drawing', align: 'Right' } +]; + +const toolbar = new Tool({ + items, + overflowMode: 'Scrollable', + clicked: (args: ClickEventArgs) => { + switch (args.item.id) { + case 'annHighlight': pdfviewer.annotationModule.setAnnotationMode('Highlight'); break; + case 'annUnderline': pdfviewer.annotationModule.setAnnotationMode('Underline'); break; + case 'annStrike': pdfviewer.annotationModule.setAnnotationMode('Strikethrough'); break; + case 'annRect': pdfviewer.annotationModule.setAnnotationMode('Rectangle'); break; + case 'annCircle': pdfviewer.annotationModule.setAnnotationMode('Circle'); break; + case 'annLine': pdfviewer.annotationModule.setAnnotationMode('Line'); break; + case 'annArrow': pdfviewer.annotationModule.setAnnotationMode('Arrow'); break; + case 'annPolygon': pdfviewer.annotationModule.setAnnotationMode('Polygon'); break; + case 'annFreeText': pdfviewer.annotationModule.setAnnotationMode('FreeText'); break; + case 'annInk': pdfviewer.annotationModule.setAnnotationMode('Ink'); break; + case 'annSticky': pdfviewer.annotationModule.setAnnotationMode('StickyNotes'); break; + case 'annDistance': pdfviewer.annotationModule.setAnnotationMode('Distance'); break; + case 'annPerimeter': pdfviewer.annotationModule.setAnnotationMode('Perimeter'); break; + case 'annArea': pdfviewer.annotationModule.setAnnotationMode('Area'); break; + case 'annRadius': pdfviewer.annotationModule.setAnnotationMode('Radius'); break; + case 'annNone': pdfviewer.annotationModule.setAnnotationMode('None'); break; + } + } +}); +toolbar.appendTo('#annotationToolbar'); \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/src/index.html b/Annotations/Custom Tools in Annotation/src/index.html new file mode 100644 index 0000000..07003e4 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/src/index.html @@ -0,0 +1,20 @@ + + + + + Essential JS 2 + + + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/src/resources/favicon.ico b/Annotations/Custom Tools in Annotation/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Custom Tools in Annotation/src/resources/favicon.ico differ diff --git a/Annotations/Custom Tools in Annotation/src/resources/pdf-succinctly.json b/Annotations/Custom Tools in Annotation/src/resources/pdf-succinctly.json new file mode 100644 index 0000000..24f4bf1 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/src/resources/pdf-succinctly.json @@ -0,0 +1 @@ +{"pdfAnnotation":{ "0":{"shapeAnnotation":[{"type":"Line","page":"0","start":"74.25,681","end":"153,761.25","title":"Guest","name":"9abdfca6-067f-4298-63fb-ca5ac669f574","subject":"Arrow","color":"#FF0000","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","head":"ClosedArrow","tail":"ClosedArrow","date":"D:20251217165951+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"caption":"false","caption-style":"Inline","leaderLength":"0","leaderExtend":"0","rect":{"x":"61.25","y":"672","width":"166","height":"770.25"}},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"9abdfca6-067f-4298-63fb-ca5ac669f574","rect":{"x":"98","y":"940","width":"205","height":"833"}},{"type":"Square","page":"0","title":"Guest","name":"2cb37334-7596-426a-d102-476974d61583","subject":"Rectangle","color":"#FF0000","FillOpacity":"0","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","date":"D:20251217165955+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"rect":{"x":"186.75","y":"660.75","width":"333.75","height":"749.25"},"N":"","appearance":"eyJhcCI6eyJOIjp7InN0cmVhbSI6eyJUeXBlIjp7Im5hbWUiOiJYT2JqZWN0In0sIlN1YnR5cGUiOnsibmFtZSI6IkZvcm0ifSwiQkJveCI6eyJhcnJheSI6W3siaW50IjoiMCJ9LHsiaW50IjoiMCJ9LHsiaW50IjoiMTQ3In0seyJmaXhlZCI6Ijg4LjUifV19LCJNYXRyaXgiOnsiYXJyYXkiOlt7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifSx7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifV19LCJSZXNvdXJjZXMiOnsiZGljdCI6eyJQcm9jU2V0Ijp7ImFycmF5IjpbeyJuYW1lIjoiUERGIn1dfX19LCJMZW5ndGgiOnsiaW50IjoiMTkwIn0sImRhdGEiOnsibW9kZSI6InJhdyIsImVuY29kaW5nIjoiaGV4IiwiYnl0ZXMiOiIyNTIwNDM2ODYxNkU2NzY1MjA2MzZGMkQ2RjcyNjQ2OTZFNjE3NDY1MjA3Mzc5NzM3NDY1NkQyMDc0NkYyMDZDNjU2Njc0MkY3NDZGNzAyRTBEMEEzMTJFMzAzMDIwMkUzMDMwMjAyRTMwMzAyMDMxMkUzMDMwMjAyRTMwMzAyMDM4MzgyRTM1MzAyMDIwNjM2RDBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNDM1MzBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNjM3MzBEMEE1QjVEMjAzMDIwNjQwRDBBMzEyRTMwMzAzMDIwNzcwRDBBMzAyMDZBMEQwQTMwMjA0QTBEMEEzMTJFMzAzMDMwMjAzMDJFMzAzMDMwMjAzMDJFMzAzMDMwMjA1MjQ3MEQwQTMwMkUzNTMwMzAyMDJEMzAyRTM1MzAzMDIwMzEzNDM2MkUzMDMwMzAyMDJEMzgzNzJFMzUzMDMwMjA3MjY1MEQwQTUzMEQwQSJ9fX19fQ=="},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"2cb37334-7596-426a-d102-476974d61583","rect":{"x":"186.75","y":"923.25","width":"333.75","height":"834.75"}}]},"2":{"shapeAnnotation":[{"type":"Link","page":"2","rect":{"x":"313.87","y":"544.57","width":"414.3","height":"559.75"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"87.75","y":"499.03","width":"188.18","height":"514.21"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"331.53","y":"483.86","width":"431.96","height":"499.03"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"}]},"3":{"shapeAnnotation":[{"type":"Link","page":"3","rect":{"x":"87.75","y":"667.05","width":"523.75","height":"679.7"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"654.4","width":"523.75","height":"667.05"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"641.76","width":"523.75","height":"654.4"},"width":"0","flags":"print","Dest":",XYZ,87,319,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"628.33","width":"523.75","height":"641.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"615.68","width":"523.75","height":"628.33"},"width":"0","flags":"print","Dest":",XYZ,87,219,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"603.03","width":"523.75","height":"615.68"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"590.38","width":"523.75","height":"603.03"},"width":"0","flags":"print","Dest":",XYZ,87,306,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"577.73","width":"523.75","height":"590.38"},"width":"0","flags":"print","Dest":",XYZ,87,187,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"565.08","width":"523.75","height":"577.73"},"width":"0","flags":"print","Dest":",XYZ,87,657,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"551.66","width":"523.75","height":"565.08"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"539.01","width":"523.75","height":"551.66"},"width":"0","flags":"print","Dest":",XYZ,87,494,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"526.36","width":"523.75","height":"539.01"},"width":"0","flags":"print","Dest":",XYZ,87,325,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"513.71","width":"523.75","height":"526.36"},"width":"0","flags":"print","Dest":",XYZ,87,218,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"501.06","width":"523.75","height":"513.71"},"width":"0","flags":"print","Dest":",XYZ,87,260,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"488.41","width":"523.75","height":"501.06"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"475.76","width":"523.75","height":"488.41"},"width":"0","flags":"print","Dest":",XYZ,87,460,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"463.11","width":"523.75","height":"475.76"},"width":"0","flags":"print","Dest":",XYZ,87,604,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"450.46","width":"523.75","height":"463.11"},"width":"0","flags":"print","Dest":",XYZ,87,401,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"437.81","width":"523.75","height":"450.46"},"width":"0","flags":"print","Dest":",XYZ,87,245,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"425.17","width":"523.75","height":"437.81"},"width":"0","flags":"print","Dest":",XYZ,87,590,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"412.52","width":"523.75","height":"425.17"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"399.87","width":"523.75","height":"412.52"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"387.22","width":"523.75","height":"399.87"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"374.57","width":"523.75","height":"387.22"},"width":"0","flags":"print","Dest":",XYZ,87,287,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"361.92","width":"523.75","height":"374.57"},"width":"0","flags":"print","Dest":",XYZ,87,670,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"348.49","width":"523.75","height":"361.92"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"335.84","width":"523.75","height":"348.49"},"width":"0","flags":"print","Dest":",XYZ,87,592,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"323.2","width":"523.75","height":"335.84"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"310.55","width":"523.75","height":"323.2"},"width":"0","flags":"print","Dest":",XYZ,87,645,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"297.9","width":"523.75","height":"310.55"},"width":"0","flags":"print","Dest":",XYZ,87,463,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"285.25","width":"523.75","height":"297.9"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"272.6","width":"523.75","height":"285.25"},"width":"0","flags":"print","Dest":",XYZ,87,341,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"259.95","width":"523.75","height":"272.6"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"247.3","width":"523.75","height":"259.95"},"width":"0","flags":"print","Dest":",XYZ,87,367,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"234.65","width":"523.75","height":"247.3"},"width":"0","flags":"print","Dest":",XYZ,87,127,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"222","width":"523.75","height":"234.65"},"width":"0","flags":"print","Dest":",XYZ,87,280,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"209.36","width":"523.75","height":"222"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"196.71","width":"523.75","height":"209.36"},"width":"0","flags":"print","Dest":",XYZ,87,400,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"184.06","width":"523.75","height":"196.71"},"width":"0","flags":"print","Dest":",XYZ,87,333,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"171.41","width":"523.75","height":"184.06"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"158.76","width":"523.75","height":"171.41"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"146.11","width":"523.75","height":"158.76"},"width":"0","flags":"print","Dest":",XYZ,87,251,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"133.46","width":"523.75","height":"146.11"},"width":"0","flags":"print","Dest":",XYZ,87,519,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"120.81","width":"523.75","height":"133.46"},"width":"0","flags":"print","Dest":",XYZ,87,517,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"108.16","width":"523.75","height":"120.81"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"94.736","width":"523.75","height":"108.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"82.087","width":"523.75","height":"94.736"},"width":"0","flags":"print","Dest":",XYZ,87,620,0"}]},"4":{"shapeAnnotation":[{"type":"Link","page":"4","rect":{"x":"97.75","y":"707.35","width":"523.75","height":"720"},"width":"0","flags":"print","Dest":",XYZ,87,311,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"694.7","width":"523.75","height":"707.35"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"682.05","width":"523.75","height":"694.7"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"669.4","width":"523.75","height":"682.05"},"width":"0","flags":"print","Dest":",XYZ,87,194,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"656.76","width":"523.75","height":"669.4"},"width":"0","flags":"print","Dest":",XYZ,87,358,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"644.11","width":"523.75","height":"656.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"631.46","width":"523.75","height":"644.11"},"width":"0","flags":"print","Dest":",XYZ,87,414,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"618.81","width":"523.75","height":"631.46"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"606.16","width":"523.75","height":"618.81"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"593.51","width":"523.75","height":"606.16"},"width":"0","flags":"print","Dest":",XYZ,87,389,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"580.86","width":"523.75","height":"593.51"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"568.21","width":"523.75","height":"580.86"},"width":"0","flags":"print","Dest":",XYZ,87,215,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"555.56","width":"523.75","height":"568.21"},"width":"0","flags":"print","Dest":",XYZ,87,457,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"542.92","width":"523.75","height":"555.56"},"width":"0","flags":"print","Dest":",XYZ,87,362,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"530.27","width":"523.75","height":"542.92"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"517.62","width":"523.75","height":"530.27"},"width":"0","flags":"print","Dest":",XYZ,87,668,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"504.97","width":"523.75","height":"517.62"},"width":"0","flags":"print","Dest":",XYZ,87,350,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"492.32","width":"523.75","height":"504.97"},"width":"0","flags":"print","Dest":",XYZ,87,371,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"479.67","width":"523.75","height":"492.32"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"467.02","width":"523.75","height":"479.67"},"width":"0","flags":"print","Dest":",XYZ,87,570,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"454.37","width":"523.75","height":"467.02"},"width":"0","flags":"print","Dest":",XYZ,87,471,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"441.72","width":"523.75","height":"454.37"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"429.07","width":"523.75","height":"441.72"},"width":"0","flags":"print","Dest":",XYZ,87,478,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"416.43","width":"523.75","height":"429.07"},"width":"0","flags":"print","Dest":",XYZ,87,454,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"403.78","width":"523.75","height":"416.43"},"width":"0","flags":"print","Dest":",XYZ,87,388,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"390.35","width":"523.75","height":"403.78"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"377.7","width":"523.75","height":"390.35"},"width":"0","flags":"print","Dest":",XYZ,87,481,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"365.05","width":"523.75","height":"377.7"},"width":"0","flags":"print","Dest":",XYZ,87,337,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"352.4","width":"523.75","height":"365.05"},"width":"0","flags":"print","Dest":",XYZ,87,243,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"339.75","width":"523.75","height":"352.4"},"width":"0","flags":"print","Dest":",XYZ,87,201,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"327.1","width":"523.75","height":"339.75"},"width":"0","flags":"print","Dest":",XYZ,87,363,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"314.46","width":"523.75","height":"327.1"},"width":"0","flags":"print","Dest":",XYZ,87,281,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"301.81","width":"523.75","height":"314.46"},"width":"0","flags":"print","Dest":",XYZ,87,444,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"289.16","width":"523.75","height":"301.81"},"width":"0","flags":"print","Dest":",XYZ,87,226,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"276.51","width":"523.75","height":"289.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"263.86","width":"523.75","height":"276.51"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"251.21","width":"523.75","height":"263.86"},"width":"0","flags":"print","Dest":",XYZ,87,334,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"238.56","width":"523.75","height":"251.21"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"225.91","width":"523.75","height":"238.56"},"width":"0","flags":"print","Dest":",XYZ,87,488,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"213.26","width":"523.75","height":"225.91"},"width":"0","flags":"print","Dest":",XYZ,87,268,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"200.62","width":"523.75","height":"213.26"},"width":"0","flags":"print","Dest":",XYZ,87,543,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"187.97","width":"523.75","height":"200.62"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"175.32","width":"523.75","height":"187.97"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"}]},"6":{"shapeAnnotation":[{"type":"Link","page":"6","rect":{"x":"114.65","y":"554.29","width":"286.81","height":"578.94"},"width":"0","flags":"print","URI":"mailto:succinctly-series@syncfusion.com"}]},"7":{"shapeAnnotation":[{"type":"Link","page":"7","rect":{"x":"236.94","y":"494.27","width":"265.29","height":"506.92"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/docs/install-pdftk/"},{"type":"Link","page":"7","rect":{"x":"91.413","y":"406.37","width":"185.79","height":"419.02"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"319.13","width":"316.02","height":"343.78"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly/"},{"type":"Link","page":"7","rect":{"x":"351.9","y":"262.38","width":"446.3","height":"275.03"},"width":"0","flags":"print","URI":"http://www.iso.org/iso/catalogue_detail.htm?csnumber=51502"},{"type":"Link","page":"7","rect":{"x":"329.28","y":"249.74","width":"524.25","height":"262.38"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"225.09","width":"107.54","height":"249.74"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]},"12":{"shapeAnnotation":[{"type":"Link","page":"12","rect":{"x":"217.35","y":"582.81","width":"270.76","height":"595.46"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/tools/pdftk-the-pdf-toolkit/"},{"type":"Link","page":"12","rect":{"x":"267.47","y":"519.24","width":"492.69","height":"531.89"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"50":{"shapeAnnotation":[{"type":"Link","page":"50","rect":{"x":"227.17","y":"569.51","width":"284.86","height":"582.16"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"50","rect":{"x":"284.04","y":"374.6","width":"416.32","height":"399.25"},"width":"0","flags":"print","URI":"http://api.itextpdf.com/itext"},{"type":"Link","page":"50","rect":{"x":"369.63","y":"293.21","width":"437.71","height":"314.86"},"width":"0","flags":"print","URI":"http://sourceforge.net/projects/itextsharp/files/itextsharp/"},{"type":"Link","page":"50","rect":{"x":"274.81","y":"174.52","width":"500.02","height":"199.17"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"57":{"shapeAnnotation":[{"type":"Link","page":"57","rect":{"x":"99.98","y":"568.8","width":"198.63","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/fonts/ChunkFive"},{"type":"Link","page":"57","rect":{"x":"267.5","y":"568.8","width":"355.76","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/"}]},"58":{"shapeAnnotation":[{"type":"Link","page":"58","rect":{"x":"117.7","y":"641.84","width":"212.82","height":"667.46"},"width":"0","flags":"print","Dest":",XYZ,87,198,0"},{"type":"Link","page":"58","rect":{"x":"277.29","y":"522.5","width":"303.8","height":"547.15"},"width":"0","flags":"print","URI":"http://mvc.syncfusion.com/sfmvcpdfsamplebrowser"}]},"59":{"shapeAnnotation":[{"type":"Link","page":"59","rect":{"x":"347.01","y":"532.21","width":"524.25","height":"544.86"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"59","rect":{"x":"87.75","y":"519.56","width":"146.06","height":"532.21"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]}}} \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/src/styles/styles.css b/Annotations/Custom Tools in Annotation/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Custom Tools in Annotation/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Custom Tools in Annotation/tsconfig.json b/Annotations/Custom Tools in Annotation/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Custom Tools in Annotation/webpack.config.js b/Annotations/Custom Tools in Annotation/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Custom Tools in Annotation/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Customize Annotation Settings/.gitignore b/Annotations/Customize Annotation Settings/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Customize Annotation Settings/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Customize Annotation Settings/README.md b/Annotations/Customize Annotation Settings/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Customize Annotation Settings/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Customize Annotation Settings/e2e/index.spec.js b/Annotations/Customize Annotation Settings/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Customize Annotation Settings/e2e/protractor.conf.js b/Annotations/Customize Annotation Settings/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Customize Annotation Settings/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Customize Annotation Settings/gulpfile.js b/Annotations/Customize Annotation Settings/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Customize Annotation Settings/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Customize Annotation Settings/license b/Annotations/Customize Annotation Settings/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Customize Annotation Settings/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Customize Annotation Settings/package.json b/Annotations/Customize Annotation Settings/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Customize Annotation Settings/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Customize Annotation Settings/src/app/app.ts b/Annotations/Customize Annotation Settings/src/app/app.ts new file mode 100644 index 0000000..91a46e4 --- /dev/null +++ b/Annotations/Customize Annotation Settings/src/app/app.ts @@ -0,0 +1,123 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + Print, + Annotation, + FormFields, + FormDesigner, + AnnotationResizerLocation, + CursorType, + AllowedInteraction +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + Print, + Annotation, + FormFields, + FormDesigner +); + +// Centralized default values (used on init and “Restore Defaults”) +const defaultConfig = { + // Text markup + highlightSettings: { author: 'QA', subject: 'Review', color: '#ffff00', opacity: 0.6 }, + strikethroughSettings: { author: 'QA', subject: 'Remove', color: '#ff0000', opacity: 0.6 }, + underlineSettings: { author: 'Guest User', subject: 'Points to be remembered', color: '#00ffff', opacity: 0.9 }, + squigglySettings: { author: 'Guest User', subject: 'Corrections', color: '#00ff00', opacity: 0.9 }, + + // Shapes + lineSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8 }, + arrowSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8 }, + rectangleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1 }, + circleSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1 }, + polygonSettings: { fillColor: '#ffffff00', strokeColor: '#222222', thickness: 1, opacity: 1 }, + + // Measurements + distanceSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8 }, + perimeterSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8 }, + areaSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00' }, + radiusSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00' }, + volumeSettings: { strokeColor: '#0066ff', thickness: 2, opacity: 0.8, fillColor: '#ffffff00' }, + + // Others + freeTextSettings: { borderColor: '#222222', thickness: 1, opacity: 1 }, + inkAnnotationSettings: { color: '#0000ff', thickness: 3, opacity: 0.8 }, + stampSettings: { opacity: 0.9 }, + stickyNotesSettings: { author: 'QA', subject: 'Review', color: '#ffcc00', opacity: 1 } +}; + +// Create viewer +const viewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + // Standalone resources + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', + // Apply defaults + ...defaultConfig +}); + +// Optional: If you want to run with server-backed mode, uncomment the next line and remove resourceUrl above +// viewer.serviceUrl = 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/'; + +viewer.appendTo('#PdfViewer'); + +// Bulk update annotations example +document.getElementById('bulkUpdateAnn')?.addEventListener('click', () => { + // Walk all annotations in current document and update matches + for (let i = 0; i < viewer.annotationCollection.length; i++) { + const ann = viewer.annotationCollection[i] as any; + if (ann.author === 'Guest' || ann.subject === 'rectangle') { + ann.color = '#ff0000'; + ann.opacity = 0.8; + // Optional for shapes/lines: + // ann.strokeColor = '#222222'; + // ann.thickness = 2; + ann.fillColor = 'rgba(158, 23, 237, 0.87)'; + viewer.annotation.editAnnotation(ann); + } + } +}); + +// Apply annotationSettings (runtime) +document.getElementById('applyAnnSettings')?.addEventListener('click', () => { + viewer.annotationSettings = { + author: 'XYZ', + minHeight: 10, + minWidth: 10, + maxWidth: 100, + maxHeight: 100, + isLock: false, + skipPrint: false, + skipDownload: false, + allowedInteractions: [AllowedInteraction.Select, AllowedInteraction.Move] + }; +}); + +// Apply annotationSelectorSettings (runtime) +document.getElementById('applySelectorSettings')?.addEventListener('click', () => { + viewer.annotationSelectorSettings = { + selectionBorderColor: 'blue', + resizerBorderColor: 'red', + resizerFillColor: '#f2ff40ff', + resizerSize: 8, + selectionBorderThickness: 1, + resizerShape: 'Circle', + selectorLineDashArray: [5, 6], + resizerLocation: AnnotationResizerLocation.Corners | AnnotationResizerLocation.Edges, + resizerCursorType: CursorType.grab + }; +}); \ No newline at end of file diff --git a/Annotations/Customize Annotation Settings/src/index.html b/Annotations/Customize Annotation Settings/src/index.html new file mode 100644 index 0000000..4b3e842 --- /dev/null +++ b/Annotations/Customize Annotation Settings/src/index.html @@ -0,0 +1,25 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Customize Annotation Settings/src/resources/favicon.ico b/Annotations/Customize Annotation Settings/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Customize Annotation Settings/src/resources/favicon.ico differ diff --git a/Annotations/Customize Annotation Settings/src/styles/styles.css b/Annotations/Customize Annotation Settings/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Customize Annotation Settings/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Customize Annotation Settings/tsconfig.json b/Annotations/Customize Annotation Settings/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Customize Annotation Settings/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Customize Annotation Settings/webpack.config.js b/Annotations/Customize Annotation Settings/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Customize Annotation Settings/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Export and Import Annotations/.gitignore b/Annotations/Export and Import Annotations/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Export and Import Annotations/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Export and Import Annotations/README.md b/Annotations/Export and Import Annotations/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Export and Import Annotations/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Export and Import Annotations/e2e/index.spec.js b/Annotations/Export and Import Annotations/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Export and Import Annotations/e2e/protractor.conf.js b/Annotations/Export and Import Annotations/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Export and Import Annotations/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/gulpfile.js b/Annotations/Export and Import Annotations/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Export and Import Annotations/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/license b/Annotations/Export and Import Annotations/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Export and Import Annotations/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Export and Import Annotations/package.json b/Annotations/Export and Import Annotations/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Export and Import Annotations/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Export and Import Annotations/src/app/app.ts b/Annotations/Export and Import Annotations/src/app/app.ts new file mode 100644 index 0000000..5af3cfa --- /dev/null +++ b/Annotations/Export and Import Annotations/src/app/app.ts @@ -0,0 +1,64 @@ +import { PdfViewer, Toolbar, Magnification, Navigation, LinkAnnotation, ThumbnailView, BookmarkView, + TextSelection, TextSearch, Print, Annotation, FormFields, FormDesigner, AllowedInteraction, AnnotationDataFormat } from '@syncfusion/ej2-pdfviewer'; + +// Inject required modules +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + Print, + Annotation, + FormFields, + FormDesigner +); + +// Initialize the viewer +let viewer: PdfViewer = new PdfViewer(); +viewer.resourceUrl = 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'; +viewer.documentPath = 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf'; +viewer.appendTo('#pdfViewer'); + +// Wire up export actions + +//Export Annotation as JSON +const btnJson = document.getElementById('ExportJSON'); +btnJson?.addEventListener('click', () => { + viewer.exportAnnotation(AnnotationDataFormat.Json); +}); + +//Export Annotation As XFDF +const btnXfdf = document.getElementById('ExportXfdf'); +btnXfdf?.addEventListener('click', () => { + viewer.exportAnnotation(AnnotationDataFormat.Xfdf); +}); + +//Export Annotation as Object +var exportedObject: string; +const btnObject = document.getElementById('ExportAsObject'); +btnObject?.addEventListener('click', () => { + viewer.exportAnnotationsAsObject().then((value: any) => { + // Persist or transmit the object as needed (DB/API). Keep for future import. + console.log('Exported annotation object:', value); + exportedObject=value; + }); +}); + +//Export Annotation as Base64 +var exportObject1; +document.getElementById('ExportAsBase64')?.addEventListener('click', function () { +viewer.exportAnnotationsAsBase64String(AnnotationDataFormat.Json).then(function (value: any) { + exportObject1 = value; + console.log(exportObject1); + }) + }); + +// Import from an exported object pasted in the textarea +const btnImport = document.getElementById('ImportFromObject'); +btnImport?.addEventListener('click', () => { + viewer.importAnnotation(JSON.parse(exportedObject)); +}); \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/src/index.html b/Annotations/Export and Import Annotations/src/index.html new file mode 100644 index 0000000..386c98a --- /dev/null +++ b/Annotations/Export and Import Annotations/src/index.html @@ -0,0 +1,24 @@ + + + + + Essential JS 2 + + + + + + + + + + + + + + +
+ + + + \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/src/resources/favicon.ico b/Annotations/Export and Import Annotations/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Export and Import Annotations/src/resources/favicon.ico differ diff --git a/Annotations/Export and Import Annotations/src/resources/pdf-succinctly.json b/Annotations/Export and Import Annotations/src/resources/pdf-succinctly.json new file mode 100644 index 0000000..24f4bf1 --- /dev/null +++ b/Annotations/Export and Import Annotations/src/resources/pdf-succinctly.json @@ -0,0 +1 @@ +{"pdfAnnotation":{ "0":{"shapeAnnotation":[{"type":"Line","page":"0","start":"74.25,681","end":"153,761.25","title":"Guest","name":"9abdfca6-067f-4298-63fb-ca5ac669f574","subject":"Arrow","color":"#FF0000","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","head":"ClosedArrow","tail":"ClosedArrow","date":"D:20251217165951+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"caption":"false","caption-style":"Inline","leaderLength":"0","leaderExtend":"0","rect":{"x":"61.25","y":"672","width":"166","height":"770.25"}},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"9abdfca6-067f-4298-63fb-ca5ac669f574","rect":{"x":"98","y":"940","width":"205","height":"833"}},{"type":"Square","page":"0","title":"Guest","name":"2cb37334-7596-426a-d102-476974d61583","subject":"Rectangle","color":"#FF0000","FillOpacity":"0","opacity":"1","border":"0,0,1","width":"1","style":"solid","dashes":"0","rotation":"0","date":"D:20251217165955+05'30'","flags":"print","AllowedInteractions":{"unicodeData":"5B224E6F6E65225D"},"rect":{"x":"186.75","y":"660.75","width":"333.75","height":"749.25"},"N":"","appearance":"eyJhcCI6eyJOIjp7InN0cmVhbSI6eyJUeXBlIjp7Im5hbWUiOiJYT2JqZWN0In0sIlN1YnR5cGUiOnsibmFtZSI6IkZvcm0ifSwiQkJveCI6eyJhcnJheSI6W3siaW50IjoiMCJ9LHsiaW50IjoiMCJ9LHsiaW50IjoiMTQ3In0seyJmaXhlZCI6Ijg4LjUifV19LCJNYXRyaXgiOnsiYXJyYXkiOlt7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifSx7ImludCI6IjEifSx7ImludCI6IjAifSx7ImludCI6IjAifV19LCJSZXNvdXJjZXMiOnsiZGljdCI6eyJQcm9jU2V0Ijp7ImFycmF5IjpbeyJuYW1lIjoiUERGIn1dfX19LCJMZW5ndGgiOnsiaW50IjoiMTkwIn0sImRhdGEiOnsibW9kZSI6InJhdyIsImVuY29kaW5nIjoiaGV4IiwiYnl0ZXMiOiIyNTIwNDM2ODYxNkU2NzY1MjA2MzZGMkQ2RjcyNjQ2OTZFNjE3NDY1MjA3Mzc5NzM3NDY1NkQyMDc0NkYyMDZDNjU2Njc0MkY3NDZGNzAyRTBEMEEzMTJFMzAzMDIwMkUzMDMwMjAyRTMwMzAyMDMxMkUzMDMwMjAyRTMwMzAyMDM4MzgyRTM1MzAyMDIwNjM2RDBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNDM1MzBEMEEyRjQ0NjU3NjY5NjM2NTUyNDc0MjIwNjM3MzBEMEE1QjVEMjAzMDIwNjQwRDBBMzEyRTMwMzAzMDIwNzcwRDBBMzAyMDZBMEQwQTMwMjA0QTBEMEEzMTJFMzAzMDMwMjAzMDJFMzAzMDMwMjAzMDJFMzAzMDMwMjA1MjQ3MEQwQTMwMkUzNTMwMzAyMDJEMzAyRTM1MzAzMDIwMzEzNDM2MkUzMDMwMzAyMDJEMzgzNzJFMzUzMDMwMjA3MjY1MEQwQTUzMEQwQSJ9fX19fQ=="},{"type":"Text","page":"0","State":"Unmarked","StateModel":"Review","flags":"hidden,norotate,nozoom,print","inreplyto":"2cb37334-7596-426a-d102-476974d61583","rect":{"x":"186.75","y":"923.25","width":"333.75","height":"834.75"}}]},"2":{"shapeAnnotation":[{"type":"Link","page":"2","rect":{"x":"313.87","y":"544.57","width":"414.3","height":"559.75"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"87.75","y":"499.03","width":"188.18","height":"514.21"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"},{"type":"Link","page":"2","rect":{"x":"331.53","y":"483.86","width":"431.96","height":"499.03"},"width":"0","flags":"print","URI":"http://www.syncfusion.com/"}]},"3":{"shapeAnnotation":[{"type":"Link","page":"3","rect":{"x":"87.75","y":"667.05","width":"523.75","height":"679.7"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"654.4","width":"523.75","height":"667.05"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"641.76","width":"523.75","height":"654.4"},"width":"0","flags":"print","Dest":",XYZ,87,319,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"628.33","width":"523.75","height":"641.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"615.68","width":"523.75","height":"628.33"},"width":"0","flags":"print","Dest":",XYZ,87,219,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"603.03","width":"523.75","height":"615.68"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"590.38","width":"523.75","height":"603.03"},"width":"0","flags":"print","Dest":",XYZ,87,306,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"577.73","width":"523.75","height":"590.38"},"width":"0","flags":"print","Dest":",XYZ,87,187,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"565.08","width":"523.75","height":"577.73"},"width":"0","flags":"print","Dest":",XYZ,87,657,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"551.66","width":"523.75","height":"565.08"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"539.01","width":"523.75","height":"551.66"},"width":"0","flags":"print","Dest":",XYZ,87,494,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"526.36","width":"523.75","height":"539.01"},"width":"0","flags":"print","Dest":",XYZ,87,325,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"513.71","width":"523.75","height":"526.36"},"width":"0","flags":"print","Dest":",XYZ,87,218,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"501.06","width":"523.75","height":"513.71"},"width":"0","flags":"print","Dest":",XYZ,87,260,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"488.41","width":"523.75","height":"501.06"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"475.76","width":"523.75","height":"488.41"},"width":"0","flags":"print","Dest":",XYZ,87,460,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"463.11","width":"523.75","height":"475.76"},"width":"0","flags":"print","Dest":",XYZ,87,604,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"450.46","width":"523.75","height":"463.11"},"width":"0","flags":"print","Dest":",XYZ,87,401,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"437.81","width":"523.75","height":"450.46"},"width":"0","flags":"print","Dest":",XYZ,87,245,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"425.17","width":"523.75","height":"437.81"},"width":"0","flags":"print","Dest":",XYZ,87,590,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"412.52","width":"523.75","height":"425.17"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"399.87","width":"523.75","height":"412.52"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"387.22","width":"523.75","height":"399.87"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"374.57","width":"523.75","height":"387.22"},"width":"0","flags":"print","Dest":",XYZ,87,287,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"361.92","width":"523.75","height":"374.57"},"width":"0","flags":"print","Dest":",XYZ,87,670,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"348.49","width":"523.75","height":"361.92"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"335.84","width":"523.75","height":"348.49"},"width":"0","flags":"print","Dest":",XYZ,87,592,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"323.2","width":"523.75","height":"335.84"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"310.55","width":"523.75","height":"323.2"},"width":"0","flags":"print","Dest":",XYZ,87,645,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"297.9","width":"523.75","height":"310.55"},"width":"0","flags":"print","Dest":",XYZ,87,463,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"285.25","width":"523.75","height":"297.9"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"272.6","width":"523.75","height":"285.25"},"width":"0","flags":"print","Dest":",XYZ,87,341,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"259.95","width":"523.75","height":"272.6"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"247.3","width":"523.75","height":"259.95"},"width":"0","flags":"print","Dest":",XYZ,87,367,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"234.65","width":"523.75","height":"247.3"},"width":"0","flags":"print","Dest":",XYZ,87,127,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"222","width":"523.75","height":"234.65"},"width":"0","flags":"print","Dest":",XYZ,87,280,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"209.36","width":"523.75","height":"222"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"196.71","width":"523.75","height":"209.36"},"width":"0","flags":"print","Dest":",XYZ,87,400,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"184.06","width":"523.75","height":"196.71"},"width":"0","flags":"print","Dest":",XYZ,87,333,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"171.41","width":"523.75","height":"184.06"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"158.76","width":"523.75","height":"171.41"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"146.11","width":"523.75","height":"158.76"},"width":"0","flags":"print","Dest":",XYZ,87,251,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"133.46","width":"523.75","height":"146.11"},"width":"0","flags":"print","Dest":",XYZ,87,519,0"},{"type":"Link","page":"3","rect":{"x":"107.75","y":"120.81","width":"523.75","height":"133.46"},"width":"0","flags":"print","Dest":",XYZ,87,517,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"108.16","width":"523.75","height":"120.81"},"width":"0","flags":"print","Dest":",XYZ,87,529,0"},{"type":"Link","page":"3","rect":{"x":"87.75","y":"94.736","width":"523.75","height":"108.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"3","rect":{"x":"97.75","y":"82.087","width":"523.75","height":"94.736"},"width":"0","flags":"print","Dest":",XYZ,87,620,0"}]},"4":{"shapeAnnotation":[{"type":"Link","page":"4","rect":{"x":"97.75","y":"707.35","width":"523.75","height":"720"},"width":"0","flags":"print","Dest":",XYZ,87,311,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"694.7","width":"523.75","height":"707.35"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"682.05","width":"523.75","height":"694.7"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"669.4","width":"523.75","height":"682.05"},"width":"0","flags":"print","Dest":",XYZ,87,194,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"656.76","width":"523.75","height":"669.4"},"width":"0","flags":"print","Dest":",XYZ,87,358,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"644.11","width":"523.75","height":"656.76"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"631.46","width":"523.75","height":"644.11"},"width":"0","flags":"print","Dest":",XYZ,87,414,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"618.81","width":"523.75","height":"631.46"},"width":"0","flags":"print","Dest":",XYZ,87,669,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"606.16","width":"523.75","height":"618.81"},"width":"0","flags":"print","Dest":",XYZ,87,480,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"593.51","width":"523.75","height":"606.16"},"width":"0","flags":"print","Dest":",XYZ,87,389,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"580.86","width":"523.75","height":"593.51"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"568.21","width":"523.75","height":"580.86"},"width":"0","flags":"print","Dest":",XYZ,87,215,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"555.56","width":"523.75","height":"568.21"},"width":"0","flags":"print","Dest":",XYZ,87,457,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"542.92","width":"523.75","height":"555.56"},"width":"0","flags":"print","Dest":",XYZ,87,362,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"530.27","width":"523.75","height":"542.92"},"width":"0","flags":"print","Dest":",XYZ,87,269,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"517.62","width":"523.75","height":"530.27"},"width":"0","flags":"print","Dest":",XYZ,87,668,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"504.97","width":"523.75","height":"517.62"},"width":"0","flags":"print","Dest":",XYZ,87,350,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"492.32","width":"523.75","height":"504.97"},"width":"0","flags":"print","Dest":",XYZ,87,371,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"479.67","width":"523.75","height":"492.32"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"467.02","width":"523.75","height":"479.67"},"width":"0","flags":"print","Dest":",XYZ,87,570,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"454.37","width":"523.75","height":"467.02"},"width":"0","flags":"print","Dest":",XYZ,87,471,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"441.72","width":"523.75","height":"454.37"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"429.07","width":"523.75","height":"441.72"},"width":"0","flags":"print","Dest":",XYZ,87,478,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"416.43","width":"523.75","height":"429.07"},"width":"0","flags":"print","Dest":",XYZ,87,454,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"403.78","width":"523.75","height":"416.43"},"width":"0","flags":"print","Dest":",XYZ,87,388,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"390.35","width":"523.75","height":"403.78"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"377.7","width":"523.75","height":"390.35"},"width":"0","flags":"print","Dest":",XYZ,87,481,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"365.05","width":"523.75","height":"377.7"},"width":"0","flags":"print","Dest":",XYZ,87,337,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"352.4","width":"523.75","height":"365.05"},"width":"0","flags":"print","Dest":",XYZ,87,243,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"339.75","width":"523.75","height":"352.4"},"width":"0","flags":"print","Dest":",XYZ,87,201,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"327.1","width":"523.75","height":"339.75"},"width":"0","flags":"print","Dest":",XYZ,87,363,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"314.46","width":"523.75","height":"327.1"},"width":"0","flags":"print","Dest":",XYZ,87,281,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"301.81","width":"523.75","height":"314.46"},"width":"0","flags":"print","Dest":",XYZ,87,444,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"289.16","width":"523.75","height":"301.81"},"width":"0","flags":"print","Dest":",XYZ,87,226,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"276.51","width":"523.75","height":"289.16"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"263.86","width":"523.75","height":"276.51"},"width":"0","flags":"print","Dest":",XYZ,87,415,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"251.21","width":"523.75","height":"263.86"},"width":"0","flags":"print","Dest":",XYZ,87,334,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"238.56","width":"523.75","height":"251.21"},"width":"0","flags":"print","Dest":",XYZ,87,682,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"225.91","width":"523.75","height":"238.56"},"width":"0","flags":"print","Dest":",XYZ,87,488,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"213.26","width":"523.75","height":"225.91"},"width":"0","flags":"print","Dest":",XYZ,87,268,0"},{"type":"Link","page":"4","rect":{"x":"107.75","y":"200.62","width":"523.75","height":"213.26"},"width":"0","flags":"print","Dest":",XYZ,87,543,0"},{"type":"Link","page":"4","rect":{"x":"97.75","y":"187.97","width":"523.75","height":"200.62"},"width":"0","flags":"print","Dest":",XYZ,87,641,0"},{"type":"Link","page":"4","rect":{"x":"87.75","y":"175.32","width":"523.75","height":"187.97"},"width":"0","flags":"print","Dest":",XYZ,87,720,0"}]},"6":{"shapeAnnotation":[{"type":"Link","page":"6","rect":{"x":"114.65","y":"554.29","width":"286.81","height":"578.94"},"width":"0","flags":"print","URI":"mailto:succinctly-series@syncfusion.com"}]},"7":{"shapeAnnotation":[{"type":"Link","page":"7","rect":{"x":"236.94","y":"494.27","width":"265.29","height":"506.92"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/docs/install-pdftk/"},{"type":"Link","page":"7","rect":{"x":"91.413","y":"406.37","width":"185.79","height":"419.02"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"319.13","width":"316.02","height":"343.78"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly/"},{"type":"Link","page":"7","rect":{"x":"351.9","y":"262.38","width":"446.3","height":"275.03"},"width":"0","flags":"print","URI":"http://www.iso.org/iso/catalogue_detail.htm?csnumber=51502"},{"type":"Link","page":"7","rect":{"x":"329.28","y":"249.74","width":"524.25","height":"262.38"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"7","rect":{"x":"87.75","y":"225.09","width":"107.54","height":"249.74"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]},"12":{"shapeAnnotation":[{"type":"Link","page":"12","rect":{"x":"217.35","y":"582.81","width":"270.76","height":"595.46"},"width":"0","flags":"print","URI":"http://www.pdflabs.com/tools/pdftk-the-pdf-toolkit/"},{"type":"Link","page":"12","rect":{"x":"267.47","y":"519.24","width":"492.69","height":"531.89"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"50":{"shapeAnnotation":[{"type":"Link","page":"50","rect":{"x":"227.17","y":"569.51","width":"284.86","height":"582.16"},"width":"0","flags":"print","URI":"http://itextpdf.com/"},{"type":"Link","page":"50","rect":{"x":"284.04","y":"374.6","width":"416.32","height":"399.25"},"width":"0","flags":"print","URI":"http://api.itextpdf.com/itext"},{"type":"Link","page":"50","rect":{"x":"369.63","y":"293.21","width":"437.71","height":"314.86"},"width":"0","flags":"print","URI":"http://sourceforge.net/projects/itextsharp/files/itextsharp/"},{"type":"Link","page":"50","rect":{"x":"274.81","y":"174.52","width":"500.02","height":"199.17"},"width":"0","flags":"print","URI":"https://bitbucket.org/syncfusion/pdf-succinctly"}]},"57":{"shapeAnnotation":[{"type":"Link","page":"57","rect":{"x":"99.98","y":"568.8","width":"198.63","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/fonts/ChunkFive"},{"type":"Link","page":"57","rect":{"x":"267.5","y":"568.8","width":"355.76","height":"582.43"},"width":"0","flags":"print","URI":"http://www.fontsquirrel.com/"}]},"58":{"shapeAnnotation":[{"type":"Link","page":"58","rect":{"x":"117.7","y":"641.84","width":"212.82","height":"667.46"},"width":"0","flags":"print","Dest":",XYZ,87,198,0"},{"type":"Link","page":"58","rect":{"x":"277.29","y":"522.5","width":"303.8","height":"547.15"},"width":"0","flags":"print","URI":"http://mvc.syncfusion.com/sfmvcpdfsamplebrowser"}]},"59":{"shapeAnnotation":[{"type":"Link","page":"59","rect":{"x":"347.01","y":"532.21","width":"524.25","height":"544.86"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"},{"type":"Link","page":"59","rect":{"x":"87.75","y":"519.56","width":"146.06","height":"532.21"},"width":"0","flags":"print","URI":"http://www.adobe.com/devnet/pdf.html"}]}}} \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/src/styles/styles.css b/Annotations/Export and Import Annotations/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Export and Import Annotations/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Export and Import Annotations/tsconfig.json b/Annotations/Export and Import Annotations/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Export and Import Annotations/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Export and Import Annotations/webpack.config.js b/Annotations/Export and Import Annotations/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Export and Import Annotations/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +}; diff --git a/Annotations/Remove Annoations/.gitignore b/Annotations/Remove Annoations/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/Annotations/Remove Annoations/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/Annotations/Remove Annoations/README.md b/Annotations/Remove Annoations/README.md new file mode 100644 index 0000000..46e0b02 --- /dev/null +++ b/Annotations/Remove Annoations/README.md @@ -0,0 +1,75 @@ +# Essential JS 2 QuickStart + +This project is a skeleton application used to create [Essential JS 2](https://www.syncfusion.com/products/essential-js2) web application. + +>This application uses the latest version of the [webpack-cli](https://webpack.js.org/api/cli/#commands). It requires node `v14.15.0` or higher. + +## Getting Started + +To get started you need to clone the `ej2-quickstart` repository and navigate to `ej2-quickstart` location. + +``` +git clone https://github.com/syncfusion/ej2-quickstart.git quickstart +cd quickstart +``` + +## Installing + +We can get all the Essential JS 2 components in a single npm package [`ej2`](https://www.npmjs.com/package/@syncfusion/ej2). + +We already configure the required packages in the `package.json` file. + +You can run the below command to install all dependent packages related to this seed project. + +``` +npm install +``` + +## Testing + +This application is preconfigured with End-to-End testing and the test case is written in Jasmine. + +We run the test scripts with [Protractor](http://www.protractortest.org/#/) end-to-end test runner. The test case file can be found in the `e2e` folder. + +Protractor can interact with our web application and verify the test scripts. + +We have to install WebDriver and also need to ensure it is updated. Open a separate terminal and run the below npm script. + +``` +npm run update-webdriver +``` + +Open another terminal and run the below npm script. It will start web server to serve our application. + +``` +npm run serve +``` + +Once the web server is up and running, we can run the end-to-end tests using the below npm script + +``` +npm run test +``` + +> **Note:** Since Protractor is using the Selenium Standalone Server, the Java Development Kit (JDK) need to be installed in your local machine. + +If JDK is not installed in your local machine, you can download it from [here](http://www.oracle.com/technetwork/java/javase/downloads/index.html). + +## Running + +The application is configured with [webpack-dev-server](https://webpack.js.org/configuration/dev-server/#devserver), so it will serve the web application in your default browser. + +We have used [Webpack](https://github.com/webpack/webpack) for module loading. + +You can use the below npm script to run the web application. + +``` +npm run start +``` + +## Resources + +You can also refer the below resources to know more details about Essential JS 2 components. + +* [Pure JS Demos](http://ej2.syncfusion.com/demos/) +* [Pure JS Documentation](http://ej2.syncfusion.com/documentation/) diff --git a/Annotations/Remove Annoations/e2e/index.spec.js b/Annotations/Remove Annoations/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/Annotations/Remove Annoations/e2e/protractor.conf.js b/Annotations/Remove Annoations/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/Annotations/Remove Annoations/e2e/protractor.conf.js @@ -0,0 +1,21 @@ +exports.config = { + + allScriptsTimeout: 11000, + + capabilities: { + 'browserName': 'chrome' + }, + + framework: 'jasmine', + + jasmineNodeOpts: { + defaultTimeoutInterval: 10000 + }, + directConnect: true, + + onPrepare: function() { + browser.waitForAngularEnabled(false); + }, + + specs: ['./*.spec.js'] +}; \ No newline at end of file diff --git a/Annotations/Remove Annoations/gulpfile.js b/Annotations/Remove Annoations/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/Annotations/Remove Annoations/gulpfile.js @@ -0,0 +1,62 @@ +'use strict'; + +var gulp = require('gulp'); + +/** + * Compile TypeScript to JS + */ +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(); + }); +}); + +/** + * Testing spec files + */ +var protractor = require('gulp-protractor').protractor; +var webdriver_standalone = require('gulp-protractor').webdriver_standalone; +var webdriver_update = require('gulp-protractor').webdriver_update_specific; + +gulp.task('e2e-serve', webdriver_standalone); + +gulp.task('e2e-webdriver-update', webdriver_update({ + webdriverManagerArgs: ['--ie', '--edge'] +})); + +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: [ + './dist/', + ], + directory: true + }, + ui: false, + open: false, + notify: false + }; + bs.init(options, function () { + gulp.src(['./spec/**/*.spec.js']) + .pipe(protractor({ + configFile: 'e2e/protractor.conf.js' + })) + .on('error', function (e) { + console.error('Error: ' + e.message); + done(); + process.exit(1); + }) + .on('end', function () { + done(); + process.exit(0); + }); + }); +})); \ No newline at end of file diff --git a/Annotations/Remove Annoations/license b/Annotations/Remove Annoations/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/Annotations/Remove Annoations/license @@ -0,0 +1,10 @@ +Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license. + +To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. + +Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options. + +Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. + +The Syncfusion license that contains the terms and conditions can be found at +https://www.syncfusion.com/content/downloads/syncfusion_license.pdf diff --git a/Annotations/Remove Annoations/package.json b/Annotations/Remove Annoations/package.json new file mode 100644 index 0000000..f108444 --- /dev/null +++ b/Annotations/Remove Annoations/package.json @@ -0,0 +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" + }, + "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": "^5.2.1", + "webpack-stream": "^7.0.0" + }, + "dependencies": { + "@syncfusion/ej2": "*" + } +} diff --git a/Annotations/Remove Annoations/src/app/app.ts b/Annotations/Remove Annoations/src/app/app.ts new file mode 100644 index 0000000..5345d97 --- /dev/null +++ b/Annotations/Remove Annoations/src/app/app.ts @@ -0,0 +1,49 @@ +import { + PdfViewer, + Toolbar, + Magnification, + Navigation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + Print, + Annotation, + FormFields, + FormDesigner +} from '@syncfusion/ej2-pdfviewer'; + +PdfViewer.Inject( + Toolbar, + Magnification, + Navigation, + LinkAnnotation, + ThumbnailView, + BookmarkView, + TextSelection, + TextSearch, + Print, + Annotation, + FormFields, + FormDesigner +); + +// Create viewer +const viewer = new PdfViewer({ + documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', + // Standalone resources + resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib', +}); + +viewer.appendTo('#PdfViewer'); + +document.getElementById('del')?.addEventListener('click',()=>{ + //delete the selected annotation + viewer.annotation.deleteAnnotation(); +}); + +document.getElementById('delbyId')?.addEventListener('click', () => { + //deletet the first annotation using its id from the annotation collection + viewer.annotation.deleteAnnotationById(viewer.annotationCollection[0].id); +}); \ No newline at end of file diff --git a/Annotations/Remove Annoations/src/index.html b/Annotations/Remove Annoations/src/index.html new file mode 100644 index 0000000..a17569d --- /dev/null +++ b/Annotations/Remove Annoations/src/index.html @@ -0,0 +1,24 @@ + + + + + Essential JS 2 + + + + + + + + + +
+ + +
+ +
+ + + + \ No newline at end of file diff --git a/Annotations/Remove Annoations/src/resources/favicon.ico b/Annotations/Remove Annoations/src/resources/favicon.ico new file mode 100644 index 0000000..d8d5c15 Binary files /dev/null and b/Annotations/Remove Annoations/src/resources/favicon.ico differ diff --git a/Annotations/Remove Annoations/src/styles/styles.css b/Annotations/Remove Annoations/src/styles/styles.css new file mode 100644 index 0000000..c5d413e --- /dev/null +++ b/Annotations/Remove Annoations/src/styles/styles.css @@ -0,0 +1,9 @@ +@import '../../node_modules/@syncfusion/ej2-base/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css'; +@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css'; +@import "../../node_modules/@syncfusion/ej2-pdfviewer/styles/material.css"; +@import "../../node_modules/@syncfusion/ej2-notifications/styles/material.css"; \ No newline at end of file diff --git a/Annotations/Remove Annoations/tsconfig.json b/Annotations/Remove Annoations/tsconfig.json new file mode 100644 index 0000000..db9b7c2 --- /dev/null +++ b/Annotations/Remove Annoations/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "node" + } +} diff --git a/Annotations/Remove Annoations/webpack.config.js b/Annotations/Remove Annoations/webpack.config.js new file mode 100644 index 0000000..f61e596 --- /dev/null +++ b/Annotations/Remove Annoations/webpack.config.js @@ -0,0 +1,41 @@ +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const path = require('path'); + +module.exports = { + entry: ['./src/app/app.ts', './src/styles/styles.css'], + module: { + rules: [ + { + test: /\.ts?$/, + use: 'ts-loader', + exclude: /node_modules/, + }, + { + test: /\.css$/, + use: [ MiniCssExtractPlugin.loader, "css-loader" ] + }, + ], + }, + resolve: { + extensions: ['.ts', '.js'], + }, + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'src/index.html' + }), + new MiniCssExtractPlugin({ + filename: "bundle.css" + }) + ], + devServer: { + static: path.join(__dirname, "dist"), + compress: true, + port: 4000, + open: true + }, +};