diff options
Diffstat (limited to 'sandbox/test-projekat-danijel/frontend/src/app/page-one')
4 files changed, 87 insertions, 0 deletions
diff --git a/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.css b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.css diff --git a/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.html b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.html new file mode 100644 index 00000000..5c8527f9 --- /dev/null +++ b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.html @@ -0,0 +1,26 @@ +<div style="display: flex; flex-direction: row;"> + <div> + <label for="red">CRVENA</label> + <br> + <input type="number" min="0" max="255" [(ngModel)]="red" name="red"> + </div> + <div> + <label for="green">ZELENA</label> + <br> + <input type="number" min="0" max="255" [(ngModel)]="green" name="green"> + </div> + <div> + <label for="blue">PLAVA</label> + <br> + <input type="number" min="0" max="255" [(ngModel)]="blue" name="blue"> + </div> +</div> +<button type="button" (click)="submit()" [style.backgroundColor]="'rgb('+red+','+green+','+blue+')'" + [style.color]="(red+green+blue>255*1.5 ? '#000':'#fff')"> + DODAJ BOJU +</button> +<br><br> +<div [style.backgroundColor]="color" style="width: 200px; height: 40px;"></div> + +<br> +<button type="button" (click)="goToColors()">POGLEDAJ BOJE</button>
\ No newline at end of file diff --git a/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.spec.ts b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.spec.ts new file mode 100644 index 00000000..9270aeda --- /dev/null +++ b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PageOneComponent } from './page-one.component'; + +describe('PageOneComponent', () => { + let component: PageOneComponent; + let fixture: ComponentFixture<PageOneComponent>; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ PageOneComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(PageOneComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.ts b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.ts new file mode 100644 index 00000000..93964644 --- /dev/null +++ b/sandbox/test-projekat-danijel/frontend/src/app/page-one/page-one.component.ts @@ -0,0 +1,36 @@ +import { Component, OnInit } from '@angular/core'; +import { ValuesService } from '../values.service'; +import { NgModel } from '@angular/forms'; +import { Router } from '@angular/router'; + +@Component({ + selector: 'app-page-one', + templateUrl: './page-one.component.html', + styleUrls: ['./page-one.component.css'] +}) +export class PageOneComponent implements OnInit { + + red: number = 255; + green: number = 255; + blue: number = 255; + + color = '#ffffff'; + + constructor(private values: ValuesService, private router: Router) { } + + ngOnInit(): void { + } + + submit() { + console.log(this.red + ':' + this.green + ':' + this.blue); + this.values.addColor(this.red, this.green, this.blue).subscribe((color) => { + console.log(color); + this.color = color; + }) + } + + goToColors() { + this.router.navigate(['boje']) + } + +} |