@guajiritos/image-picker 0.0.6 → 0.0.8

package/README.md

@@ -1,37 +1,39 @@
-# Guajiritos Image Picker
+# Guachos Image Picker
 
-Biblioteca angular basada en componentes de material angular para la selección, edición y compresión de imágenes en formatos png, jpeg, webp.
+Angular library based on angular material components for the selection, edition and compression of images in png, jpeg, webp formats
+This library was generated with Angular CLI version 13.1.3, and support until angular version 10.0.2 to the latest version of angular.
 
 ### Description
 
-En muchos proyectos interesa subir y editar imágenes, y en ocasiones tenemos que consultar otros programas para la compresión de imágenes y el cambio de formato para mejorar el rendimiento de la página. Con `Guajiritos Image Picker` esto es posible en tiempo real con cada imagen que quieras subir.
+In many projects it is of interest to upload and edit images, and sometimes we have to consult other programs for the compression of images and the change of format to improve the performance of the page. With `GuachosImagePicker` this is possible in real time with for each image that you want to upload.
 
 ### Installation
 
 Using `npm`
 
 ```sh
-npm i @guajiritos/image-picker --save
+npm i guachos-image-picker --save
 ```
 Using `yarn`
 
 ```sh
-yarn add @guajiritos/image-picker
+yarn add guachos-image-picker
 ```
 
-`Guajiritos Image Picker` require [Angular Material](https://material.angular.io/guide/getting-started/).
+`GuachosImagePicker` requires [Angular Material](https://material.angular.io/guide/getting-started/).
+version 10.0.1 or higher
 
 ```sh
 ng add @angular/material
 ```
 
-La importación de `BrowserAnimationsModule` a su aplicación habilita el sistema de animación de Angular. Rechazar esto deshabilitará la mayoría de las animaciones de Angular Material.
-### External Resource
+Importing the BrowserAnimationsModule into your application enables Angular's animation system. Declining this will disable most of Angular Material's animations.
 
-`Guajiritos Image Picker` usa `resize-observer`, para la funcionalidad de recortar imágenes. Se utiliza la API de observador de cambio de tamaño
-la interfaz de cambio de tamaño del observador informa de los cambios en las dimensiones del contenido de un Elemento o del cuadro de borde, o del cuadro delimitador de un SVGElement.
+### External Resource
 
-Instala la librería
+`GuachosImagePicker` use `resize-observer`, for the functionality of cropping images. The resize observer api is used
+the resize observer interface reports changes to the dimensions of an Element's content or border box, or the bounding box of an SVGElement.
+Install the package
 
 Using `npm`
 
@@ -46,30 +48,27 @@ yarn add resize-observer
 
 ### Usages
 
-Debes importar el módulo `Guajiritos Image Picker` donde lo usarás y usar el componente.
+You must import the module `GuachosImagePicker` where you will use it and use the component
 
-```ts
-import { GuajiritosImagePicker } from '@guajiritos/image-picker';
+```typescript
+import { GuachosImagePickerModule } from 'guachos-image-picker';
 
 @NgModule({
-  ...
   imports: [
-    ...
-    GuajiritosImagePicker,
-    ...
-  ]
+    GuachosImagePickerModule
+  ],
 })
 ```
 
 In your component:
 
 ```html
-<guajiritos-image-picker [_config]="imagePickerConf" ($imageChanged)="onImageChange($event)"></guajiritos-image-picker>
+<guachos-image-picker [_config]="imagePickerConf" ($imageChanged)="onImageChange($event)"></guachos-image-picker>
 ```
 
-En el componente .ts
+In .ts file
 
-```ts
+```typescript
 export class ExampleComponent {
   imagePickerConf: ImagePickerConf = {
     borderRadius: '4px',
@@ -80,9 +79,9 @@ export class ExampleComponent {
 }
 ```
 
-### Aquí hay un ejemplo con diferentes configuraciones.
+### Here is an example with different configurations
 
-```ts
+```typescript
 export class ExampleComponent {
   config1: ImagePickerConf = {
     borderRadius: '16px',
@@ -103,21 +102,21 @@ export class ExampleComponent {
 ```
 
 ```html
-<h2>Uso básico</h2>
-<guajiritos-image-picker [_config]="config1"></guajiritos-image-picker>
+<h2>Basic usage</h2>
+<guachos-image-picker [_config]="config1"></guachos-image-picker>
 <br />
-<h2>Configuración personalizada</h2>
-<guajiritos-image-picker [_config]="config2"></guajiritos-image-picker>
+<h2>Custom config</h2>
+<guachos-image-picker [_config]="config2"></guachos-image-picker>
 <br />
-<h2>Imagen inicial</h2>
-<guajiritos-image-picker [_imageSrc]="initialImage" ($imageChanged)="onImageChanged($event)" [_config]="config3"></guajiritos-image-picker>
+<h2>Initial Image</h2>
+<guachos-image-picker [_imageSrc]="initialImage" ($imageChanged)="onImageChanged($event)" [_config]="config3"> </guachos-image-picker>
 ```
 
-### Más sobre el componente
+### More about the component
 
-El componente `Guajiritos Image Picker` tiene una configuración para cambiar el ancho y largo de la imagen cargada. Además del idioma (solo 'es' y 'en'). También tiene una opción de compresión inicial que por defecto es true. La interfaz se ve así:
+The `GuachosImagePicker` component has a setting to change the width and length of the loaded image. In addition to the language (only 'es' and 'en'). It also has an initial compression option that by default is true. The interface looks like this:
 
-```ts
+```typescript
 export interface ImagePickerConf {
   width?: string;
   height?: string;
@@ -127,14 +126,15 @@ export interface ImagePickerConf {
 }
 ```
 
-### Panel de edición
-
-Una vez que haya seleccionado una imagen, se habilitarán tres botones debajo de la imagen:
+### Editing panel
 
+Once you have selected an image, three buttons are enabled below the image:
 ```text
-1- Cargar una nueva imagen.
-2- Abrir el panel de edición.
-3- Descargar la imagen.
+1- Load a new image.
+2- Open the editing panel.
+3- DOWNLOAD.
 ```
 
-En el panel de edición, puede cambiar la relación de calidad para comprimir el tamaño del archivo (en kb). También se puede seleccionar el cambio de ancho y alto en px manteniendo la relación de aspecto o no. Puede cambiar el formato de la imagen como desee, las opciones son 'png', 'webp', 'jpeg'. El formato 'Png' no se ve afectado por cambiar la relación de calidad.
+
+In the edit panel, you can change the quality ratio to compress the file size (in kb). Also changing width and height in px keeping aspect ratio or not, is selectable. You can change the image format as you wish, the options are 'png', 'webp','jpeg'. The 'Png' format is not affected by changing the quality ratio.
+