diff options
| author | Kumar Priyansh <[email protected]> | 2018-09-09 08:19:27 +0530 |
|---|---|---|
| committer | Kumar Priyansh <[email protected]> | 2018-09-09 08:19:27 +0530 |
| commit | 5ef465dab66d20100630bba6a42f47c243aa476a (patch) | |
| tree | d95a1f961888d451733c947e42e56f49271f04be /src/pages | |
| download | NewsApp-5ef465dab66d20100630bba6a42f47c243aa476a.tar.xz NewsApp-5ef465dab66d20100630bba6a42f47c243aa476a.zip | |
Files Upload via GIT
Diffstat (limited to 'src/pages')
| -rw-r--r-- | src/pages/about/about.html | 17 | ||||
| -rw-r--r-- | src/pages/about/about.scss | 3 | ||||
| -rw-r--r-- | src/pages/about/about.ts | 14 | ||||
| -rw-r--r-- | src/pages/contact/contact.html | 19 | ||||
| -rw-r--r-- | src/pages/contact/contact.scss | 3 | ||||
| -rw-r--r-- | src/pages/contact/contact.ts | 14 | ||||
| -rw-r--r-- | src/pages/home/home.html | 18 | ||||
| -rw-r--r-- | src/pages/home/home.scss | 32 | ||||
| -rw-r--r-- | src/pages/home/home.ts | 40 | ||||
| -rw-r--r-- | src/pages/tabs/tabs.html | 5 | ||||
| -rw-r--r-- | src/pages/tabs/tabs.ts | 19 |
11 files changed, 184 insertions, 0 deletions
diff --git a/src/pages/about/about.html b/src/pages/about/about.html new file mode 100644 index 0000000..ea76b88 --- /dev/null +++ b/src/pages/about/about.html @@ -0,0 +1,17 @@ + +<ion-header> + <ion-navbar> + <ion-title> + About + </ion-title> + </ion-navbar> +</ion-header> + +<ion-content padding> + <h3>About News App</h3> + <p>Developed by <strong>Kumar Priyansh</strong> for Phones</p> + <p><strong>App Version: </strong> 1.0.0<br> + <strong>API Used: </strong> NewsAPI<br> + <strong>Framework: </strong> Ionic<br> + <strong>JS Library: </strong> JQuery<br> +</ion-content> diff --git a/src/pages/about/about.scss b/src/pages/about/about.scss new file mode 100644 index 0000000..639956d --- /dev/null +++ b/src/pages/about/about.scss @@ -0,0 +1,3 @@ +page-about { + +} diff --git a/src/pages/about/about.ts b/src/pages/about/about.ts new file mode 100644 index 0000000..a7ee80a --- /dev/null +++ b/src/pages/about/about.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; +import { NavController } from 'ionic-angular'; + +@Component({ + selector: 'page-about', + templateUrl: 'about.html' +}) +export class AboutPage { + + constructor(public navCtrl: NavController) { + + } + +} diff --git a/src/pages/contact/contact.html b/src/pages/contact/contact.html new file mode 100644 index 0000000..b1dfb59 --- /dev/null +++ b/src/pages/contact/contact.html @@ -0,0 +1,19 @@ +<ion-header> + <ion-navbar> + <ion-title> + Feedback + </ion-title> + </ion-navbar> +</ion-header> + +<ion-content padding> + <!--<ion-list> + <ion-list-header>Send your feedback on Twitter</ion-list-header> + <ion-item> + <ion-icon name="ionic" item-start></ion-icon> + @LuciferCReeves + </ion-item> + </ion-list>--> + <h3>Feedback sending is supported only via email.</h3> + <p>Send your feedbacks to <a href="mailto:[email protected]">[email protected]</a></p> +</ion-content> diff --git a/src/pages/contact/contact.scss b/src/pages/contact/contact.scss new file mode 100644 index 0000000..13d4440 --- /dev/null +++ b/src/pages/contact/contact.scss @@ -0,0 +1,3 @@ +page-contact { + +} diff --git a/src/pages/contact/contact.ts b/src/pages/contact/contact.ts new file mode 100644 index 0000000..3ccadc9 --- /dev/null +++ b/src/pages/contact/contact.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; +import { NavController } from 'ionic-angular'; + +@Component({ + selector: 'page-contact', + templateUrl: 'contact.html' +}) +export class ContactPage { + + constructor(public navCtrl: NavController) { + + } + +} diff --git a/src/pages/home/home.html b/src/pages/home/home.html new file mode 100644 index 0000000..c7830bb --- /dev/null +++ b/src/pages/home/home.html @@ -0,0 +1,18 @@ +<ion-header> + <ion-navbar> + <ion-title>News App</ion-title> + </ion-navbar> +</ion-header> + +<ion-content> + <!--<h2>Welcome to Ionic!</h2> + <p> + This starter project comes with simple tabs-based layout for apps + that are going to primarily use a Tabbed UI. + </p> + <p> + Take a look at the <code>src/pages/</code> directory to add or change tabs, + update any existing page or create new pages. + </p>--> + <div id="showNews"></div> +</ion-content> diff --git a/src/pages/home/home.scss b/src/pages/home/home.scss new file mode 100644 index 0000000..900c9ec --- /dev/null +++ b/src/pages/home/home.scss @@ -0,0 +1,32 @@ +.article { + height: 400px; + width: 100%; + background-position: center; + background-size: cover; + display: block; + margin: 5px; +} +.overlayart { + background-color: rgba(0, 0, 0, 0.568); + position: relative; + z-index: 1; + top: 0; + left: 0; + width: 100%; + height: 100%; +} +.art { + position: absolute; + bottom: 50px; + width: 100%; +} + +.art h3 { + color: white; + padding: 0px 20px; + width: 100%; +} +.art p { + color: white; + padding: 0px 20px; +}
\ No newline at end of file diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts new file mode 100644 index 0000000..df3af8f --- /dev/null +++ b/src/pages/home/home.ts @@ -0,0 +1,40 @@ +import { Component } from '@angular/core'; +import { NavController } from 'ionic-angular'; +import * as $ from 'jquery'; + +@Component({ + selector: 'page-home', + templateUrl: 'home.html' +}) +export class HomePage { + + constructor(public navCtrl: NavController) { + + } + ngAfterViewInit(){ + $(document).ready(function(){ + var url = 'https://newsapi.org/v2/top-headlines?country=in&apiKey=f449ba44714842379f423215072370dd'; + $.getJSON(url).then(function(res){ + //console.log(res); + var count; + for (count = 0; count<20; count++) { + var article = res.articles[count]; + var ImageURL = res.articles[count].urlToImage; + //console.log(article); + $('#showNews').append('<div id="'+count+'" class="article"><div class="overlayart"><div class="art"><h3>'+article.title+'</h3><p>'+article.description+'<br><br><a target="_blank" href="'+article.url+'">Follow Link</a></p></div></div></div>'); + $("#"+count).css('background-image','url(' + ImageURL + ')'); + } + }) + //$.getJSON(url).then(function(res){ + // console.log(res) + // var count; + // for(count = 0; count < 20; count++){ + // var article = res.articles[count] + // var ImageURL = res.articles[count].urlToImage + // //console.log(ImageURL) + // $('#showNews').append('<div id="'+count+'" class="article"><div class="overlayart"><div class="art"><h3>'+article.title+'</h3><p>'+article.description+'<br><a href="'+article.url+'">Follow Link</a></p></div></div></div>'); + // $("#"+count).css('background-image','url(' + ImageURL + ')'); + //} + }) + } + }
\ No newline at end of file diff --git a/src/pages/tabs/tabs.html b/src/pages/tabs/tabs.html new file mode 100644 index 0000000..bed91a4 --- /dev/null +++ b/src/pages/tabs/tabs.html @@ -0,0 +1,5 @@ +<ion-tabs> + <ion-tab [root]="tab1Root" tabTitle="Read" tabIcon="book"></ion-tab> + <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="information-circle"></ion-tab> + <ion-tab [root]="tab3Root" tabTitle="Feedback" tabIcon="megaphone"></ion-tab> +</ion-tabs> diff --git a/src/pages/tabs/tabs.ts b/src/pages/tabs/tabs.ts new file mode 100644 index 0000000..f80301b --- /dev/null +++ b/src/pages/tabs/tabs.ts @@ -0,0 +1,19 @@ +import { Component } from '@angular/core'; + +import { AboutPage } from '../about/about'; +import { ContactPage } from '../contact/contact'; +import { HomePage } from '../home/home'; + +@Component({ + templateUrl: 'tabs.html' +}) +export class TabsPage { + + tab1Root = HomePage; + tab2Root = AboutPage; + tab3Root = ContactPage; + + constructor() { + + } +} |
