root / src / app / settings / settings.component.ts @ fc64f1a2
Historique | Voir | Annoter | Télécharger (8,36 ko)
1 |
import { Component, OnInit } from "@angular/core"; |
---|---|
2 |
import { RadSideDrawer } from "nativescript-ui-sidedrawer"; |
3 |
import { TextField } from "tns-core-modules/ui/text-field"; |
4 |
import { EventData } from "tns-core-modules/data/observable"; |
5 |
import { getViewById } from "tns-core-modules/ui/core/view"; |
6 |
import { View } from "tns-core-modules/ui/core/view"; |
7 |
import { Page } from "tns-core-modules/ui/page"; |
8 |
import { ActivatedRoute } from "@angular/router"; |
9 |
import { RouterExtensions } from "nativescript-angular/router"; |
10 |
import { getFile, getImage, getJSON, request, HttpResponse } from "tns-core-modules/http"; |
11 |
import { getString, setString, hasKey, remove, clear } from "tns-core-modules/application-settings"; |
12 |
import { ListPicker } from "tns-core-modules/ui/list-picker"; |
13 |
import { getFrameById } from "tns-core-modules/ui/frame"; |
14 |
import { ObservableArray, ChangedData } from "tns-core-modules/data/observable-array"; |
15 |
import { CheckBox } from '@nstudio/nativescript-checkbox'; |
16 |
import { topmost } from 'tns-core-modules/ui/frame'; |
17 |
|
18 |
import * as dialogs from "tns-core-modules/ui/dialogs"; |
19 |
import * as app from "tns-core-modules/application"; |
20 |
import { observable } from "rxjs"; |
21 |
import { RadioOption } from "./radio-option"; |
22 |
|
23 |
@Component({ |
24 |
selector: "Settings", |
25 |
templateUrl: "./settings.component.html" |
26 |
}) |
27 |
export class SettingsComponent implements OnInit { |
28 |
public pseudo: string; |
29 |
public email: string; |
30 |
public serverJSON: JSON; |
31 |
public serverName: string; |
32 |
public serverURI: string; |
33 |
public serverLabel: string; |
34 |
radioOptions?: Array<RadioOption>; |
35 |
|
36 |
constructor(private routerExtensions: RouterExtensions, private activeRoute: ActivatedRoute) { |
37 |
// Use the component constructor to inject providers. |
38 |
} |
39 |
|
40 |
ngOnInit(): void { |
41 |
this.radioOptions = []; |
42 |
|
43 |
let serversLabelTMP = Array(); |
44 |
// Init your component properties here. |
45 |
this.pseudo = getString("pseudo", ""); |
46 |
this.email = getString("email", ""); |
47 |
this.serverName = getString("serverName", ""); |
48 |
this.serverURI = getString("serverURI", ""); |
49 |
|
50 |
//On recupere les infos serveurs et en particulier la liste des serveurs disponibles |
51 |
try { |
52 |
this.serverJSON = JSON.parse(getString("serverJSON")); |
53 |
let i = 0; |
54 |
this.serverJSON['servers'].forEach(element => { |
55 |
console.log(" JSON element : ", element.name); |
56 |
let option = new RadioOption(element.label, element.uri); |
57 |
this.radioOptions.push(option); |
58 |
if (i == 0) { |
59 |
console.log(" Premier element on le checked : ", element.label); |
60 |
this.serverLabel = element.label; |
61 |
this.serverName = element.label; |
62 |
this.serverURI = element.uri; |
63 |
option.selected = true; |
64 |
} |
65 |
i++; |
66 |
}); |
67 |
} catch (e) { |
68 |
console.log(" JSON empty, ask server"); |
69 |
getJSON("https://clicalbum.abuledu.net/api.php").then((r: any) => { |
70 |
console.log("getJSON : ", r); |
71 |
this.serverJSON = r; |
72 |
let i = 0; |
73 |
r.servers.forEach(element => { |
74 |
console.log(" json element : ", element.name); |
75 |
let option = new RadioOption(element.label, element.uri); |
76 |
this.radioOptions.push(option); |
77 |
if (i == 0) { |
78 |
console.log(" premier element on le checked : ", element.label); |
79 |
this.serverLabel = element.label; |
80 |
this.serverName = element.label; |
81 |
this.serverURI = element.uri; |
82 |
option.selected = true; |
83 |
} |
84 |
i++; |
85 |
}); |
86 |
}, (e) => { |
87 |
console.log("getJSON Error", e); |
88 |
}); |
89 |
} |
90 |
|
91 |
} |
92 |
|
93 |
changeCheckedRadio(radioOption: RadioOption): void { |
94 |
radioOption.selected = !radioOption.selected; |
95 |
|
96 |
if (!radioOption.selected) { |
97 |
return; |
98 |
} |
99 |
|
100 |
this.serverLabel = radioOption.label; |
101 |
this.serverName = radioOption.label; |
102 |
this.serverURI = radioOption.uri; |
103 |
|
104 |
// uncheck all other options |
105 |
this.radioOptions.forEach(option => { |
106 |
//On est sur un qu'il faut décocher |
107 |
if (option.label !== radioOption.label) { |
108 |
option.selected = false; |
109 |
} |
110 |
//On est sur le choix coché |
111 |
}); |
112 |
} |
113 |
|
114 |
|
115 |
onDrawerButtonTap(): void { |
116 |
const sideDrawer = <RadSideDrawer>app.getRootView(); |
117 |
sideDrawer.showDrawer(); |
118 |
} |
119 |
|
120 |
onFocus(args: EventData): void { |
121 |
console.log("on focus: "); |
122 |
} |
123 |
|
124 |
onBlur(args: EventData): void { |
125 |
const tf = <TextField>args.object; |
126 |
this.pseudo = tf.text.toLowerCase().replace(/[^a-z0-9]/g, ""); |
127 |
tf.text = this.pseudo; |
128 |
} |
129 |
|
130 |
onReturnPress(args: EventData): void { |
131 |
console.log("on returnpress"); |
132 |
} |
133 |
|
134 |
onTextChange(args: EventData): void { |
135 |
console.log("on textChange "); |
136 |
} |
137 |
|
138 |
onSelectedIndexChanged(args: EventData) { |
139 |
const picker = <ListPicker>args.object; |
140 |
console.log('index: ${picker.selectedIndex}; item" ${this.years[picker.selectedIndex]}'); |
141 |
} |
142 |
|
143 |
onSaveTap(args: EventData): void { |
144 |
// alert("on sauvegarde ..."); |
145 |
let button = <View>args.object; |
146 |
let parent = button.parent; |
147 |
if (parent) { |
148 |
let p = <TextField>getViewById(parent, "pseudo"); |
149 |
let e = <TextField>getViewById(parent, "email"); |
150 |
|
151 |
this.pseudo = p.text.toLowerCase().replace(/[^a-z0-9]/g, "") |
152 |
this.email = e.text; |
153 |
|
154 |
// console.log("on a un parent, le pseudo : " + this.pseudo); |
155 |
// console.log("le mail : " + this.email); |
156 |
|
157 |
if (this.pseudo == "" || this.email == "") { |
158 |
dialogs.alert({ |
159 |
title: "Pseudo ou email vide !", |
160 |
message: "Veuillez saisir un pseudo et une adresse mail...", |
161 |
okButtonText: "Ok" |
162 |
}); |
163 |
} |
164 |
else { |
165 |
//il faudrait demander au serveur si ce pseudo n'est pas déjà utilisé ... |
166 |
request({ |
167 |
url: "https://" + this.serverURI + "/api.php", |
168 |
method: "POST", |
169 |
headers: { "Content-Type": "application/json" }, |
170 |
content: JSON.stringify({ |
171 |
command: "createUser", |
172 |
pseudo: this.pseudo, |
173 |
email: this.email |
174 |
}) |
175 |
}).then((response) => { |
176 |
const result = response.content.toJSON(); |
177 |
console.log("Valeur de loginOK dans le retour request : ", result['loginOK']); |
178 |
|
179 |
if (result['loginOK'] == true) { |
180 |
setString("pseudo", this.pseudo); |
181 |
setString("email", this.email); |
182 |
setString("serverURI", this.serverURI); |
183 |
setString("serverName", this.serverName); |
184 |
dialogs.alert({ |
185 |
title: "Pseudo enregistré !", |
186 |
message: "Votre pseudo est maintenant associé à votre adresse email vous pouvez utiliser l'application.", |
187 |
okButtonText: "Ok" |
188 |
}).then(() => { |
189 |
this.routerExtensions.navigate(["/home"], { relativeTo: this.activeRoute }); |
190 |
}); |
191 |
} |
192 |
else { |
193 |
console.log("Pseudo déjà utilisé"); |
194 |
dialogs.alert({ |
195 |
title: "Pseudo déjà utilisé !", |
196 |
message: "Malheureusement ce pseudo est déjà utilisé par quelqu'un d'autre. Veuillez changer de pseudo et tenter à nouveau votre chance :-)", |
197 |
okButtonText: "Ok" |
198 |
}); |
199 |
} |
200 |
}, (e) => { |
201 |
console.log("request Error :", e); |
202 |
dialogs.alert({ |
203 |
title: "Erreur de vérification !", |
204 |
message: "Une erreur de communication avec le serveur nous empêche de vérifier si ce pseudo est déjà utilisé ... ré-essayez plus tard.", |
205 |
okButtonText: "Ok" |
206 |
}); |
207 |
}); |
208 |
} |
209 |
} |
210 |
} |
211 |
} |