Merge pull request #5 from DoodleyJC/dev

massive rework, added delete page and proper subscribing to observables
DaiseyD · Apr 3, 2024 · 8d74b83 · 8d74b83
2 parents ccfb9c9 + a4f9a20
commit 8d74b83
Show file tree

Hide file tree

Showing 21 changed files with 257 additions and 98 deletions.
diff --git a/bluenps/angular.json b/bluenps/angular.json
@@ -55,7 +55,13 @@
               "vendorChunk": true,
               "extractLicenses": false,
               "sourceMap": true,
-              "namedChunks": true
+              "namedChunks": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.development.ts"
+                }
+              ]
             }
           },
           "defaultConfiguration": "production"

diff --git a/bluenps/src/app/app-routing.module.ts b/bluenps/src/app/app-routing.module.ts
@@ -1,10 +1,15 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
+import { DeleteComponent } from './delete/delete.component';
+import { HomePageComponent } from './home-page/home-page.component';
 
-const routes: Routes = [];
+const routes: Routes = [
+  { path: "secretdelete", component: DeleteComponent },
+  {path: "", component: HomePageComponent}
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
   exports: [RouterModule]
 })
-export class AppRoutingModule { }
+export class AppRoutingModule { }
diff --git a/bluenps/src/app/app.component.html b/bluenps/src/app/app.component.html
@@ -1,31 +1 @@
-<html>
-
-  <div class="row">
-    <div class="col border border-danger">
-      Blue
-    </div>
-    <div class="col border border-danger">
-      NPS
-    </div>
-  </div>
-  <div class="container">
-    <div class="mt-3 mb-3">
-      <select class="form-select" aria-label="courtSelection" id="courtSelection">
-        <option value="nps" selected="selected">NPS</option>
-        <option value="blue">BLUE</option>
-      </select>
-      <label for="nameInput" class="form-label">Name:</label>
-      <input class="form-control" id="nameInput" placeholder="CuteDaisey">
-      <button type="button" class="btn btn-success" (click)="submitCourtName()">submit</button>
-    </div>
-  </div>
-  <div class="container">
-    <li *ngFor="let player of data">
-      <div class="row">
-        <div class="col">{{player.name}}</div>
-        <div class="col">{{player.time}}</div>
-        <div class="col">{{player.court}}</div>
-      </div>
-  </div>
-
-</html>
+<router-outlet></router-outlet>
diff --git a/bluenps/src/app/app.component.ts b/bluenps/src/app/app.component.ts
@@ -2,6 +2,7 @@ import { Component } from '@angular/core';
 import {formatDate} from '@angular/common';
 import { HttpClient, HttpResponse } from  '@angular/common/http';
 import {signup, BackendService } from './backend.service';
+import { RouterLink, RouterLinkActive, RouterModule, RouterOutlet } from '@angular/router';
 
 @Component({
   selector: 'app-root',
@@ -10,48 +11,9 @@ import {signup, BackendService } from './backend.service';
 })
 
 export class AppComponent {
-  title = 'bluenps';
-  test: any;
-  data: signup[]= [];
-  constructor(private http: HttpClient, private backendService: BackendService){}
-
-  ngOnInit(){
-    this.refreshData();
-  }
-
-  refreshData(){
-    this.backendService.getAllData()
-    .subscribe( data => this.data = data);
-  }
-  submitCourtName(): void{
-
-
-    var e = (document.getElementById("courtSelection") as HTMLInputElement);
-    var court = e.value;
-    var name = (document.getElementById("nameInput") as HTMLInputElement).value;
-    var date = new Date();
-    if(name==undefined || date==undefined || court == undefined){
-      alert("error");
-      return;
-    }
-    var dateString = formatDate(date, "yyyy-MM-dd", 'en')
-
-    var newSignup:signup = {
-                "name" : name,
-                "time" : dateString,
-                "court" : court
-    }
-    this.backendService.postSignup(newSignup).subscribe({
-      next(value) {alert("succesfully signed up, refresh page to see yourself")},
-      error: (e) =>console.log(e)}
-    )
-  }
-
-
-
-
-
+  title = 'routing';
 }
+
 
 
 

diff --git a/bluenps/src/app/app.module.ts b/bluenps/src/app/app.module.ts
@@ -1,18 +1,28 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-
-import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
 import { HttpClientModule } from '@angular/common/http';
+import {provideRouter, RouterModule, Routes} from '@angular/router';
+import { DeleteComponent } from './delete/delete.component';
+import { AppComponent } from './app.component';
+import { HomePageComponent } from './home-page/home-page.component';
+import { AppRoutingModule } from './app-routing.module';
+const routes: Routes = [
+  {path:"test", component: DeleteComponent},
+  {path: "", component: DeleteComponent},
+  {path: "**", component: DeleteComponent}
+];
 
 @NgModule({
   declarations: [
-    AppComponent
+    AppComponent,
+    DeleteComponent,
+    HomePageComponent,
   ],
   imports: [
     BrowserModule,
+    HttpClientModule,
+    RouterModule,
     AppRoutingModule,
-    HttpClientModule
   ],
   providers: [],
   bootstrap: [AppComponent]

diff --git a/bluenps/src/app/backend.service.ts b/bluenps/src/app/backend.service.ts
@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpHeaders} from '@angular/common/http';
+import { environment } from 'src/environments/environment';
 
 export type signup = {
   name: string;
@@ -11,23 +12,31 @@ export type signup = {
   providedIn: 'root'
 })
 export class BackendService {
-  localurl: string = "http://localhost:8000"
-  url :string = "https://backendbluenps.azurewebsites.net/";
-  actualurl: string = this.url;
+  url :string = environment.backendUrl;
   constructor(private http: HttpClient) { }
 
 
 
   getAllData( ){
     console.log("test");
-    return this.http.get<signup[]>(this.actualurl);
+    return this.http.get<signup[]>(this.url);
 
 
   }
 
   postSignup(newPlayer:signup){
     console.log(newPlayer);
-    const headers = new HttpHeaders().set("Content-Type", "application/json; charset=utf-8");
-    return this.http.post(this.actualurl, newPlayer, {headers: headers});
+    var headers = new HttpHeaders().set("Content-Type", "application/json; charset=utf-8");
+    return this.http.post<signup>(this.url, newPlayer, {headers: headers});
+  }
+
+
+  deleteData(regexString:string){
+    console.log(regexString);
+    var headers = new HttpHeaders();
+    headers = headers.set("nameQuery", regexString);
+    console.log(headers);
+    return this.http.delete(this.url + "delete", {headers: headers});
+
   }
 }
diff --git a/bluenps/src/app/delete/delete.component.css b/bluenps/src/app/delete/delete.component.css
diff --git a/bluenps/src/app/delete/delete.component.html b/bluenps/src/app/delete/delete.component.html
@@ -0,0 +1,2 @@
+<input class="form-control" id="regexInput" placeholder="CuteDaisey">
+<button type="button" class="btn btn-success" (click)="deleteData()">submit</button>
diff --git a/bluenps/src/app/delete/delete.component.spec.ts b/bluenps/src/app/delete/delete.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DeleteComponent } from './delete.component';
+
+describe('DeleteComponent', () => {
+  let component: DeleteComponent;
+  let fixture: ComponentFixture<DeleteComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [DeleteComponent]
+    });
+    fixture = TestBed.createComponent(DeleteComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/bluenps/src/app/delete/delete.component.ts b/bluenps/src/app/delete/delete.component.ts
@@ -0,0 +1,23 @@
+import { Component } from '@angular/core';
+import { BackendService } from '../backend.service';
+
+@Component({
+  selector: 'app-delete',
+  templateUrl: './delete.component.html',
+  styleUrls: ['./delete.component.css']
+})
+export class DeleteComponent {
+  constructor(private backendService: BackendService){}
+
+    deleteData(){
+      var name = (document.getElementById("regexInput") as HTMLInputElement).value;
+      if(name.length<1){
+        alert("error");
+        return;
+      } 
+      this.backendService.deleteData(name).subscribe({
+        next: (value) => {alert("successfully deleted")},
+        error: (e)=>{console.log(e); alert("error");}
+      });
+    }
+}
diff --git a/bluenps/src/app/home-page/home-page.component.css b/bluenps/src/app/home-page/home-page.component.css
diff --git a/bluenps/src/app/home-page/home-page.component.html b/bluenps/src/app/home-page/home-page.component.html
@@ -0,0 +1,31 @@
+<html>
+
+  <div class="row">
+    <div class="col border border-danger">
+      Blue
+    </div>
+    <div class="col border border-danger">
+      NPS
+    </div>
+  </div>
+  <div class="container">
+    <div class="mt-3 mb-3">
+      <select class="form-select" aria-label="courtSelection" id="courtSelection">
+        <option value="nps" selected="selected">NPS</option>
+        <option value="blue">BLUE</option>
+      </select>
+      <label for="nameInput" class="form-label">Name:</label>
+      <input class="form-control" id="nameInput" placeholder="CuteDaisey">
+      <button type="button" class="btn btn-success" (click)="submitCourtName()">submit</button>
+    </div>
+  </div>
+  <div class="container">
+    <li *ngFor="let player of data">
+      <div class="row">
+        <div class="col">{{player.name}}</div>
+        <div class="col">{{player.time}}</div>
+        <div class="col">{{player.court}}</div>
+      </div>
+  </div>
+
+</html>
diff --git a/bluenps/src/app/home-page/home-page.component.spec.ts b/bluenps/src/app/home-page/home-page.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HomePageComponent } from './home-page.component';
+
+describe('HomePageComponent', () => {
+  let component: HomePageComponent;
+  let fixture: ComponentFixture<HomePageComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [HomePageComponent]
+    });
+    fixture = TestBed.createComponent(HomePageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/bluenps/src/app/home-page/home-page.component.ts b/bluenps/src/app/home-page/home-page.component.ts
@@ -0,0 +1,49 @@
+import { Component } from '@angular/core';
+import {formatDate} from '@angular/common';
+import { HttpClient, HttpResponse } from  '@angular/common/http';
+import {signup, BackendService } from '../backend.service';
+import { RouterModule } from '@angular/router';
+@Component({
+  selector: 'app-home-page',
+  templateUrl: './home-page.component.html',
+  styleUrls: ['./home-page.component.css']
+})
+export class HomePageComponent {
+  title = 'bluenps';
+  test: any;
+  data: signup[]= [{name: "uninitialized", court: "uninitialized", time: "uninitialized"}];
+  constructor(private http: HttpClient, private backendService: BackendService){}
+
+  ngOnInit(){
+    this.refreshData();
+  }
+
+  refreshData(){
+    console.log("refreshing data");
+    this.backendService.getAllData()
+    .subscribe( data => this.data = data);
+  }
+  submitCourtName(): void{
+    var e = (document.getElementById("courtSelection") as HTMLInputElement);
+    var court = e.value;
+    var name = (document.getElementById("nameInput") as HTMLInputElement).value;
+    var date = new Date();
+    if(name==undefined || date==undefined || court == undefined){
+      alert("error");
+      return;
+    }
+    var dateString = formatDate(date, "yyyy-MM-dd", 'en')
+
+    var newSignup:signup = {
+                "name" : name,
+                "time" : dateString,
+                "court" : court
+    }
+    this.backendService.postSignup(newSignup).subscribe({
+      next: (value) =>this.refreshData(),
+      error:(e)=>{console.log("error",e); this.refreshData()}}
+    )
+    this.refreshData();
+  }
+
+}
diff --git a/bluenps/src/environments/environment.development.ts b/bluenps/src/environments/environment.development.ts
@@ -0,0 +1,4 @@
+export const environment = {
+    production: false,
+    backendUrl: "http://localhost:8000/",
+};
diff --git a/bluenps/src/environments/environment.ts b/bluenps/src/environments/environment.ts
@@ -0,0 +1,4 @@
+export const environment = {
+    production: true,
+    backendUrl: "https://backendbluenps.azurewebsites.net/",
+};
diff --git a/bluenpsbackend/court/__pycache__/urls.cpython-312.pyc b/bluenpsbackend/court/__pycache__/urls.cpython-312.pyc
diff --git a/bluenpsbackend/court/__pycache__/views.cpython-312.pyc b/bluenpsbackend/court/__pycache__/views.cpython-312.pyc
diff --git a/bluenpsbackend/court/urls.py b/bluenpsbackend/court/urls.py
@@ -4,5 +4,6 @@
 
 urlpatterns =[
     path("", views.index, name="index"),
-    path("all", views.all, name="all")
+    path("all", views.all, name="all"),
+    path("delete", views.deleteToday, name="delete")
 ]
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		<input class="form-control" id="regexInput" placeholder="CuteDaisey">
		<button type="button" class="btn btn-success" (click)="deleteData()">submit</button>