Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@mindbowser_inc/ng-ineers-file-viewer

Package Overview
Dependencies
Maintainers
0
Versions
13
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mindbowser_inc/ng-ineers-file-viewer - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

20

package.json
{
"name": "@mindbowser_inc/ng-ineers-file-viewer",
"version": "1.0.6",
"version": "1.0.7",
"peerDependencies": {

@@ -10,21 +10,5 @@ "@angular/common": "^17.3.0",

"@mindbowser_inc/ng-ineers-file-viewer": "file:",
"docviewhelper": "^0.0.2",
"mammoth": "^1.8.0",
"screenfull": "^6.0.2",
"ng-ineers-file-viewer": "file:",
"tslib": "^2.3.0"
},
"repository": {
"url": "https://bitbucket.org/Mindbowser/ng-ineers-file-viewer"
},
"keywords": [
"amgular",
"image-viewer",
"audio-viewer-viewer",
"image-loader",
"image-fullscreen",
"loader",
"image",
"angular-image",
"doc-viewer"
],
"sideEffects": false,

@@ -31,0 +15,0 @@ "module": "fesm2022/ng-ineers-file-viewer.mjs",

@@ -1,151 +0,24 @@

# Angular Document, Image, and Audio/Video Viewer Library
# NgIneersFileViewer
A versatile Angular library for viewing documents, images, and audio/video files directly within your Angular application. This library supports a variety of file types and offers customizable configurations.
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.3.0.
## Features
## Code scaffolding
- **Document Viewer:** Supports public and private documents using Google, Office, PDF, and Mammoth viewers.
- **Image Viewer:** Displays images with customizable buttons, zoom functionality, and keyboard navigation.
- **Audio/Video Viewer:** Simple and efficient way to embed and play audio or video files.
Run `ng generate component component-name --project ng-ineers-file-viewer` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ng-ineers-file-viewer`.
> Note: Don't forget to add `--project ng-ineers-file-viewer` or else it will be added to the default project in your `angular.json` file.
## Installation
## Build
Install the library via npm:
Run `ng build ng-ineers-file-viewer` to build the project. The build artifacts will be stored in the `dist/` directory.
```bash
npm install @mindbowser_inc/ng-ineers-file-viewer --save
```
## Publishing
Getting Started
After building your library with `ng build ng-ineers-file-viewer`, go to the dist folder `cd dist/ng-ineers-file-viewer` and run `npm publish`.
1. Import Modules
Add the necessary modules to your app module:
## Running unit tests
```bash
import { DocViewerModule, ImageViewerModule, AudioVideoViewer } from '@mindbowser_inc/ng-ineers-file-viewer';
Run `ng test ng-ineers-file-viewer` to execute the unit tests via [Karma](https://karma-runner.github.io).
@NgModule({
imports: [
DocViewerModule,
ImageViewerModule,
AudioVideoViewer
],
})
export class AppModule {}
```
## Further help
2. Usage
Document Viewer
To display a document:
```bash
<doc-viewer
[url]="docUrl"
viewer="google"
style="width:100%;height:50vh;">
</doc-viewer>
```
Inputs:
url: The document URL.
viewer: Choose from 'google' (default), 'office', 'mammoth', 'pdf', or 'url'.
Image Viewer
To display images:
```bash
<image-viewer [src]="imageUrls" [(index)]="currentIndex"></image-viewer>
```
Optional Configuration:
```bash
const config = {
btnClass: 'default',
zoomFactor: 0.1,
allowFullscreen: true,
allowKeyboardNavigation: true,
btnIcons: {
zoomIn: 'fa fa-plus',
zoomOut: 'fa fa-minus',
next: 'fa fa-arrow-right',
prev: 'fa fa-arrow-left',
fullscreen: 'fa fa-arrows-alt',
}
};
```
Audio/Video Viewer
To display audio:
```bash
<audio-video-viewer [url]="audioUrl" viewer="audio"></audio-video-viewer>
```
To display video:
```bash
<audio-video-viewer [url]="videoUrl" viewer="video"></audio-video-viewer>
```
## File Type Support
#### Public Document Viewer
#### Google Viewer:
Supports .doc, .docx, .xls, .xlsx, .ppt, .pptx, .pdf.
#### Office Viewer:
Supports .doc, .docx, .xls, .xlsx, .ppt, .pptx.
#### Image Viewer
Supports all standard image formats including .jpg, .jpeg, .png, .gif.
Audio/Video Viewer
#### Audio Video Viewer
Supports standard audio formats like .mp3, .wav and video formats like .mp4, .avi.
### Blob Support with Mammoth
For viewing .docx files from blobs using Mammoth, you can directly use the convertToHtml function integrated into the package.
For .docx files, install Mammoth:
```bash
npm install mammoth --save
```
Include mammoth.browser.min.js in angular.json:
```bash
"scripts": [
"node_modules/mammoth/mammoth.browser.min.js"
]
```
#### Example Usage:
```bash
<doc-viewer
viewer="mammoth"
[url]="blobUrl"
style="width:100%;height:50vh;">
</doc-viewer>
```
Custom Viewer Example
For external document viewers:
```bash
<doc-viewer
[viewerUrl]="'https://docs.google.com/gview?url=%URL%&embedded=true'"
[url]="'https://example.com/sample.doc'"
viewer="url"
style="width:100%;height:50vh;">
</doc-viewer>
```
Contributions
Contributions are welcome! Please open an issue or submit a pull request with your improvements or suggestions.
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc