- article works! -
+ +
+ Cavallium.it
+ diff --git a/src/app/gui/big-logo/big-logo.component.scss b/src/app/gui/big-logo/big-logo.component.scss new file mode 100644 index 0000000..5ade9cb --- /dev/null +++ b/src/app/gui/big-logo/big-logo.component.scss @@ -0,0 +1,48 @@ +@import "../../../styles-variables.scss"; +:host { + display: block; + background-color: $color-main; + color: white; + text-align: center; + position: relative; + user-select: none; + z-index: 1002; + overflow: hidden; +} +:host:after, :host:before { + content: ""; + display: flex; + clear: both; +} +a { + color: inherit; + text-decoration: none; + display: flex; + justify-content: center; + align-items: center; + margin: -0.5rem; + padding-top: 3rem; + padding-bottom: 2.5rem; + font-size: 1.5rem; +} +h1 { + margin: 0; +} +a > * { + margin: 0.5rem; +} +img { + height: 5rem; +} + +@media screen and (max-width: $mobile-mode-size) { + a { + flex-direction: column; + padding-top: 1rem; + padding-bottom: 0.5rem; + font-size: 1rem; + } + img { + height: 4rem; + } +} diff --git a/src/app/gui/big-logo/big-logo.component.spec.ts b/src/app/gui/big-logo/big-logo.component.spec.ts new file mode 100644 index 0000000..ca0b622 --- /dev/null +++ b/src/app/gui/big-logo/big-logo.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BigLogoComponent } from './big-logo.component'; + +describe('BigLogoComponent', () => { + let component: BigLogoComponent; + let fixture: ComponentFixture
-
-
-Big Logo
-
-
-
-
-
-
-
- ;
+ @ViewChild("navbuttons") navButtons: ElementRef;
- constructor() { }
+ constructor(private elRef: ElementRef, public currentDocument: CurrentDocumentService) { }
ngOnInit() {
+ // TODO: fare la parte dei percorsi preselezionati
}
+ ngAfterViewInit() {
+ setTimeout(() => {
+ this.updateSticked();
+ this.updateSize();
+ });
+ }
+
+ @Input()
+ public onParentScroll(event: Event) {
+ this.updateSticked();
+ }
+
+ private updateSticked() {
+ this.stickedOnTop = this.elRef.nativeElement.getBoundingClientRect().top <= 0;
+ }
+
+ private updateSize() {
+ if (this.overflowLogo === false
+ && (this.navButtons.nativeElement.offsetWidth + this.navLogo.nativeElement.offsetWidth) > this.elRef.nativeElement.offsetWidth) {
+ this.overflowLogo = true;
+ } else if (this.overflowLogo === true
+ && this.navButtons.nativeElement.offsetWidth + this.navLogo.nativeElement.offsetWidth < this.elRef.nativeElement.offsetWidth - 30) {
+ this.overflowLogo = false;
+ }
+ if (this.overflowMax === false
+ && this.navButtons.nativeElement.offsetWidth > this.elRef.nativeElement.offsetWidth) {
+ this.overflowMax = true;
+ } else if (this.overflowMax === true
+ && this.navButtons.nativeElement.offsetWidth < this.elRef.nativeElement.offsetWidth) {
+ this.overflowMax = false;
+ }
+ }
+
+ @HostListener("window:resize", ["$event"])
+ handleResize(event: Event) {
+ this.updateSize();
+ }
}
diff --git a/src/app/services/current-document.service.spec.ts b/src/app/services/current-document.service.spec.ts
new file mode 100644
index 0000000..7e26a7e
--- /dev/null
+++ b/src/app/services/current-document.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { CurrentDocumentService } from './current-document.service';
+
+describe('CurrentDocumentService', () => {
+ beforeEach(() => TestBed.configureTestingModule({}));
+
+ it('should be created', () => {
+ const service: CurrentDocumentService = TestBed.get(CurrentDocumentService);
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/src/app/services/current-document.service.ts b/src/app/services/current-document.service.ts
new file mode 100644
index 0000000..5f6adbb
--- /dev/null
+++ b/src/app/services/current-document.service.ts
@@ -0,0 +1,21 @@
+import { Injectable } from "@angular/core";
+import { Observable, BehaviorSubject } from "rxjs";
+import { DocumentData } from "../symbols/DocumentData";
+
+@Injectable({
+ providedIn: "root"
+})
+export class CurrentDocumentService {
+
+ private documentSubject = new BehaviorSubject(null);
+
+ constructor() { }
+
+ public onDocumentChange(): Observable {
+ return this.documentSubject.asObservable();
+ }
+
+ public setCurrentDocument(data: DocumentData) {
+ this.documentSubject.next(data);
+ }
+}
diff --git a/src/app/services/document-fetch.service.ts b/src/app/services/document-fetch.service.ts
index ced52d9..84725b7 100644
--- a/src/app/services/document-fetch.service.ts
+++ b/src/app/services/document-fetch.service.ts
@@ -1,44 +1,64 @@
import { Injectable } from "@angular/core";
-import { Observable } from "rxjs";
import { DocumentData } from "../symbols/DocumentData";
-import { HttpClient, Request, Response } from "selenium-webdriver/http";
-import { encodeUriSegment } from "@angular/router/src/url_tree";
+import { HttpClient } from "@angular/common/http";
+import { take } from "rxjs/operators";
@Injectable({
providedIn: "root"
})
export class DocumentFetchService {
+ private language: string;
- constructor(private http: HttpClient) {}
+ constructor(private http: HttpClient) {
+ this.language = document.body.parentElement.lang;
+ }
public async fetch(unsafeId: string): Promise {
const encodedId = this.encodeId(unsafeId);
- const response: Response = await this.http.send(new Request("GET", "/documents/" + encodedId + ".md"));
- if (response.status === 200) {
- return {
- found: true,
- id: encodedId,
- content: await response.body
- };
+ try {
+ return await this.fetchWithLanguage(encodedId, this.language);
+ } catch (e) {
+ try {
+ return await this.fetchWithLanguage(encodedId, "en");
+ } catch (e) {
+ return {
+ found: false,
+ id: encodedId,
+ content: await this.fetchErrorContent(404)
+ };
+ }
}
+ }
+
+ private async fetchWithLanguage(unsafeId: string, language: string): Promise {
+ const encodedId = this.encodeId(unsafeId);
+ const response: string = await this.http.get("/documents/" + encodedId + "." + language + ".md", { responseType: "text" })
+ .pipe(take(1)).toPromise();
return {
- found: false,
+ found: true,
id: encodedId,
- content: await this.fetchErrorContent(404)
+ content: await response
};
}
public async fetchErrorContent(errorCode: number): Promise {
if (errorCode > 0 && errorCode <= 700) {
- const response: Response = await this.http.send(new Request("GET", "/documents/" + errorCode + ".md"));
- if (response.status === 200) {
- return await response.body;
+ try {
+ const response: string = await this.http.get("/documents/" + errorCode + "." + this.language + ".md", { responseType: "text" })
+ .pipe(take(1)).toPromise();
+ return response;
+ } catch (e) {
}
}
return "Error " + errorCode + ".";
}
private encodeId(id: string): string {
- return id.split("/").map(encodeUriSegment).filter((part) => part !== "." && part !== "..").join("/");
+ const encoded = id.split("/").map(encodeURIComponent).filter((part) => part.length > 0 && part !== "." && part !== "..").join("/");
+ if (encoded.length > 0) {
+ return encoded;
+ } else {
+ return "index";
+ }
}
}
diff --git a/src/assets/drone.min.svg b/src/assets/drone.min.svg
new file mode 100644
index 0000000..1574838
--- /dev/null
+++ b/src/assets/drone.min.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/documents/404.en.md b/src/documents/404.en.md
new file mode 100644
index 0000000..c285f07
--- /dev/null
+++ b/src/documents/404.en.md
@@ -0,0 +1,3 @@
+# 404 Error
+
+## Page not found
diff --git a/src/documents/404.it.md b/src/documents/404.it.md
new file mode 100644
index 0000000..f483630
--- /dev/null
+++ b/src/documents/404.it.md
@@ -0,0 +1,3 @@
+# Errore 404
+
+## Pagina non trovata
diff --git a/src/documents/index.en.md b/src/documents/index.en.md
new file mode 100644
index 0000000..8731030
--- /dev/null
+++ b/src/documents/index.en.md
@@ -0,0 +1,5 @@
+# Welcome to Cavallium.it
+
+This page is a test.
+
+**Bold.** *Cantami o diva del pelide achille l'ira funesta che infiniti addusse lutti agli achei.*
\ No newline at end of file
diff --git a/src/documents/index.it.md b/src/documents/index.it.md
new file mode 100644
index 0000000..e7f1350
--- /dev/null
+++ b/src/documents/index.it.md
@@ -0,0 +1,5 @@
+# Benvenuto in Cavallium.it
+
+Questa pagina รจ una prova.
+
+**Prova in grassetto.** *Cantami o diva del pelide achille l'ira funesta che infiniti addusse lutti agli achei.*
\ No newline at end of file
diff --git a/src/documents/software.en.md b/src/documents/software.en.md
new file mode 100644
index 0000000..281106d
--- /dev/null
+++ b/src/documents/software.en.md
@@ -0,0 +1,29 @@
+# LG G2 Cardboard fix
+
+## Fixing the double vision on your LG G2 using Cardboard
+
+### When this problem occurs
+
+If you have installed a custom rom on your LG G2 probably the DPI setting has changed.
+The DPI setting is used to calculate the pixel density, and consequently the real measures of your screen. Google Cardboard calculates the distance between eyes using the DPI setting, and if it's wrong some apps using the old CardBoard SDK don't show properly.
+
+#### Here's an example
+
+With 480 DPI (CyanogenMod default setting)
+*same length in inches:* 4 + +With 424 DPI (LG G2 real DPI)
+*same length in inches:* 3 + +### How to fix it + +Please choose the method that you prefer + +#### Method 1 + +***Fixing the problem for some apps, keeping your current DPI setting.*** + +1. Open Cardboard app +2. Tap **Settings** +3. Tap **Change** +4. Scan with your camera this QR-Code:
[warning]WARNING: If you do this you can't go back to the default settings![warning] \ No newline at end of file diff --git a/src/documents/software.it.md b/src/documents/software.it.md new file mode 100644 index 0000000..b9ffc32 --- /dev/null +++ b/src/documents/software.it.md @@ -0,0 +1,55 @@ +# LG G2 Cardboard fix + +## Fixing the double vision on your LG G2 using Cardboard + +### When this problem occurs + +If you have installed a custom rom on your LG G2 probably the DPI setting has changed. +The DPI setting is used to calculate the pixel density, and consequently the real measures of your screen. Google Cardboard calculates the distance between eyes using the DPI setting, and if it's wrong some apps using the old CardBoard SDK don't show properly. + +#### Here's an example + +With 480 DPI (CyanogenMod default setting)
+*same length in inches:* 4 + +With 424 DPI (LG G2 real DPI)
+*same length in inches:* 3 + +### How to fix it + +Please choose the method that you prefer + +#### Method 1 + +***Fixing the problem for some apps, keeping your current DPI setting.*** + +1. Open Cardboard app +2. Tap **Settings** +3. Tap **Change** +4. Scan with your camera this QR-Code:
[warning]WARNING: If you do this you can't go back to the default settings![warning] + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/src/documents/software/midi23d.en.md b/src/documents/software/midi23d.en.md new file mode 100644 index 0000000..82a2752 --- /dev/null +++ b/src/documents/software/midi23d.en.md @@ -0,0 +1,3 @@ +# Midi23D + +This is a test page \ No newline at end of file diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts index 3612073..8b7239d 100644 --- a/src/environments/environment.prod.ts +++ b/src/environments/environment.prod.ts @@ -1,3 +1,3 @@ export const environment = { - production: true + production: true }; diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 7b4f817..c5a517a 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -3,7 +3,7 @@ // The list of file replacements can be found in `angular.json`. export const environment = { - production: false + production: false }; /* diff --git a/src/index.html b/src/index.html index 7516355..9b1c283 100644 --- a/src/index.html +++ b/src/index.html @@ -1,8 +1,8 @@ - + -CavalliumWebsite
+ Cavallium.it
-
-
- - {{link.text}} - {{link.text}} - -
+ Cavallium.it
+
+
+
\ No newline at end of file
diff --git a/src/app/gui/navbar/navbar.component.scss b/src/app/gui/navbar/navbar.component.scss
index e69de29..8dbcb16 100644
--- a/src/app/gui/navbar/navbar.component.scss
+++ b/src/app/gui/navbar/navbar.component.scss
@@ -0,0 +1,123 @@
+@import "../../../styles-variables";
+:host {
+ position: sticky;
+ top: 0;
+ overflow: initial;
+ display: block;
+ background-color: $color-main;
+ color: white;
+ z-index: 1001;
+}
+.shadow-container {
+ overflow-x: hidden;
+ display: flex;
+ box-shadow: 0 -2rem 2rem 2rem transparent;
+ transition: box-shadow ease-in-out 0.2s;
+}
+.shadow-container.overflow {
+ overflow-x: scroll;
+ -ms-overflow-style: none; // IE 10+
+ scrollbar-width: none; // Firefox
+ justify-content: center;
+}
+.shadow-container.overflow.overflow-max {
+ justify-content: flex-start;
+}
+.shadow-container.overflow::-webkit-scrollbar {
+ display: none; // Safari and Chrome
+}
+.shadow-container.sticked {
+ box-shadow: 0 -2rem 2rem 2rem #0000006e;
+}
+:host:after, :host:before {
+ content: "";
+ display: flex;
+ clear: both;
+}
+.header-logo, .header-logo-space {
+ padding: 1rem 0rem;
+ text-align: right;
+ vertical-align: middle;
+ flex: 0 0 6.2rem;
+ opacity: 0;
+ pointer-events: none;
+ user-select: none;
+ position: relative;
+ top: -5rem;
+ color: inherit;
+ text-decoration: none;
+ transition: opacity ease-in-out 0.4s, top ease-in-out 0s 0.4s;
+}
+.header-logo.visible {
+ opacity: 1;
+ pointer-events: initial;
+ font-size: initial;
+ top: 0;
+ transition: opacity ease-in-out 0.3s, top ease-in-out 0.3s;
+}
+.header-logo-space {
+ flex: 0 1 6rem;
+}
+.header-logo.overflow, .header-logo-space.overflow {
+ position: fixed;
+ top: 0;
+ visibility: hidden;
+ pointer-events: none;
+}
+.header-nav {
+ flex: 1 0 auto;
+}
+.header-nav.overflow {
+ flex: 0 0 auto;
+}
+.header-nav.overflow-max {
+ padding-right: 1.5rem;
+}
+.header-nav a {
+ color: inherit;
+ text-decoration: none;
+ flex: 1 1 100%;
+ padding: 0 0.5rem;
+}
+.header-nav ul {
+ list-style: none;
+ padding-inline-start: 0;
+ margin: 0;
+ display: flex;
+ justify-content: center;
+}
+.header-nav li {
+ flex: 0 0 auto;
+ text-align: center;
+ display: flex;
+}
+.header-nav span {
+ display: block;
+ padding: 1rem 0.2rem;
+ border-bottom: 0rem solid transparent;
+ padding-bottom: 1rem;
+ transition: border-bottom-color ease-in-out 0.2s, border-bottom-width ease-in-out 0.2s, padding-bottom ease-in-out 0.2s;
+}
+.header-nav li:hover span, .header-nav li .force-focus span {
+ border-bottom-color: white;
+ border-bottom-width: 0.2rem;
+ border-bottom-color: white;
+ padding-bottom: 0.8rem;
+}
+.overflow-max-indicator {
+ position: absolute;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ opacity: 0;
+ pointer-events: none;
+ padding: 1rem 0;
+ font-weight: 800;
+ width: 2rem;
+ text-align: right;
+ padding-right: 0.25rem;
+ box-shadow: -2rem 0 0.5rem -0.5rem $color-main inset;
+}
+.overflow-max-indicator.visible {
+ opacity: 1;
+}
\ No newline at end of file
diff --git a/src/app/gui/navbar/navbar.component.ts b/src/app/gui/navbar/navbar.component.ts
index 015e37d..b1d2ed9 100644
--- a/src/app/gui/navbar/navbar.component.ts
+++ b/src/app/gui/navbar/navbar.component.ts
@@ -1,38 +1,84 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnInit, HostListener, Input, ElementRef, ViewChild, AfterViewInit } from "@angular/core";
import { NavigationLink } from "src/app/symbols/NavigationLink";
+import { ActivatedRoute, UrlSegment } from "@angular/router";
+import { map } from "rxjs/operators";
+import { CurrentDocumentService } from "src/app/services/current-document.service";
@Component({
selector: "app-navbar",
templateUrl: "./navbar.component.html",
styleUrls: ["./navbar.component.scss"]
})
-export class NavbarComponent implements OnInit {
+export class NavbarComponent implements OnInit, AfterViewInit {
public navigationLinks: NavigationLink[] = [
{
- text: "Software",
+ text: "Cardboard bug",
address: "/article/software"
},
{
text: "Midi23D",
- address: "/article/midi23d"
+ address: "/article/software/midi23d"
},
{
text: "Calculator",
address: "/article/calculator",
- newtab: true
+ newtab: false
},
{
text: "Github",
address: "https://github.com/Cavallium/WarpPI",
external: true,
- newtab: false
+ newtab: true
},
];
+ stickedOnTop = false;
+ overflowLogo = false;
+ overflowMax = false;
+ @ViewChild("navlogo") navLogo: ElementRef>
+*same length in inches:* 4 + +With 424 DPI (LG G2 real DPI)
+*same length in inches:* 3 + +### How to fix it + +Please choose the method that you prefer + +#### Method 1 + +***Fixing the problem for some apps, keeping your current DPI setting.*** + +1. Open Cardboard app +2. Tap **Settings** +3. Tap **Change** +4. Scan with your camera this QR-Code:
[warning]WARNING: If you do this you can't go back to the default settings![warning] \ No newline at end of file diff --git a/src/documents/software.it.md b/src/documents/software.it.md new file mode 100644 index 0000000..b9ffc32 --- /dev/null +++ b/src/documents/software.it.md @@ -0,0 +1,55 @@ +# LG G2 Cardboard fix + +## Fixing the double vision on your LG G2 using Cardboard + +### When this problem occurs + +If you have installed a custom rom on your LG G2 probably the DPI setting has changed. +The DPI setting is used to calculate the pixel density, and consequently the real measures of your screen. Google Cardboard calculates the distance between eyes using the DPI setting, and if it's wrong some apps using the old CardBoard SDK don't show properly. + +#### Here's an example + +With 480 DPI (CyanogenMod default setting)
+*same length in inches:* 4 + +With 424 DPI (LG G2 real DPI)
+*same length in inches:* 3 + +### How to fix it + +Please choose the method that you prefer + +#### Method 1 + +***Fixing the problem for some apps, keeping your current DPI setting.*** + +1. Open Cardboard app +2. Tap **Settings** +3. Tap **Change** +4. Scan with your camera this QR-Code:
[warning]WARNING: If you do this you can't go back to the default settings![warning] + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/src/documents/software/midi23d.en.md b/src/documents/software/midi23d.en.md new file mode 100644 index 0000000..82a2752 --- /dev/null +++ b/src/documents/software/midi23d.en.md @@ -0,0 +1,3 @@ +# Midi23D + +This is a test page \ No newline at end of file diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts index 3612073..8b7239d 100644 --- a/src/environments/environment.prod.ts +++ b/src/environments/environment.prod.ts @@ -1,3 +1,3 @@ export const environment = { - production: true + production: true }; diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 7b4f817..c5a517a 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -3,7 +3,7 @@ // The list of file replacements can be found in `angular.json`. export const environment = { - production: false + production: false }; /* diff --git a/src/index.html b/src/index.html index 7516355..9b1c283 100644 --- a/src/index.html +++ b/src/index.html @@ -1,8 +1,8 @@ - + -