Merge branch 'develop' into jaime_leon

Caivan · May 23, 2020 · d0a5625 · d0a5625
2 parents b1c466b + d603028
commit d0a5625
Show file tree

Hide file tree

Showing 30 changed files with 346 additions and 177 deletions.
diff --git a/Poliradio/angular.json b/Poliradio/angular.json
@@ -32,6 +32,7 @@
               }
             ],
             "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
               {
                 "input": "src/theme/variables.scss"
               },
@@ -98,7 +99,9 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
-            "styles": [],
+            "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css"
+            ],
             "scripts": [],
             "assets": [
               {
@@ -128,7 +131,9 @@
               "tsconfig.spec.json",
               "e2e/tsconfig.json"
             ],
-            "exclude": ["**/node_modules/**"]
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         },
         "e2e": {
@@ -184,4 +189,4 @@
       "styleext": "scss"
     }
   }
-}
+}
diff --git a/Poliradio/package-lock.json b/Poliradio/package-lock.json
diff --git a/Poliradio/package.json b/Poliradio/package.json
@@ -13,9 +13,12 @@
   },
   "private": true,
   "dependencies": {
+    "@angular/animations": "~8.2.14",
+    "@angular/cdk": "~8.2.3",
     "@angular/common": "~8.2.14",
     "@angular/core": "~8.2.14",
     "@angular/forms": "~8.2.14",
+    "@angular/material": "^8.2.3",
     "@angular/platform-browser": "~8.2.14",
     "@angular/platform-browser-dynamic": "~8.2.14",
     "@angular/router": "~8.2.14",
@@ -31,12 +34,13 @@
     "cordova-browser": "6.0.0",
     "cordova-plugin-streaming-media": "^2.2.0",
     "core-js": "^2.5.4",
+    "hammerjs": "^2.0.8",
     "rxjs": "~6.5.1",
     "tslib": "^1.9.0",
     "zone.js": "~0.9.1"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.803.20",
+    "@angular-devkit/build-angular": "^0.901.7",
     "@angular/cli": "~8.3.23",
     "@angular/compiler": "~8.2.14",
     "@angular/compiler-cli": "~8.2.14",
@@ -82,4 +86,4 @@
       "android"
     ]
   }
-}
+}
diff --git a/Poliradio/src/app/Model/news.ts b/Poliradio/src/app/Model/news.ts
@@ -1,9 +1,13 @@
 export class news{
     title : string;
     content : string;
+    excerpt : string;
+    _links : string;
 
-    constructor (title, content){
+    constructor (title, content, excrept, _links){
         this.content = content;
         this.title = title;
+        this.excerpt = excrept;
+        this._links = _links;
     }
 }
diff --git a/Poliradio/src/app/app-routing.module.ts b/Poliradio/src/app/app-routing.module.ts
@@ -5,7 +5,12 @@ const routes: Routes = [
   {
     path: '',
     loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
+  },
+  {
+    path: 'news-modal',
+    loadChildren: () => import('./news-modal/news-modal.module').then( m => m.NewsModalPageModule)
   }
+
 ];
 @NgModule({
   imports: [

diff --git a/Poliradio/src/app/app.module.ts b/Poliradio/src/app/app.module.ts
@@ -9,18 +9,14 @@ import { StatusBar } from '@ionic-native/status-bar/ngx';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { HttpClientModule } from "@angular/common/http";
-import { WordPressConnectionService } from "./word-press-connection.service";
-import { StreamingMedia } from '@ionic-native/streaming-media/ngx';
-import { HeaderComponent } from './header/header.component';
 import { SharedModule } from './shared/shared.module';
 
-
-
 /**
  * SERVICES
  */
-import {SonginfoService} from './services/songinfo.service';
+import { SonginfoService } from './services/songinfo.service';
+import { WordPressConnectionService } from './services/word-press-connection.service';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 
 @NgModule({
@@ -31,11 +27,11 @@ import {SonginfoService} from './services/songinfo.service';
     IonicModule.forRoot(),
     AppRoutingModule,
     SharedModule,
-    HttpClientModule],
+    HttpClientModule,
+    BrowserAnimationsModule],
   providers: [
     StatusBar,
     SplashScreen,
-    StreamingMedia,
     SonginfoService,
     WordPressConnectionService,
     { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }

diff --git a/Poliradio/src/app/header/header.component.html b/Poliradio/src/app/header/header.component.html
@@ -1,38 +1,28 @@
 <ion-header [translucent]="true">
   <ion-toolbar>
     <div class="audio-player">
-      
+
       <div (click)="play()" *ngIf="!isPlaying" id="play-btn"></div>
       <div (click)="stop()" *ngIf="isPlaying" id="play-btn" class="pause"></div>
 
 
       <div class="audio-wrapper" id="player-container" href="javascript:;">
-        <audio  preload="metadata" (loadedmetadata)="control($event)" (timeupdate)="update()" name="media" #audioPlayer (ontimeupdate)="getCurrent()">
+        <audio preload="metadata" (loadedmetadata)="control($event)" (timeupdate)="update()" name="media" #audioPlayer
+          (ontimeupdate)="getCurrent()">
           <source [src]="URL" type="audio/mpeg">
-          </audio>
+        </audio>
       </div>
 
-
-
       <div class="player-controls scrubber">
-        <!--Song Name-->
-        <p>{{songName}}</p>
-        <!--Artist Name-->
+        <p style="font-weight: 700;">{{songName}}</p>
         <small>{{artistName}}</small>
-
-        <!--
-        <span id="seekObjContainer">
-          <progress id="seekObj" value="0" max="1"></progress>
-        </span>
-        <br>
-        <small style="float: left; position: relative; left: 15px;" class="start-time"></small>
-        <small style="float: right; position: relative; right: 20px;" class="end-time"></small>
-        -->
       </div>
-      <div class="album-image" style="background-image: src('https://poliradio.airtime.pro/api/album-artwork?id=67.png')"></div>
+      <div class="album-image">
+        <img *ngIf="this.albumImage" [src]="this.albumImage" alt="">
+      </div>
     </div>
-  </ion-toolbar>  
-  <ion-progress-bar [value] ="progress"> </ion-progress-bar>
-  
+  </ion-toolbar>
+  <ion-progress-bar [value]="progress"> </ion-progress-bar>
+
 
 </ion-header>
diff --git a/Poliradio/src/app/header/header.component.scss b/Poliradio/src/app/header/header.component.scss
@@ -1,9 +1,16 @@
 ion-content ion-toolbar {
     --background: translucent;
   }
+  .audio-player:hover{
+    background: light-gray;
+    color: #3498DB;
+  }
+
   .audio-player {
-    background: white;
+    background:#1a3882;
+   color: whitesmoke;
     border: 1px solid lighten(#acacac, 20%);
+    font: 150% sans-serif;
     width: 100%;
     text-align: center;
     display: flex;
@@ -12,16 +19,27 @@ ion-content ion-toolbar {
     max-height: 100px;
     //margin: 4rem 0 4rem 0;
     .album-image {
+      background-image: url(../../assets/audioplayer/null-image.png);
       min-height: 5%;
       height: auto;
       max-height: 100%;
-      width: 50%;
+      width: 40%;
       max-width: 100px;
       background-size: cover;
+      border-radius: 50%;
+      z-index: 9999;
+      margin: 0.15%;
+
+      img{
+        border-radius: 50%;
+        padding: 0.5%;
+      }
     }
+
     .player-controls {
       align-items: center;
       justify-content: center;
+      color: #fff;
       //margin-top: 2.5rem;
       flex: 3;
   /*    progress {
@@ -60,4 +78,5 @@ ion-content ion-toolbar {
         background-image: url('http://www.lukeduncan.me/images/pause-button.png');
       }
     }
+
   }
diff --git a/Poliradio/src/app/header/header.component.ts b/Poliradio/src/app/header/header.component.ts
@@ -4,6 +4,7 @@ import {SonginfoService} from "../services/songinfo.service";
 import { stringify } from 'querystring';
 import { format } from 'url';
 import { formatNumber, formatDate } from '@angular/common';
+import { environment } from 'src/environments/environment';
 
 @Component({
   selector: 'app-header',
@@ -14,20 +15,21 @@ export class HeaderComponent{
 
   @ViewChild('audioPlayer',{static: true})audioPlayer: HTMLMediaElement;
 
-  public URL= "https://poliradio.out.airtime.pro/poliradio_b";
+  public URL= environment.ACCESS_POINT_STREAMING;
   loaded = false;
   isPlaying = false;
   progress;
   duration;
   songName;
   songCurrentName;
-  artistName;
+  artistName:String;
   albumImage;  
   info;  
   startSongHour;
   actualHour;
   position;
   durationValues:string[];  
+
   constructor(private router:Router, private songinfoService:SonginfoService){
       router.events.forEach((event) => {
         if(event instanceof NavigationStart) {
@@ -48,7 +50,6 @@ export class HeaderComponent{
 
   control(event:any){
       this.loaded = true;
-      console.log(event)
       this.audioPlayer = event.srcElement;      
   }
 
@@ -64,7 +65,6 @@ export class HeaderComponent{
     if(this.loaded){
       if(this.isPlaying){
         this.progress=this.position;
-        console.log(this.progress);
         this.getCurrent();
         if(this.songName!=this.songCurrentName){
           this.progress=0;
@@ -92,8 +92,9 @@ export class HeaderComponent{
       let headers = keys.map(key =>
       `${key}: ${resp.headers.get(key)}`);
       this.info=resp.body;
-      this.songName=this.info.current.metadata.track_title;
-      this.artistName=this.info.current.metadata.artist_name; 
+      this.songName=String(this.info.current.metadata.track_title);
+
+      this.artistName=decodeURIComponent(this.info.current.metadata.artist_name); 
       this.albumImage=this.info.current.album_artwork_image;  
       this.durationValues= this.info.current.metadata.length.split(":");     
       this.startSongHour=this.info.current.starts.split(" ")[1].split(":") //inicia la cancion      

diff --git a/Poliradio/src/app/news-modal/news-modal.module.ts b/Poliradio/src/app/news-modal/news-modal.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { NewsModalPage } from './news-modal.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+  ],
+  declarations: [NewsModalPage]
+})
+export class NewsModalPageModule {}
diff --git a/Poliradio/src/app/news-modal/news-modal.page.html b/Poliradio/src/app/news-modal/news-modal.page.html
@@ -0,0 +1,16 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>{{post.title.rendered}}</ion-title>
+    <ion-buttons slot="end">
+      <ion-button (click)="closeModal()">
+        <ion-icon slot="icon-only" name="close"></ion-icon>
+      </ion-button>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-header>
+<ion-content>
+  <div class="content">
+   <div [innerHTML]="post.excerpt.rendered"></div>
+   <div [innerHTML]="post.content.rendered"></div>
+  </div>
+</ion-content>