diff --git a/src/components/Home.vue b/src/components/Home.vue
index 13aad30..dda024c 100644
--- a/src/components/Home.vue
+++ b/src/components/Home.vue
@@ -21,10 +21,10 @@
- Hi, I am another freelance developer !
- I made this website so you can browse some of my skills and projects.
- After 50+ projects since I started IT back in 2010, I still work hard for making projects maintainable so they last and can evolve..
- For now, my technologies of choice are : Go and IoT (Arduino, Raspberry) projects.
+ Hi, I am another freelance developer !
+ I made this website so you can browse some of my skills and projects.
+ After 50+ projects since I started IT back in 2010, I still work hard for making projects maintainable so they last and can evolve.
+ For now, my technologies of choice are : Go and IoT (Arduino, Raspberry).
@@ -39,6 +39,7 @@
diff --git a/src/service/typewriter.ts b/src/service/typewriter.ts
new file mode 100644
index 0000000..14206cf
--- /dev/null
+++ b/src/service/typewriter.ts
@@ -0,0 +1,45 @@
+export class TypeWriter {
+ private target: HTMLElement;
+ private display: string|null;
+ private html: string|null;
+
+ constructor(target: HTMLElement){
+ this.target = target;
+ }
+
+ /* initialize with copying and clearing the original text */
+ public init(hide: boolean = true) {
+ this.html = this.target.innerHTML;
+ this.display = this.target.style.display;
+ this.target.innerHTML = '';
+ if( hide ){
+ this.target.style.display = 'none';
+ }
+ }
+
+ public animate(duration_ms: number) {
+ if( this.html == null || this.display == null ){
+ console.warn("[typewriter] init must be called first ; doing it anyway");
+ this.init();
+ }
+
+ const size = this.html!.length;
+ const letter_ms = duration_ms / size;
+
+ this.target.style.display = this.display!;
+ for( let i = 0, l = this.html!.length ; i < l ; i++ ){
+ setTimeout(
+ () => {
+ ((i: number) => {
+ this.target.innerHTML = this.html!.substring(0, i+1);
+ })(i);
+ },
+ i*letter_ms);
+ }
+
+ }
+
+};
+
+
+