Skip to content

Commit 315ac4b

Browse files
feat(ng): add home and details
1 parent 163bc3d commit 315ac4b

28 files changed

+351
-156
lines changed

angular-demo/package-lock.json

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

angular-demo/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
},
4747
"devDependencies": {
4848
"@angular/compiler-cli": "~12.0.0",
49+
"@nativescript/ios": "8.0.0",
4950
"@nativescript/types": "~8.0.0",
5051
"@nativescript/webpack": "beta",
5152
"@ngtools/webpack": "~12.0.0",
Lines changed: 32 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,40 @@ of writing your own CSS rules. You can learn more about the
1010
NativeScript core theme at https://github.com/nativescript/theme
1111
The imported CSS rules must precede all other types of rules.
1212
*/
13-
@import '@nativescript/theme/css/core.css';
14-
@import '@nativescript/theme/css/default.css';
13+
@import "@nativescript/theme/css/core.css";
14+
@import "@nativescript/theme/css/default.css";
1515

1616
/* Place any CSS rules you want to apply on both iOS and Android here.
1717
This is where the vast majority of your CSS code goes. */
1818

19-
/*
20-
The following CSS rule changes the font size of all Buttons that have the
21-
"-primary" class modifier.
22-
*/
23-
Button.-primary {
24-
font-size: 18;
19+
// applied when device is in light mode
20+
.ns-light {
21+
.bg-primary {
22+
background-color: #fdfdfd;
23+
}
24+
.bg-secondary {
25+
background-color: #ffffff;
26+
}
27+
.text-primary {
28+
color: #444;
29+
}
30+
.text-secondary {
31+
color: #777;
32+
}
33+
}
34+
35+
// applied when device is in dark mode
36+
.ns-dark {
37+
.bg-primary {
38+
background-color: #212121;
39+
}
40+
.bg-secondary {
41+
background-color: #383838;
42+
}
43+
.text-primary {
44+
color: #eee;
45+
}
46+
.text-secondary {
47+
color: #ccc;
48+
}
2549
}
Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,23 @@
1-
import { NgModule } from '@angular/core'
2-
import { Routes } from '@angular/router'
3-
import { NativeScriptRouterModule } from '@nativescript/angular'
4-
5-
import { ItemsComponent } from './item/items.component'
6-
import { ItemDetailComponent } from './item/item-detail.component'
1+
import { NgModule } from "@angular/core";
2+
import { Routes } from "@angular/router";
3+
import { NativeScriptRouterModule } from "@nativescript/angular";
74

85
const routes: Routes = [
9-
{ path: '', redirectTo: '/items', pathMatch: 'full' },
10-
{ path: 'items', component: ItemsComponent },
11-
{ path: 'item/:id', component: ItemDetailComponent },
12-
]
6+
{ path: "", redirectTo: "/home", pathMatch: "full" },
7+
{
8+
path: "home",
9+
loadChildren: () =>
10+
import("./features/home/home.module").then(m => m.HomeModule)
11+
},
12+
{
13+
path: "details/:id",
14+
loadChildren: () =>
15+
import("./features/details/details.module").then(m => m.DetailsModule)
16+
}
17+
];
1318

1419
@NgModule({
1520
imports: [NativeScriptRouterModule.forRoot(routes)],
16-
exports: [NativeScriptRouterModule],
21+
exports: [NativeScriptRouterModule]
1722
})
1823
export class AppRoutingModule {}
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
<GridLayout>
1+
<RootLayout>
22
<page-router-outlet></page-router-outlet>
3-
</GridLayout>
3+
</RootLayout>

angular-demo/src/app/app.module.ts

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,13 @@
1-
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core'
2-
import { NativeScriptModule } from '@nativescript/angular'
1+
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
2+
import { NativeScriptModule } from "@nativescript/angular";
33

4-
import { AppRoutingModule } from './app-routing.module'
5-
import { AppComponent } from './app.component'
6-
import { ItemsComponent } from './item/items.component'
7-
import { ItemDetailComponent } from './item/item-detail.component'
4+
import { AppRoutingModule } from "./app-routing.module";
5+
import { AppComponent } from "./app.component";
86

97
@NgModule({
108
bootstrap: [AppComponent],
119
imports: [NativeScriptModule, AppRoutingModule],
12-
declarations: [AppComponent, ItemsComponent, ItemDetailComponent],
13-
providers: [],
14-
schemas: [NO_ERRORS_SCHEMA],
10+
declarations: [AppComponent],
11+
schemas: [NO_ERRORS_SCHEMA]
1512
})
1613
export class AppModule {}

angular-demo/src/app/core/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export * from "./models";
2+
export * from "./services";
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
export interface FlickModel {
2+
id: number;
3+
genre: string;
4+
title: string;
5+
image: string;
6+
url: string;
7+
description: string;
8+
details: {
9+
title: string;
10+
body: string;
11+
}[];
12+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from "./flick.model";
Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
import { Injectable } from "@angular/core";
2+
import { FlickModel } from "~/app/core/models";
3+
4+
@Injectable({
5+
providedIn: "root"
6+
})
7+
export class FlickService {
8+
private flicks: FlickModel[] = [
9+
{
10+
id: 1,
11+
genre: "Musical",
12+
title: "Book of Mormon",
13+
image: "~/assets/bookofmormon.png",
14+
url: "https://nativescript.org/images/ngconf/book-of-mormon.mov",
15+
description: `A satirical examination of the beliefs and practices of The Church of Jesus Christ of Latter-day Saints.`,
16+
details: [
17+
{
18+
title: "Music, Lyrics and Book by",
19+
body: "Trey Parker, Robert Lopez, and Matt Stone"
20+
},
21+
{
22+
title: "First showing on Broadway",
23+
body: "March 2011 after nearly seven years of development."
24+
},
25+
{
26+
title: "Revenue",
27+
body:
28+
"Grossed over $500 million, making it one of the most successful musicals of all time."
29+
},
30+
{
31+
title: "History",
32+
body:
33+
'The Book of Mormon was conceived by Trey Parker, Matt Stone and Robert Lopez. Parker and Stone grew up in Colorado, and were familiar with The Church of Jesus Christ of Latter-day Saints and its members. They became friends at the University of Colorado Boulder and collaborated on a musical film, Cannibal! The Musical (1993), their first experience with movie musicals. In 1997, they created the TV series South Park for Comedy Central and in 1999, the musical film South Park: Bigger, Longer & Uncut. The two had first thought of a fictionalized Joseph Smith, religious leader and founder of the Latter Day Saint movement, while working on an aborted Fox series about historical characters. Their 1997 film, Orgazmo, and a 2003 episode of South Park, "All About Mormons", both gave comic treatment to Mormonism. Smith was also included as one of South Park\'s "Super Best Friends", a Justice League parody team of religious figures like Jesus and Buddha.'
34+
},
35+
{
36+
title: "Development",
37+
body: `During the summer of 2003, Parker and Stone flew to New York City to discuss the script of their new film, Team America: World Police, with friend and producer Scott Rudin (who also produced South Park: Bigger, Longer & Uncut). Rudin advised the duo to see the musical Avenue Q on Broadway, finding the cast of marionettes in Team America similar to the puppets of Avenue Q. Parker and Stone went to see the production during that summer and the writer-composers of Avenue Q, Lopez and Jeff Marx, noticed them in the audience and introduced themselves. Lopez revealed that South Park: Bigger, Longer & Uncut was highly influential in the creation of Avenue Q. The quartet went for drinks afterwards, and soon found that each camp wanted to write something involving Joseph Smith. The four began working out details nearly immediately, with the idea to create a modern story formulated early on. For research purposes, the quartet took a road trip to Salt Lake City where they "interviewed a bunch of missionaries—or ex-missionaries." They had to work around Parker and Stone\'s South Park schedule. In 2006, Parker and Stone flew to London where they spent three weeks with Lopez, who was working on the West End production of Avenue Q. There, the three wrote "four or five songs" and came up with the basic idea of the story. After an argument between Parker and Marx, who felt he was not getting enough creative control, Marx was separated from the project.[10] For the next few years, the remaining trio met frequently to develop what they initially called The Book of Mormon: The Musical of the Church of Jesus Christ of Latter-day Saints. "There was a lot of hopping back and forth between L.A. and New York," Parker recalled.`
38+
}
39+
]
40+
},
41+
{
42+
id: 2,
43+
genre: "Musical",
44+
title: "Beetlejuice",
45+
image: "~/assets/beetlejuicemusical.png",
46+
url: "https://nativescript.org/images/ngconf/beetlejuice.mov",
47+
description: `A deceased couple looks for help from a devious bio-exorcist to handle their haunted house.`,
48+
details: [
49+
{
50+
title: "Music and Lyrics",
51+
body: "Eddie Perfect"
52+
},
53+
{
54+
title: "Book by",
55+
body: "Scott Brown and Anthony King"
56+
},
57+
{
58+
title: "Based on",
59+
body: "A 1988 film of the same name."
60+
},
61+
{
62+
title: "First showing on Broadway",
63+
body: "April 25, 2019"
64+
},
65+
{
66+
title: "Background",
67+
body: `In 2016, a musical adaptation of the 1988 film Beetlejuice (directed by Tim Burton and starring Geena Davis as Barbara Maitland, Alec Baldwin as Adam Maitland, Winona Ryder as Lydia Deetz and Michael Keaton as Betelgeuse) was reported to be in the works, directed by Alex Timbers and produced by Warner Bros., following a reading with Christopher Fitzgerald in the title role. In March 2017, it was reported that Australian musical comedian Eddie Perfect would be writing the music and lyrics and Scott Brown and Anthony King would be writing the book of the musical, and that another reading would take place in May, featuring Kris Kukul as musical director. The musical has had three readings and two laboratory workshops with Alex Brightman in the title role, Sophia Anne Caruso as Lydia Deetz, Kerry Butler and Rob McClure as Barbara and Adam Maitland.`
68+
}
69+
]
70+
},
71+
{
72+
id: 3,
73+
genre: "Musical",
74+
title: "Anastasia",
75+
image: "~/assets/anastasia.png",
76+
url: "https://nativescript.org/images/ngconf/anastasia.mov",
77+
description: `The legend of Grand Duchess Anastasia Nikolaevna of Russia.`,
78+
details: [
79+
{ title: "Music and Lyrics", body: "Lynn Ahrens and Stephen Flaherty" },
80+
{
81+
title: "Book by",
82+
body: "Terrence McNally"
83+
},
84+
{
85+
title: "Based on",
86+
body: "A 1997 film of the same name."
87+
},
88+
{
89+
title: "Background",
90+
body: `A reading was held in 2012, featuring Kelli Barret as Anya (Anastasia), Aaron Tveit as Dmitry, Patrick Page as Vladimir, and Angela Lansbury as the Empress Maria. A workshop was held on June 12, 2015, in New York City, and included Elena Shaddow as Anya, Ramin Karimloo as Gleb Vaganov, a new role, and Douglas Sills as Vlad.
91+
The original stage production of Anastasia premiered at the Hartford Stage in Hartford, Connecticut on May 13, 2016 (previews). The show was directed by Darko Tresnjak and choreography by Peggy Hickey, with Christy Altomare and Derek Klena starring as Anya and Dmitry, respectively.
92+
Director Tresnjak explained: "We've kept, I think, six songs from the movie, but there are 16 new numbers. We've kept the best parts of the animated movie, but it really is a new musical." The musical also adds characters not in the film. Additionally, Act 1 is set in Russia and Act 2 in Paris, "which was everything modern Soviet Russia was not: free, expressive, creative, no barriers," according to McNally.
93+
The musical also omits the supernatural elements from the original film, including the character of Rasputin and his musical number "In the Dark of the Night", (although that song’s melody is repurposed in the new number "Stay, I Pray You"), and introduces instead a new villain called Gleb, a general for the Bolsheviks who receives orders to kill Anya.`
94+
}
95+
]
96+
}
97+
];
98+
99+
getFlicks(): FlickModel[] {
100+
return this.flicks;
101+
}
102+
103+
getFlickById(id: number): FlickModel | undefined {
104+
return this.flicks.find(flick => flick.id === id) || undefined;
105+
}
106+
}

0 commit comments

Comments
 (0)