= getAllHeroes()
24 | .first { hero ->
25 | hero.id == heroId
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/kotlin/com/github/crunc/angular/sample/services/InMemoryDataService.kt:
--------------------------------------------------------------------------------
1 | package com.github.crunc.angular.sample.services
2 |
3 | import ng.api.inMemoryWebApi.InMemoryDbService
4 | import kotlin.js.Json
5 | import kotlin.js.json
6 |
7 | class InMemoryDataService : InMemoryDbService() {
8 | override fun createDb(): Json = json(
9 | "heroes" to arrayOf(
10 | json("id" to 11, "name" to "Mr. Nice"),
11 | json("id" to 12, "name" to "Narco"),
12 | json("id" to 13, "name" to "Bombasto"),
13 | json("id" to 14, "name" to "Celeritas"),
14 | json("id" to 15, "name" to "Magneta"),
15 | json("id" to 16, "name" to "RubberMan"),
16 | json("id" to 17, "name" to "Dynama"),
17 | json("id" to 18, "name" to "Dr IQ"),
18 | json("id" to 19, "name" to "Magma"),
19 | json("id" to 20, "name" to "Tornado")
20 | )
21 | )
22 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/AppComponent.css:
--------------------------------------------------------------------------------
1 | .selected {
2 | background-color: #CFD8DC !important;
3 | color: white;
4 | }
5 | .heroes {
6 | margin: 0 0 2em 0;
7 | list-style-type: none;
8 | padding: 0;
9 | width: 15em;
10 | }
11 | .heroes li {
12 | cursor: pointer;
13 | position: relative;
14 | left: 0;
15 | background-color: #EEE;
16 | margin: .5em;
17 | padding: .3em 0;
18 | height: 1.6em;
19 | border-radius: 4px;
20 | }
21 | .heroes li.selected:hover {
22 | background-color: #BBD8DC !important;
23 | color: white;
24 | }
25 | .heroes li:hover {
26 | color: #607D8B;
27 | background-color: #DDD;
28 | left: .1em;
29 | }
30 | .heroes .text {
31 | position: relative;
32 | top: -3px;
33 | }
34 | .heroes .badge {
35 | display: inline-block;
36 | font-size: small;
37 | color: white;
38 | padding: 0.8em 0.7em 0 0.7em;
39 | background-color: #607D8B;
40 | line-height: 1em;
41 | position: relative;
42 | left: -1px;
43 | top: -4px;
44 | height: 1.8em;
45 | margin-right: .8em;
46 | border-radius: 4px 0 0 4px;
47 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/AppComponent.html:
--------------------------------------------------------------------------------
1 | {{title}}
2 |
6 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/DashboardComponent.css:
--------------------------------------------------------------------------------
1 | [class*='col-'] {
2 | float: left;
3 | padding-right: 20px;
4 | padding-bottom: 20px;
5 | }
6 | [class*='col-']:last-of-type {
7 | padding-right: 0;
8 | }
9 | a {
10 | text-decoration: none;
11 | }
12 | *, *:after, *:before {
13 | -webkit-box-sizing: border-box;
14 | -moz-box-sizing: border-box;
15 | box-sizing: border-box;
16 | }
17 | h3 {
18 | text-align: center; margin-bottom: 0;
19 | }
20 | h4 {
21 | position: relative;
22 | }
23 | .grid {
24 | margin: 0;
25 | }
26 | .col-1-4 {
27 | width: 25%;
28 | }
29 | .module {
30 | padding: 20px;
31 | text-align: center;
32 | color: #eee;
33 | max-height: 120px;
34 | min-width: 120px;
35 | background-color: #607D8B;
36 | border-radius: 2px;
37 | }
38 | .module:hover {
39 | background-color: #EEE;
40 | cursor: pointer;
41 | color: #607d8b;
42 | }
43 | .grid-pad {
44 | padding: 10px 0;
45 | }
46 | .grid-pad > [class*='col-']:last-of-type {
47 | padding-right: 20px;
48 | }
49 | @media (max-width: 600px) {
50 | .module {
51 | font-size: 10px;
52 | max-height: 75px; }
53 | }
54 | @media (max-width: 1024px) {
55 | .grid {
56 | margin: 0;
57 | }
58 | .module {
59 | min-width: 60px;
60 | }
61 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/DashboardComponent.html:
--------------------------------------------------------------------------------
1 | Top Heroes
2 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/HeroDetailComponent.css:
--------------------------------------------------------------------------------
1 | label {
2 | display: inline-block;
3 | width: 3em;
4 | margin: .5em 0;
5 | color: #607D8B;
6 | font-weight: bold;
7 | }
8 | input {
9 | height: 2em;
10 | font-size: 1em;
11 | padding-left: .4em;
12 | }
13 | button {
14 | margin-top: 20px;
15 | font-family: Arial;
16 | background-color: #eee;
17 | border: none;
18 | padding: 5px 10px;
19 | border-radius: 4px;
20 | cursor: pointer; cursor: hand;
21 | }
22 | button:hover {
23 | background-color: #cfd8dc;
24 | }
25 | button:disabled {
26 | background-color: #eee;
27 | color: #ccc;
28 | cursor: auto;
29 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/HeroDetailComponent.html:
--------------------------------------------------------------------------------
1 |
2 |
{{hero.name}} details!
3 |
4 | {{hero.id}}
5 |
6 |
7 |
8 |
9 |
10 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/HeroesComponent.css:
--------------------------------------------------------------------------------
1 | .selected {
2 | background-color: #CFD8DC !important;
3 | color: white;
4 | }
5 | .heroes {
6 | margin: 0 0 2em 0;
7 | list-style-type: none;
8 | padding: 0;
9 | width: 15em;
10 | }
11 | .heroes li {
12 | cursor: pointer;
13 | position: relative;
14 | left: 0;
15 | background-color: #EEE;
16 | margin: .5em;
17 | padding: .3em 0;
18 | height: 1.6em;
19 | border-radius: 4px;
20 | }
21 | .heroes li:hover {
22 | color: #607D8B;
23 | background-color: #DDD;
24 | left: .1em;
25 | }
26 | .heroes li.selected:hover {
27 | background-color: #BBD8DC !important;
28 | color: white;
29 | }
30 | .heroes .text {
31 | position: relative;
32 | top: -3px;
33 | }
34 | .heroes .badge {
35 | display: inline-block;
36 | font-size: small;
37 | color: white;
38 | padding: 0.8em 0.7em 0 0.7em;
39 | background-color: #607D8B;
40 | line-height: 1em;
41 | position: relative;
42 | left: -1px;
43 | top: -4px;
44 | height: 1.8em;
45 | margin-right: .8em;
46 | border-radius: 4px 0 0 4px;
47 | }
48 | button {
49 | font-family: Arial;
50 | background-color: #eee;
51 | border: none;
52 | padding: 5px 10px;
53 | border-radius: 4px;
54 | cursor: pointer;
55 | cursor: hand;
56 | }
57 | button:hover {
58 | background-color: #cfd8dc;
59 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/components/HeroesComponent.html:
--------------------------------------------------------------------------------
1 | My Heroes
2 |
3 | -
6 | {{hero.id}} {{hero.name}}
7 |
8 |
9 |
10 |
11 | {{selectedHero.name | uppercase}} is my hero
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Tour of Heroes
6 |
7 |
8 |
9 |
10 |
11 |
12 | Loading...
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/main/resources/styles.css:
--------------------------------------------------------------------------------
1 | h1 {
2 | color: #369;
3 | font-family: Arial, Helvetica, sans-serif;
4 | font-size: 250%;
5 | }
6 | h2, h3 {
7 | color: #444;
8 | font-family: Arial, Helvetica, sans-serif;
9 | font-weight: lighter;
10 | }
11 | body {
12 | margin: 2em;
13 | }
14 | body, input[text], button {
15 | color: #888;
16 | font-family: Cambria, Georgia;
17 | }
18 | a {
19 | cursor: pointer;
20 | cursor: hand;
21 | }
22 | button {
23 | font-family: Arial;
24 | background-color: #eee;
25 | border: none;
26 | padding: 5px 10px;
27 | border-radius: 4px;
28 | cursor: pointer;
29 | cursor: hand;
30 | }
31 | button:hover {
32 | background-color: #cfd8dc;
33 | }
34 | button:disabled {
35 | background-color: #eee;
36 | color: #aaa;
37 | cursor: auto;
38 | }
39 |
40 | /* Navigation link styles */
41 | nav a {
42 | padding: 5px 10px;
43 | text-decoration: none;
44 | margin-right: 10px;
45 | margin-top: 10px;
46 | display: inline-block;
47 | background-color: #eee;
48 | border-radius: 4px;
49 | }
50 | nav a:visited, a:link {
51 | color: #607D8B;
52 | }
53 | nav a:hover {
54 | color: #039be5;
55 | background-color: #CFD8DC;
56 | }
57 | nav a.active {
58 | color: #039be5;
59 | }
60 |
61 | /* items class */
62 | .items {
63 | margin: 0 0 2em 0;
64 | list-style-type: none;
65 | padding: 0;
66 | width: 24em;
67 | }
68 | .items li {
69 | cursor: pointer;
70 | position: relative;
71 | left: 0;
72 | background-color: #EEE;
73 | margin: .5em;
74 | padding: .3em 0;
75 | height: 1.6em;
76 | border-radius: 4px;
77 | }
78 | .items li:hover {
79 | color: #607D8B;
80 | background-color: #DDD;
81 | left: .1em;
82 | }
83 | .items li.selected {
84 | background-color: #CFD8DC;
85 | color: white;
86 | }
87 | .items li.selected:hover {
88 | background-color: #BBD8DC;
89 | }
90 | .items .text {
91 | position: relative;
92 | top: -3px;
93 | }
94 | .items .badge {
95 | display: inline-block;
96 | font-size: small;
97 | color: white;
98 | padding: 0.8em 0.7em 0 0.7em;
99 | background-color: #607D8B;
100 | line-height: 1em;
101 | position: relative;
102 | left: -1px;
103 | top: -4px;
104 | height: 1.8em;
105 | margin-right: .8em;
106 | border-radius: 4px 0 0 4px;
107 | }
108 | /* everywhere else */
109 | * {
110 | font-family: Arial, Helvetica, sans-serif;
111 | }
--------------------------------------------------------------------------------
/kotlin-angular-sample/src/test/kotlin/com/github/crunc/angular/sample/components/HeroDetailComponentSpec.kt:
--------------------------------------------------------------------------------
1 | package com.github.crunc.angular.sample.components
2 |
3 | import jasmine.beforeEach
4 | import jasmine.describe
5 | import jasmine.it
6 | import ng.api.core.testing.TestBed
7 | import ng.api.core.testing.async
8 |
9 | val spec = describe("HeroDetailComponent") {
10 |
11 | beforeEach { ->
12 | async {
13 | TestBed.configureTestingModule(
14 | declarations = arrayOf(HeroDetailComponent)
15 | ).compileComponents()
16 | }
17 | }
18 |
19 | it("should run") { ->
20 | console.log("running...")
21 | }
22 | }
--------------------------------------------------------------------------------
/pom.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 | 4.0.0
5 |
6 | com.github.crunc
7 | kotlin-angular
8 | 2.4.8-SNAPSHOT
9 | pom
10 |
11 | Kotlin Angular
12 | Kotlin Angular
13 |
14 |
15 | https://github.com/Crunc/kotlin-angular.git
16 | scm:git:git@github.com:Crunc/kotlin-angular.git
17 | scm:git:git@github.com:Crunc/kotlin-angular.git
18 |
19 |
20 |
21 | kotlin-angular-dependencies
22 | kotlin-angular-parent
23 | kotlin-angular-lib-parent
24 | kotlin-angular-app-parent
25 | kotlin-angular-core
26 | kotlin-angular-core-test
27 | kotlin-angular-in-memory-web-api
28 | kotlin-angular-sample
29 |
30 |
31 |
32 |
--------------------------------------------------------------------------------