manuel/converter
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

externalized templates and styles (styles are still empty)

Browse source
This commit is contained in:
Manuel Friedli 2016-09-15 12:55:13 +02:00
parent 0cf6eeaedf
commit dd4ffd9989
7 changed files with 25 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

0
app/app.component.css Normal file
View file

3
app/app.component.html Normal file
View file

@ -0,0 +1,3 @@
<div>
<den-inputarea></den-inputarea>
</div>

8
app/app.component.ts
View file

@ -5,12 +5,10 @@ import {InputareaComponent} from "./inputarea.component";
//import { SelectorComponent } from "./selector.component";
@Component({
moduleId: module.id,
selector: "den-app",
template: `
<div>
<den-inputarea></den-inputarea>
</div>
`
templateUrl: "app.component.html",
styleUrls: ["app.component.css"]
})
export class AppComponent {
// private inputAreas:InputareaComponent[] = [];

2
app/conversioninput.ts
View file

@ -1,4 +1,4 @@
import { ConversionType} from "./conversiontype";
import {ConversionType} from "./conversiontype";
export class ConversionInput {
public content:string;

0
app/inputarea.component.css Normal file
View file

8
app/inputarea.component.html Normal file
View file

@ -0,0 +1,8 @@
<div id="wrapper-{{index}}" class="wrapper">
<textarea id="input-{{index}}" class="input" (change)="update()" placeholder="Please enter your input ..."
[(ngModel)]="conversion.content">{{conversion.content}}</textarea>
<select id="type-{{index}}" class="conversion" (change)="convert($event)">
<option id="-1">Select conversion ...</option>
<option *ngFor="let c of conversions" id="{{c}}">Type {{ConversionType[c]}}</option>
</select>
</div>

26
app/inputarea.component.ts
View file

@ -1,37 +1,31 @@
import { Component } from "@angular/core";
import { ConversionInput } from "./conversioninput";
import { ConversionType } from "./conversiontype";
import {Component} from "@angular/core";
import {ConversionInput} from "./conversioninput";
import {ConversionType} from "./conversiontype";
@Component({
moduleId: module.id,
selector: "den-inputarea",
template: `
<div id="wrapper-{{index}}" class="wrapper">
<textarea id="input-{{index}}" class="input" (change)="update()" placeholder="Please enter your input ..." [(ngModel)]="conversion.content">{{conversion.content}}</textarea>
<select id="type-{{index}}" class="conversion" (change)="convert($event)">
<option id="-1">Select conversion ...</option>
<option *ngFor="let c of conversions" id="{{c}}">Type {{ConversionType[c]}}</option>
</select>
</div>
`
templateUrl: "inputarea.component.html",
styleUrls: ["inputarea.component.css"]
})
export class InputareaComponent {
public index:number = 0;
public conversions:ConversionType[] = [ConversionType.ENCODE_BASE64, ConversionType.DECODE_BASE64];
private conversion:ConversionInput;
private ConversionType:ConversionType = ConversionType;
constructor() {
console.log("Aloha, " + this.index);
this.conversion = new ConversionInput();
this.conversion.content = "";
this.conversion.type = ConversionType.DECODE_BASE64;
}
public update():void {
console.log(this.conversion.content);
}
public convert(e):void {
this.conversion.type = ConversionType.of(+e.target.selectedOptions[0].id);
console.log(this.conversion.type);
@ -47,7 +41,7 @@ export class InputareaComponent {
break;
}
}
public setIndex(index:number):void {
this.index = index;
}