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

First usable version based on AngularJS 2! Almost no converters yet, though.

Browse source
This commit is contained in:
Manuel Friedli 2016-09-20 20:30:39 +02:00
parent 8acddfe548
commit 4197bca299
13 changed files with 155 additions and 66 deletions
Download patch file Download diff file Expand all files Collapse all files

41
app/InputcomponentmanagerService.ts Normal file
View file

@ -0,0 +1,41 @@
import {Injectable} from "@angular/core";
@Injectable()
export class InputcomponentmanagerService {
private components:any[] = [];
public constructor() {
}
public register(component:any):void {
this.components.push(component);
}
public getAllComponents():any[] {
return this.components;
}
public getNext(component:any):any {
let index:number = component.index;
if (index == this.components.length - 1) {
this.addComponent();
}
return this.components[index + 1];
}
public getFirst():any {
if (this.components.length == 0) {
this.addComponent();
}
return this.components[0];
}
private addComponent():void {
this.register({
content: "",
selectedConverter: undefined,
index: this.components.length,
error: false,
message: ""
});
}
}

10
app/app.component.html
View file

@ -1,3 +1,9 @@
<div>
<den-inputarea></den-inputarea>
<div *ngFor="let step of steps" class="wrapper">
<textarea class="input" (change)="update(step)" placeholder="Please enter your input ..."
[(ngModel)]="step.content">{{step.content}}</textarea>
<select class="conversion" (change)="convert(step, $event)">
<option id="-1">Select conversion ...</option>
<option *ngFor="let c of converters" id="{{c.getId()}}">{{c.getDisplayname()}}</option>
</select>
<div class="message" *ngIf="step.error">{{step.message}}</div>
</div>

53
app/app.component.ts
View file

@ -1,26 +1,57 @@
import {Component} from "@angular/core";
import {OnInit}from "@angular/core";
import {Component, OnInit} from "@angular/core";
import {ConverterregistryService} from "./converterregistry.service";
import {Converter} from "./converter";
import {InputcomponentmanagerService} from "./InputcomponentmanagerService";
import {Converter} from "./converter/converter";
@Component({
moduleId: module.id,
selector: "den-app",
templateUrl: "app.component.html",
styleUrls: ["app.component.css"],
providers: [ConverterregistryService]
providers: [ConverterregistryService, InputcomponentmanagerService]
})
export class AppComponent extends OnInit {
constructor(private converterregistryService:ConverterregistryService) {
public steps:any[] = [];
public converters:Converter[] = [];
constructor(private converterregistryService:ConverterregistryService, private inputcomponentmanagerService:InputcomponentmanagerService) {
super();
}
ngOnInit():void {
let converters:Converter[] = this.converterregistryService.getConverters();
console.log("Number of registered converters: " + converters.length);
for (let i = 0; i < converters.length; i++) {
console.log("Converter " + converters[i].getId() + ": " + converters[i].getDisplayname());
convert(step:any, $event:any):void {
step.selectedConverter = this.converterregistryService.getConverter($event.target.selectedOptions[0].id);
this.update(step);
}
update(step:any):void {
let converter:Converter = step.selectedConverter;
if (converter !== undefined) {
let content:string = step.content;
let result:string;
try {
result = converter.convert(content);
} catch (error) {
result = null;
}
if (result === null) {
step.message = "Error converting. Not applicable?";
step.error = true;
} else {
step.message = "";
step.error = false;
if (result !== "") {
let nextComponent:any = this.inputcomponentmanagerService.getNext(step);
nextComponent.content = result;
this.update(nextComponent);
}
}
}
}
ngOnInit():void {
this.converters = this.converterregistryService.getAllConverters();
this.steps = this.inputcomponentmanagerService.getAllComponents();
this.inputcomponentmanagerService.getFirst();
}
}

9
app/app.module.ts
View file

@ -1,8 +1,7 @@
import {NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import {FormsModule} from '@angular/forms'
import {AppComponent} from './app.component'
import {NgModule} from "@angular/core";
import {BrowserModule} from "@angular/platform-browser";
import {FormsModule} from "@angular/forms";
import {AppComponent} from "./app.component";
import {InputareaComponent} from "./inputarea.component";
@NgModule({

2
app/base64decoder.ts → app/converter/base64decoder.ts
View file

@ -1,4 +1,4 @@
import {Converter} from './converter';
import {Converter} from "./converter";
export class Base64Decoder implements Converter {
getDisplayname():string {

2
app/base64encoder.ts → app/converter/base64encoder.ts
View file

@ -1,4 +1,4 @@
import {Converter} from './converter';
import {Converter} from "./converter";
export class Base64Encoder implements Converter {
getDisplayname():string {

0
app/converter.ts → app/converter/converter.ts
View file

11
app/converterregistry.service.ts
View file

@ -1,8 +1,7 @@
import {Injectable} from '@angular/core';
import {Converter} from './converter';
import {Base64Encoder} from "./base64encoder";
import {Base64Decoder} from "./base64decoder";
import {Injectable} from "@angular/core";
import {Converter} from "./converter/converter";
import {Base64Encoder} from "./converter/base64encoder";
import {Base64Decoder} from "./converter/base64decoder";
@Injectable()
export class ConverterregistryService {
@ -12,7 +11,7 @@ export class ConverterregistryService {
this.init();
}
public getConverters():Converter[] {
public getAllConverters():Converter[] {
return this.converters;
}

23
app/inputarea.component.html
View file

@ -1,8 +1,15 @@
<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>
<!--<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>-->
<textarea class="input" (change)="update()" placeholder="Please enter your input ..."
[(ngModel)]="content">{{content}}</textarea>
<select class="conversion" (change)="convert($event)">
<option id="-1">Select conversion ...</option>
<option *ngFor="let c of converters" id="{{c.getId()}}">{{c.getDisplayname()}}</option>
</select>

61
app/inputarea.component.ts
View file

@ -1,6 +1,7 @@
import {Component} from "@angular/core";
import {ConversionInput} from "./conversioninput";
import {ConversionType} from "./conversiontype";
import {Component, OnInit} from "@angular/core";
import {ConverterregistryService} from "./converterregistry.service";
import {Converter} from "./converter/converter";
import {InputcomponentmanagerService} from "./InputcomponentmanagerService";
@Component({
@ -9,40 +10,38 @@ import {ConversionType} from "./conversiontype";
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;
export class InputareaComponent extends OnInit {
public converters:Converter[] = [];
public content:string = '';
private selectedConverter:Converter;
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);
constructor(private converterregistryService:ConverterregistryService, private inputcomponentmanagerService:InputcomponentmanagerService) {
super();
}
public convert(e):void {
this.conversion.type = ConversionType.of(+e.target.selectedOptions[0].id);
console.log(this.conversion.type);
switch (this.conversion.type) {
case ConversionType.DECODE_BASE64:
this.conversion.content = "Base64 decode";
break;
case ConversionType.ENCODE_BASE64:
this.conversion.content = "Base64 encode";
break;
default:
this.conversion.content = "Unknown: " + this.conversion.type;
break;
this.selectedConverter = this.converterregistryService.getConverter(e.target.selectedOptions[0].id);
this.update();
}
public update():void {
if (this.selectedConverter !== undefined) {
let result:string = this.selectedConverter.convert(this.content);
let nextComponent:InputareaComponent = this.inputcomponentmanagerService.getNext(this);
if (nextComponent !== undefined) {
nextComponent.setContent(result);
}
}
}
public setIndex(index:number):void {
this.index = index;
public setContent(content:string):void {
this.content = content;
this.update();
}
ngOnInit():void {
this.converters = this.converterregistryService.getAllConverters();
this.selectedConverter = undefined;
this.inputcomponentmanagerService.register(this);
}
}

1
app/main.ts
View file

@ -1,5 +1,4 @@
import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
import {AppModule} from "./app.module";
platformBrowserDynamic().bootstrapModule(AppModule);