Como utilizar el TemplateAngular

Obtener ultima version de

_TEMPLATES\TemplateAngular

Renombrar la carpeta (ej, Creditos)

editar los siguientes archivos y cambiar el nombre "programa1" por el del sitio (en este ejemplo, Creditos)

package.json
src\index.html
package-lock.json
angular.json


quitar los atributos readonly para poder compilarlo.

Eliminar ApplicationInsights Telemetry de todos los sitios web

Ejecutar como administrador IIS, y sobre el Default Web Site:

Quitar:

Módulos / ApplicationInsighsWebModule

Esta acción modifica los web.config de todas las aplicaciones web que esten en el Default Web Site:


Por lo tanto, deben estar sin readonly (pueden ocurrir errores por este tema)

Solucionar problema CORS en servicios asmx

Agregar en web.config lo siguiente:

<configuration>
       ....
       ....
       ....

<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="http://servidor-origen-habilitado"/>
<add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS"/>
<add name="Access-Control-Allow-Headers" value="Content-Type"/>
</customHeaders>
</httpProtocol>
</system.webServer>

</configuration>

Ej, si se quiere admitir que desde http://Xdesa:8080 se pueda llegar al servicio 'http://Xdesa/wsX/Seguridad.asmx/ExisteRolUsuario, poner lo siguiente:

<add name="Access-Control-Allow-Origin" value="http://Xdesa:8080"/>



(el error que da si no se agregan estas lineas es:
Access to XMLHttpRequest at ... from origin ... has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource)

Reactive form Error: formGroup expects a FormGroup instance. Please pass one in

Si da este error:

Error: formGroup expects a FormGroup instance. Please pass one in...

en el constructor, en la primer linea, inicializar el formulario:

ej:

    this.clienteForm = this.fb.group({
      id: [""],
      numero: new FormControl({value: null, disabled: false}),
      nombre: [""],
      direccion: [""],
      telefono: [""],
      email: [""],
      fechaNacimiento: [""]
    });


Si no se hace, por un tema de asincronia, trata de utilizar el form que aun no esta inicializado y da el error.

Reaper

Quitar el modo loop

En la pista del piano roll (la pista midi) darle F2 y ahi desactivar el modo loop

Configurar teclado MIDI

Conectar el teclado MIDI

Ctrl+p  / MIDI devices / ver el que esta DISABLED y darle click derecho y habilitarlo (tanto en input como en output)

Agregar una pista (doble click en la zona izquierda)

Armar la pista (circulo rojo)

Probar el teclado

Grabar

Armar track (circulo rojo en el track)
Presionar el circulo rojo que esta mas abajo (abajo de todas las pistas)
Luego de grabar, click en FX
Elegir un VSTi (ej, EVM Grand Piano) *** SI NO SE ELIGE UN VSTi NO SE OYE EL PLAYBACK!! ***
Para escuchar el sonido del teclado MIDI en Reaper: click en icono Record Monitoring (un icono con forma de parlante que esta en cada pista)

Para que se escuche el monitoreo en la interfaz Focusrite

1. En Option / Preferences / Device / Audio System = ASIO / ASIO Driver: Focusrite Scarlet ASIO

2. Crear pista (doble click a la izquierda)

3. En la pista elegir Input MIDI / USB midi cable / All channels

4. Activar el monitoreo (click en parlante que esta en la pista)

5. Click en Route / en midi channel output elegir USB midi cable

** SI NO APARECE EL BOTON ROUTE: Options / Layouts / Track Panel / B

6. En FX, elegir un instrumento (ej DSK Brass)

7. Armar la pista (click en circulo rojo)

Importacion de todos los modulos de Material

Para instalar angular material:

npm install --save @angular/material @angular/cdk
ng add @angular/material

Para no tener que importar todos los modulos material en cada pagina que se utilicen, se puede crear un modulo que tenga todas las definiciones y luego importar solamente ese:

1. Crear un archivo llamado material.module.ts y agregarle esto:

import { NgModule } from '@angular/core';

import { CommonModule } from '@angular/common';

import {MatCheckboxModule} from '@angular/material/checkbox';

import {MatButtonModule} from '@angular/material/button';

import {MatInputModule} from '@angular/material/input';

import {MatAutocompleteModule} from '@angular/material/autocomplete';

import {MatDatepickerModule} from '@angular/material/datepicker';

import {MatFormFieldModule} from '@angular/material/form-field';

import {MatNativeDateModule, MAT_DATE_LOCALE} from '@angular/material/core';

import {MatRadioModule} from '@angular/material/radio';

import {MatSelectModule} from '@angular/material/select';

import {MatSliderModule} from '@angular/material/slider';

import {MatSlideToggleModule} from '@angular/material/slide-toggle';

import {MatMenuModule} from '@angular/material/menu';

import {MatSidenavModule} from '@angular/material/sidenav';

import {MatToolbarModule} from '@angular/material/toolbar';

import {MatListModule} from '@angular/material/list';

import {MatGridListModule} from '@angular/material/grid-list';

import {MatCardModule} from '@angular/material/card';

import {MatStepperModule} from '@angular/material/stepper';

import {MatTabsModule} from '@angular/material/tabs';

import {MatExpansionModule} from '@angular/material/expansion';

import {MatButtonToggleModule} from '@angular/material/button-toggle';

import {MatChipsModule} from '@angular/material/chips';

import {MatIconModule} from '@angular/material/icon';

import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';

import {MatProgressBarModule} from '@angular/material/progress-bar';

import {MatDialogModule} from '@angular/material/dialog';

import {MatTooltipModule} from '@angular/material/tooltip';

import {MatSnackBarModule} from '@angular/material/snack-bar';

import {MatTableModule} from '@angular/material/table';

import {MatSortModule} from '@angular/material/sort';

import {MatPaginatorModule} from '@angular/material/paginator';

@NgModule({

  declarations: [],

  imports: [

    CommonModule,

    MatCheckboxModule,

    MatCheckboxModule,

    MatButtonModule,

    MatInputModule,

    MatAutocompleteModule,

    MatDatepickerModule,

    MatNativeDateModule,

    MatFormFieldModule,

    MatRadioModule,

    MatSelectModule,

    MatSliderModule,

    MatSlideToggleModule,

    MatMenuModule,

    MatSidenavModule,

    MatToolbarModule,

    MatListModule,

    MatGridListModule,

    MatCardModule,

    MatStepperModule,

    MatTabsModule,

    MatExpansionModule,

    MatButtonToggleModule,

    MatChipsModule,

    MatIconModule,

    MatProgressSpinnerModule,

    MatProgressBarModule,

    MatDialogModule,

    MatTooltipModule,

    MatSnackBarModule,

    MatTableModule,

    MatSortModule,

    MatPaginatorModule

  ],

  exports: [

    MatCheckboxModule,

    MatCheckboxModule,

    MatButtonModule,

    MatInputModule,

    MatAutocompleteModule,

    MatDatepickerModule,

    MatNativeDateModule,

    MatFormFieldModule,

    MatRadioModule,

    MatSelectModule,

    MatSliderModule,

    MatSlideToggleModule,

    MatMenuModule,

    MatSidenavModule,

    MatToolbarModule,

    MatListModule,

    MatGridListModule,

    MatCardModule,

    MatStepperModule,

    MatTabsModule,

    MatExpansionModule,

    MatButtonToggleModule,

    MatChipsModule,

    MatIconModule,

    MatProgressSpinnerModule,

    MatProgressBarModule,

    MatDialogModule,

    MatTooltipModule,

    MatSnackBarModule,

    MatTableModule,

    MatSortModule,

    MatPaginatorModule

  ],

  providers: [

    {provide: MAT_DATE_LOCALE, useValue: 'es-ES'},

  ],

})

export class MaterialModule { }

2. Para la pagina en la que se quiere utilizar material, en el archivo module (ej, home.module.ts) agregar:

import { MaterialModule } from '../_material/material.module';

y en imports:

MaterialModule

3. En home.page.html, agregar algo para testearlo:

<ion-content padding>

    <div style="text-align: center;">

        <mat-button-toggle-group name="fontStyle" aria-label="Font Style" class="example-full-width">

          <mat-button-toggle color="primary" value="opcion1">Opcion1</mat-button-toggle>

          <mat-button-toggle color="primary" value="opcion2">Opcion2</mat-button-toggle>    

        </mat-button-toggle-group>        

    </div>

    

    <div style="text-align: center;">

      <mat-form-field class="example-full-width">

        <input matInput placeholder="Nombre y apellido">

      </mat-form-field>  

    </div>

  

    <div style="text-align: center;">

      <mat-form-field class="example-full-width">

        <input matInput placeholder="Email">

      </mat-form-field>  

    </div>    

</ion-content>

Comprimir videos para whatsapp

App:
Smart Video Compressor and Resizer

Quitar fondo en imagenes complejas

1. Elegir pen tool\
2. Hacer click cada cierto tramo alrededor de la imagen
3. Luego de unir el punto final con el origen, hacer ctrl+z
4. Click derecho / make selection
5. Elegir el lazo
6. Click derecho / Layer via copy

Remover borde externo de imagenes recortadas con Photoshop CS6

agregar layer negro
rasterizar la imagen, y colocarla en el layer encima del fondo negro
select / all
click en rectangle marquee tool
click derecho / free transform
mover un poco la imagen
ctrl enter
select / modify / contract
1px
select / inverse
delete
ctrl+d

TypeError ionic firebase

npm install rxjs@6 rxjs-compat@6 --save

Subir archivos con Angular y WebApi

app.component.html

<form [formGroup]="form" (ngSubmit)="onSubmit()" class="form-horizontal form-control-sm">
  <div class="form-row">
    <label for="nombre" class="col-sm-1 control-label form-control-sm text-right">Nombre</label>
    <div class="col-sm-1">
      <input class="form-control form-control-sm" formControlName="nombre">
    </div>
  </div>

  <div class="form-row mb-2">
    <label for="foto" class="col-sm-1 control-label form-control-sm text-right">Foto</label>
    <div class="col-sm-3">
      <img src="./assets/noimage.png" id="previewFoto" name="previewFoto" style="width: 150px; height: 150px;cursor: pointer" onClick="document.getElementById('foto').click();"
      />
    </div>
    <input class="form-control form-control-sm" id="foto" type="file" accept=".xlsx" (change)="upload($event)"
      #fileInput style="display: none">
  </div>

  <input type="submit" value="Guardar" [disabled]="!form.valid" class="btn btn-primary col-sm-1">
</form>


app.component.ts

import { Component } from '@angular/core';
import { FormBuilder, FormGroup } from "@angular/forms";
import { DatosService } from './_servicios/datos.service';
import { Datos } from './_modelos/datos';
import { CustomResponse } from './_modelos/custom-response';
import { ResponseMessageCode } from './_servicios/enumerados';
//import { Archivo } from './_modelos/archivo';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  datos = new Datos();
  form: FormGroup;

  constructor(private fb: FormBuilder, private data : DatosService) {
    this.createForm();
  }

  createForm() {
    this.form = this.fb.group({     
  nombre: [''],
      foto: ['']
    });
  }

  upload(event) {
    this.onFileChange(event);
  }

  onFileChange(event) {
    if (event.target.files.length > 0) {
      let archivoSeleccionado = event.target.files[0];

      let reader = new FileReader();
      reader.readAsDataURL(archivoSeleccionado);
      let _this = this;

      reader.onloadend = function () {
        _this.form.patchValue({
          foto: (<string>reader.result).split('base64,')[1]
        });
      }
    }
  }

  onSubmit() {       
    this.datos.nombre = this.form.get('nombre').value;

    if (this.datos.contenido != 'undefined') {
      this.datos.contenido = this.form.get('foto').value;
    }

    this.data.guardar(this.datos).subscribe(
      (response: CustomResponse<any>) => {
        if (response.messageCode == ResponseMessageCode.OK) {
          console.log("todo ok");
        } else {
          console.log("mal");     
        }
      }
    );
  }

  ngOnInit() {
  }
}


app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  { path: 'home', component: AppComponent }
]

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpModule,
    HttpClientModule,
    FormsModule,
    ReactiveFormsModule,
    RouterModule.forRoot(routes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }



datos.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})

export class DatosService {
  constructor(public http: HttpClient) { }

  public guardar(datos): Observable<any> {
    return this.http.post<any>("http://localhost/servicios/api/creditos/subirarchivo", datos);
  }
}

custom-response.ts

export class CustomResponse<T> {
   messageCode: number;
   message: string;
   data: T;
}

datos.ts

export class Datos {
    nombre: string;
    contenido: string;
}


WebApi C#

[AllowAnonymous]
[OverrideAuthentication]
[HttpPost]
public IHttpActionResult SubirArchivo(Arch datos)
{
var path = System.Web.HttpContext.Current.Server.MapPath("~") + @"\xls\archivo.xlsx";
if (File.Exists(path))
File.Delete(path);

File.WriteAllBytes(path, datos.Contenido);

var mensaje = new { error = false, mensaje = "" };

return this.Ok(mensaje);
}

public class Arch
{
    [JsonProperty("nombre")]
    public string Nombre { get; set; }
    [JsonProperty("contenido")]
    public byte[] Contenido { get; set; }
}

no se puede cargar el archivo o ensamblado Microsoft.AI.Web...

Opcion 1:

Eliminar el contenido de la carpeta que se llame igual que el sitio que esta dando el problema, en esta carpeta (ej, si fuera el sitio creditos):

C:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files\creditos


Opción 2:

Instalar con NuGet:

Microsoft.ApplicationInsights (version 2.7.2)

y

Microsoft.ApplicationInsights.Web (version 2.7.2)

Este ultimo es el que contiene el archivo que resuelve el error: Microsoft.AI.Web.dll

Crear un paquete custom con NuGet

Ejemplo: crear un paquete para prueba.dll

mkdir c:\temp\prueba
mkdir c:\temp\prueba\lib
mkdir c:\temp\prueba\lib\net45

copy prueba.dll c:\temp\prueba\lib\net45

nuget spec prueba
nuget pack prueba.nuspec


<?xml version="1.0"?>
<package >
  <metadata>
    <id>prueba</id>
    <version>1.0.0</version>
    <authors>carusso</authors>
    <owners>carusso</owners>
    <requireLicenseAcceptance>false</requireLicenseAcceptance>
    <description>prueba</description>
    <releaseNotes></releaseNotes>
    <copyright></copyright>
    <tags></tags>
    <dependencies>
      <dependency id="SampleDependency" version="1.0" />
    </dependencies>
  </metadata>
</package>