parent
70f1000eff
commit
5c986142c5
@ -1,9 +1,4 @@
|
|||||||
.code_input {
|
.ngx-codemirror {
|
||||||
padding: 2rem;
|
border: 1px solid #060202;
|
||||||
}
|
padding-top: 10px;
|
||||||
|
|
||||||
.code_input .code_input_textarea {
|
|
||||||
background-color: #cccccc;
|
|
||||||
min-height: 80vh;
|
|
||||||
width: 100%;
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,13 +1,39 @@
|
|||||||
<div class="code_input">
|
<div>
|
||||||
<textarea
|
<div>
|
||||||
class="code_input_textarea"
|
<ngx-codemirror
|
||||||
id="code_input"
|
[options]="{
|
||||||
name="code_input"
|
theme: 'material',
|
||||||
placeholder="Enter your code here..."
|
lineNumbers: true,
|
||||||
></textarea>
|
lineWrapping: true,
|
||||||
<button (click)="onRunButtonClicked()" [disabled]="isLoaded">Run</button>
|
mode: mode,
|
||||||
|
autofocus: true
|
||||||
|
}"
|
||||||
|
[ngModel]="defaults[mode]"
|
||||||
|
[autoFocus]="true"
|
||||||
|
(ngModelChange)="handleChange($event)"
|
||||||
|
></ngx-codemirror>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label for="language">Langage de programmation</label>
|
||||||
|
<select
|
||||||
|
id="language"
|
||||||
|
name="language"
|
||||||
|
[(ngModel)]="mode"
|
||||||
|
(ngModelChange)="changeMode()"
|
||||||
|
>
|
||||||
|
<option value="text/typescript">TypeScript</option>
|
||||||
|
<option value="markdown">Markdown</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<button type="button" (click)="clear()">Remettre à zéro</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button (click)="onRunButtonClicked()" [disabled]="isLoaded">Lancer</button>
|
||||||
<div *ngIf="!isLoaded">
|
<div *ngIf="!isLoaded">
|
||||||
<p>Loading: {{ loadingProgress }}%</p>
|
<p>Chargement: {{ loadingProgress }}%</p>
|
||||||
<div class="loading-bar" [style.width.%]="loadingProgress"></div>
|
<div class="loading-bar" [style.width.%]="loadingProgress"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -0,0 +1,21 @@
|
|||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { TranslateService } from '@ngx-translate/core';
|
||||||
|
|
||||||
|
@Injectable({
|
||||||
|
providedIn: 'root',
|
||||||
|
})
|
||||||
|
export class TranslationService {
|
||||||
|
language: string = 'fr'; // Par défaut, français
|
||||||
|
|
||||||
|
constructor(private translate: TranslateService) {}
|
||||||
|
|
||||||
|
onLanguageChange(event: any) {
|
||||||
|
this.language = event.target.value;
|
||||||
|
this.translate.use(this.language);
|
||||||
|
console.log(this.language);
|
||||||
|
}
|
||||||
|
|
||||||
|
getFlagImageUrl(): string {
|
||||||
|
return `../../assets/img/${this.language}_flag.jpg`;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
{
|
||||||
|
"LandingPage": {
|
||||||
|
"Welcome" : "Welcome to Sandkasten",
|
||||||
|
"Description" : "You've arrived at the best code testing sandbox site! We let you test all your programs in your favorite languages. Thanks to the Code Mirror editor and our personalized management of execution on containers, your code becomes completely harmless, so you can have as much fun as you like!",
|
||||||
|
"Try" : "Try it now !"
|
||||||
|
},
|
||||||
|
"HeaderPage": {
|
||||||
|
"Language" : "You can choose your language here :",
|
||||||
|
"Home" : "Home",
|
||||||
|
"Editor" : "Editor",
|
||||||
|
"Documentation" : "Documentation",
|
||||||
|
"Contact" : "Contact us"
|
||||||
|
},
|
||||||
|
"FooterPage": {
|
||||||
|
"About" : "About Sandkasten",
|
||||||
|
"Contact" : "Contact us",
|
||||||
|
"Story" : "Our story",
|
||||||
|
"Legal" : "Legal mentions",
|
||||||
|
"Terms" : "Terms of use",
|
||||||
|
"Privacy" : "Privacy policy",
|
||||||
|
"Rights" : "©2023 Sandkasten, Inc. All rights reserved.",
|
||||||
|
"Social" : "Follow us on social networks :"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 258 KiB |
|
After Width: | Height: | Size: 253 KiB |
@ -1,7 +1,9 @@
|
|||||||
|
import 'codemirror/mode/javascript/javascript';
|
||||||
|
import 'codemirror/mode/markdown/markdown';
|
||||||
|
|
||||||
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
||||||
|
|
||||||
import { AppModule } from './app/app.module';
|
import { AppModule } from './app/app.module';
|
||||||
|
|
||||||
|
|
||||||
platformBrowserDynamic().bootstrapModule(AppModule)
|
platformBrowserDynamic().bootstrapModule(AppModule)
|
||||||
.catch(err => console.error(err));
|
.catch(err => console.error(err));
|
||||||
|
|||||||
Loading…
Reference in new issue