Přidán základní prohlížeč

Numax-cz · Aug 19, 2022 · 6f8b1c4 · 6f8b1c4
1 parent 34a31ff
commit 6f8b1c4
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 4 deletions.
diff --git a/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.html b/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.html
@@ -1 +1,11 @@
-<p>browser works!</p>
+<section class="WindowContent ConsoleThemeFeraDark BackgroundColor BrowserView">
+  <div>
+    <input #input class="NapicuOSSimpleInput" [ngModel]="iframePath" (keydown.enter)="goToPage(input.value)">
+  </div>
+
+
+  <div class="BrowserIframe">
+    <iframe  [src]="iframePath | safe" title="Preview" ></iframe>
+  </div>
+
+</section>
diff --git a/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.scss b/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.scss
@@ -0,0 +1,20 @@
+.BackgroundColor {
+  background-color: var(--NapicuClassicDark2);
+}
+
+.BrowserView{
+  display: flex;
+  flex-direction: column;
+}
+
+.BrowserIframe{
+  width: 100%;
+  height: 100%;
+  iframe{
+    width: 100%;
+    height: 100%;
+    border: none;
+    outline: none;
+  }
+
+}
diff --git a/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.ts b/src/app/Sys/Systems/NapicuOS/Apps/browser/browser.component.ts
@@ -1,4 +1,14 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit, Pipe, PipeTransform} from '@angular/core';
+import {DomSanitizer} from "@angular/platform-browser";
+import {UrlChecker} from "../../scripts/UrlChecker";
+
+@Pipe({ name: 'safe' })
+export class SafePipe implements PipeTransform {
+  constructor(private sanitizer: DomSanitizer) { }
+  transform(url: string) {
+    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
+  }
+}
 
 @Component({
   selector: 'app-browser',
@@ -7,9 +17,19 @@ import { Component, OnInit } from '@angular/core';
 })
 export class BrowserComponent implements OnInit {
 
+  public iframePath: string = "https://google.com";
+  public pageHistory: string[] = [];
+
   constructor() { }
 
   ngOnInit(): void {
   }
 
+
+  public goToPage(url: string): void {
+    let u = UrlChecker(url);
+    this.pageHistory.push(u);
+    this.iframePath = u;
+  }
+
 }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -53,7 +53,7 @@ import {
 import {CounterInputComponent} from './Sys/Systems/NapicuOS/template/counter-input/counter-input.component';
 import { AppWindowComponent } from './Sys/Systems/NapicuOS/template/app-window/app-window.component';
 import { CalculatorComponent } from './Sys/Systems/NapicuOS/Apps/calculator/calculator.component';
-import { BrowserComponent } from './Sys/Systems/NapicuOS/Apps/browser/browser.component';
+import {BrowserComponent, SafePipe} from './Sys/Systems/NapicuOS/Apps/browser/browser.component';
 
 @NgModule({
   declarations: [
@@ -102,7 +102,8 @@ import { BrowserComponent } from './Sys/Systems/NapicuOS/Apps/browser/browser.co
     CounterInputComponent,
     AppWindowComponent,
     CalculatorComponent,
-    BrowserComponent
+    BrowserComponent,
+    SafePipe
   ],
   imports: [
     BrowserModule,