From 5963c2b255c3f125ef95cd2af0cc3e4d7e0c642d Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 08:54:06 +0530 Subject: [PATCH 1/8] 1032947: Adding form filling samples --- javascript/pdf-fill-form/README.md | 22 ++ javascript/pdf-fill-form/index.html | 90 ++++++ javascript/pdf-form-fillings/README.md | 22 ++ javascript/pdf-form-fillings/index.html | 270 ++++++++++++++++++ javascript/pdf-list-sample/index.html | 186 ++++++------ javascript/pdf-remove-layers/index.html | 2 +- .../.github/workflows/gitleaks.yaml | 44 +++ typescript/pdf-fill-form/.gitignore | 2 + typescript/pdf-fill-form/README.md | 43 +++ typescript/pdf-fill-form/e2e/index.spec.js | 0 .../pdf-fill-form/e2e/protractor.conf.js | 21 ++ typescript/pdf-fill-form/gulpfile.js | 62 ++++ typescript/pdf-fill-form/license | 10 + typescript/pdf-fill-form/package.json | 38 +++ typescript/pdf-fill-form/src/app/app.ts | 62 ++++ typescript/pdf-fill-form/src/index.html | 12 + .../pdf-fill-form/src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-fill-form/src/styles/styles.css | 1 + typescript/pdf-fill-form/tsconfig.json | 12 + typescript/pdf-fill-form/webpack.config.js | 45 +++ .../.github/workflows/gitleaks.yaml | 44 +++ typescript/pdf-form-fillings/.gitignore | 2 + typescript/pdf-form-fillings/README.md | 43 +++ .../pdf-form-fillings/e2e/index.spec.js | 0 .../pdf-form-fillings/e2e/protractor.conf.js | 21 ++ typescript/pdf-form-fillings/gulpfile.js | 62 ++++ typescript/pdf-form-fillings/license | 10 + typescript/pdf-form-fillings/package.json | 38 +++ typescript/pdf-form-fillings/src/app/app.ts | 161 +++++++++++ typescript/pdf-form-fillings/src/index.html | 109 +++++++ .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-form-fillings/src/styles/styles.css | 1 + typescript/pdf-form-fillings/tsconfig.json | 12 + .../pdf-form-fillings/webpack.config.js | 45 +++ 34 files changed, 1385 insertions(+), 107 deletions(-) create mode 100644 javascript/pdf-fill-form/README.md create mode 100644 javascript/pdf-fill-form/index.html create mode 100644 javascript/pdf-form-fillings/README.md create mode 100644 javascript/pdf-form-fillings/index.html create mode 100644 typescript/pdf-fill-form/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-fill-form/.gitignore create mode 100644 typescript/pdf-fill-form/README.md create mode 100644 typescript/pdf-fill-form/e2e/index.spec.js create mode 100644 typescript/pdf-fill-form/e2e/protractor.conf.js create mode 100644 typescript/pdf-fill-form/gulpfile.js create mode 100644 typescript/pdf-fill-form/license create mode 100644 typescript/pdf-fill-form/package.json create mode 100644 typescript/pdf-fill-form/src/app/app.ts create mode 100644 typescript/pdf-fill-form/src/index.html create mode 100644 typescript/pdf-fill-form/src/resources/favicon.ico create mode 100644 typescript/pdf-fill-form/src/styles/styles.css create mode 100644 typescript/pdf-fill-form/tsconfig.json create mode 100644 typescript/pdf-fill-form/webpack.config.js create mode 100644 typescript/pdf-form-fillings/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-form-fillings/.gitignore create mode 100644 typescript/pdf-form-fillings/README.md create mode 100644 typescript/pdf-form-fillings/e2e/index.spec.js create mode 100644 typescript/pdf-form-fillings/e2e/protractor.conf.js create mode 100644 typescript/pdf-form-fillings/gulpfile.js create mode 100644 typescript/pdf-form-fillings/license create mode 100644 typescript/pdf-form-fillings/package.json create mode 100644 typescript/pdf-form-fillings/src/app/app.ts create mode 100644 typescript/pdf-form-fillings/src/index.html create mode 100644 typescript/pdf-form-fillings/src/resources/favicon.ico create mode 100644 typescript/pdf-form-fillings/src/styles/styles.css create mode 100644 typescript/pdf-form-fillings/tsconfig.json create mode 100644 typescript/pdf-form-fillings/webpack.config.js diff --git a/javascript/pdf-fill-form/README.md b/javascript/pdf-fill-form/README.md new file mode 100644 index 0000000..9cbcfac --- /dev/null +++ b/javascript/pdf-fill-form/README.md @@ -0,0 +1,22 @@ +# How to Create Fillable PDF Forms in JavaScript + +This project is a complete working application to create fillable PDF forms using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-form-fillings` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-fill-form/index.html b/javascript/pdf-fill-form/index.html new file mode 100644 index 0000000..1ebc207 --- /dev/null +++ b/javascript/pdf-fill-form/index.html @@ -0,0 +1,90 @@ + + + + + + + +
+

PDF Forms

+
+ + + \ No newline at end of file diff --git a/javascript/pdf-form-fillings/README.md b/javascript/pdf-form-fillings/README.md new file mode 100644 index 0000000..9cbcfac --- /dev/null +++ b/javascript/pdf-form-fillings/README.md @@ -0,0 +1,22 @@ +# How to Create Fillable PDF Forms in JavaScript + +This project is a complete working application to create fillable PDF forms using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-form-fillings` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-form-fillings/index.html b/javascript/pdf-form-fillings/index.html new file mode 100644 index 0000000..fc71671 --- /dev/null +++ b/javascript/pdf-form-fillings/index.html @@ -0,0 +1,270 @@ + + + + + + + +
+

PDF Forms

+
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +
+
+ + +
+
+ +
+ + + + \ No newline at end of file diff --git a/javascript/pdf-list-sample/index.html b/javascript/pdf-list-sample/index.html index 655582e..ad86d28 100644 --- a/javascript/pdf-list-sample/index.html +++ b/javascript/pdf-list-sample/index.html @@ -5,134 +5,108 @@

Add Ordered and Unordered lists into PDF document

- - +
\ No newline at end of file diff --git a/javascript/pdf-remove-layers/index.html b/javascript/pdf-remove-layers/index.html index a9cd543..59d5332 100644 --- a/javascript/pdf-remove-layers/index.html +++ b/javascript/pdf-remove-layers/index.html @@ -3,7 +3,7 @@
-

Rempove Layers

+

Remove Layers

diff --git a/typescript/pdf-fill-form/.github/workflows/gitleaks.yaml b/typescript/pdf-fill-form/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-fill-form/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-fill-form/.gitignore b/typescript/pdf-fill-form/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-fill-form/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-fill-form/README.md b/typescript/pdf-fill-form/README.md new file mode 100644 index 0000000..abbfcd5 --- /dev/null +++ b/typescript/pdf-fill-form/README.md @@ -0,0 +1,43 @@ +# How to Add Fillable Form Fields to a PDF Document in TypeScript + +This project is a complete working application to add fillable form fields to a PDF document using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-form-fillings` repository and navigate to `pdf-form-fillings` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-form-fillings +cd pdf-form-fillings +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-fill-form/e2e/index.spec.js b/typescript/pdf-fill-form/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-fill-form/e2e/protractor.conf.js b/typescript/pdf-fill-form/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-fill-form/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/typescript/pdf-fill-form/gulpfile.js b/typescript/pdf-fill-form/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-fill-form/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/typescript/pdf-fill-form/license b/typescript/pdf-fill-form/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-fill-form/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/typescript/pdf-fill-form/package.json b/typescript/pdf-fill-form/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-fill-form/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-fill-form/src/app/app.ts b/typescript/pdf-fill-form/src/app/app.ts new file mode 100644 index 0000000..5466f45 --- /dev/null +++ b/typescript/pdf-fill-form/src/app/app.ts @@ -0,0 +1,62 @@ + +import { PdfDocument, PdfForm, PdfTextBoxField, PdfCheckBoxField, PdfRadioButtonListField, PdfListBoxField } from '@syncfusion/ej2-pdf'; +import { Button } from '@syncfusion/ej2-buttons'; +// Create and initialize the Ordered List button +var editForm = new Button(); +editForm.appendTo('#editForm'); +// Generate an Ordered List PDF when the button is clicked +editForm.element.onclick = editFormFields; +function editFormFields() { + fetchAsUint8Array( + 'https://cdn.syncfusion.com/content/pdf-resources/form-filling-document.pdf' + ) + .then(function (pdfBytes) { + // Create a PdfDocument instance from the loaded PDF bytes + const pdf = new PdfDocument(pdfBytes); + // Access the Date text box field (Field Index: 0) + let dateField: PdfTextBoxField = pdf.form.fieldAt(0) as PdfTextBoxField; + // Set the date value + dateField.text = '07/07/2026'; + dateField.setAppearance(true); + // Access the Name text box field (Field Index: 1) + let nameField: PdfTextBoxField = pdf.form.fieldAt(1) as PdfTextBoxField; + // Set the name value + nameField.text = 'John Allister'; + nameField.setAppearance(true); + // Access the Email text box field (Field Index: 2) + let mailField: PdfTextBoxField = pdf.form.fieldAt(2) as PdfTextBoxField; + // Set the email address + mailField.text = 'allister.john@example.com'; + mailField.setAppearance(true); + // Access the Gender radio button field (Field Index: 3) + let genderField: PdfRadioButtonListField = pdf.form.fieldAt(3) as PdfRadioButtonListField; + // Select the radio button option at index 2 + genderField.selectedIndex = 2; + genderField.setAppearance(true); + // Access the Country/Selection list box field (Field Index: 4) + let dropdownField: PdfListBoxField = pdf.form.fieldAt(4) as PdfListBoxField; + // Select the list item at index 4 + dropdownField.selectedIndex = 4; + dropdownField.setAppearance(true); + // Access the CheckBox field (Field Index: 5) + let checkboxField: PdfCheckBoxField = pdf.form.fieldAt(5) as PdfCheckBoxField; + // Set a tooltip for the checkbox field + checkboxField.toolTip = 'Check Box Field'; + checkboxField.setAppearance(true); + // Save the modified PDF document and download it + pdf.save('FillForm.pdf'); + // Release resources associated with the PDF document + pdf.destroy(); + }) + .catch(function (err) { + console.error(err); + alert('Failed to create fillable form PDF'); + }) +} +// Fetch URL and return Uint8Array +async function fetchAsUint8Array(url: string): Promise { + const res = await fetch(url, { cache: 'no-cache' }); + if (!res.ok) throw new Error(`Failed to fetch ${url}: ${res.status} ${res.statusText}`); + const buf = await res.arrayBuffer(); + return new Uint8Array(buf); +} \ No newline at end of file diff --git a/typescript/pdf-fill-form/src/index.html b/typescript/pdf-fill-form/src/index.html new file mode 100644 index 0000000..ae31f0b --- /dev/null +++ b/typescript/pdf-fill-form/src/index.html @@ -0,0 +1,12 @@ + + + + PDF Forms + + + +
+

PDF Forms

+
+ + \ No newline at end of file diff --git a/typescript/pdf-fill-form/src/resources/favicon.ico b/typescript/pdf-fill-form/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-fill-form/src/styles/styles.css b/typescript/pdf-fill-form/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-fill-form/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-fill-form/tsconfig.json b/typescript/pdf-fill-form/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-fill-form/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-fill-form/webpack.config.js b/typescript/pdf-fill-form/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-fill-form/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; diff --git a/typescript/pdf-form-fillings/.github/workflows/gitleaks.yaml b/typescript/pdf-form-fillings/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-form-fillings/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-form-fillings/.gitignore b/typescript/pdf-form-fillings/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-form-fillings/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-form-fillings/README.md b/typescript/pdf-form-fillings/README.md new file mode 100644 index 0000000..abbfcd5 --- /dev/null +++ b/typescript/pdf-form-fillings/README.md @@ -0,0 +1,43 @@ +# How to Add Fillable Form Fields to a PDF Document in TypeScript + +This project is a complete working application to add fillable form fields to a PDF document using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-form-fillings` repository and navigate to `pdf-form-fillings` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-form-fillings +cd pdf-form-fillings +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-form-fillings/e2e/index.spec.js b/typescript/pdf-form-fillings/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-form-fillings/e2e/protractor.conf.js b/typescript/pdf-form-fillings/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-form-fillings/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/typescript/pdf-form-fillings/gulpfile.js b/typescript/pdf-form-fillings/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-form-fillings/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/typescript/pdf-form-fillings/license b/typescript/pdf-form-fillings/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-form-fillings/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/typescript/pdf-form-fillings/package.json b/typescript/pdf-form-fillings/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-form-fillings/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-form-fillings/src/app/app.ts b/typescript/pdf-form-fillings/src/app/app.ts new file mode 100644 index 0000000..edea80d --- /dev/null +++ b/typescript/pdf-form-fillings/src/app/app.ts @@ -0,0 +1,161 @@ +import { PdfDocument, PdfForm, PdfTextBoxField, PdfCheckBoxField, PdfListFieldItem, PdfComboBoxField, PdfRadioButtonListField } from '@syncfusion/ej2-pdf'; +import { CheckBox, Button } from '@syncfusion/ej2-buttons'; +import { DatePicker } from '@syncfusion/ej2-calendars'; +import { DropDownList } from '@syncfusion/ej2-dropdowns'; + +// Create and initialize the Ordered List button +var editForm = new Button(); +editForm.appendTo('#editForm'); +// Generate an Ordered List PDF when the button is clicked +editForm.element.onclick = editFormFields; +// Gender DropDownList +var genderData = [ + { text: 'Male', value: 'Male' }, + { text: 'Female', value: 'Female' }, + { text: 'Other', value: 'Other' } +]; +var genderDropDown = new DropDownList({ + dataSource: genderData, + fields: { text: 'text', value: 'value' }, + value: 'Male', + popupHeight: '200px' +}); +genderDropDown.appendTo('#gender'); + +// State DropDownList +var stateData = [ + 'Alabama', 'Alaska', 'California', 'Delaware', 'Florida', 'Georgia', + 'Hawaii', 'Indiana', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'New Jersey', + 'New Mexico', 'New York', 'Texas', 'Washington', 'Wyoming' +]; +var stateDropDown = new DropDownList({ + dataSource: stateData, + value: 'Alabama', + popupHeight: '200px' +}); +stateDropDown.appendTo('#state'); + +// Date of Birth DatePicker +var dobPicker = new DatePicker({ + value: new Date(2012, 11, 5), + format: 'MM/dd/yyyy' +}); +dobPicker.appendTo('#dob'); + +// Newsletter CheckBox +var newsletterCheckBox = new CheckBox({ + label: 'Would you like to receive our Newsletter?', + cssClass: 'e-custom' +}); +newsletterCheckBox.appendTo('#newsletter'); + +function editFormFields() { + fetchAsUint8Array( + 'https://cdn.syncfusion.com/content/pdf-resources/form-filling-document.pdf' + ) + .then(function (pdfBytes) { + // Read current form values from the page + const values = getFormValues(); + // Create a PdfDocument from the fetched bytes + const pdf = new PdfDocument(pdfBytes); + // Get the PdfForm + const form = pdf.form; + // Map and set each field if present, then set appearance + const nameField = findByName(form, 'name') as PdfTextBoxField | undefined; + if (nameField) { + nameField.text = values.name; + nameField.setAppearance(true); + } + const gender = findByName(form, 'gender') as PdfRadioButtonListField | undefined; + if (gender) { + switch (values.gender) { + case 'Male': gender.selectedIndex = 0; break; + case 'Other': gender.selectedIndex = 1; break; + case 'Female': gender.selectedIndex = 2; break; + } + gender.setAppearance(true); + } + const dobField = findByName(form, 'dob') as PdfTextBoxField | undefined; + if (dobField) { + dobField.text = values.dob; + dobField.setAppearance(true); + } + const emailField = findByName(form, 'email') as PdfTextBoxField | undefined; + if (emailField) { + emailField.text = values.email; + emailField.setAppearance(true); + } + const stateField = findByName(form, 'state') as PdfComboBoxField | undefined; + if (stateField) { + for (let i = 0; i < stateField.itemsCount; i++) { + const item = stateField._options[i] as any; + if (item === values.state) { + stateField.selectedIndex = i; + break; + } + } + stateField.setAppearance(true); + } + const newsField = findByName(form, 'newsletter'); + if (newsField && 'checked' in newsField) { + (newsField as PdfCheckBoxField).checked = values.newsletter; + (newsField as PdfCheckBoxField).setAppearance(true); + } + // Save and download the document + pdf.save('FormFillings.pdf'); + // Destroy the document + pdf.destroy(); + }) + .catch(function (err) { + console.error(err); + alert('Failed to create fillable form PDF'); + }) +} + +// Read values from EJ2 form controls +function getFormValues() { + function getInstance(id: string): any { + const el = document.getElementById(id) as any; + return el?.ej2_instances?.[0]; + } + const name = (document.getElementById('name') as HTMLInputElement)?.value || ''; + const email = (document.getElementById('email') as HTMLInputElement)?.value || ''; + const gender = getInstance('gender')?.value || 'Male'; + const state = getInstance('state')?.value || ''; + const newsletter = !!getInstance('newsletter')?.checked; + let dob = ''; + const dobInst = getInstance('dob'); + if (dobInst?.value) { + const d = dobInst.value; + const mm = pad(d.getMonth() + 1); + const dd = pad(d.getDate()); + const yyyy = d.getFullYear(); + dob = `${mm}/${dd}/${yyyy}`; + } + return { + name, + gender, + dob, + email, + state, + newsletter + }; +} +function pad(val: number): string { + return val < 10 ? '0' + val : String(val); +} +// Find PDF form field by name +function findByName(form: PdfForm, name: string) { + for (let i = 0; i < form.count; i++) { + const field = form.fieldAt(i); + if (field && field.name === name) return field; + } + return undefined; +} +// Fetch URL and return Uint8Array +async function fetchAsUint8Array(url: string): Promise { + const res = await fetch(url, { cache: 'no-cache' }); + if (!res.ok) throw new Error(`Failed to fetch ${url}: ${res.status} ${res.statusText}`); + const buf = await res.arrayBuffer(); + return new Uint8Array(buf); +} \ No newline at end of file diff --git a/typescript/pdf-form-fillings/src/index.html b/typescript/pdf-form-fillings/src/index.html new file mode 100644 index 0000000..d7938f7 --- /dev/null +++ b/typescript/pdf-form-fillings/src/index.html @@ -0,0 +1,109 @@ + + + + + PDF Forms + + + + +
+

PDF Forms

+
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +
+
+ + +
+
+ +
+ + + + \ No newline at end of file diff --git a/typescript/pdf-form-fillings/src/resources/favicon.ico b/typescript/pdf-form-fillings/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-form-fillings/src/styles/styles.css b/typescript/pdf-form-fillings/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-form-fillings/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-form-fillings/tsconfig.json b/typescript/pdf-form-fillings/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-form-fillings/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-form-fillings/webpack.config.js b/typescript/pdf-form-fillings/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-form-fillings/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; From e6190b65deb053ac1d32032518805aa4acfb440f Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 09:03:18 +0530 Subject: [PATCH 2/8] 1032947: Modified list sample --- typescript/pdf-list-sample/src/app/app.ts | 145 +++++----------------- typescript/pdf-list-sample/src/index.html | 5 +- 2 files changed, 33 insertions(+), 117 deletions(-) diff --git a/typescript/pdf-list-sample/src/app/app.ts b/typescript/pdf-list-sample/src/app/app.ts index 2915935..ef8fa11 100644 --- a/typescript/pdf-list-sample/src/app/app.ts +++ b/typescript/pdf-list-sample/src/app/app.ts @@ -2,129 +2,46 @@ import { Button } from '@syncfusion/ej2-buttons'; import { PdfDocument, PdfBrush, PdfFontFamily, PdfFontStyle, PdfListItem, PdfListItemCollection, PdfOrderedList, PdfStringFormat, PdfUnorderedList, PdfUnorderedListStyle } from '@syncfusion/ej2-pdf'; // Create Ordered List button -let orderButton: Button = new Button(); -orderButton.appendTo('#orderbtn'); -orderButton.element.onclick = (): void => { - // Create a new PDF document +let listBtn: Button = new Button(); +listBtn.appendTo('#listBtn'); +listBtn.element.onclick = (): void => { let pdf = new PdfDocument(); // Add a new page let page = pdf.addPage(); - // Embed fonts - let headerFont = pdf.embedFont(PdfFontFamily.helvetica, 14, PdfFontStyle.bold); - let listFont = pdf.embedFont(PdfFontFamily.timesRoman, 10, PdfFontStyle.regular); - // Draw title - page.graphics.drawString( - 'Ordered List', - headerFont, - { x: 225, y: 10, width: 300, height: 100 }, - new PdfBrush({ r: 0, g: 0, b: 139 }) - ); - // Create string format - let format = new PdfStringFormat(); - format.lineSpacing = 10; - // Create ordered list - const collection = new PdfListItemCollection([ - 'Essential Tools', - 'Essential Grid', - 'Essential Chart', - 'Essential Edit', - 'Essential Diagram', - 'Essential XlsIO', - 'Essential Grouping', - 'Essential Calculate', - 'Essential PDF', - 'Essential HTMLUI', - 'Essential DocIO' - ]); - let orderedList = new PdfOrderedList(collection, { - font: listFont, - format: format, - indent: 20, - textIndent: 10 - }); - // Draw the ordered list - orderedList.draw(page, { - x: 0, - y: 80, - width: page.graphics.clientSize.width, - height: page.graphics.clientSize.height - 80 - }); - // Save the PDF - pdf.save('OrderedList.pdf'); - // Destroy the document instance - pdf.destroy(); -}; - -// Create Unordered List button -let unorderButton: Button = new Button(); -unorderButton.appendTo('#unorderbtn'); -unorderButton.element.onclick = (): void => { - // Create a new PDF document - let pdf = new PdfDocument(); - // Add a new page - let page = pdf.addPage(); - // Embed fonts + // Embed fonts used for title, body, and lists let font1 = pdf.embedFont(PdfFontFamily.helvetica, 14, PdfFontStyle.bold); let font2 = pdf.embedFont(PdfFontFamily.helvetica, 12, PdfFontStyle.regular); let font3 = pdf.embedFont(PdfFontFamily.timesRoman, 10, PdfFontStyle.bold); - let font4 = pdf.embedFont(PdfFontFamily.timesRoman, 10, PdfFontStyle.regular); - // Draw title and description - page.graphics.drawString( - 'Unordered List', - font1, - { x: 225, y: 10, width: 300, height: 100 }, - new PdfBrush({ r: 0, g: 0, b: 139 }) - ); - page.graphics.drawString( - 'This sample demonstrates various features of unordered lists.', - font2, - { - x: 0, - y: 50, - width: page.graphics.clientSize.width, - height: page.graphics.clientSize.height - 50 - }, - new PdfBrush({ r: 0, g: 0, b: 0 }) - ); - // Create string format + let font4 = pdf.embedFont(PdfFontFamily.timesRoman, 10, PdfFontStyle.italic); + let font5 = pdf.embedFont(PdfFontFamily.timesRoman, 10, PdfFontStyle.regular); + // Draw the title and introductory paragraph explaining lists + page.graphics.drawString('List Features', font1, { x: 225, y: 10, width: 300, height: 100 }, new PdfBrush({ r: 0, g: 0, b: 139 })); + page.graphics.drawString('This sample demonstrates letious features of bullets and lists. A list can be ordered and Unordered. Essential PDF provides support for creating and formatting ordered and unordered lists.', font2, { x: 0, y: 50, width: page.graphics.clientSize.width, height: page.graphics.clientSize.height - 50 }, new PdfBrush({ r: 0, g: 0, b: 0 })); + // Create a string format for list items with line spacing let format = new PdfStringFormat(); format.lineSpacing = 10; - // Create main unordered list - const collection = new PdfListItemCollection([ - 'List of Essential Studio products', - 'IO products' - ]); - let unorderedList = new PdfUnorderedList(collection, { - format: format, - font: font3, - style: PdfUnorderedListStyle.disk, - indent: 10, - textIndent: 10 - }); - // Create unordered sublist - const subListCollection = new PdfListItemCollection([ - 'Essential PDF: It is a .NET library with the capability to produce Adobe PDF files.', - 'Essential DocIO: It is a .NET library that can read and write Microsoft Word files.', - 'Essential XlsIO: It is a .NET library that can read and write Microsoft Excel files.' + // Create an unordered list with disk-style bullets + const collection = new PdfListItemCollection(['List of Essential Studio products', 'IO products']); + let list = new PdfUnorderedList(collection, { format: format, font: font3, style: PdfUnorderedListStyle.disk, indent: 10, textIndent: 10 }); + // Create ordered sublist for first item + let subList = new PdfOrderedList(new PdfListItemCollection(), { brush: new PdfBrush({ r: 0, g: 0, b: 0 }), indent: 20, font: font4, format: format }); + let products = ['Tools', 'Grid', 'Chart', 'Edit', 'Diagram', 'XlsIO', 'Grouping', 'Calculate', 'PDF', 'HTMLUI', 'DocIO']; + products.forEach(function (s) { subList.items.add(new PdfListItem('Essential ' + s)); }); + // Add the ordered sublist to the first main item + list.items.at(0).subList = subList; + // Create unordered sublist for second item + const subSubListCollection = new PdfListItemCollection([ + 'Essential PDF: It is a .NET library with the capability to produce Adobe PDF files. It features a full-fledged object model for the easy creation of PDF files from any .NET language. It does not use any external libraries and is built from scratch in C#. It can be used on the server side (ASP.NET or any other environment) or with Windows Forms applications. Essential PDF supports many features for creating a PDF document. Drawing Text, Images, Shapes, etc can be drawn easily in the PDF document.', + 'Essential DocIO: It is a .NET library that can read and write Microsoft Word files. It features a full-fledged object model similar to the Microsoft Office COM libraries. It does not use COM interop and is built from scratch in C#. It can be used on systems that do not have Microsoft Word installed. Here are some of the most common questions that arise regarding the usage and functionality of Essential DocIO.', + 'Essential XlsIO: It is a .NET library that can read and write Microsoft Excel files (BIFF 8 format). It features a full-fledged object model similar to the Microsoft Office COM libraries. It does not use COM interop and is built from scratch in C#. It can be used on systems that do not have Microsoft Excel installed, making it an excellent reporting engine for tabular data. ', ]); - let subList = new PdfUnorderedList(subListCollection, { - brush: new PdfBrush({ r: 0, g: 0, b: 0 }), - indent: 20, - font: font4, - format: format, - style: PdfUnorderedListStyle.square - }); + let SubsubList = new PdfUnorderedList(subSubListCollection, { brush: new PdfBrush({ r: 0, g: 0, b: 0 }), indent: 20, font: font5, format: format, style: PdfUnorderedListStyle.square }); // Add the unordered sublist to the second main item - unorderedList.items.at(1).subList = subList; - // Draw the unordered list - unorderedList.draw(page, { - x: 0, - y: 130, - width: page.graphics.clientSize.width, - height: page.graphics.clientSize.height - 130 - }); - // Save the PDF - pdf.save('UnorderedList.pdf'); - // Destroy the document instance + list.items.at(1).subList = SubsubList; + // Draw the list on the page + list.draw(page, { x: 0, y: 130, width: page.graphics.clientSize.width, height: page.graphics.clientSize.height - 130 }); + // Save the document PDF + pdf.save('BulletsAndLists.pdf'); + // Destory the document instance. pdf.destroy(); }; \ No newline at end of file diff --git a/typescript/pdf-list-sample/src/index.html b/typescript/pdf-list-sample/src/index.html index a30181b..4f1283d 100644 --- a/typescript/pdf-list-sample/src/index.html +++ b/typescript/pdf-list-sample/src/index.html @@ -2,12 +2,11 @@ - Extract Image + Add Ordered and Unordered lists into PDF document - - + \ No newline at end of file From be39c89a5daab01495ddb33a1581b5e9c838acad Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 09:48:43 +0530 Subject: [PATCH 3/8] 1032947: Adding samples --- javascript/pdf-fill-form/README.md | 6 +- javascript/pdf-fill-form/index.html | 4 +- javascript/pdf-form-fillings/index.html | 4 +- javascript/pdf-modify-form/README.md | 22 +++++++ javascript/pdf-modify-form/index.html | 57 ++++++++++++++++ typescript/pdf-fill-form/README.md | 10 +-- typescript/pdf-fill-form/src/app/app.ts | 4 +- typescript/pdf-form-fillings/src/app/app.ts | 4 +- .../.github/workflows/gitleaks.yaml | 44 +++++++++++++ typescript/pdf-modify-form/.gitignore | 2 + typescript/pdf-modify-form/README.md | 43 ++++++++++++ typescript/pdf-modify-form/e2e/index.spec.js | 0 .../pdf-modify-form/e2e/protractor.conf.js | 21 ++++++ typescript/pdf-modify-form/gulpfile.js | 62 ++++++++++++++++++ typescript/pdf-modify-form/license | 10 +++ typescript/pdf-modify-form/package.json | 38 +++++++++++ typescript/pdf-modify-form/src/app/app.ts | 38 +++++++++++ typescript/pdf-modify-form/src/index.html | 12 ++++ .../pdf-modify-form/src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-modify-form/src/styles/styles.css | 1 + typescript/pdf-modify-form/tsconfig.json | 12 ++++ typescript/pdf-modify-form/webpack.config.js | 45 +++++++++++++ 22 files changed, 423 insertions(+), 16 deletions(-) create mode 100644 javascript/pdf-modify-form/README.md create mode 100644 javascript/pdf-modify-form/index.html create mode 100644 typescript/pdf-modify-form/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-modify-form/.gitignore create mode 100644 typescript/pdf-modify-form/README.md create mode 100644 typescript/pdf-modify-form/e2e/index.spec.js create mode 100644 typescript/pdf-modify-form/e2e/protractor.conf.js create mode 100644 typescript/pdf-modify-form/gulpfile.js create mode 100644 typescript/pdf-modify-form/license create mode 100644 typescript/pdf-modify-form/package.json create mode 100644 typescript/pdf-modify-form/src/app/app.ts create mode 100644 typescript/pdf-modify-form/src/index.html create mode 100644 typescript/pdf-modify-form/src/resources/favicon.ico create mode 100644 typescript/pdf-modify-form/src/styles/styles.css create mode 100644 typescript/pdf-modify-form/tsconfig.json create mode 100644 typescript/pdf-modify-form/webpack.config.js diff --git a/javascript/pdf-fill-form/README.md b/javascript/pdf-fill-form/README.md index 9cbcfac..0e9c7d3 100644 --- a/javascript/pdf-fill-form/README.md +++ b/javascript/pdf-fill-form/README.md @@ -1,10 +1,10 @@ -# How to Create Fillable PDF Forms in JavaScript +# How to Fill Form Fields in an Existing PDF Document in JavaScript -This project is a complete working application to create fillable PDF forms using JavaScript. +This project is a complete working application to fill form fields in an existing PDF document using JavaScript. ## Getting Started -To get started you need to clone the `pdf-form-fillings` repository. +To get started you need to clone the `pdf-fill-form` repository. ``` git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git diff --git a/javascript/pdf-fill-form/index.html b/javascript/pdf-fill-form/index.html index 1ebc207..b4a0fcd 100644 --- a/javascript/pdf-fill-form/index.html +++ b/javascript/pdf-fill-form/index.html @@ -11,10 +11,10 @@

PDF Forms

+ + + + +
+

Modify PDF Forms

+
+ + + \ No newline at end of file diff --git a/typescript/pdf-fill-form/README.md b/typescript/pdf-fill-form/README.md index abbfcd5..ff760ce 100644 --- a/typescript/pdf-fill-form/README.md +++ b/typescript/pdf-fill-form/README.md @@ -1,14 +1,14 @@ -# How to Add Fillable Form Fields to a PDF Document in TypeScript +# How to Fill Form Fields in an Existing PDF Document in TypeScript -This project is a complete working application to add fillable form fields to a PDF document using TypeScript. +This project is a complete working application to fill form fields in an existing PDF document using TypeScript. ## Getting Started -To get started you need to clone the `pdf-form-fillings` repository and navigate to `pdf-form-fillings` location. +To get started you need to clone the `pdf-fill-form` repository and navigate to `pdf-fill-form` location. ``` -git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-form-fillings -cd pdf-form-fillings +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-fill-form +cd pdf-fill-form ``` ## Installing diff --git a/typescript/pdf-fill-form/src/app/app.ts b/typescript/pdf-fill-form/src/app/app.ts index 5466f45..05c6040 100644 --- a/typescript/pdf-fill-form/src/app/app.ts +++ b/typescript/pdf-fill-form/src/app/app.ts @@ -1,10 +1,10 @@ import { PdfDocument, PdfForm, PdfTextBoxField, PdfCheckBoxField, PdfRadioButtonListField, PdfListBoxField } from '@syncfusion/ej2-pdf'; import { Button } from '@syncfusion/ej2-buttons'; -// Create and initialize the Ordered List button +// Create and initialize the PDF creation button var editForm = new Button(); editForm.appendTo('#editForm'); -// Generate an Ordered List PDF when the button is clicked +// Generate an PDF form when the button is clicked editForm.element.onclick = editFormFields; function editFormFields() { fetchAsUint8Array( diff --git a/typescript/pdf-form-fillings/src/app/app.ts b/typescript/pdf-form-fillings/src/app/app.ts index edea80d..5bf8949 100644 --- a/typescript/pdf-form-fillings/src/app/app.ts +++ b/typescript/pdf-form-fillings/src/app/app.ts @@ -3,10 +3,10 @@ import { CheckBox, Button } from '@syncfusion/ej2-buttons'; import { DatePicker } from '@syncfusion/ej2-calendars'; import { DropDownList } from '@syncfusion/ej2-dropdowns'; -// Create and initialize the Ordered List button +// Create and initialize the PDF creation button var editForm = new Button(); editForm.appendTo('#editForm'); -// Generate an Ordered List PDF when the button is clicked +// Generate an PDF Form when the button is clicked editForm.element.onclick = editFormFields; // Gender DropDownList var genderData = [ diff --git a/typescript/pdf-modify-form/.github/workflows/gitleaks.yaml b/typescript/pdf-modify-form/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-modify-form/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-modify-form/.gitignore b/typescript/pdf-modify-form/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-modify-form/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-modify-form/README.md b/typescript/pdf-modify-form/README.md new file mode 100644 index 0000000..b637f30 --- /dev/null +++ b/typescript/pdf-modify-form/README.md @@ -0,0 +1,43 @@ +# How to Modify Existing Form Fields in PDF in TypeScript + +This project is a complete working application to modify existing form fields in PDF using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-modify-form` repository and navigate to `pdf-modify-form` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-modify-form +cd pdf-modify-form +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-modify-form/e2e/index.spec.js b/typescript/pdf-modify-form/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-modify-form/e2e/protractor.conf.js b/typescript/pdf-modify-form/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-modify-form/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/typescript/pdf-modify-form/gulpfile.js b/typescript/pdf-modify-form/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-modify-form/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/typescript/pdf-modify-form/license b/typescript/pdf-modify-form/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-modify-form/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/typescript/pdf-modify-form/package.json b/typescript/pdf-modify-form/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-modify-form/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-modify-form/src/app/app.ts b/typescript/pdf-modify-form/src/app/app.ts new file mode 100644 index 0000000..a691736 --- /dev/null +++ b/typescript/pdf-modify-form/src/app/app.ts @@ -0,0 +1,38 @@ + +import { PdfDocument, PdfTextBoxField } from '@syncfusion/ej2-pdf'; +import { Button } from '@syncfusion/ej2-buttons'; + +// Create and initialize the PDF creation button +var modifyForm = new Button(); +modifyForm.appendTo('#modifyForm'); +// Generate an Modified Form PDF when the button is clicked +modifyForm.element.onclick = modifyFormFields; +function modifyFormFields() { + fetchAsUint8Array( + 'https://cdn.syncfusion.com/content/pdf-resources/form-filling-document.pdf' + ) + .then(function (pdfBytes) { + // Create a PdfDocument instance from the loaded PDF bytes + const pdf = new PdfDocument(pdfBytes); + // Access the Name text box field (Field Index: 1) + let nameField: PdfTextBoxField = pdf.form.fieldAt(1) as PdfTextBoxField; + // Set the name value + nameField.text = 'John Allister'; + nameField.setAppearance(true); + // Save the modified PDF document and download it + pdf.save('ModifiedForm.pdf'); + // Release resources associated with the PDF document + pdf.destroy(); + }) + .catch(function (err) { + console.error(err); + alert('Failed to create fillable form PDF'); + }) +} +// Fetch URL and return Uint8Array +async function fetchAsUint8Array(url: string): Promise { + const res = await fetch(url, { cache: 'no-cache' }); + if (!res.ok) throw new Error(`Failed to fetch ${url}: ${res.status} ${res.statusText}`); + const buf = await res.arrayBuffer(); + return new Uint8Array(buf); +} \ No newline at end of file diff --git a/typescript/pdf-modify-form/src/index.html b/typescript/pdf-modify-form/src/index.html new file mode 100644 index 0000000..18cd6ef --- /dev/null +++ b/typescript/pdf-modify-form/src/index.html @@ -0,0 +1,12 @@ + + + + PDF Forms + + + +
+

PDF Forms

+
+ + \ No newline at end of file diff --git a/typescript/pdf-modify-form/src/resources/favicon.ico b/typescript/pdf-modify-form/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-modify-form/src/styles/styles.css b/typescript/pdf-modify-form/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-modify-form/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-modify-form/tsconfig.json b/typescript/pdf-modify-form/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-modify-form/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-modify-form/webpack.config.js b/typescript/pdf-modify-form/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-modify-form/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; From ca1a67338fda532aa1ddb743fbe130524e4d228f Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 11:45:49 +0530 Subject: [PATCH 4/8] 1032947: Adding merge PDF samples --- javascript/pdf-merge-sample/README.md | 22 +++++++ javascript/pdf-merge-sample/index.html | 47 +++++++++++++ .../.github/workflows/gitleaks.yaml | 44 +++++++++++++ typescript/pdf-merge-sample/.gitignore | 2 + typescript/pdf-merge-sample/README.md | 43 ++++++++++++ typescript/pdf-merge-sample/e2e/index.spec.js | 0 .../pdf-merge-sample/e2e/protractor.conf.js | 21 ++++++ typescript/pdf-merge-sample/gulpfile.js | 62 ++++++++++++++++++ typescript/pdf-merge-sample/license | 10 +++ typescript/pdf-merge-sample/package.json | 38 +++++++++++ typescript/pdf-merge-sample/src/app/app.ts | 60 +++++++++++++++++ typescript/pdf-merge-sample/src/index.html | 9 +++ .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-merge-sample/src/styles/styles.css | 1 + typescript/pdf-merge-sample/tsconfig.json | 12 ++++ typescript/pdf-merge-sample/webpack.config.js | 45 +++++++++++++ 16 files changed, 416 insertions(+) create mode 100644 javascript/pdf-merge-sample/README.md create mode 100644 javascript/pdf-merge-sample/index.html create mode 100644 typescript/pdf-merge-sample/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-merge-sample/.gitignore create mode 100644 typescript/pdf-merge-sample/README.md create mode 100644 typescript/pdf-merge-sample/e2e/index.spec.js create mode 100644 typescript/pdf-merge-sample/e2e/protractor.conf.js create mode 100644 typescript/pdf-merge-sample/gulpfile.js create mode 100644 typescript/pdf-merge-sample/license create mode 100644 typescript/pdf-merge-sample/package.json create mode 100644 typescript/pdf-merge-sample/src/app/app.ts create mode 100644 typescript/pdf-merge-sample/src/index.html create mode 100644 typescript/pdf-merge-sample/src/resources/favicon.ico create mode 100644 typescript/pdf-merge-sample/src/styles/styles.css create mode 100644 typescript/pdf-merge-sample/tsconfig.json create mode 100644 typescript/pdf-merge-sample/webpack.config.js diff --git a/javascript/pdf-merge-sample/README.md b/javascript/pdf-merge-sample/README.md new file mode 100644 index 0000000..b7621ce --- /dev/null +++ b/javascript/pdf-merge-sample/README.md @@ -0,0 +1,22 @@ +# How to Merge Multiple PDFs into One File in JavaScript + +This project is a complete working application to merge multiple PDFs into one file using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-merge-sample` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/javascript/pdf-merge-sample/index.html b/javascript/pdf-merge-sample/index.html new file mode 100644 index 0000000..2a5cfa8 --- /dev/null +++ b/javascript/pdf-merge-sample/index.html @@ -0,0 +1,47 @@ + + + + +
+

Merge Multiple PDFs into One File

+ +
+ + \ No newline at end of file diff --git a/typescript/pdf-merge-sample/.github/workflows/gitleaks.yaml b/typescript/pdf-merge-sample/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-merge-sample/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-merge-sample/.gitignore b/typescript/pdf-merge-sample/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-merge-sample/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-merge-sample/README.md b/typescript/pdf-merge-sample/README.md new file mode 100644 index 0000000..e36dcd9 --- /dev/null +++ b/typescript/pdf-merge-sample/README.md @@ -0,0 +1,43 @@ +# How to Merge Multiple PDFs into One File in TypeScript + +This project is a complete working application to merge multiple PDFs into one file using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-merge-sample` repository and navigate to `pdf-merge-sample` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-merge-sample +cd pdf-merge-sample +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-merge-sample/e2e/index.spec.js b/typescript/pdf-merge-sample/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-merge-sample/e2e/protractor.conf.js b/typescript/pdf-merge-sample/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-merge-sample/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/typescript/pdf-merge-sample/gulpfile.js b/typescript/pdf-merge-sample/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-merge-sample/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/typescript/pdf-merge-sample/license b/typescript/pdf-merge-sample/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-merge-sample/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/typescript/pdf-merge-sample/package.json b/typescript/pdf-merge-sample/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-merge-sample/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-merge-sample/src/app/app.ts b/typescript/pdf-merge-sample/src/app/app.ts new file mode 100644 index 0000000..73f06f9 --- /dev/null +++ b/typescript/pdf-merge-sample/src/app/app.ts @@ -0,0 +1,60 @@ +import { Button } from '@syncfusion/ej2-buttons'; +import { PdfDocument } from '@syncfusion/ej2-pdf'; + +// Create the Merge button and attach it to the container element +const mergeBtn = new Button(); +mergeBtn.appendTo('#mergeBtn'); + +// URLs of the PDF files to be merged +const templateUrl1 = 'https://cdn.syncfusion.com/content/pdf-resources/pdf-succinctly.pdf'; +const templateUrl2 = 'https://cdn.syncfusion.com/content/pdf-resources/syncfusion-brochure.pdf'; + +// Handle the button click event +mergeBtn.element.onclick = async (): Promise => { + try { + // Fetch both PDF files as Uint8Array + const pdfBytes1 = await fetchAsUint8Array(templateUrl1); + const pdfBytes2 = await fetchAsUint8Array(templateUrl2); + // Create PdfDocument instances from the downloaded PDF data + const doc1 = new PdfDocument(pdfBytes1); + const doc2 = new PdfDocument(pdfBytes2); + // Import all pages from doc2 into doc1 + // Parameters: + // doc2 -> Source PDF document + // 0 -> Starting page index + // doc2.pageCount - 1 -> Ending page index + doc1.importPageRange(doc2, 0, doc2.pageCount - 1); + // Save the merged PDF and trigger download + doc1.save('MergedPDF.pdf'); + // Release resources used by both PDF documents + doc1.destroy(); + doc2.destroy(); + } catch (err) { + // Log any errors that occur during the merge process + console.error('Merge PDFs failed:', err); + } +}; + +/** + * Downloads a PDF file and converts it to Uint8Array. + * + * @param url - URL of the PDF file to download. + * @returns Promise that resolves with the PDF content as Uint8Array. + */ +async function fetchAsUint8Array(url: string): Promise { + // Fetch the file from the specified URL + const res = await fetch(url, { cache: 'no-cache' }); + + // Throw an error if the request fails + if (!res.ok) { + throw new Error( + `Failed to fetch ${url}: ${res.status} ${res.statusText}` + ); + } + + // Convert the response into an ArrayBuffer + const buf = await res.arrayBuffer(); + + // Return the data as Uint8Array for PdfDocument processing + return new Uint8Array(buf); +} \ No newline at end of file diff --git a/typescript/pdf-merge-sample/src/index.html b/typescript/pdf-merge-sample/src/index.html new file mode 100644 index 0000000..3bc97c4 --- /dev/null +++ b/typescript/pdf-merge-sample/src/index.html @@ -0,0 +1,9 @@ + + + + Merge Multiple PDFs into One File + + + + + \ No newline at end of file diff --git a/typescript/pdf-merge-sample/src/resources/favicon.ico b/typescript/pdf-merge-sample/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-merge-sample/src/styles/styles.css b/typescript/pdf-merge-sample/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-merge-sample/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-merge-sample/tsconfig.json b/typescript/pdf-merge-sample/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-merge-sample/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-merge-sample/webpack.config.js b/typescript/pdf-merge-sample/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-merge-sample/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; From 58f20c0a86109dd6dfbec6edcf15f8922ae0a27a Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 15:09:01 +0530 Subject: [PATCH 5/8] 1032947: Adding bookmark sample --- javascript/pdf-bookmark-index/README.md | 22 +++++++ javascript/pdf-bookmark-index/index.html | 47 +++++++++++++ .../.github/workflows/gitleaks.yaml | 44 +++++++++++++ typescript/pdf-bookmark-index/.gitignore | 2 + typescript/pdf-bookmark-index/README.md | 43 ++++++++++++ .../pdf-bookmark-index/e2e/index.spec.js | 0 .../pdf-bookmark-index/e2e/protractor.conf.js | 21 ++++++ typescript/pdf-bookmark-index/gulpfile.js | 62 ++++++++++++++++++ typescript/pdf-bookmark-index/license | 10 +++ typescript/pdf-bookmark-index/package.json | 38 +++++++++++ typescript/pdf-bookmark-index/src/app/app.ts | 43 ++++++++++++ typescript/pdf-bookmark-index/src/index.html | 9 +++ .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-bookmark-index/src/styles/styles.css | 1 + typescript/pdf-bookmark-index/tsconfig.json | 12 ++++ .../pdf-bookmark-index/webpack.config.js | 45 +++++++++++++ 16 files changed, 399 insertions(+) create mode 100644 javascript/pdf-bookmark-index/README.md create mode 100644 javascript/pdf-bookmark-index/index.html create mode 100644 typescript/pdf-bookmark-index/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-bookmark-index/.gitignore create mode 100644 typescript/pdf-bookmark-index/README.md create mode 100644 typescript/pdf-bookmark-index/e2e/index.spec.js create mode 100644 typescript/pdf-bookmark-index/e2e/protractor.conf.js create mode 100644 typescript/pdf-bookmark-index/gulpfile.js create mode 100644 typescript/pdf-bookmark-index/license create mode 100644 typescript/pdf-bookmark-index/package.json create mode 100644 typescript/pdf-bookmark-index/src/app/app.ts create mode 100644 typescript/pdf-bookmark-index/src/index.html create mode 100644 typescript/pdf-bookmark-index/src/resources/favicon.ico create mode 100644 typescript/pdf-bookmark-index/src/styles/styles.css create mode 100644 typescript/pdf-bookmark-index/tsconfig.json create mode 100644 typescript/pdf-bookmark-index/webpack.config.js diff --git a/javascript/pdf-bookmark-index/README.md b/javascript/pdf-bookmark-index/README.md new file mode 100644 index 0000000..9496e3e --- /dev/null +++ b/javascript/pdf-bookmark-index/README.md @@ -0,0 +1,22 @@ +# How to Get Bookmark Page Index from PDF Using JavaScript + +This project is a complete working application to get bookmark page index from PDF file using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-bookmark-index` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-bookmark-index/index.html b/javascript/pdf-bookmark-index/index.html new file mode 100644 index 0000000..318e59c --- /dev/null +++ b/javascript/pdf-bookmark-index/index.html @@ -0,0 +1,47 @@ + + + + +
+

Get Bookmark Page Index from PDF

+ +
+ + \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/.github/workflows/gitleaks.yaml b/typescript/pdf-bookmark-index/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-bookmark-index/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/.gitignore b/typescript/pdf-bookmark-index/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-bookmark-index/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-bookmark-index/README.md b/typescript/pdf-bookmark-index/README.md new file mode 100644 index 0000000..7b328c3 --- /dev/null +++ b/typescript/pdf-bookmark-index/README.md @@ -0,0 +1,43 @@ +# How to Get Bookmark Page Index from PDF in TypeScript + +This project is a complete working application to get bookmark page index from PDF file using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-bookmark-index` repository and navigate to `pdf-bookmark-index` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-bookmark-index +cd pdf-bookmark-index +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/e2e/index.spec.js b/typescript/pdf-bookmark-index/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-bookmark-index/e2e/protractor.conf.js b/typescript/pdf-bookmark-index/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-bookmark-index/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/typescript/pdf-bookmark-index/gulpfile.js b/typescript/pdf-bookmark-index/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-bookmark-index/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/typescript/pdf-bookmark-index/license b/typescript/pdf-bookmark-index/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-bookmark-index/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/typescript/pdf-bookmark-index/package.json b/typescript/pdf-bookmark-index/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-bookmark-index/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-bookmark-index/src/app/app.ts b/typescript/pdf-bookmark-index/src/app/app.ts new file mode 100644 index 0000000..7be7ac3 --- /dev/null +++ b/typescript/pdf-bookmark-index/src/app/app.ts @@ -0,0 +1,43 @@ +import { Button } from '@syncfusion/ej2-buttons'; +import { PdfDocument, PdfBookmarkBase } from '@syncfusion/ej2-pdf'; + +const indexBtn = new Button(); +indexBtn.appendTo('#indexBtn'); +indexBtn.element.onclick = getBookmarkIndex; + +function getBookmarkIndex() { + const templateUrl = 'https://cdn.syncfusion.com/content/pdf-resources/bookmarks.pdf'; + readFromUrl(templateUrl) + .then(function (pdfBytes) { + // Load the existing PDF document + const document: PdfDocument = new PdfDocument(pdfBytes); + // Get the bookmarks collection + const bookmarks: PdfBookmarkBase = document.bookmarks; + // Get the first bookmark (or any specific one) + let bookmark = bookmarks.at(1); + // Get the page index of the bookmark's destination + let pageIndex: number = bookmark.destination.pageIndex; + // Print the Bookmark Index + console.log("Bookmark Index: " + pageIndex); + // Close the document + document.destroy(); + }); +} + +// Fetch PDF data from a URL +function readFromUrl(url: any): Promise { + return fetch(url, { cache: 'no-cache' }) + .then(function (res) { + // Check whether the request was successful + if (!res.ok) { + throw new Error( + 'Failed to fetch ' + url + ': ' + res.status + ' ' + res.statusText + ); + } + return res.arrayBuffer(); + }) + .then(function (buf) { + // Convert the response to Uint8Array + return new Uint8Array(buf); + }); +} \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/src/index.html b/typescript/pdf-bookmark-index/src/index.html new file mode 100644 index 0000000..bac4374 --- /dev/null +++ b/typescript/pdf-bookmark-index/src/index.html @@ -0,0 +1,9 @@ + + + + Get Bookmark Page Index from PDF + + + + + \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/src/resources/favicon.ico b/typescript/pdf-bookmark-index/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-bookmark-index/src/styles/styles.css b/typescript/pdf-bookmark-index/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-bookmark-index/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-bookmark-index/tsconfig.json b/typescript/pdf-bookmark-index/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-bookmark-index/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-bookmark-index/webpack.config.js b/typescript/pdf-bookmark-index/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-bookmark-index/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; From 93512b4365251b87e113b874bcca0b50773fbf0a Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 16:13:32 +0530 Subject: [PATCH 6/8] 1032947: Adding remove bookmark sample --- javascript/pdf-remove-bookmark/README.md | 22 +++++++ javascript/pdf-remove-bookmark/index.html | 45 +++++++++++++ .../.github/workflows/gitleaks.yaml | 44 +++++++++++++ typescript/pdf-remove-bookmark/.gitignore | 2 + typescript/pdf-remove-bookmark/README.md | 43 ++++++++++++ .../pdf-remove-bookmark/e2e/index.spec.js | 0 .../e2e/protractor.conf.js | 21 ++++++ typescript/pdf-remove-bookmark/gulpfile.js | 62 ++++++++++++++++++ typescript/pdf-remove-bookmark/license | 10 +++ typescript/pdf-remove-bookmark/package.json | 38 +++++++++++ typescript/pdf-remove-bookmark/src/app/app.ts | 41 ++++++++++++ typescript/pdf-remove-bookmark/src/index.html | 9 +++ .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../pdf-remove-bookmark/src/styles/styles.css | 1 + typescript/pdf-remove-bookmark/tsconfig.json | 12 ++++ .../pdf-remove-bookmark/webpack.config.js | 45 +++++++++++++ 16 files changed, 395 insertions(+) create mode 100644 javascript/pdf-remove-bookmark/README.md create mode 100644 javascript/pdf-remove-bookmark/index.html create mode 100644 typescript/pdf-remove-bookmark/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-remove-bookmark/.gitignore create mode 100644 typescript/pdf-remove-bookmark/README.md create mode 100644 typescript/pdf-remove-bookmark/e2e/index.spec.js create mode 100644 typescript/pdf-remove-bookmark/e2e/protractor.conf.js create mode 100644 typescript/pdf-remove-bookmark/gulpfile.js create mode 100644 typescript/pdf-remove-bookmark/license create mode 100644 typescript/pdf-remove-bookmark/package.json create mode 100644 typescript/pdf-remove-bookmark/src/app/app.ts create mode 100644 typescript/pdf-remove-bookmark/src/index.html create mode 100644 typescript/pdf-remove-bookmark/src/resources/favicon.ico create mode 100644 typescript/pdf-remove-bookmark/src/styles/styles.css create mode 100644 typescript/pdf-remove-bookmark/tsconfig.json create mode 100644 typescript/pdf-remove-bookmark/webpack.config.js diff --git a/javascript/pdf-remove-bookmark/README.md b/javascript/pdf-remove-bookmark/README.md new file mode 100644 index 0000000..8729508 --- /dev/null +++ b/javascript/pdf-remove-bookmark/README.md @@ -0,0 +1,22 @@ +# How to Remove a Bookmark from PDF (By Index) Using JavaScript + +This project is a complete working application to remove a bookmark from PDF by index using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-remove-bookmark` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-remove-bookmark/index.html b/javascript/pdf-remove-bookmark/index.html new file mode 100644 index 0000000..1d515b8 --- /dev/null +++ b/javascript/pdf-remove-bookmark/index.html @@ -0,0 +1,45 @@ + + + + +
+

Remove Bookmark Using Index from PDF

+ +
+ + \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/.github/workflows/gitleaks.yaml b/typescript/pdf-remove-bookmark/.github/workflows/gitleaks.yaml new file mode 100644 index 0000000..9ae62e1 --- /dev/null +++ b/typescript/pdf-remove-bookmark/.github/workflows/gitleaks.yaml @@ -0,0 +1,44 @@ +name: Secret Value found!! +on: + push: + public: +jobs: + scan: + name: gitleaks + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4.2.2 + - name: Install the gitleaks + run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz + shell: pwsh + - name: Extract the tar file + run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz + - name: Generate the report + id: gitleaks + run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json + shell: bash + continue-on-error: true + - name: Setup NuGet.exe + if: steps.gitleaks.outcome != 'success' + uses: nuget/setup-nuget@v2 + with: + nuget-version: latest + - name: Install Mono + if: steps.gitleaks.outcome != 'success' + run: | + sudo apt update + sudo apt install -y mono-complete + - name: Install the dotnet SDK to a custom directory + if: steps.gitleaks.outcome != 'success' + run: | + mkdir -p $GITHUB_WORKSPACE/dotnet + curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0 + - name: Install the report tool packages + if: steps.gitleaks.outcome != 'success' + run: | + export PATH=$GITHUB_WORKSPACE/dotnet:$PATH + nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion + dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0 + dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }} + exit 1 \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/.gitignore b/typescript/pdf-remove-bookmark/.gitignore new file mode 100644 index 0000000..1eae0cf --- /dev/null +++ b/typescript/pdf-remove-bookmark/.gitignore @@ -0,0 +1,2 @@ +dist/ +node_modules/ diff --git a/typescript/pdf-remove-bookmark/README.md b/typescript/pdf-remove-bookmark/README.md new file mode 100644 index 0000000..d700dcf --- /dev/null +++ b/typescript/pdf-remove-bookmark/README.md @@ -0,0 +1,43 @@ +# How to Remove a Bookmark from PDF (By Index) in TypeScript + +This project is a complete working application to remove a bookmark from PDF by index using TypeScript. + +## Getting Started + +To get started you need to clone the `pdf-remove-bookmark` repository and navigate to `pdf-remove-bookmark` location. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git pdf-remove-bookmark +cd pdf-remove-bookmark +``` + +## 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 @syncfusion/ej2-pdf +``` + +## 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 Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/e2e/index.spec.js b/typescript/pdf-remove-bookmark/e2e/index.spec.js new file mode 100644 index 0000000..e69de29 diff --git a/typescript/pdf-remove-bookmark/e2e/protractor.conf.js b/typescript/pdf-remove-bookmark/e2e/protractor.conf.js new file mode 100644 index 0000000..43eee1b --- /dev/null +++ b/typescript/pdf-remove-bookmark/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/typescript/pdf-remove-bookmark/gulpfile.js b/typescript/pdf-remove-bookmark/gulpfile.js new file mode 100644 index 0000000..6a623f3 --- /dev/null +++ b/typescript/pdf-remove-bookmark/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/typescript/pdf-remove-bookmark/license b/typescript/pdf-remove-bookmark/license new file mode 100644 index 0000000..111c12a --- /dev/null +++ b/typescript/pdf-remove-bookmark/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/typescript/pdf-remove-bookmark/package.json b/typescript/pdf-remove-bookmark/package.json new file mode 100644 index 0000000..70da801 --- /dev/null +++ b/typescript/pdf-remove-bookmark/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 serve --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", + "css-loader": "^6.7.2", + "gulp": "*", + "gulp-protractor": "*", + "gulp-typescript": "*", + "html-webpack-plugin": "^5.5.0", + "jasmine": "^2.6.0", + "mini-css-extract-plugin": "^2.7.0", + "ts-loader": "^9.4.1", + "typescript": "*", + "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/typescript/pdf-remove-bookmark/src/app/app.ts b/typescript/pdf-remove-bookmark/src/app/app.ts new file mode 100644 index 0000000..7bd0f3c --- /dev/null +++ b/typescript/pdf-remove-bookmark/src/app/app.ts @@ -0,0 +1,41 @@ +import { Button } from '@syncfusion/ej2-buttons'; +import { PdfDocument, PdfBookmarkBase } from '@syncfusion/ej2-pdf'; + +const indexBtn = new Button(); +indexBtn.appendTo('#indexBtn'); +indexBtn.element.onclick = getBookmarkIndex; + +function getBookmarkIndex() { + const templateUrl = 'https://cdn.syncfusion.com/content/pdf-resources/bookmarks.pdf'; + readFromUrl(templateUrl) + .then(function (pdfBytes) { + // Load the existing PDF document + const document: PdfDocument = new PdfDocument(pdfBytes); + // Get the bookmarks collection + const bookmarks: PdfBookmarkBase = document.bookmarks; + // Remove the bookmark from the document at the index 1 + let bookmark = bookmarks.remove(1); + // Save the Updated PDF + document.save('Bookmark.pdf'); + // Destroy the document instance to release memory + document.destroy(); + }); +} + +// Fetch PDF data from a URL +function readFromUrl(url: any): Promise { + return fetch(url, { cache: 'no-cache' }) + .then(function (res) { + // Check whether the request was successful + if (!res.ok) { + throw new Error( + 'Failed to fetch ' + url + ': ' + res.status + ' ' + res.statusText + ); + } + return res.arrayBuffer(); + }) + .then(function (buf) { + // Convert the response to Uint8Array + return new Uint8Array(buf); + }); +} \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/src/index.html b/typescript/pdf-remove-bookmark/src/index.html new file mode 100644 index 0000000..e65b584 --- /dev/null +++ b/typescript/pdf-remove-bookmark/src/index.html @@ -0,0 +1,9 @@ + + + + Remove Bookmark Using Index from PDF + + + + + \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/src/resources/favicon.ico b/typescript/pdf-remove-bookmark/src/resources/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..d8d5c152e7353a07c3e519c9e53ac9328e515fa8 GIT binary patch literal 6574 zcmeHLZ)jUp6o1J}(=>U>YhL@3w0TL>C8MsL+H`gkEVxdkmO9tb;jBuvbG9p5I^2g+ zoQ_RobEu4M#mx^QI7C|n@y`&)zU<3BbPQB*vVCzdnHEGebfLH<{!U+RdizYC2_~~j z1HasR&O7J+&b{}%bKiS{U=c*2x>`UR5q8-GVZ9(Mk>7TV@$vY-_rFZ=hz7$<%I*YLf(BcUQQv$12qd1n5&7W;6a-9p|6b zEhm49g@-KH`gmCjM%xIyj%eKs>3FcY z7n(o3J#i>co_LArxZI=s%9(%6R(@pPpgxCWiu%Ry6DQk0y}gm7yr6rAVRyV~hT>x~ zwUqzFqjN9j0FA-VgT-jp@-Yrp@Q=->eJHEXYL9=tkj!kdk!e*gDhmYScQgOFnb;OE~-vz&&w zQajg1Pn+N~)SZTV{K{q%o6~)<&}%H8s9lI*l^4D+KY9dvo5Ozg=*(Ki>YA>-a|SZ~p!SYpRMR literal 0 HcmV?d00001 diff --git a/typescript/pdf-remove-bookmark/src/styles/styles.css b/typescript/pdf-remove-bookmark/src/styles/styles.css new file mode 100644 index 0000000..0da413e --- /dev/null +++ b/typescript/pdf-remove-bookmark/src/styles/styles.css @@ -0,0 +1 @@ +@import '../../node_modules/@syncfusion/ej2/material.css'; \ No newline at end of file diff --git a/typescript/pdf-remove-bookmark/tsconfig.json b/typescript/pdf-remove-bookmark/tsconfig.json new file mode 100644 index 0000000..3292391 --- /dev/null +++ b/typescript/pdf-remove-bookmark/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "es2016", + "module": "ES6", + "sourceMap": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true, + "moduleResolution": "bundler" + } +} diff --git a/typescript/pdf-remove-bookmark/webpack.config.js b/typescript/pdf-remove-bookmark/webpack.config.js new file mode 100644 index 0000000..8a2b060 --- /dev/null +++ b/typescript/pdf-remove-bookmark/webpack.config.js @@ -0,0 +1,45 @@ +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: { + directory: path.join(__dirname, "dist"), + }, + compress: true, + port: 4000, + open: true, + hot: true, + historyApiFallback: true + }, +}; From 8e32865f2fa2fee5ddb00543c13df1d2ca98f1d1 Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Wed, 8 Jul 2026 17:23:59 +0530 Subject: [PATCH 7/8] 1032947: Updated split pdf sample --- javascript/pdf-split/index.html | 75 +++++++++++++++------------- typescript/pdf-split/src/app/app.ts | 76 +++++++++++++---------------- typescript/pdf-split/src/index.html | 7 --- 3 files changed, 75 insertions(+), 83 deletions(-) diff --git a/javascript/pdf-split/index.html b/javascript/pdf-split/index.html index d1cc826..abcb6e7 100644 --- a/javascript/pdf-split/index.html +++ b/javascript/pdf-split/index.html @@ -4,44 +4,51 @@

Split PDF

- -
\ No newline at end of file diff --git a/typescript/pdf-split/src/app/app.ts b/typescript/pdf-split/src/app/app.ts index f7e9aef..1cc9eb2 100644 --- a/typescript/pdf-split/src/app/app.ts +++ b/typescript/pdf-split/src/app/app.ts @@ -1,51 +1,43 @@ import { Button } from '@syncfusion/ej2-buttons'; -import { NumericTextBox } from '@syncfusion/ej2-inputs'; -import { PdfDocument } from '@syncfusion/ej2-pdf'; +import { PdfDocument, PdfDocumentSplitEventArgs } from '@syncfusion/ej2-pdf'; +import { Save } from '@syncfusion/ej2/file-utils'; -const DEFAULT_PDF_URL = - 'https://cdn.syncfusion.com/content/pdf-resources/pdf-succinctly.pdf'; - -// Initialize input box -const numericBox = new NumericTextBox( - { - min: 1, - value: 2, - format: 'n0', - width: '120px', - showSpinButton: true - } -); -numericBox.appendTo('#pagesPerFileInput'); +const DEFAULT_PDF_URL = 'https://cdn.syncfusion.com/content/pdf-resources/pdf-succinctly.pdf'; // Initialize button const splitBtnSf = new Button(); splitBtnSf.appendTo('#splitBtn'); -splitBtnSf.element.onclick = async function (): Promise { - try { - const response = await fetch(DEFAULT_PDF_URL); - const buffer = await response.arrayBuffer(); - const pdf = new PdfDocument(new Uint8Array(buffer)); - // Download each generated PDF - (pdf as any).splitEvent = ( - _sender: unknown, - args: { index: number; pdfData: Uint8Array } - ) => { - const splitDocument = new PdfDocument(args.pdfData); +splitBtnSf.element.onclick = splitPDF; + +function splitPDF() { + readFromUrl(DEFAULT_PDF_URL) + .then(function (pdfBytes) { + const pdf = new PdfDocument(pdfBytes); + // Download each generated PDF + pdf.splitEvent = (sender: PdfDocument, args: PdfDocumentSplitEventArgs) => { + Save.save('SplitDocument_' + (args.index + 1) + '.pdf', new Blob([args.pdfData], { type: 'application/pdf' })); + }; + // Split PDF document into individual pages + pdf.split(); + pdf.destroy(); + }); +} - splitDocument.save(`SplitDocument_${args.index + 1}.pdf`); - splitDocument.destroy(); - }; - const inputElement = document.getElementById( - 'pagesPerFileInput' - ) as HTMLElement; - const instance = (inputElement as any).ej2_instances[0]; - const pagesPerFile = instance.value; - // Split PDF by page count - (pdf as any).splitByFixedNumber(pagesPerFile); - pdf.destroy(); - } catch (error) { - console.error(error); - alert('Failed to split PDF.'); - } +// Fetch PDF data from a URL +function readFromUrl(url: string): Promise { + return fetch(url, { cache: 'no-cache' }) + .then(function (res) { + // Check whether the request was successful + if (!res.ok) { + throw new Error( + 'Failed to fetch ' + url + ': ' + res.status + ' ' + res.statusText + ); + } + return res.arrayBuffer(); + }) + .then(function (buf) { + // Convert the response to Uint8Array + return new Uint8Array(buf); + }); } diff --git a/typescript/pdf-split/src/index.html b/typescript/pdf-split/src/index.html index 19f4474..33f97fe 100644 --- a/typescript/pdf-split/src/index.html +++ b/typescript/pdf-split/src/index.html @@ -1,16 +1,9 @@ - Split PDF - - - -
-
- \ No newline at end of file From cb31e05a33c3aa710b222af1f47fec3a318ee710 Mon Sep 17 00:00:00 2001 From: "AzureAD\\DhakshinPrasathDhanr" Date: Fri, 10 Jul 2026 11:00:37 +0530 Subject: [PATCH 8/8] 1032947: Added samples and updated feedbacks --- javascript/pdf-export-annotations/README.md | 22 + javascript/pdf-export-annotations/index.html | 45 ++ javascript/pdf-form-fillings/index.html | 387 +++++++----------- javascript/pdf-modify-annotations/README.md | 22 + javascript/pdf-modify-annotations/index.html | 51 +++ javascript/pdf-remove-annotations/README.md | 22 + javascript/pdf-remove-annotations/index.html | 47 +++ javascript/pdf-remove-bookmark/index.html | 2 +- javascript/pdf-split/index.html | 15 +- typescript/pdf-extract-image/src/app/app.ts | 27 +- typescript/pdf-form-fillings/src/app/app.ts | 303 +++++++------- typescript/pdf-form-fillings/src/index.html | 94 ----- .../.github/workflows/gitleaks.yaml | 44 ++ typescript/pdf-modify-annotations/.gitignore | 2 + typescript/pdf-modify-annotations/README.md | 43 ++ .../pdf-modify-annotations/e2e/index.spec.js | 0 .../e2e/protractor.conf.js | 21 + typescript/pdf-modify-annotations/gulpfile.js | 62 +++ typescript/pdf-modify-annotations/license | 10 + .../pdf-modify-annotations/package.json | 38 ++ .../pdf-modify-annotations/src/app/app.ts | 47 +++ .../pdf-modify-annotations/src/index.html | 9 + .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../src/styles/styles.css | 1 + .../pdf-modify-annotations/tsconfig.json | 12 + .../pdf-modify-annotations/webpack.config.js | 45 ++ .../.github/workflows/gitleaks.yaml | 44 ++ typescript/pdf-remove-annotations/.gitignore | 2 + typescript/pdf-remove-annotations/README.md | 43 ++ .../pdf-remove-annotations/e2e/index.spec.js | 0 .../e2e/protractor.conf.js | 21 + typescript/pdf-remove-annotations/gulpfile.js | 62 +++ typescript/pdf-remove-annotations/license | 10 + .../pdf-remove-annotations/package.json | 38 ++ .../pdf-remove-annotations/src/app/app.ts | 43 ++ .../pdf-remove-annotations/src/index.html | 9 + .../src/resources/favicon.ico | Bin 0 -> 6574 bytes .../src/styles/styles.css | 1 + .../pdf-remove-annotations/tsconfig.json | 12 + .../pdf-remove-annotations/webpack.config.js | 45 ++ 40 files changed, 1185 insertions(+), 516 deletions(-) create mode 100644 javascript/pdf-export-annotations/README.md create mode 100644 javascript/pdf-export-annotations/index.html create mode 100644 javascript/pdf-modify-annotations/README.md create mode 100644 javascript/pdf-modify-annotations/index.html create mode 100644 javascript/pdf-remove-annotations/README.md create mode 100644 javascript/pdf-remove-annotations/index.html create mode 100644 typescript/pdf-modify-annotations/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-modify-annotations/.gitignore create mode 100644 typescript/pdf-modify-annotations/README.md create mode 100644 typescript/pdf-modify-annotations/e2e/index.spec.js create mode 100644 typescript/pdf-modify-annotations/e2e/protractor.conf.js create mode 100644 typescript/pdf-modify-annotations/gulpfile.js create mode 100644 typescript/pdf-modify-annotations/license create mode 100644 typescript/pdf-modify-annotations/package.json create mode 100644 typescript/pdf-modify-annotations/src/app/app.ts create mode 100644 typescript/pdf-modify-annotations/src/index.html create mode 100644 typescript/pdf-modify-annotations/src/resources/favicon.ico create mode 100644 typescript/pdf-modify-annotations/src/styles/styles.css create mode 100644 typescript/pdf-modify-annotations/tsconfig.json create mode 100644 typescript/pdf-modify-annotations/webpack.config.js create mode 100644 typescript/pdf-remove-annotations/.github/workflows/gitleaks.yaml create mode 100644 typescript/pdf-remove-annotations/.gitignore create mode 100644 typescript/pdf-remove-annotations/README.md create mode 100644 typescript/pdf-remove-annotations/e2e/index.spec.js create mode 100644 typescript/pdf-remove-annotations/e2e/protractor.conf.js create mode 100644 typescript/pdf-remove-annotations/gulpfile.js create mode 100644 typescript/pdf-remove-annotations/license create mode 100644 typescript/pdf-remove-annotations/package.json create mode 100644 typescript/pdf-remove-annotations/src/app/app.ts create mode 100644 typescript/pdf-remove-annotations/src/index.html create mode 100644 typescript/pdf-remove-annotations/src/resources/favicon.ico create mode 100644 typescript/pdf-remove-annotations/src/styles/styles.css create mode 100644 typescript/pdf-remove-annotations/tsconfig.json create mode 100644 typescript/pdf-remove-annotations/webpack.config.js diff --git a/javascript/pdf-export-annotations/README.md b/javascript/pdf-export-annotations/README.md new file mode 100644 index 0000000..d0463c2 --- /dev/null +++ b/javascript/pdf-export-annotations/README.md @@ -0,0 +1,22 @@ +# How to Export Annotations from a PDF in JavaScript + +This project is a complete working application to export annotation from PDF using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-export-annotations` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-export-annotations/index.html b/javascript/pdf-export-annotations/index.html new file mode 100644 index 0000000..436e31d --- /dev/null +++ b/javascript/pdf-export-annotations/index.html @@ -0,0 +1,45 @@ + + + + +
+

Export Annotations from PDF

+ +
+ + \ No newline at end of file diff --git a/javascript/pdf-form-fillings/index.html b/javascript/pdf-form-fillings/index.html index 8b28b58..4ab68b4 100644 --- a/javascript/pdf-form-fillings/index.html +++ b/javascript/pdf-form-fillings/index.html @@ -7,37 +7,6 @@

PDF Forms

-
- -
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
- -
-
- - -
-
@@ -47,224 +16,144 @@

PDF Forms

formBtn.appendTo('#formBtn'); // Generate an PDF Form when the button is clicked formBtn.element.onclick = createFormPDF; - // Gender DropDownList - var genderData = [ - { text: 'Male', value: 'Male' }, - { text: 'Female', value: 'Female' }, - { text: 'Other', value: 'Other' } - ]; - var genderDropDown = new ej.dropdowns.DropDownList({ - dataSource: genderData, - fields: { text: 'text', value: 'value' }, - value: 'Male', - popupHeight: '200px' - }); - genderDropDown.appendTo('#gender'); - - // State DropDownList - var stateData = [ - 'Alabama', 'Alaska', 'California', 'Delaware', 'Florida', 'Georgia', - 'Hawaii', 'Indiana', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'New Jersey', - 'New Mexico', 'New York', 'Texas', 'Washington', 'Wyoming' - ]; - var stateDropDown = new ej.dropdowns.DropDownList({ - dataSource: stateData, - value: 'Alabama', - popupHeight: '200px' - }); - stateDropDown.appendTo('#state'); - - // Date of Birth DatePicker - var dobPicker = new ej.calendars.DatePicker({ - value: new Date(2012, 11, 5), - format: 'MM/dd/yyyy' - }); - dobPicker.appendTo('#dob'); - - // Newsletter CheckBox - var newsletterCheckBox = new ej.buttons.CheckBox({ - label: 'Would you like to receive our Newsletter?', - cssClass: 'e-custom' - }); - newsletterCheckBox.appendTo('#newsletter'); function createFormPDF() { - fetchAsUint8Array( - 'https://cdn.syncfusion.com/content/pdf-resources/form-filling-document.pdf' - ) - .then(function (pdfBytes) { - // Read values from HTML form inputs - var values = getFormValues(); - // Create PDF document instance - var pdf = new ej.pdf.PdfDocument(pdfBytes); - var form = pdf.form; - // Fill Name field - var nameField = findByName(form, 'name'); - if (nameField) { - nameField.text = values.name; - nameField.setAppearance(true); - } - // Fill Gender (Radio button list) - var gender = findByName(form, 'gender'); - if (gender) { - if (values.gender === 'Male') gender.selectedIndex = 0; - else if (values.gender === 'Other') gender.selectedIndex = 1; - else if (values.gender === 'Female') gender.selectedIndex = 2; - gender.setAppearance(true); - } - // Fill Date of Birth - var dobField = findByName(form, 'dob'); - if (dobField) { - dobField.text = values.dob; - dobField.setAppearance(true); - } - // Fill Email - var emailField = findByName(form, 'email'); - if (emailField) { - emailField.text = values.email; - emailField.setAppearance(true); - } - // Fill State (ComboBox) - var stateField = findByName(form, 'state'); - if (stateField) { - for (var i = 0; i < stateField.itemsCount; i++) { - var item = stateField._options[i]; - if (item === values.state) { - stateField.selectedIndex = i; - break; - } - } - stateField.setAppearance(true); - } - // Fill Newsletter checkbox - var newsField = findByName(form, 'newsletter'); - if (newsField) { - newsField.checked = values.newsletter; - newsField.setAppearance(true); - } - // Save filled PDF - pdf.save('FormFillings.pdf'); - // Cleanup PDF object - pdf.destroy(); - }) - .catch(function (err) { - console.error(err); - alert('Failed to create fillable form PDF'); - }) - }; - - // Read values from EJ2 form controls - function getFormValues() { - var name = document.querySelector('#name'); - var email = document.querySelector('#email'); - - // Get EJ2 component instances - var genderInstance = ej.base.getComponent(document.querySelector('#gender'), 'dropdownlist'); - var dobInstance = ej.base.getComponent(document.querySelector('#dob'), 'datepicker'); - var stateInstance = ej.base.getComponent(document.querySelector('#state'), 'dropdownlist'); - var newsletterInstance = ej.base.getComponent(document.querySelector('#newsletter'), 'checkbox'); - - // Format date to mm/dd/yyyy - var dob = ''; - if (dobInstance && dobInstance.value) { - var date = dobInstance.value; - var month = ('0' + (date.getMonth() + 1)).slice(-2); - var day = ('0' + date.getDate()).slice(-2); - var year = date.getFullYear(); - dob = month + '/' + day + '/' + year; - } - - return { - name: name ? name.value : '', - gender: genderInstance ? genderInstance.value : 'Male', - dob: dob, - email: email ? email.value : '', - state: stateInstance ? stateInstance.value : '', - newsletter: newsletterInstance ? newsletterInstance.checked : false - }; - } - // Find PDF form field by name - function findByName(form, name) { - for (var i = 0; i < form.count; i++) { - var field = form.fieldAt(i); - if (field && field.name === name) return field; - } - return undefined; - } - // Fetch URL and return Uint8Array - function fetchAsUint8Array(url) { - return fetch(url, { cache: 'no-cache' }) - .then(function (res) { - if (!res.ok) { - throw new Error('Failed to fetch ' + url + ': ' + res.status + ' ' + res.statusText); - } - return res.arrayBuffer(); - }) - .then(function (buf) { - return new Uint8Array(buf); - }); - } - - - \ No newline at end of file + \ No newline at end of file diff --git a/javascript/pdf-modify-annotations/README.md b/javascript/pdf-modify-annotations/README.md new file mode 100644 index 0000000..7943c58 --- /dev/null +++ b/javascript/pdf-modify-annotations/README.md @@ -0,0 +1,22 @@ +# How to Modify Existing Annotations in PDF using JavaScript + +This project is a complete working application to modify the existing annotations in PDF using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-modify-annotations` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-modify-annotations/index.html b/javascript/pdf-modify-annotations/index.html new file mode 100644 index 0000000..f02fab3 --- /dev/null +++ b/javascript/pdf-modify-annotations/index.html @@ -0,0 +1,51 @@ + + + + +
+

Modify Annotations in PDF

+ +
+ + \ No newline at end of file diff --git a/javascript/pdf-remove-annotations/README.md b/javascript/pdf-remove-annotations/README.md new file mode 100644 index 0000000..7447dd7 --- /dev/null +++ b/javascript/pdf-remove-annotations/README.md @@ -0,0 +1,22 @@ +# How to Remove Annotations from a PDF in JavaScript + +This project is a complete working application to remove annotation from PDF using JavaScript. + +## Getting Started + +To get started you need to clone the `pdf-remove-annotations` repository. + +``` +git clone https://github.com/SyncfusionExamples/javascript-pdf-examples.git +``` + +## Running + +You can run the application by simply opening the `index.html` file in any web browser. + +## Resources + +You can also refer the below resources to know more details about Javascript PDF Library. + +* [JavaScript PDF Library Demos](https://document.syncfusion.com/demos/pdf/javascript-es5/#/tailwind3/pdf/default.html) +* [JavaScript PDF Library Documentation](https://help.syncfusion.com/document-processing/pdf/pdf-library/javascript/overview) diff --git a/javascript/pdf-remove-annotations/index.html b/javascript/pdf-remove-annotations/index.html new file mode 100644 index 0000000..8776c23 --- /dev/null +++ b/javascript/pdf-remove-annotations/index.html @@ -0,0 +1,47 @@ + + + + +
+

Remove Annotations from PDF

+ +
+ + \ No newline at end of file diff --git a/javascript/pdf-remove-bookmark/index.html b/javascript/pdf-remove-bookmark/index.html index 1d515b8..0ccb99a 100644 --- a/javascript/pdf-remove-bookmark/index.html +++ b/javascript/pdf-remove-bookmark/index.html @@ -11,7 +11,7 @@

Remove Bookmark Using Index from PDF

// Remove Bookmark (By Index) functionality var indexBtn = new ej.buttons.Button({}, '#indexBtn'); indexBtn.element.onclick = removeBookmarkIndex; - //Method to add bookmark on PDF + //Method to remove bookmark on PDF function removeBookmarkIndex() { const templateUrl = 'https://cdn.syncfusion.com/content/pdf-resources/bookmarks.pdf'; readFromUrl(templateUrl) diff --git a/javascript/pdf-split/index.html b/javascript/pdf-split/index.html index abcb6e7..a1d10c3 100644 --- a/javascript/pdf-split/index.html +++ b/javascript/pdf-split/index.html @@ -9,27 +9,30 @@

Split PDF