re init
This commit is contained in:
@@ -0,0 +1 @@
|
||||
<p>add works!</p>
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AddComponent } from './add.component';
|
||||
|
||||
describe('AddComponent', () => {
|
||||
let component: AddComponent;
|
||||
let fixture: ComponentFixture<AddComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ AddComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(AddComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-add',
|
||||
templateUrl: './add.component.html',
|
||||
styleUrls: ['./add.component.scss']
|
||||
})
|
||||
export class AddComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
|
||||
import { SavedComponent } from './saved/saved.component';
|
||||
import { ShareComponent } from './share/share.component';
|
||||
import { IdoComponent } from './ido/ido.component';
|
||||
import { AddComponent } from './add/add.component';
|
||||
|
||||
export const APP_ROUTES: Routes = [
|
||||
{ path: 'ido', component: IdoComponent },
|
||||
{ path: 'saved', component: SavedComponent },
|
||||
{ path: 'share/:line1/:line2/:line3', component: ShareComponent },
|
||||
{ path: '**', component: IdoComponent },
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forRoot(APP_ROUTES, {
|
||||
useHash: true,
|
||||
}),
|
||||
],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AppRoutingModule {}
|
||||
@@ -0,0 +1,4 @@
|
||||
<app-navbar></app-navbar>
|
||||
<div class="col-12">
|
||||
<router-outlet></router-outlet>
|
||||
</div>
|
||||
@@ -0,0 +1,10 @@
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
templateUrl: './app.component.html',
|
||||
styleUrls: ['./app.component.scss']
|
||||
})
|
||||
export class AppComponent {
|
||||
title = 'haikudo';
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { BrowserModule } from '@angular/platform-browser';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { NavbarComponent } from './navbar/navbar.component';
|
||||
import { SavedComponent } from './saved/saved.component';
|
||||
import { ShareComponent } from './share/share.component';
|
||||
import { IdoComponent } from './ido/ido.component';
|
||||
import { AddComponent } from './add/add.component';
|
||||
|
||||
import { ToastrModule } from 'ngx-toastr';
|
||||
import { NgxLocalStorageModule } from 'ngx-localstorage';
|
||||
import { StorageModule } from '@ngx-pwa/local-storage';
|
||||
import { ClipboardModule } from 'ngx-clipboard';
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AppComponent,
|
||||
NavbarComponent,
|
||||
SavedComponent,
|
||||
ShareComponent,
|
||||
IdoComponent,
|
||||
AddComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
AppRoutingModule,
|
||||
BrowserAnimationsModule,
|
||||
ClipboardModule,
|
||||
ToastrModule.forRoot(),
|
||||
NgxLocalStorageModule.forRoot(),
|
||||
StorageModule.forRoot({
|
||||
IDBNoWrap: true,
|
||||
})
|
||||
|
||||
],
|
||||
providers: [],
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
export class AppModule { }
|
||||
@@ -0,0 +1,70 @@
|
||||
import { Injectable } from "@angular/core";
|
||||
import { LocalStorageService } from "ngx-localstorage";
|
||||
import { LocalStorage, StorageMap } from '@ngx-pwa/local-storage';
|
||||
import { } from 'sha1';
|
||||
let options = { hour12: false };
|
||||
|
||||
@Injectable({
|
||||
providedIn: "root"
|
||||
})
|
||||
|
||||
|
||||
export class DataService {
|
||||
|
||||
db: any;
|
||||
|
||||
constructor(
|
||||
private storage: LocalStorageService,
|
||||
private localStorage: LocalStorage,
|
||||
private storageMap: StorageMap
|
||||
) { }
|
||||
|
||||
async db_init() { }
|
||||
|
||||
async set_item(_item: object) {
|
||||
try {
|
||||
let list: any;
|
||||
let has = await this.storageMap.has("instances").toPromise();
|
||||
if(!has) {
|
||||
list = await this.storageMap.set('instances', []).toPromise()
|
||||
return [];
|
||||
} else {
|
||||
list = await this.storageMap.get('instances').toPromise()
|
||||
}
|
||||
list.push({
|
||||
id: Date.now(),
|
||||
lines: _item,
|
||||
created_at: new Date(Date.now()).toLocaleString("en-US", options)
|
||||
});
|
||||
await this.storageMap.set('instances', list).toPromise();
|
||||
return true;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
async get_all() {
|
||||
|
||||
try {
|
||||
return await this.storageMap.get("instances").toPromise();
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
// get_singe_instance(line1, line2, line3) {
|
||||
|
||||
// }
|
||||
|
||||
async remove_item(_item: any) {
|
||||
try {
|
||||
let data: any;
|
||||
data = await this.storageMap.get("instances").toPromise();
|
||||
let tmp = data.findIndex((x:any)=> x['id'] === _item.id)
|
||||
data.splice(tmp, 1);
|
||||
return await this.storageMap.set('instances', data).toPromise();
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,102 @@
|
||||
<div class="container col-12">
|
||||
<div class="row justify-content-center">
|
||||
<div class="container animate__animated animate__fadeIn">
|
||||
<br>
|
||||
<br>
|
||||
<div class="row justify-content-center animate__animated animate__fadeIn" *ngIf="ready">
|
||||
<div class="col col-lg-6 col-sm-12">
|
||||
<div class="text-center">
|
||||
<img src="/assets/cpf.png" alt="cpf" >
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line1">
|
||||
{{line1}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line2">
|
||||
{{line2}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line3">
|
||||
{{line3}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br><br>
|
||||
<div *ngIf="notify">
|
||||
<div class="ui visible success message text-center">
|
||||
<p>
|
||||
Instance Was saved ..
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="text-center" data-toggle="tooltip" data-placement="top" title="Save in Browser">
|
||||
<button type="button"
|
||||
class="ui circular raised icon button"
|
||||
(click)="saveInstance()">
|
||||
<i class="heart icon animated pulse infinite" style="color: #C05353;"></i>
|
||||
</button>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<div class="text-center" data-toggle="tooltip" data-placement="top" title="Refresh instance">
|
||||
<button type="button"
|
||||
class="ui circular raised icon button"
|
||||
(click)="instance_generator()">
|
||||
<i class="refresh icon"></i>
|
||||
</button>
|
||||
</div>
|
||||
<br><br>
|
||||
<div class="text-center" data-toggle="tooltip" data-placement="top" title="Share instance">
|
||||
<button type="button"
|
||||
class="ui circular raised icon button"
|
||||
(click)="shareIt = !shareIt">
|
||||
<i class="share alternate icon"></i>
|
||||
</button>
|
||||
<br><br>
|
||||
<div class="ui fluid action input"
|
||||
*ngIf="shareIt">
|
||||
<input type="text"
|
||||
placeholder=".."
|
||||
value="https://udohaiku.com/#/share/{{line1_number}}/{{line2_number}}/{{line3_number}}" selected>
|
||||
<button class="ui button" (click)="shareIt = !shareIt" (click)="copy_text('copying')">COPY</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
.text-former {
|
||||
height: 100px;
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { IdoComponent } from './ido.component';
|
||||
|
||||
describe('IdoComponent', () => {
|
||||
let component: IdoComponent;
|
||||
let fixture: ComponentFixture<IdoComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ IdoComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(IdoComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,123 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { DataService } from '../data.service';
|
||||
import { environment } from '../../environments/environment';
|
||||
import { ClipboardService } from 'ngx-clipboard'
|
||||
import axios from 'axios';
|
||||
|
||||
@Component({
|
||||
selector: 'app-ido',
|
||||
templateUrl: './ido.component.html',
|
||||
styleUrls: ['./ido.component.scss']
|
||||
})
|
||||
export class IdoComponent implements OnInit {
|
||||
|
||||
BASE_URL = environment.BASE_URL;
|
||||
|
||||
notify: boolean = false;
|
||||
shareIt: boolean = false;
|
||||
|
||||
line1: any = "";
|
||||
line2: any = "";
|
||||
line3: any = "";
|
||||
|
||||
line1_number = 0;
|
||||
line2_number = 0;
|
||||
line3_number = 0;
|
||||
|
||||
five_max: any;
|
||||
five_id_list = [];
|
||||
seven_max: any;
|
||||
seven_id_list = [];
|
||||
|
||||
ready = false;
|
||||
|
||||
constructor(
|
||||
private toastr: ToastrService,
|
||||
private _clipboardService: ClipboardService,
|
||||
private data: DataService
|
||||
) {
|
||||
axios.get(this.BASE_URL + "/ping")
|
||||
.catch(console.error);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
try {
|
||||
axios.get(this.BASE_URL + "/get_line5_ids")
|
||||
.then((the) => {
|
||||
this.five_id_list = the['data'];
|
||||
this.five_max = the['data'].length;
|
||||
return axios.get(this.BASE_URL + "/get_line7_ids");
|
||||
})
|
||||
.catch((e) => {
|
||||
this.toastr.error('Server Error!', e);
|
||||
})
|
||||
.then((the: any) => {
|
||||
this.seven_id_list = the['data'];
|
||||
this.seven_max = the['data'].length;
|
||||
console.log("FIVE MAX: ", this.five_max);
|
||||
console.log("SEVEN MAX: ", this.seven_max);
|
||||
return this.instance_generator()
|
||||
})
|
||||
.then(() => {
|
||||
console.log("INSTANCE LOADED");
|
||||
this.ready = true;
|
||||
})
|
||||
.catch((e) => {
|
||||
console.error(e);
|
||||
this.toastr.error('Server Error!', e);
|
||||
})
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
|
||||
instance_generator() {
|
||||
|
||||
this.line1_number = this.five_id_list[Math.floor(Math.random() * this.five_max) + 1];
|
||||
this.line2_number = this.seven_id_list[Math.floor(Math.random() * this.seven_max) + 1];
|
||||
this.line3_number = this.five_id_list[Math.floor(Math.random() * this.five_max) + 1];
|
||||
|
||||
axios({
|
||||
method: 'post',
|
||||
url: this.BASE_URL + '/get_instance',
|
||||
params: {
|
||||
line1: this.line1_number,
|
||||
line2: this.line2_number,
|
||||
line3: this.line3_number
|
||||
}})
|
||||
.then((ting) => {
|
||||
this.line1 = ting.data.line1;
|
||||
this.line2 = ting.data.line2;
|
||||
this.line3 = ting.data.line3;
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
this.toastr.error('Server Error!', e);
|
||||
});
|
||||
}
|
||||
|
||||
copy_text(_text: any) {
|
||||
let url = `https://udohaiku.com/#/share/${this.line1_number}/${this.line2_number}/${this.line3_number}`
|
||||
this._clipboardService.copyFromContent(url);
|
||||
this.toastr.info('URL Copied To Clipboard ');
|
||||
}
|
||||
|
||||
async saveInstance() {
|
||||
try {
|
||||
await this.data.set_item({
|
||||
line1: this.line1,
|
||||
line2: this.line2,
|
||||
line3: this.line3,
|
||||
line_number1: this.line1_number,
|
||||
line_number2: this.line2_number,
|
||||
line_number3: this.line3_number
|
||||
});
|
||||
this.toastr.success('Instance Saved !', "");
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
this.toastr.error('Unable to save instance !');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<div class="container-fluid">
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarColor03" aria-controls="navbarColor03" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarColor03">
|
||||
<ul class="navbar-nav me-auto">
|
||||
<li class="nav-item" routerLink="/ido" style="cursor: pointer" data-toggle="tooltip" data-placement="top" title="Go to landing page">
|
||||
<i class="chess board icon"></i> HOME
|
||||
</li>
|
||||
</ul>
|
||||
<form class="d-flex">
|
||||
<div class="nav-item" style="cursor: pointer; padding-right: 25px;" routerLink="/ido" data-toggle="tooltip" data-placement="top" title="This site generates pseudo random combination of lines, creating new and interesting haiku poems on each update.">
|
||||
<i class="light blue question circle icon"></i>Hook into
|
||||
</div>
|
||||
<div class="nav-item" style="cursor: pointer" routerLink="/saved" data-toggle="tooltip" data-placement="top" title="View the instances saved in your browser">
|
||||
<i class="heart icon"></i> FAVORITES
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavbarComponent } from './navbar.component';
|
||||
|
||||
describe('NavbarComponent', () => {
|
||||
let component: NavbarComponent;
|
||||
let fixture: ComponentFixture<NavbarComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavbarComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavbarComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar',
|
||||
templateUrl: './navbar.component.html',
|
||||
styleUrls: ['./navbar.component.scss']
|
||||
})
|
||||
export class NavbarComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
<div class="container col-lg-12 animate__animated animate__fadeIn">
|
||||
<div class="row justify-content-center">
|
||||
<div class="container">
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="row justify-content-center" *ngFor="let item of instance_list">
|
||||
<div class="col col-lg-6">
|
||||
<br>
|
||||
|
||||
<div class="container" style="border: 1px solid #9bc0c0; border-radius: 3px;">
|
||||
<br>
|
||||
<small>
|
||||
<b style="padding-right: 15px;">SAVED: </b> {{ item['created_at'] }}
|
||||
</small>
|
||||
<span class="badge badge-pill badge-danger " style="float: right; cursor: pointer; color: #b55050;"
|
||||
(click)="delete_item(item)">
|
||||
<i class="small red close icon float-right" style="cursor: pointer"></i>
|
||||
</span>
|
||||
<br>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line1">
|
||||
{{item['lines']['line1']}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line2">
|
||||
{{item['lines']['line2']}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line3">
|
||||
{{item['lines']['line3']}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<i class="small blue share alternate icon float-right" style="cursor: pointer; float:right"
|
||||
(click)="share_it(item['id'])"></i>
|
||||
<br>
|
||||
<br>
|
||||
<div class="ui fluid action input" *ngIf="shareIt && item['id'] == sharing_id" [id]="item['id']">
|
||||
<input type="text" placeholder=".."
|
||||
value="https://udohaiku.com/#/share/{{item['lines']['line_number1']}}/{{item['lines']['line_number2']}}/{{item['lines']['line_number3']}}"
|
||||
selected>
|
||||
<button class="ui button" (click)="copy_text(item['lines']['line_number1'], item['lines']['line_number2'], item['lines']['line_number3'])">COPY</button>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
</div>
|
||||
|
||||
<br> <br>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="container-fluid text-center animate__animated animate__fadeIn" *ngIf="instance_list.length < 1">
|
||||
<h4>
|
||||
No Saved Instances Found.
|
||||
</h4>
|
||||
<br><br>
|
||||
<p routerLink="/ido" style="cursor: pointer">
|
||||
Go Save Some
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SavedComponent } from './saved.component';
|
||||
|
||||
describe('SavedComponent', () => {
|
||||
let component: SavedComponent;
|
||||
let fixture: ComponentFixture<SavedComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ SavedComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(SavedComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,60 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { DataService } from '../data.service';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { ClipboardService } from 'ngx-clipboard'
|
||||
|
||||
@Component({
|
||||
selector: 'app-saved',
|
||||
templateUrl: './saved.component.html',
|
||||
styleUrls: ['./saved.component.scss']
|
||||
})
|
||||
export class SavedComponent implements OnInit {
|
||||
|
||||
shareIt: boolean = false;
|
||||
sharing_id: string = "";
|
||||
|
||||
|
||||
constructor(
|
||||
private toastr: ToastrService,
|
||||
private data: DataService,
|
||||
private _clipboardService: ClipboardService
|
||||
) { }
|
||||
|
||||
instance_list = [];
|
||||
|
||||
ngOnInit(): void {
|
||||
this.instance_list = [];
|
||||
this.data.get_all()
|
||||
.then((data: any) => {
|
||||
this.instance_list = data;
|
||||
console.log("instance_list ", this.instance_list);
|
||||
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
})
|
||||
}
|
||||
|
||||
delete_item(_item: any) {
|
||||
this.data.remove_item(_item)
|
||||
.then(() => {
|
||||
this.toastr.success("Instance Deleted !")
|
||||
this.ngOnInit();
|
||||
})
|
||||
.catch(console.error);
|
||||
}
|
||||
|
||||
copy_text(_line1: any, line2: any, line3: any) {
|
||||
let url = `https://udohaiku.com/#/share/${_line1}/${line2}/${line3}`
|
||||
this._clipboardService.copyFromContent(url);
|
||||
this.toastr.info('URL Copied To Clipboard ');
|
||||
this.sharing_id = "";
|
||||
this.shareIt = !this.shareIt;
|
||||
}
|
||||
|
||||
share_it(_id: string) {
|
||||
this.sharing_id = _id;
|
||||
this.shareIt = !this.shareIt;
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
<div class="container col-12">
|
||||
<div class="row justify-content-center">
|
||||
<div class="container animate__animated animate__fadeIn">
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="row justify-content-center animate__animated animate__fadeIn" *ngIf="ready" >
|
||||
<div class="col col-lg-6 col-sm-12 shading" style="border: 3px solid #dcdcdc; padding: 35px; border-radius: 3px;">
|
||||
<br>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line1">
|
||||
{{line1}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line2">
|
||||
{{line2}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row text-center">
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body animate__animated animate__fadeIn">
|
||||
<span id="line3">
|
||||
{{line3}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="text-center" data-toggle="tooltip" data-placement="top" title="Save in Browser">
|
||||
<button type="button"
|
||||
class="ui circular raised icon button"
|
||||
(click)="save_instance()">
|
||||
<i class="heart icon animated pulse infinite" style="color: #C05353;"></i>
|
||||
</button>
|
||||
</div>
|
||||
<br><br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,5 @@
|
||||
.shading {
|
||||
-webkit-box-shadow: 1px 3px 5px -2px rgba(66, 66, 66, 1);
|
||||
-moz-box-shadow: 1px 3px 5px -2px rgba(66, 66, 66, 1);
|
||||
box-shadow: 1px 3px 5px -2px rgba(66, 66, 66, 1);
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ShareComponent } from './share.component';
|
||||
|
||||
describe('ShareComponent', () => {
|
||||
let component: ShareComponent;
|
||||
let fixture: ComponentFixture<ShareComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ ShareComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(ShareComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,78 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { ToastrService } from 'ngx-toastr';
|
||||
import { DataService } from '../data.service';
|
||||
import { environment } from '../../environments/environment';
|
||||
import axios from 'axios';
|
||||
|
||||
@Component({
|
||||
selector: 'app-share',
|
||||
templateUrl: './share.component.html',
|
||||
styleUrls: ['./share.component.scss']
|
||||
})
|
||||
export class ShareComponent implements OnInit {
|
||||
|
||||
ready = false;
|
||||
|
||||
line1: any;
|
||||
line2: any;
|
||||
line3: any;
|
||||
line_number1: any;
|
||||
line_number2: any;
|
||||
line_number3: any;
|
||||
|
||||
BASE_URL = environment.BASE_URL;
|
||||
|
||||
constructor(
|
||||
private activated_route: ActivatedRoute,
|
||||
private toastr: ToastrService,
|
||||
private data: DataService
|
||||
) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this.activated_route.params.subscribe((params) => {
|
||||
if(Object.keys(params).length > 0) {
|
||||
this.ready = true;
|
||||
this.line_number1 = params['line1'];
|
||||
this.line_number2 = params['line2'];
|
||||
this.line_number3 = params['line3'];
|
||||
axios({
|
||||
method: 'post',
|
||||
url: this.BASE_URL + '/get_instance',
|
||||
params: {
|
||||
line1: this.line_number1,
|
||||
line2: this.line_number2,
|
||||
line3: this.line_number3
|
||||
}})
|
||||
.then((ting) => {
|
||||
this.line1 = ting.data.line1;
|
||||
this.line2 = ting.data.line2;
|
||||
this.line3 = ting.data.line3;
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
this.toastr.error('Server Error!', e);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
async save_instance() {
|
||||
try {
|
||||
await this.data.set_item({
|
||||
line1: this.line1,
|
||||
line2: this.line2,
|
||||
line3: this.line3,
|
||||
line_number1: this.line_number1,
|
||||
line_number2: this.line_number2,
|
||||
line_number3: this.line_number3
|
||||
});
|
||||
this.toastr.success('Instance Saved !', "");
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
this.toastr.error('Unable to save instance !');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user