Repository: NativeScript/sample-Groceries
Branch: master
Commit: 7b0cca917754
Files: 76
Total size: 113.9 KB
Directory structure:
gitextract_9481lv8a/
├── .ctags-exclude
├── .gitignore
├── .travis.yml
├── .vscode/
│ ├── launch.json
│ └── settings.json
├── CODE_OF_CONDUCT.md
├── LICENSE
├── README.md
├── app/
│ ├── App_Resources/
│ │ ├── Android/
│ │ │ ├── app.gradle
│ │ │ └── src/
│ │ │ └── main/
│ │ │ ├── AndroidManifest.xml
│ │ │ └── res/
│ │ │ ├── drawable-nodpi/
│ │ │ │ └── splash_screen.xml
│ │ │ ├── values/
│ │ │ │ ├── colors.xml
│ │ │ │ ├── strings.xml
│ │ │ │ └── styles.xml
│ │ │ └── values-v21/
│ │ │ ├── colors.xml
│ │ │ └── styles.xml
│ │ └── iOS/
│ │ ├── Assets.xcassets/
│ │ │ ├── AppIcon.appiconset/
│ │ │ │ └── Contents.json
│ │ │ ├── Contents.json
│ │ │ ├── LaunchImage.launchimage/
│ │ │ │ └── Contents.json
│ │ │ ├── LaunchScreen.AspectFill.imageset/
│ │ │ │ └── Contents.json
│ │ │ └── LaunchScreen.Center.imageset/
│ │ │ └── Contents.json
│ │ ├── Info.plist
│ │ ├── LaunchScreen.storyboard
│ │ └── build.xcconfig
│ ├── app.component.ts
│ ├── app.css
│ ├── app.module.ngfactory.d.ts
│ ├── app.module.ts
│ ├── app.routing.ts
│ ├── auth-guard.service.ts
│ ├── groceries/
│ │ ├── groceries-common.css
│ │ ├── groceries.component.android.css
│ │ ├── groceries.component.html
│ │ ├── groceries.component.ios.css
│ │ ├── groceries.component.ts
│ │ ├── groceries.module.ts
│ │ ├── groceries.routing.ts
│ │ ├── grocery-list/
│ │ │ ├── grocery-list.component.css
│ │ │ ├── grocery-list.component.html
│ │ │ ├── grocery-list.component.ts
│ │ │ └── item-status.pipe.ts
│ │ └── shared/
│ │ ├── grocery.model.ts
│ │ ├── grocery.service.ts
│ │ └── index.ts
│ ├── login/
│ │ ├── login-common.css
│ │ ├── login.component.android.css
│ │ ├── login.component.html
│ │ ├── login.component.ios.css
│ │ ├── login.component.ts
│ │ ├── login.module.ts
│ │ └── login.routing.ts
│ ├── main.aot.ts
│ ├── main.ts
│ ├── package.json
│ ├── platform.android.css
│ ├── platform.ios.css
│ ├── shared/
│ │ ├── backend.service.ts
│ │ ├── dialog-util.ts
│ │ ├── index.ts
│ │ ├── login.service.ts
│ │ ├── status-bar-util.ts
│ │ └── user.model.ts
│ └── tests/
│ └── shared/
│ └── user/
│ └── user.spec.ts
├── e2e/
│ ├── config/
│ │ ├── appium.capabilities.json
│ │ └── mocha.opts
│ ├── groceries.e2e.ts
│ ├── setup.ts
│ └── tsconfig.json
├── karma.conf.js
├── package.json
├── references.d.ts
├── tsconfig.esm.json
├── tsconfig.json
├── tsconfig.tns.json
├── tslint.json
└── webpack.config.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .ctags-exclude
================================================
node_modules
platforms
android17.d.ts
ios.d.ts
*.js
bin
================================================
FILE: .gitignore
================================================
npm-debug.log
.DS_Store
*.js.map
app/**/*.js
e2e/**/*.js
e2e/reports/
hooks/
lib/
node_modules/
platforms/
tmp/
typings/
report/
test-results.xml
================================================
FILE: .travis.yml
================================================
env:
global:
- ANDROID_PACKAGE='sampleGroceries.apk'
- ANDROID_PACKAGE_FOLDER=$TRAVIS_BUILD_DIR/platforms/android/app/build/outputs/apk/debug/
- ANDROID_SAUCE_STORAGE="https://saucelabs.com/rest/v1/storage/$SAUCE_USER/$ANDROID_PACKAGE?overwrite=true"
- IOS_PACKAGE='sampleGroceries.zip'
- IOS_APP_NAME='sampleGroceries.app'
- IOS_PACKAGE_FOLDER=$TRAVIS_BUILD_DIR/platforms/ios/build/Debug-iphonesimulator
- IOS_SAUCE_STORAGE="https://saucelabs.com/rest/v1/storage/$SAUCE_USER/$IOS_PACKAGE?overwrite=true"
branches:
only:
- master
matrix:
include:
- stage: "Lint"
language: node_js
os: linux
node_js: "10"
install: true
script: npm i && npm run tslint
- stage: "Build"
os: osx
env:
- BuildiOS="12"
- Xcode="10.0"
osx_image: xcode10
language: node_js
node_js: "10"
jdk: oraclejdk8
script:
- tns build ios --bundle --env.aot --env.uglify
- cd $IOS_PACKAGE_FOLDER && zip -r $IOS_PACKAGE $IOS_APP_NAME
- "curl -u $SAUCE_USER:$SAUCE_KEY -X POST -H 'Content-Type: application/octet-stream' $IOS_SAUCE_STORAGE --data-binary @$IOS_PACKAGE_FOLDER/$IOS_PACKAGE"
- language: android
env:
- BuildAndroid="28"
os: linux
jdk: oraclejdk8
before_install: nvm install 10
script:
- tns build android --bundle --env.aot --env.uglify --env.snapshot
- "curl -u $SAUCE_USER:$SAUCE_KEY -X POST -H 'Content-Type: application/octet-stream' $ANDROID_SAUCE_STORAGE --data-binary @$ANDROID_PACKAGE_FOLDER/app-debug.apk"
- stage: "UI Tests"
env:
- AndroidEmulator="23"
language: node_js
os: linux
node_js: "10"
script:
# - npm i -g appium@1.8.0
- npm i
- travis_retry npm run e2e -- --runType android23 --sauceLab --appPath $ANDROID_PACKAGE
- os: linux
env:
- iOS="11"
language: node_js
node_js: "10"
script:
# - npm i -g appium@1.8.0
- npm i
- travis_wait travis_retry npm run e2e -- --runType sim.iPhone8 --sauceLab --appPath $IOS_PACKAGE
android:
components:
- tools
- platform-tools
- build-tools-28.0.3
- android-28
- extra-android-m2repository
before_cache:
- rm -f $HOME/.gradle/caches/modules-2/modules-2.lock
cache:
directories:
- .nvm
- $HOME/.gradle/caches/
- $HOME/.gradle/wrapper/
install:
- pip install six
- echo no | npm install -g nativescript@latest --ignore-scripts
- tns usage-reporting disable
- tns error-reporting disable
================================================
FILE: .vscode/launch.json
================================================
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Mocha Tests",
"program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
"args": [
"--runType",
"android23",
"--sauceLab",
"-v",
"--appPath",
"sampleGroceries.apk",
"--timeout",
"999999",
"-u",
"tdd",
"--timeout",
"999999",
"--colors",
"${workspaceFolder}/e2e"
],
"internalConsoleOptions": "openOnSessionStart"
},
{
"name": "Sync on iOS",
"type": "nativescript",
"platform": "ios",
"request": "launch",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false,
"rebuild": false,
"syncAllFiles": false
},
{
"name": "Launch on iOS",
"type": "nativescript",
"platform": "ios",
"request": "launch",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false,
"rebuild": true
},
{
"name": "Attach on iOS",
"type": "nativescript",
"platform": "ios",
"request": "attach",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false
},
{
"name": "Sync on Android",
"type": "nativescript",
"platform": "android",
"request": "launch",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false,
"rebuild": false
},
{
"name": "Launch on Android",
"type": "nativescript",
"platform": "android",
"request": "launch",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false,
"rebuild": true
},
{
"name": "Attach on Android",
"type": "nativescript",
"platform": "android",
"request": "attach",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"diagnosticLogging": false,
"emulator": false
}
]
}
================================================
FILE: .vscode/settings.json
================================================
// Place your settings in this file to overwrite default and user settings.
{
"files.exclude": {
"**/*.js": { "when": "$(basename).ts" },
"**/*.map": { "when": "$(basename).map" }
}
}
================================================
FILE: CODE_OF_CONDUCT.md
================================================
# NativeScript Community Code of Conduct
Our community members come from all walks of life and are all at different stages of their personal and professional journeys. To support everyone, we've prepared a short code of conduct. Our mission is best served in an environment that is friendly, safe, and accepting; free from intimidation or harassment.
Towards this end, certain behaviors and practices will not be tolerated.
## tl;dr
- Be respectful.
- We're here to help.
- Abusive behavior is never tolerated.
- Violations of this code may result in swift and permanent expulsion from the NativeScript community channels.
## Administrators
- Dan Wilson (@DanWilson on Slack)
- Jen Looper (@jen.looper on Slack)
- TJ VanToll (@tjvantoll on Slack)
## Scope
We expect all members of the NativeScript community, including administrators, users, facilitators, and vendors to abide by this Code of Conduct at all times in our community venues, online and in person, and in one-on-one communications pertaining to NativeScript affairs.
This policy covers the usage of the NativeScript Slack community, as well as the NativeScript support forums, NativeScript GitHub repositories, the NativeScript website, and any NativeScript-related events. This Code of Conduct is in addition to, and does not in any way nullify or invalidate, any other terms or conditions related to use of NativeScript.
The definitions of various subjective terms such as "discriminatory", "hateful", or "confusing" will be decided at the sole discretion of the NativeScript administrators.
## Friendly, Harassment-Free Space
We are committed to providing a friendly, safe, and welcoming environment for all, regardless of gender identity, sexual orientation, disability, ethnicity, religion, age, physical appearance, body size, race, or similar personal characteristics.
We ask that you please respect that people have differences of opinion regarding technical choices, and acknowledge that every design or implementation choice carries a trade-off and numerous costs. There is seldom a single right answer. A difference of technology preferences is never a license to be rude.
Any spamming, trolling, flaming, baiting, or other attention-stealing behaviour is not welcome, and will not be tolerated.
Harassing other users of NativeScript is never tolerated, whether via public or private media.
Avoid using offensive or harassing package names, nicknames, or other identifiers that might detract from a friendly, safe, and welcoming environment for all.
Harassment includes, but is not limited to: harmful or prejudicial verbal or written comments related to gender identity, sexual orientation, disability, ethnicity, religion, age, physical appearance, body size, race, or similar personal characteristics; inappropriate use of nudity, sexual images, and/or sexually explicit language in public spaces; threats of physical or non-physical harm; deliberate intimidation, stalking or following; harassing photography or recording; sustained disruption of talks or other events; inappropriate physical contact; and unwelcome sexual attention.
## Acceptable Content
The NativeScript administrators reserve the right to make judgement calls about what is and isn't appropriate in published content. These are guidelines to help you be successful in our community.
Content must contain something applicable to the previously stated goals of the NativeScript community. "Spamming", that is, publishing any form of content that is not applicable, is not allowed.
Content must not contain illegal or infringing content. You should only publish content to NativeScript properties if you have the right to do so. This includes complying with all software license agreements or other intellectual property restrictions. For example, redistributing an MIT-licensed module with the copyright notice removed, would not be allowed. You will be responsible for any violation of laws or others’ intellectual property rights.
Content must not be malware. For example, content (code, video, pictures, words, etc.) which is designed to maliciously exploit or damage computer systems, is not allowed.
Content name, description, and other visible metadata must not include abusive, inappropriate, or harassing content.
## Reporting Violations of this Code of Conduct
If you believe someone is harassing you or has otherwise violated this Code of Conduct, please contact the administrators and send us an abuse report. If this is the initial report of a problem, please include as much detail as possible. It is easiest for us to address issues when we have more context.
## Consequences
All content published to the NativeScript community channels is hosted at the sole discretion of the NativeScript administrators.
Unacceptable behavior from any community member, including sponsors, employees, customers, or others with decision-making authority, will not be tolerated.
Anyone asked to stop unacceptable behavior is expected to comply immediately.
If a community member engages in unacceptable behavior, the NativeScript administrators may take any action they deem appropriate, up to and including a temporary ban or permanent expulsion from the community without warning (and without refund in the case of a paid event or service).
## Addressing Grievances
If you feel you have been falsely or unfairly accused of violating this Code of Conduct, you should notify the administrators. We will do our best to ensure that your grievance is handled appropriately.
In general, we will choose the course of action that we judge as being most in the interest of fostering a safe and friendly community.
## Contact Info
Please contact Dan Wilson @DanWilson if you need to report a problem or address a grievance related to an abuse report.
You are also encouraged to contact us if you are curious about something that might be "on the line" between appropriate and inappropriate content. We are happy to provide guidance to help you be a successful part of our community.
## Credit and License
This Code of Conduct borrows heavily from the WADE Code of Conduct, which is derived from the NodeBots Code of Conduct, which in turn borrows from the npm Code of Conduct, which was derived from the Stumptown Syndicate Citizen's Code of Conduct, and the Rust Project Code of Conduct.
This document may be reused under a Creative Commons Attribution-ShareAlike License.
================================================
FILE: LICENSE
================================================
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "{}"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright (c) 2015-2019 Progress Software Corporation
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
================================================
FILE: README.md
================================================
# Groceries [](https://travis-ci.org/NativeScript/sample-Groceries)
Groceries is a NativeScript-built iOS and Android app for managing grocery lists. You can learn how to build a version of this app from scratch using either our [JavaScript getting started guide](http://docs.nativescript.org/tutorial/chapter-0), or our [TypeScript and Angular getting started guide](http://docs.nativescript.org/angular/tutorial/ng-chapter-0).
<!-- * [Download](#download) -->
* [Screenshots](#screenshots)
* [Development](#development)
* [Linting](#linting)
* [Unit testing](#unit-testing)
* [Travis CI](#travis)
* [Contributors](#contributors)
<h2 id="screenshots">Screenshots</h2>
<h2 id="development">Development</h2>
This app is built with the NativeScript CLI. Once you have the [CLI installed](https://docs.nativescript.org/start/quick-setup), start by cloning the repo:
```
$ git clone https://github.com/NativeScript/sample-Groceries.git
$ cd sample-Groceries
```
From there you can use the `run` command to run Groceries on iOS:
```
$ tns run ios
```
And the same command to run Groceries on Android:
```
$ tns run android
```
<h3 id="linting">Linting</h3>
Groceries uses [tslint](https://www.npmjs.com/package/tslint) + [codelyzer](https://github.com/mgechev/codelyzer) rules to ensure the code follows the [angular style guide](https://angular.io/docs/ts/latest/guide/style-guide.html).
You can run the linter with the `tslint` npm script:
```
$ npm run tslint
```
<h3 id="unit-testing">Unit Testing</h3>
Groceries uses NativeScript’s [integrated unit test runner](http://docs.nativescript.org/core-concepts/testing) with [Jasmine](http://jasmine.github.io/). To run the tests for yourself use the `tns test` command:
```
$ tns test ios --emulator
```
```
$ tns test android --emulator
```
For more information on unit testing NativeScript apps, refer to the [NativeScript docs on the topic](http://docs.nativescript.org/core-concepts/testing).
<h3 id="travis">Travis CI</h3>
Groceries uses [Travis CI](https://travis-ci.org/) to verify all tests pass on each commit. Refer to the [`.travis.yml` configuration file](https://github.com/NativeScript/sample-Groceries/blob/release/.travis.yml) for details.
<h2 id="contributors">Contributors</h2>
The following is a list of all the people that have helped build Groceries. Thanks for your contributions!
[<img alt="tjvantoll" src="https://avatars.githubusercontent.com/u/544280?v=3&s=117" width="117">](https://github.com/tjvantoll)[<img alt="hdeshev" src="https://avatars.githubusercontent.com/u/63219?v=3&s=117" width="117">](https://github.com/hdeshev)[<img alt="vakrilov" src="https://avatars.githubusercontent.com/u/4092076?v=3&s=117" width="117">](https://github.com/vakrilov)[<img alt="Mitko-Kerezov" src="https://avatars.githubusercontent.com/u/6683316?v=3&s=117" width="117">](https://github.com/Mitko-Kerezov)[<img alt="jlooper" src="https://avatars.githubusercontent.com/u/1450004?v=3&s=117" width="117">](https://github.com/jlooper)[<img alt="rosen-vladimirov" src="https://avatars.githubusercontent.com/u/8351653?v=3&s=117" width="117">](https://github.com/rosen-vladimirov)
[<img alt="SvetoslavTsenov" src="https://avatars.githubusercontent.com/u/3598759?v=3&s=117" width="117">](https://github.com/SvetoslavTsenov)[<img alt="ligaz" src="https://avatars.githubusercontent.com/u/19437?v=3&s=117" width="117">](https://github.com/ligaz)[<img alt="sis0k0" src="https://avatars.githubusercontent.com/u/7893485?v=3&s=117" width="117">](https://github.com/sis0k0)[<img alt="wdulin" src="https://avatars.githubusercontent.com/u/1111372?v=3&s=117" width="117">](https://github.com/wdulin)[<img alt="dtopuzov" src="https://avatars.githubusercontent.com/u/6651651?v=3&s=117" width="117">](https://github.com/dtopuzov)[<img alt="nadyaA" src="https://avatars.githubusercontent.com/u/6064810?v=3&s=117" width="117">](https://github.com/nadyaA)
[<img alt="vchimev" src="https://avatars.githubusercontent.com/u/12251337?v=3&s=117" width="117">](https://github.com/vchimev)[<img alt="covex-nn" src="https://avatars.githubusercontent.com/u/110878?v=3&s=117" width="117">](https://github.com/covex-nn)[<img alt="bundyo" src="https://avatars.githubusercontent.com/u/98318?v=3&s=117" width="117">](https://github.com/bundyo)[<img alt="EddyVerbruggen" src="https://avatars.githubusercontent.com/u/1426370?v=3&s=117" width="117">](https://github.com/EddyVerbruggen)[<img alt="NathanWalker" src="https://avatars.githubusercontent.com/u/457187?v=3&s=117" width="117">](https://github.com/NathanWalker)[<img alt="nsndeck" src="https://avatars.githubusercontent.com/u/5665150?v=3&s=117" width="117">](https://github.com/nsndeck)
[<img alt="tzraikov" src="https://avatars.githubusercontent.com/u/3244426?v=3&s=117" width="117">](https://github.com/tzraikov)[<img alt="TsvetanMilanov" src="https://avatars.githubusercontent.com/u/10463529?v=3&s=117" width="117">](https://github.com/TsvetanMilanov)[<img alt="bradmartin" src="https://avatars.githubusercontent.com/u/6006148?v=3&s=117" width="117">](https://github.com/bradmartin)[<img alt="cmelo" src="https://avatars.githubusercontent.com/u/872461?v=3&s=117" width="117">](https://github.com/cmelo)
<!-- Note: The table above get generated with the following commands -->
<!-- npm install -g github-contributors-list -->
<!-- githubcontrib --owner NativeScript --repo sample-Groceries --cols 6 --sortOrder desc | pbcopy -->
### Big Thanks
Cross-browser Testing Platform and Open Source Provided by [Sauce Labs](https://saucelabs.com).
[<img alt="SauceLabs" src="assets/sauceLabs/SauceLabs-white.svg" width="200">](https://saucelabs.com)
================================================
FILE: app/App_Resources/Android/app.gradle
================================================
// Add your native dependencies here:
// Uncomment to add recyclerview-v7 dependency
//dependencies {
// compile 'com.android.support:recyclerview-v7:+'
//}
android {
defaultConfig {
generatedDensities = []
applicationId = "org.nativescript.groceries"
//override supported platforms
// ndk {
// abiFilters.clear()
// abiFilters "armeabi-v7a"
// }
}
aaptOptions {
additionalParameters "--no-version-vectors"
}
}
================================================
FILE: app/App_Resources/Android/src/main/AndroidManifest.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="__PACKAGE__"
android:versionCode="1"
android:versionName="1.0">
<supports-screens
android:smallScreens="true"
android:normalScreens="true"
android:largeScreens="true"
android:xlargeScreens="true"/>
<uses-sdk
android:minSdkVersion="17"
android:targetSdkVersion="__APILEVEL__"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.INTERNET"/>
<application
android:name="com.tns.NativeScriptApplication"
android:allowBackup="true"
android:icon="@drawable/icon"
android:label="@string/app_name"
android:theme="@style/AppTheme">
<activity
android:name="com.tns.NativeScriptActivity"
android:label="@string/title_activity_kimera"
android:configChanges="keyboardHidden|orientation|screenSize"
android:theme="@style/LaunchScreenTheme">
<meta-data android:name="SET_THEME_ON_LAUNCH" android:resource="@style/AppTheme" />
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="com.tns.ErrorReportActivity"/>
</application>
</manifest>
================================================
FILE: app/App_Resources/Android/src/main/res/drawable-nodpi/splash_screen.xml
================================================
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:gravity="fill">
<item>
<bitmap android:gravity="fill" android:src="@drawable/background" />
</item>
<item>
<bitmap android:gravity="center" android:src="@drawable/logo" />
</item>
</layer-list>
================================================
FILE: app/App_Resources/Android/src/main/res/values/colors.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="ns_primary">#F5F5F5</color>
<color name="ns_primaryDark">#757575</color>
<color name="ns_accent">#33B5E5</color>
<color name="ns_blue">#272734</color>
</resources>
================================================
FILE: app/App_Resources/Android/src/main/res/values/strings.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Groceries</string>
<string name="title_activity_kimera">Groceries</string>
</resources>
================================================
FILE: app/App_Resources/Android/src/main/res/values/styles.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!-- theme to use FOR launch screen-->
<style name="LaunchScreenThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
<item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>
<item name="colorPrimary">@color/ns_primary</item>
<item name="colorPrimaryDark">@color/ns_primaryDark</item>
<item name="colorAccent">@color/ns_accent</item>
<item name="android:windowBackground">@drawable/splash_screen</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
<style name="LaunchScreenTheme" parent="LaunchScreenThemeBase">
</style>
<!-- theme to use AFTER launch screen is loaded-->
<style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
<item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>
<item name="colorPrimary">@color/ns_primary</item>
<item name="colorPrimaryDark">@color/ns_primaryDark</item>
<item name="colorAccent">@color/ns_accent</item>
</style>
<style name="AppTheme" parent="AppThemeBase">
</style>
<!-- theme for actioon-bar -->
<style name="NativeScriptToolbarStyleBase" parent="Widget.AppCompat.Toolbar">
<item name="android:background">@color/ns_primary</item>
<item name="theme">@style/ThemeOverlay.AppCompat.ActionBar</item>
<item name="popupTheme">@style/ThemeOverlay.AppCompat</item>
</style>
<style name="NativeScriptToolbarStyle" parent="NativeScriptToolbarStyleBase">
</style>
</resources>
================================================
FILE: app/App_Resources/Android/src/main/res/values-v21/colors.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="ns_accent">#3d5afe</color>
</resources>
================================================
FILE: app/App_Resources/Android/src/main/res/values-v21/styles.xml
================================================
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- Application theme -->
<style name="AppTheme" parent="AppThemeBase">
<item name="android:datePickerStyle">@style/SpinnerDatePicker</item>
<item name="android:timePickerStyle">@style/SpinnerTimePicker</item>
</style>
<!-- Default style for DatePicker - in spinner mode -->
<style name="SpinnerDatePicker" parent="android:Widget.Material.Light.DatePicker">
<item name="android:datePickerMode">spinner</item>
</style>
<!-- Default style for TimePicker - in spinner mode -->
<style name="SpinnerTimePicker" parent="android:Widget.Material.Light.TimePicker">
<item name="android:timePickerMode">spinner</item>
</style>
<style name="NativeScriptToolbarStyle" parent="NativeScriptToolbarStyleBase">
<item name="android:elevation">4dp</item>
</style>
</resources>
================================================
FILE: app/App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/Contents.json
================================================
{
"images" : [
{
"size" : "29x29",
"idiom" : "iphone",
"filename" : "icon-29.png",
"scale" : "1x"
},
{
"size" : "29x29",
"idiom" : "iphone",
"filename" : "icon-29@2x.png",
"scale" : "2x"
},
{
"size" : "29x29",
"idiom" : "iphone",
"filename" : "icon-29@3x.png",
"scale" : "3x"
},
{
"size" : "40x40",
"idiom" : "iphone",
"filename" : "icon-40@2x.png",
"scale" : "2x"
},
{
"size" : "40x40",
"idiom" : "iphone",
"filename" : "icon-40@3x.png",
"scale" : "3x"
},
{
"size" : "57x57",
"idiom" : "iphone",
"filename" : "icon-57.png",
"scale" : "1x"
},
{
"size" : "57x57",
"idiom" : "iphone",
"filename" : "icon-57@2x.png",
"scale" : "2x"
},
{
"size" : "60x60",
"idiom" : "iphone",
"filename" : "icon-60@2x.png",
"scale" : "2x"
},
{
"size" : "60x60",
"idiom" : "iphone",
"filename" : "icon-60@3x.png",
"scale" : "3x"
},
{
"size" : "29x29",
"idiom" : "ipad",
"filename" : "icon-29.png",
"scale" : "1x"
},
{
"size" : "29x29",
"idiom" : "ipad",
"filename" : "icon-29@2x.png",
"scale" : "2x"
},
{
"size" : "40x40",
"idiom" : "ipad",
"filename" : "icon-40.png",
"scale" : "1x"
},
{
"size" : "40x40",
"idiom" : "ipad",
"filename" : "icon-40@2x.png",
"scale" : "2x"
},
{
"size" : "50x50",
"idiom" : "ipad",
"filename" : "icon-50.png",
"scale" : "1x"
},
{
"size" : "50x50",
"idiom" : "ipad",
"filename" : "icon-50@2x.png",
"scale" : "2x"
},
{
"size" : "72x72",
"idiom" : "ipad",
"filename" : "icon-72.png",
"scale" : "1x"
},
{
"size" : "72x72",
"idiom" : "ipad",
"filename" : "icon-72@2x.png",
"scale" : "2x"
},
{
"size" : "76x76",
"idiom" : "ipad",
"filename" : "icon-76.png",
"scale" : "1x"
},
{
"size" : "76x76",
"idiom" : "ipad",
"filename" : "icon-76@2x.png",
"scale" : "2x"
},
{
"size" : "83.5x83.5",
"idiom" : "ipad",
"filename" : "icon-83.5@2x.png",
"scale" : "2x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: app/App_Resources/iOS/Assets.xcassets/Contents.json
================================================
{
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: app/App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Contents.json
================================================
{
"images" : [
{
"extent" : "full-screen",
"idiom" : "iphone",
"subtype" : "736h",
"filename" : "Default-736h@3x.png",
"minimum-system-version" : "8.0",
"orientation" : "portrait",
"scale" : "3x"
},
{
"extent" : "full-screen",
"idiom" : "iphone",
"subtype" : "736h",
"filename" : "Default-Landscape@3x.png",
"minimum-system-version" : "8.0",
"orientation" : "landscape",
"scale" : "3x"
},
{
"extent" : "full-screen",
"idiom" : "iphone",
"subtype" : "667h",
"filename" : "Default-667h@2x.png",
"minimum-system-version" : "8.0",
"orientation" : "portrait",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "iphone",
"filename" : "Default@2x.png",
"extent" : "full-screen",
"minimum-system-version" : "7.0",
"scale" : "2x"
},
{
"extent" : "full-screen",
"idiom" : "iphone",
"subtype" : "retina4",
"filename" : "Default-568h@2x.png",
"minimum-system-version" : "7.0",
"orientation" : "portrait",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"filename" : "Default-Portrait.png",
"extent" : "full-screen",
"minimum-system-version" : "7.0",
"scale" : "1x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"filename" : "Default-Landscape.png",
"extent" : "full-screen",
"minimum-system-version" : "7.0",
"scale" : "1x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"filename" : "Default-Portrait@2x.png",
"extent" : "full-screen",
"minimum-system-version" : "7.0",
"scale" : "2x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"filename" : "Default-Landscape@2x.png",
"extent" : "full-screen",
"minimum-system-version" : "7.0",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "iphone",
"filename" : "Default.png",
"extent" : "full-screen",
"scale" : "1x"
},
{
"orientation" : "portrait",
"idiom" : "iphone",
"filename" : "Default@2x.png",
"extent" : "full-screen",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "iphone",
"filename" : "Default-568h@2x.png",
"extent" : "full-screen",
"subtype" : "retina4",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"extent" : "to-status-bar",
"scale" : "1x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"filename" : "Default-Portrait.png",
"extent" : "full-screen",
"scale" : "1x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"extent" : "to-status-bar",
"scale" : "1x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"filename" : "Default-Landscape.png",
"extent" : "full-screen",
"scale" : "1x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"extent" : "to-status-bar",
"scale" : "2x"
},
{
"orientation" : "portrait",
"idiom" : "ipad",
"filename" : "Default-Portrait@2x.png",
"extent" : "full-screen",
"scale" : "2x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"extent" : "to-status-bar",
"scale" : "2x"
},
{
"orientation" : "landscape",
"idiom" : "ipad",
"filename" : "Default-Landscape@2x.png",
"extent" : "full-screen",
"scale" : "2x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: app/App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/Contents.json
================================================
{
"images" : [
{
"idiom" : "universal",
"filename" : "LaunchScreen-AspectFill.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"filename" : "LaunchScreen-AspectFill@2x.png",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: app/App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/Contents.json
================================================
{
"images" : [
{
"idiom" : "universal",
"filename" : "LaunchScreen-Center.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"filename" : "LaunchScreen-Center@2x.png",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
================================================
FILE: app/App_Resources/iOS/Info.plist
================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>CFBundleDevelopmentRegion</key>
<string>en</string>
<key>CFBundleDisplayName</key>
<string>Groceries</string>
<key>CFBundleExecutable</key>
<string>${EXECUTABLE_NAME}</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>IPHONEOS_DEPLOYMENT_TARGET</key>
<string>9.0</string>
<key>CFBundleName</key>
<string>${PRODUCT_NAME}</string>
<key>CFBundlePackageType</key>
<string>APPL</string>
<key>CFBundleShortVersionString</key>
<string>1.0</string>
<key>CFBundleSignature</key>
<string>????</string>
<key>CFBundleVersion</key>
<string>1.0</string>
<key>LSRequiresIPhoneOS</key>
<true/>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiresFullScreen</key>
<true/>
<key>UIRequiredDeviceCapabilities</key>
<array>
<string>armv7</string>
</array>
<key>UISupportedInterfaceOrientations</key>
<array>
<string>UIInterfaceOrientationPortrait</string>
<string>UIInterfaceOrientationLandscapeLeft</string>
<string>UIInterfaceOrientationLandscapeRight</string>
</array>
<key>UISupportedInterfaceOrientations~ipad</key>
<array>
<string>UIInterfaceOrientationPortrait</string>
<string>UIInterfaceOrientationPortraitUpsideDown</string>
<string>UIInterfaceOrientationLandscapeLeft</string>
<string>UIInterfaceOrientationLandscapeRight</string>
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
</dict>
</plist>
================================================
FILE: app/App_Resources/iOS/LaunchScreen.storyboard
================================================
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="10116" systemVersion="15F34" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" initialViewController="01J-lp-oVM">
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="10085"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID="EHf-IW-A2E">
<objects>
<viewController id="01J-lp-oVM" sceneMemberID="viewController">
<layoutGuides>
<viewControllerLayoutGuide type="top" id="Llm-lL-Icb"/>
<viewControllerLayoutGuide type="bottom" id="xb3-aO-Qok"/>
</layoutGuides>
<view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
<rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<imageView userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="LaunchScreen.AspectFill" translatesAutoresizingMaskIntoConstraints="NO" id="wtH-rr-YfP">
<rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
</imageView>
<imageView userInteractionEnabled="NO" contentMode="center" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="LaunchScreen.Center" translatesAutoresizingMaskIntoConstraints="NO" id="s1z-aa-wYv">
<rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
</imageView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="xb3-aO-Qok" firstAttribute="top" secondItem="wtH-rr-YfP" secondAttribute="bottom" id="5FO-pR-qKb"/>
<constraint firstItem="wtH-rr-YfP" firstAttribute="top" secondItem="Ze5-6b-2t3" secondAttribute="top" id="Awn-b8-xf1"/>
<constraint firstItem="s1z-aa-wYv" firstAttribute="top" secondItem="Ze5-6b-2t3" secondAttribute="top" id="CiP-yX-1sg"/>
<constraint firstAttribute="trailing" secondItem="wtH-rr-YfP" secondAttribute="trailing" id="RXg-rW-UK8"/>
<constraint firstItem="s1z-aa-wYv" firstAttribute="leading" secondItem="Ze5-6b-2t3" secondAttribute="leading" id="agC-wa-3bd"/>
<constraint firstItem="wtH-rr-YfP" firstAttribute="leading" secondItem="Ze5-6b-2t3" secondAttribute="leading" id="cch-8E-tYu"/>
<constraint firstItem="xb3-aO-Qok" firstAttribute="top" secondItem="s1z-aa-wYv" secondAttribute="bottom" id="fNc-Ro-KaG"/>
<constraint firstAttribute="trailing" secondItem="s1z-aa-wYv" secondAttribute="trailing" id="qoI-OC-Zk7"/>
</constraints>
</view>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="510" y="238"/>
</scene>
</scenes>
<resources>
<image name="LaunchScreen.AspectFill" width="768" height="1024"/>
<image name="LaunchScreen.Center" width="40" height="40"/>
</resources>
</document>
================================================
FILE: app/App_Resources/iOS/build.xcconfig
================================================
// You can add custom settings here
// for example you can uncomment the following line to force distribution code signing
// CODE_SIGN_IDENTITY = iPhone Distribution
// To build for device with XCode 8 you need to specify your development team. More info: https://developer.apple.com/library/prerelease/content/releasenotes/DeveloperTools/RN-Xcode/Introduction.html
// DEVELOPMENT_TEAM = YOUR_TEAM_ID;
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
ASSETCATALOG_COMPILER_LAUNCHIMAGE_NAME = LaunchImage;
================================================
FILE: app/app.component.ts
================================================
import { Component } from "@angular/core";
@Component({
selector: "gr-main",
template: "<page-router-outlet></page-router-outlet>"
})
export class AppComponent { }
================================================
FILE: app/app.css
================================================
@import url("./platform.css");
Page {
font-size: 15;
background-color: black;
}
ActionBar {
background-color: black;
color: white;
}
TextField {
padding: 10;
font-size: 13;
}
.line-through {
text-decoration: line-through;
}
================================================
FILE: app/app.module.ngfactory.d.ts
================================================
export const AppModuleNgFactory: any;
================================================
FILE: app/app.module.ts
================================================
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptHttpClientModule } from "nativescript-angular/http-client";
import { NativeScriptRouterModule } from "nativescript-angular/router";
import { authProviders, appRoutes } from "./app.routing";
import { AppComponent } from "./app.component";
import { setStatusBarColors, BackendService, LoginService } from "./shared";
import { LoginModule } from "./login/login.module";
import { GroceriesModule } from "./groceries/groceries.module";
setStatusBarColors();
@NgModule({
providers: [
BackendService,
LoginService,
authProviders
],
imports: [
NativeScriptModule,
NativeScriptHttpClientModule,
NativeScriptRouterModule,
NativeScriptRouterModule.forRoot(appRoutes),
LoginModule,
GroceriesModule,
],
declarations: [
AppComponent,
],
bootstrap: [AppComponent],
schemas: [NO_ERRORS_SCHEMA]
})
export class AppModule { }
================================================
FILE: app/app.routing.ts
================================================
import { AuthGuard } from "./auth-guard.service";
export const authProviders = [
AuthGuard
];
export const appRoutes = [
{ path: "", redirectTo: "/groceries", pathMatch: "full" }
];
================================================
FILE: app/auth-guard.service.ts
================================================
import { Injectable } from "@angular/core";
import { Router, CanActivate } from "@angular/router";
import { BackendService } from "./shared/backend.service";
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private router: Router) { }
canActivate() {
if (BackendService.isLoggedIn()) {
return true;
}
else {
this.router.navigate(["/login"]);
return false;
}
}
}
================================================
FILE: app/groceries/groceries-common.css
================================================
.background {
background-image: url("res://bg_inner");
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.action-bar-custom {
color: white;
margin-top: 26;
margin-bottom: 16;
}
.action-bar-custom Label {
font-size: 21;
font-weight: bold;
}
.action-bar-custom GridLayout {
height: 40;
padding-left: 15;
padding-right: 15;
}
.action-bar-custom GridLayout Image {
vertical-align: center;
}
.add-bar {
background-color: #CB1D00;
padding-left: 16;
padding-right: 16;
height: 50;
}
.add-bar-image-container {
height: 50;
vertical-align: center;
margin-left: -15;
padding-left: 15;
padding-right: 13;
}
.add-bar Image {
height: 20;
}
TextField {
color: white;
placeholder-color: white;
background-color: transparent;
font-size: 15;
border-width: 0;
padding: 0;
margin-left: 1;
}
.add-bar-recent-label {
vertical-align: center;
color: #311217;
}
.add-bar-recent-container {
height: 50;
padding-left: 10;
padding-right: 10;
margin-right: -10;
vertical-align: center;
}
.add-bar-recent-toggle {
color: #311217;
}
ActivityIndicator {
horizontal-align: center;
vertical-align: center;
}
================================================
FILE: app/groceries/groceries.component.android.css
================================================
.add-bar-recent-toggle {
text-transform: uppercase;
}
================================================
FILE: app/groceries/groceries.component.html
================================================
<GridLayout #container
class="background"
rows="auto, auto, *">
<!-- Row 1: The custom action bar -->
<GridLayout
row="0"
columns="44, *, auto"
class="action-bar-custom">
<Label
col="1"
text="Groceries"></Label>
<!-- Wrap the image in a StackLayout to give it a bigger tap target -->
<GridLayout
col="2"
(tap)="showMenu()">
<Image
src="res://menu"
stretch="none"></Image>
</GridLayout>
</GridLayout>
<!-- Row 2: The text field to add groceries, and recent button -->
<GridLayout
row="1"
columns="auto, *, auto"
[backgroundColor]="isShowingRecent ? '#BBC169' : '#CB1D00'"
class="add-bar">
<StackLayout
class="add-bar-image-container"
col="0"
(tap)="add('button')">
<Image
col="0"
[src]="isShowingRecent ? 'res://recent' : 'res://add'"></Image>
</StackLayout>
<TextField #groceryTextField
col="1"
[(ngModel)]="grocery"
(loaded)="handleAndroidFocus(groceryTextField, container)"
[hint]="isAndroid ? 'ADD A GROCERY' : 'Add a grocery'"
returnKeyType="done"
*ngIf="!isShowingRecent"
(returnPress)="add('textfield')"></TextField>
<Label
col="1"
text="Recent items"
*ngIf="isShowingRecent"
class="add-bar-recent-label"></Label>
<StackLayout
col="2"
class="add-bar-recent-container"
(tap)="toggleRecent()">
<Label
class="add-bar-recent-toggle"
[text]="isShowingRecent ? 'Done' : 'Recent'"></Label>
</StackLayout>
</GridLayout>
<!-- Row 3: The grocery list -->
<gr-grocery-list
[row]="2"
(loading)="showActivityIndicator()"
(loaded)="hideActivityIndicator()"
[showDeleted]="isShowingRecent"></gr-grocery-list>
<ActivityIndicator
[busy]="isLoading"
row="2"></ActivityIndicator>
</GridLayout>
================================================
FILE: app/groceries/groceries.component.ios.css
================================================
.action-bar-custom {
margin-top: 12;
}
================================================
FILE: app/groceries/groceries.component.ts
================================================
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { Router } from "@angular/router";
import { action } from "tns-core-modules/ui/dialogs";
import { Page } from "tns-core-modules/ui/page";
import { TextField } from "tns-core-modules/ui/text-field";
import * as SocialShare from "nativescript-social-share";
import { GroceryService } from "./shared";
import { LoginService, alert } from "../shared";
@Component({
selector: "gr-groceries",
moduleId: module.id,
templateUrl: "./groceries.component.html",
styleUrls: ["./groceries-common.css", "./groceries.component.css"],
providers: [GroceryService]
})
export class GroceriesComponent implements OnInit {
grocery: string = "";
isShowingRecent = false;
isLoading = false;
@ViewChild("groceryTextField", { static: false }) groceryTextField: ElementRef;
constructor(private router: Router,
private store: GroceryService,
private loginService: LoginService,
private page: Page) {}
ngOnInit() {
this.page.actionBarHidden = true;
}
// Prevent the first textfield from receiving focus on Android
// See http://stackoverflow.com/questions/5056734/android-force-edittext-to-remove-focus
handleAndroidFocus(textField, container) {
if (container.android) {
container.android.setFocusableInTouchMode(true);
container.android.setFocusable(true);
textField.android.clearFocus();
}
}
showActivityIndicator() {
this.isLoading = true;
}
hideActivityIndicator() {
this.isLoading = false;
}
add(target: string) {
// If showing recent groceries the add button should do nothing.
if (this.isShowingRecent) {
return;
}
let textField = <TextField>this.groceryTextField.nativeElement;
if (this.grocery.trim() === "") {
// If the user clicked the add button, and the textfield is empty,
// focus the text field and return.
if (target === "button") {
textField.focus();
} else {
// If the user clicked return with an empty text field show an error.
alert("Enter a grocery item");
}
return;
}
// Dismiss the keyboard
// TODO: Is it better UX to dismiss the keyboard, or leave it up so the
// user can continue to add more groceries?
textField.dismissSoftInput();
this.showActivityIndicator();
this.store.add(this.grocery)
.subscribe(
() => {
this.grocery = "";
this.hideActivityIndicator();
},
() => {
alert("An error occurred while adding an item to your list.");
this.hideActivityIndicator();
}
);
}
toggleRecent() {
this.isShowingRecent = !this.isShowingRecent;
}
showMenu() {
action({
message: "What would you like to do?",
actions: ["Share", "Log Off"],
cancelButtonText: "Cancel"
}).then((result) => {
if (result === "Share") {
this.share();
} else if (result === "Log Off") {
this.logoff();
}
});
}
share() {
let items = this.store.items.value;
let list = [];
for (let i = 0, size = items.length; i < size ; i++) {
list.push(items[i].name);
}
SocialShare.shareText(list.join(", ").trim());
}
logoff() {
this.loginService.logoff();
this.router.navigate(["/login"]);
}
}
================================================
FILE: app/groceries/groceries.module.ts
================================================
import { NativeScriptCommonModule } from "nativescript-angular/common";
import { NativeScriptFormsModule } from "nativescript-angular/forms";
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { groceriesRouting } from "./groceries.routing";
import { GroceriesComponent } from "./groceries.component";
import { GroceryListComponent } from "./grocery-list/grocery-list.component";
import { ItemStatusPipe } from "./grocery-list/item-status.pipe";
@NgModule({
imports: [
NativeScriptFormsModule,
NativeScriptCommonModule,
groceriesRouting,
],
declarations: [
GroceriesComponent,
GroceryListComponent,
ItemStatusPipe
],
schemas: [NO_ERRORS_SCHEMA]
})
export class GroceriesModule {}
================================================
FILE: app/groceries/groceries.routing.ts
================================================
import { ModuleWithProviders } from "@angular/core";
import { Routes, RouterModule } from "@angular/router";
import { GroceriesComponent } from "./groceries.component";
import { AuthGuard } from "../auth-guard.service";
const groceriesRoutes: Routes = [
{ path: "groceries", component: GroceriesComponent, canActivate: [AuthGuard] },
];
export const groceriesRouting: ModuleWithProviders = RouterModule.forChild(groceriesRoutes);
================================================
FILE: app/groceries/grocery-list/grocery-list.component.css
================================================
ListView {
background-color: transparent;
opacity: 0;
}
.visible {
animation-name: show;
animation-duration: 1s;
animation-fill-mode: forwards;
}
@keyframes show {
from { opacity: 0; }
to { opacity: 1; }
}
.container {
background-color: white;
margin-top: 1;
}
.tap-target {
padding-top: 13;
padding-bottom: 13;
padding-left: 16;
}
.tap-target Label {
min-width: 200;
}
.check-box {
margin-right: 10;
height: 20;
}
.delete-container {
padding: 10 15;
vertical-align: middle;
}
.delete-container StackLayout {
padding: 5;
}
.delete-container Image {
height: 20;
}
================================================
FILE: app/groceries/grocery-list/grocery-list.component.html
================================================
<ListView
[row]="row"
[class.visible]="listLoaded"
[items]="store.items | async | itemStatus:showDeleted"
(itemLoading)="makeBackgroundTransparent($event)" >
<ng-template let-item="item">
<GridLayout
columns="*, auto"
class="container"
[opacity]="item.done ? '0.8' : '1'">
<!-- Wrap in containers for bigger tap targets -->
<StackLayout
col="0"
orientation="horizontal"
class="tap-target"
(tap)="toggleDone(item)">
<Image
[src]="imageSource(item)"
class="check-box"></Image>
<Label
[text]="item.name"
[class.line-through]="item.done && !item.deleted"></Label>
</StackLayout>
<GridLayout
col="1"
class="delete-container"
(tap)="delete(item)">
<StackLayout>
<Image src="res://delete"></Image>
</StackLayout>
</GridLayout>
</GridLayout>
</ng-template>
</ListView>
================================================
FILE: app/groceries/grocery-list/grocery-list.component.ts
================================================
import { Component, ChangeDetectionStrategy, EventEmitter, Input, Output, AfterViewInit } from "@angular/core";
import { Grocery, GroceryService } from "../shared";
import { alert } from "../../shared";
declare var UIColor: any;
@Component({
selector: "gr-grocery-list",
moduleId: module.id,
templateUrl: "./grocery-list.component.html",
styleUrls: ["./grocery-list.component.css"],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class GroceryListComponent implements AfterViewInit {
@Input() showDeleted: boolean;
@Input() row;
@Output() loading = new EventEmitter();
@Output() loaded = new EventEmitter();
public store: GroceryService;
listLoaded = false;
constructor(store: GroceryService) {
this.store = store;
}
ngAfterViewInit() {
this.load();
}
load() {
this.loading.next("");
this.store.load()
.subscribe(
() => {
this.loaded.next("");
this.listLoaded = true;
},
() => {
alert("An error occurred loading your grocery list.");
}
);
}
// The following trick makes the background color of each cell
// in the UITableView transparent as it’s created.
makeBackgroundTransparent(args) {
let cell = args.ios;
if (cell) {
// support XCode 8
cell.backgroundColor = UIColor.clearColor;
}
}
imageSource(grocery) {
if (grocery.deleted) {
return "res://add";
}
return grocery.done ? "res://checked" : "res://unchecked";
}
toggleDone(grocery: Grocery) {
if (grocery.deleted) {
this.store.unsetDeleteFlag(grocery)
.subscribe(
() => { },
() => {
alert("An error occurred managing your grocery list.");
}
);
} else {
this.store.toggleDoneFlag(grocery)
.subscribe(
() => { },
() => {
alert("An error occurred managing your grocery list.");
}
);
}
}
delete(grocery: Grocery) {
this.loading.next("");
let successHandler = () => this.loaded.next("");
let errorHandler = () => {
alert("An error occurred while deleting an item from your list.");
this.loaded.next("");
};
if (grocery.deleted) {
this.store.permanentlyDelete(grocery)
.subscribe(successHandler, errorHandler);
} else {
this.store.setDeleteFlag(grocery)
.subscribe(successHandler, errorHandler);
}
}
}
================================================
FILE: app/groceries/grocery-list/item-status.pipe.ts
================================================
import { Pipe, PipeTransform } from "@angular/core";
import { Grocery } from "../shared";
@Pipe({
name: "itemStatus"
})
export class ItemStatusPipe implements PipeTransform {
value: Array<Grocery> = [];
transform(items: Array<Grocery>, deleted: boolean) {
if (items instanceof Array) {
this.value = items.filter((grocery: Grocery) => {
return grocery.deleted === deleted;
});
}
return this.value;
}
}
================================================
FILE: app/groceries/shared/grocery.model.ts
================================================
export class Grocery {
constructor(
public id: string,
public name: string,
public done: boolean,
public deleted: boolean
) {}
}
================================================
FILE: app/groceries/shared/grocery.service.ts
================================================
import { Injectable, NgZone } from "@angular/core";
import {
HttpClient,
HttpHeaders,
HttpErrorResponse,
} from "@angular/common/http";
import { BehaviorSubject, throwError } from "rxjs";
import { map, catchError } from "rxjs/operators";
import { BackendService } from "../../shared";
import { Grocery } from "./grocery.model";
@Injectable()
export class GroceryService {
items: BehaviorSubject<Array<Grocery>> = new BehaviorSubject([]);
private allItems: Array<Grocery> = [];
baseUrl = BackendService.baseUrl + "appdata/" + BackendService.appKey + "/Groceries";
constructor(private http: HttpClient, private zone: NgZone) { }
load() {
return this.http.get(this.baseUrl, {
headers: this.getCommonHeaders()
})
.pipe(
map((data: any[]) => {
this.allItems = data
.sort((a, b) => {
return a._kmd.lmt > b._kmd.lmt ? -1 : 1;
})
.map(
grocery => new Grocery(
grocery._id,
grocery.Name,
grocery.Done || false,
grocery.Deleted || false
)
);
this.publishUpdates();
}),
catchError(this.handleErrors)
);
}
add(name: string) {
return this.http.post(
this.baseUrl,
JSON.stringify({ Name: name }),
{ headers: this.getCommonHeaders() }
)
.pipe(
map((data: any) => {
this.allItems.unshift(new Grocery(data._id, name, false, false));
this.publishUpdates();
}),
catchError(this.handleErrors)
);
}
setDeleteFlag(item: Grocery) {
item.deleted = true;
return this.put(item)
.pipe(
map(data => {
item.done = false;
this.publishUpdates();
})
);
}
unsetDeleteFlag(item: Grocery) {
item.deleted = false;
return this.put(item)
.pipe(
map(data => {
item.done = false;
this.publishUpdates();
})
);
}
toggleDoneFlag(item: Grocery) {
item.done = !item.done;
this.publishUpdates();
return this.put(item);
}
permanentlyDelete(item: Grocery) {
return this.http
.delete(
this.baseUrl + "/" + item.id,
{ headers: this.getCommonHeaders() }
)
.pipe(
map(data => {
let index = this.allItems.indexOf(item);
this.allItems.splice(index, 1);
this.publishUpdates();
}),
catchError(this.handleErrors)
);
}
private put(grocery: Grocery) {
return this.http.put(
this.baseUrl + "/" + grocery.id,
JSON.stringify({
Name: grocery.name,
Done: grocery.done,
Deleted: grocery.deleted
}),
{ headers: this.getCommonHeaders() }
)
.pipe(catchError(this.handleErrors));
}
private publishUpdates() {
// Make sure all updates are published inside NgZone so that change detection is triggered if needed
this.zone.run(() => {
// must emit a *new* value (immutability!)
this.items.next([...this.allItems]);
});
}
private getCommonHeaders() {
return new HttpHeaders({
"Content-Type": "application/json",
"Authorization": "Kinvey " + BackendService.token,
});
}
private handleErrors(error: HttpErrorResponse) {
console.log(error);
return throwError(error);
}
}
================================================
FILE: app/groceries/shared/index.ts
================================================
export { GroceryService } from "./grocery.service";
export { Grocery } from "./grocery.model";
================================================
FILE: app/login/login-common.css
================================================
/* Hide a bunch of things to setup the initial animations */
.form-controls, .sign-up-stack {
opacity: 0;
}
.background {
background-image: url("res://bg_login");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
/* TODO: Assigning explicit heights and applying this margin shouldn’t be necessary. */
.initial-container {
margin-top: 170;
}
.initial-logo {
horizontal-align: center;
margin-bottom: 10;
}
.initial-label {
color: white;
horizontal-align: center;
margin-bottom: 80;
}
.initial-button {
background-color: white;
color: #CB1D00;
height: 45;
width: 275;
vertical-align: center;
}
.initial-button-label {
horizontal-align: center;
font-weight: bold;
}
.main-container {
visibility: collapse;
opacity: 0;
margin-left: 30;
margin-right: 30;
background-color: white;
}
.main-label {
horizontal-align: center;
color: black;
}
Image {
margin-top: 5;
margin-bottom: 20;
}
Button, TextField {
margin-left: 16;
margin-right: 16;
margin-bottom: 10;
}
TextField {
color: black;
placeholder-color: #ACA6A7;
}
TextField.light {
color: #C4AFB4;
placeholder-color: #C4AFB4;
}
.submit-button {
background-color: #CB1D00;
color: white;
margin-top: 20;
}
.forgot-password-label {
font-size: 13;
margin-left: 20;
margin-bottom: 45;
color: black;
}
.sign-up-stack {
background-color: #311217;
}
.sign-up-stack Label {
color: white;
text-align: center;
font-size: 15;
}
.logo-container {
visibility: collapse;
horizontal-align: center;
opacity: 0;
}
================================================
FILE: app/login/login.component.android.css
================================================
.main-container {
height: 360;
width: 275;
}
.initial-label {
font-size: 32;
letter-spacing: 0.35;
}
.main-label {
font-size: 28;
margin-top: 32;
margin-bottom: 32;
letter-spacing: 0.3;
}
TextField {
margin-bottom: 10;
}
.submit-button {
margin-top: 15;
}
.sign-up-stack Label {
padding-top: 5;
height: 200;
text-transform: uppercase;
}
.forgot-password-label {
font-size: 13;
text-transform: uppercase;
}
.logo-container Image {
top: 90;
}
================================================
FILE: app/login/login.component.html
================================================
<GridLayout>
<GridLayout #background
scaleX="1.4"
scaleY="1.4"
class="background"
(loaded)="startBackgroundAnimation(background)"></GridLayout>
<StackLayout #initialContainer
class="initial-container">
<Image
src="res://logo_login"
stretch="none"
class="initial-logo"></Image>
<Label
text="GROCERIES"
class="initial-label"></Label>
<StackLayout
(tap)="showMainContent()"
class="initial-button">
<Label
text="Login"
class="initial-button-label"></Label>
</StackLayout>
</StackLayout>
<StackLayout #mainContainer
class="main-container">
<Label
class="main-label"
text="GROCERIES"
[color]="isLoggingIn? 'black' : 'white'"></Label>
<GridLayout #formControls
class="form-controls"
rows="auto, auto"
translateY="50">
<TextField
hint="Email Address"
keyboardType="email"
returnKeyType="next"
(returnPress)="focusPassword()"
[(ngModel)]="user.email"
[isEnabled]="!isAuthenticating"
autocorrect="false"
autocapitalizationType="none"
[class.light]="!isLoggingIn"
row="0"></TextField>
<TextField #password
hint="Password"
secure="true"
returnKeyType="done"
(returnPress)="submit()"
[(ngModel)]="user.password"
[isEnabled]="!isAuthenticating"
[class.light]="!isLoggingIn"
row="1"></TextField>
<ActivityIndicator
[busy]="isAuthenticating"
rowSpan="2"></ActivityIndicator>
</GridLayout>
<Button
[text]="isLoggingIn ? 'Login' : 'Sign up'"
[isEnabled]="!isAuthenticating"
class="submit-button"
(tap)="submit()"></Button>
<Label
class="forgot-password-label"
text="Forgot password?"
(tap)="forgotPassword()"
[visibility]="isLoggingIn ? 'visible' : 'hidden'"></Label>
<StackLayout #signUpStack
class="sign-up-stack"
(tap)="toggleDisplay()"
translateY="50">
<Label
[text]="isLoggingIn ? 'Sign up here' : 'Back to login'"></Label>
</StackLayout>
</StackLayout>
<!-- The fruit logo that appears within the container -->
<AbsoluteLayout #logoContainer
class="logo-container">
<Image
src="res://logo_login"
stretch="none"></Image>
</AbsoluteLayout>
</GridLayout>
================================================
FILE: app/login/login.component.ios.css
================================================
.main-container {
height: 425;
width: 300;
}
.initial-label {
font-size: 40;
letter-spacing: 0.2;
}
.main-label {
color: #311217;
font-size: 32;
margin-top: 45;
margin-bottom: 52;
letter-spacing: 0.2;
}
TextField {
border-width: 1;
border-color: #6E595C;
margin-bottom: 20;
}
.submit-button {
height: 40;
margin-top: 15;
}
.sign-up-stack Label {
height: 48;
}
/* A height of zero ensures that the AbsoluteLayout container doesn’t steal taps
from the various button and text field controls that sit behind it. */
.logo-container {
height: 0;
}
.logo-container Image {
top: -250;
}
================================================
FILE: app/login/login.component.ts
================================================
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { Router } from "@angular/router";
import { Color } from "tns-core-modules/color";
import { connectionType, getConnectionType } from "tns-core-modules/connectivity";
import { Animation } from "tns-core-modules/ui/animation";
import { View } from "tns-core-modules/ui/core/view";
import { prompt } from "tns-core-modules/ui/dialogs";
import { Page } from "tns-core-modules/ui/page";
import { alert, LoginService, User } from "../shared";
@Component({
selector: "gr-login",
moduleId: module.id,
templateUrl: "./login.component.html",
styleUrls: ["./login-common.css", "./login.component.css"],
})
export class LoginComponent implements OnInit {
user: User;
isLoggingIn = true;
isAuthenticating = false;
@ViewChild("initialContainer", { static: false }) initialContainer: ElementRef;
@ViewChild("mainContainer", { static: false }) mainContainer: ElementRef;
@ViewChild("logoContainer", { static: false }) logoContainer: ElementRef;
@ViewChild("formControls", { static: false }) formControls: ElementRef;
@ViewChild("signUpStack", { static: false }) signUpStack: ElementRef;
@ViewChild("password", { static: false }) password: ElementRef;
constructor(private router: Router,
private userService: LoginService,
private page: Page) {
this.user = new User();
// this.page.className = "login-page";
}
ngOnInit() {
this.page.actionBarHidden = true;
}
focusPassword() {
this.password.nativeElement.focus();
}
startBackgroundAnimation(background) {
background.animate({
scale: { x: 1.0, y: 1.0 },
duration: 10000
});
}
submit() {
if (!this.user.isValidEmail()) {
alert("Enter a valid email address.");
return;
}
this.isAuthenticating = true;
if (this.isLoggingIn) {
this.login();
} else {
this.signUp();
}
}
login() {
if (getConnectionType() === connectionType.none) {
alert("Groceries requires an internet connection to log in.");
return;
}
this.userService.login(this.user)
.subscribe(
() => {
this.isAuthenticating = false;
this.router.navigate(["/"]);
},
(error) => {
alert("Unfortunately we could not find your account.");
this.isAuthenticating = false;
}
);
}
signUp() {
if (getConnectionType() === connectionType.none) {
alert("Groceries requires an internet connection to register.");
return;
}
this.userService.register(this.user)
.subscribe(
() => {
alert("Your account was successfully created.");
this.isAuthenticating = false;
this.toggleDisplay();
},
(errorDetails) => {
if (errorDetails.error && errorDetails.error.error === "UserAlreadyExists") {
alert("This email address is already in use.");
} else {
alert("Unfortunately we were unable to create your account.");
}
this.isAuthenticating = false;
}
);
}
forgotPassword() {
prompt({
title: "Forgot Password",
message: "Enter the email address you used to register for Groceries to reset your password.",
defaultText: "",
okButtonText: "Ok",
cancelButtonText: "Cancel"
}).then((data) => {
if (data.result) {
this.userService.resetPassword(data.text.trim())
.subscribe(() => {
alert("Your password was successfully reset. Please check your email for instructions on choosing a new password.");
}, () => {
alert("Unfortunately, an error occurred resetting your password.");
});
}
});
}
toggleDisplay() {
this.isLoggingIn = !this.isLoggingIn;
let mainContainer = <View>this.mainContainer.nativeElement;
mainContainer.animate({
backgroundColor: this.isLoggingIn ? new Color("white") : new Color("#301217"),
duration: 200
});
}
showMainContent() {
let initialContainer = <View>this.initialContainer.nativeElement;
let mainContainer = <View>this.mainContainer.nativeElement;
let logoContainer = <View>this.logoContainer.nativeElement;
let formControls = <View>this.formControls.nativeElement;
let signUpStack = <View>this.signUpStack.nativeElement;
let animations = [];
// Fade out the initial content over one half second
initialContainer.animate({
opacity: 0,
duration: 500
}).then(function() {
// After the animation completes, hide the initial container and
// show the main container and logo. The main container and logo will
// not immediately appear because their opacity is set to 0 in CSS.
initialContainer.style.visibility = "collapse";
mainContainer.style.visibility = "visible";
logoContainer.style.visibility = "visible";
// Fade in the main container and logo over one half second.
animations.push({ target: mainContainer, opacity: 1, duration: 500 });
animations.push({ target: logoContainer, opacity: 1, duration: 500 });
// Slide up the form controls and sign up container.
animations.push({ target: signUpStack, translate: { x: 0, y: 0 }, opacity: 1, delay: 500, duration: 150 });
animations.push({ target: formControls, translate: { x: 0, y: 0 }, opacity: 1, delay: 650, duration: 150 });
// Kick off the animation queue
new Animation(animations, false).play();
});
}
}
================================================
FILE: app/login/login.module.ts
================================================
import { NativeScriptCommonModule } from "nativescript-angular/common";
import { NativeScriptFormsModule } from "nativescript-angular/forms";
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { loginRouting } from "./login.routing";
import { LoginComponent } from "./login.component";
@NgModule({
imports: [
NativeScriptFormsModule,
NativeScriptCommonModule,
loginRouting,
],
declarations: [
LoginComponent
],
schemas: [NO_ERRORS_SCHEMA]
})
export class LoginModule { }
================================================
FILE: app/login/login.routing.ts
================================================
import { ModuleWithProviders } from "@angular/core";
import { Routes, RouterModule } from "@angular/router";
import { LoginComponent } from "./login.component";
const loginRoutes: Routes = [
{ path: "login", component: LoginComponent },
];
export const loginRouting: ModuleWithProviders = RouterModule.forChild(loginRoutes);
================================================
FILE: app/main.aot.ts
================================================
// this import should be first in order to load some required settings (like globals and reflect-metadata)
import { platformNativeScript } from "nativescript-angular/platform-static";
import { AppModuleNgFactory } from "./app.module.ngfactory";
platformNativeScript().bootstrapModuleFactory(AppModuleNgFactory);
================================================
FILE: app/main.ts
================================================
import { platformNativeScriptDynamic } from "nativescript-angular/platform";
import { AppModule } from "./app.module";
platformNativeScriptDynamic().bootstrapModule(AppModule);
================================================
FILE: app/package.json
================================================
{
"android": {
"v8Flags": "--expose_gc",
"markingMode": "none"
},
"main": "main.js"
}
================================================
FILE: app/platform.android.css
================================================
================================================
FILE: app/platform.ios.css
================================================
TextField {
border-width: 1;
border-color: black;
}
================================================
FILE: app/shared/backend.service.ts
================================================
import { Injectable } from "@angular/core";
import { getString, setString } from "tns-core-modules/application-settings";
const tokenKey = "token";
export class BackendService {
static baseUrl = "https://baas.kinvey.com/";
static appKey = "kid_HyHoT_REf";
static appUserHeader = "Basic a2lkX0h5SG9UX1JFZjo1MTkxMDJlZWFhMzQ0MzMyODFjN2MyODM3MGQ5OTIzMQ";
static apiUrl = "";
static isLoggedIn(): boolean {
return !!getString(tokenKey);
}
static get token(): string {
return getString(tokenKey);
}
static set token(theToken: string) {
setString(tokenKey, theToken);
}
}
================================================
FILE: app/shared/dialog-util.ts
================================================
import * as dialogsModule from "tns-core-modules/ui/dialogs";
export function alert(message: string) {
return dialogsModule.alert({
title: "Groceries",
okButtonText: "OK",
message: message
});
}
================================================
FILE: app/shared/index.ts
================================================
export * from "./backend.service";
export * from "./user.model";
export * from "./login.service";
export * from "./dialog-util";
export * from "./status-bar-util";
================================================
FILE: app/shared/login.service.ts
================================================
import { Injectable } from "@angular/core";
import { HttpHeaders, HttpClient, HttpErrorResponse } from "@angular/common/http";
import { throwError } from "rxjs";
import { tap, catchError } from "rxjs/operators";
import { User } from "./user.model";
import { BackendService } from "./backend.service";
@Injectable()
export class LoginService {
constructor(private http: HttpClient) { }
register(user: User) {
return this.http.post(
BackendService.baseUrl + "user/" + BackendService.appKey,
JSON.stringify({
username: user.email,
email: user.email,
password: user.password
}),
{ headers: this.getCommonHeaders() }
)
.pipe(catchError(this.handleErrors));
}
login(user: User) {
return this.http.post(
BackendService.baseUrl + "user/" + BackendService.appKey + "/login",
JSON.stringify({
username: user.email,
password: user.password
}),
{ headers: this.getCommonHeaders() }
)
.pipe(
tap((data: any) => {
BackendService.token = data._kmd.authtoken;
}),
catchError(this.handleErrors)
);
}
logoff() {
BackendService.token = "";
}
resetPassword(email) {
return this.http.post(
BackendService.baseUrl + "rpc/" + BackendService.appKey + "/" + email + "/user-password-reset-initiate",
{},
{ headers: this.getCommonHeaders() }
).pipe(catchError(this.handleErrors));
}
private getCommonHeaders() {
return new HttpHeaders({
"Content-Type": "application/json",
"Authorization": BackendService.appUserHeader,
});
}
private handleErrors(error: HttpErrorResponse) {
console.log(JSON.stringify(error));
return throwError(error);
}
}
================================================
FILE: app/shared/status-bar-util.ts
================================================
import * as application from "tns-core-modules/application";
import * as platform from "tns-core-modules/platform";
declare var android: any;
export function setStatusBarColors() {
// Make the Android status bar transparent.
// See http://bradmartin.net/2016/03/10/fullscreen-and-navigation-bar-color-in-a-nativescript-android-app/
// for details on the technique used.
if (application.android && platform.device.sdkVersion >= "21") {
application.android.on("activityStarted", () => {
const View = android.view.View;
const window = application.android.startActivity.getWindow();
window.setStatusBarColor(0x000000);
const decorView = window.getDecorView();
decorView.setSystemUiVisibility(
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
| View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
| View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
| View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
});
}
}
================================================
FILE: app/shared/user.model.ts
================================================
const validator = require("email-validator");
export class User {
email: string;
password: string;
isValidEmail() {
return validator.validate(this.email);
}
}
================================================
FILE: app/tests/shared/user/user.spec.ts
================================================
import "reflect-metadata";
import { User } from "../../../shared";
declare var describe: any;
declare var expect: any;
declare var it: any;
describe("Email validation", function() {
let user = new User();
it("Should reject an empty email address", function () {
user.email = "";
expect(user.isValidEmail()).toBe(false);
});
it("Should reject a malformed email addresses", function() {
user.email = "nativescript";
expect(user.isValidEmail()).toBe(false);
user.email = "nativescript@";
expect(user.isValidEmail()).toBe(false);
user.email = "nativescript@isawesome";
expect(user.isValidEmail()).toBe(false);
});
it("Should accept valid email addresses", function() {
user.email = "nativescript@isawesome.com";
expect(user.isValidEmail()).toBe(true);
});
});
================================================
FILE: e2e/config/appium.capabilities.json
================================================
{
"android19": {
"platformName": "Android",
"platformVersion": "4.4",
"deviceName": "Emulator-Api19-Default",
"avd": "Emulator-Api19-Default",
"lt": 60000,
"appActivity": "com.tns.NativeScriptActivity",
"newCommandTimeout": 720,
"noReset": true,
"fullReset": false,
"app": ""
},
"android21": {
"platformName": "Android",
"platformVersion": "5.0",
"deviceName": "Emulator-Api21-Default",
"avd": "Emulator-Api21-Default",
"lt": 60000,
"appActivity": "com.tns.NativeScriptActivity",
"newCommandTimeout": 720,
"noReset": true,
"fullReset": false,
"app": ""
},
"android23": {
"platformName": "Android",
"platformVersion": "6.0",
"deviceName": "Android Emulator",
"appiumVersion": "1.8.0",
"relaxed-security": true,
"noReset": true,
"resetKeyboard": true,
"app": ""
},
"android24": {
"platformName": "Android",
"platformVersion": "7.0",
"deviceName": "Emulator-Api24-Default",
"avd": "Emulator-Api24-Default",
"lt": 60000,
"appActivity": "com.tns.NativeScriptActivity",
"newCommandTimeout": 720,
"noReset": true,
"fullReset": false,
"app": ""
},
"android25": {
"platformName": "Android",
"platformVersion": "7.1",
"deviceName": "Emulator-Api25-Google",
"avd": "Emulator-Api25-Google",
"lt": 60000,
"appActivity": "com.tns.NativeScriptActivity",
"newCommandTimeout": 720,
"noReset": true,
"fullReset": false,
"app": ""
},
"android26": {
"platformName": "Android",
"platformVersion": "8.0",
"deviceName": "Emulator-Api26-Google",
"avd": "Emulator-Api26-Google",
"lt": 60000,
"newCommandTimeout": 720,
"noReset": true,
"fullReset": false,
"app": ""
},
"sim.iPhone6.iOS100": {
"platformName": "iOS",
"platformVersion": "10.0",
"deviceName": "iPhone 6",
"noReset": true,
"fullReset": false,
"app": "",
"density": 2,
"offsetPixels": 33
},
"sim.iPhone7": {
"platformName": "iOS",
"platformVersion": "11.2",
"deviceName": "iPhone 7",
"noReset": true,
"fullReset": false,
"app": ""
},
"sim.iPhone8": {
"platformName": "iOS",
"platformVersion": "11.2",
"deviceName": "iPhone 8",
"noReset": true,
"fullReset": false,
"app": ""
},
"sim.iPhoneX.iOS110": {
"platformName": "iOS",
"platformVersion": "11.0",
"deviceName": "iPhone X",
"noReset": true,
"fullReset": false,
"app": ""
},
"android23.local": {
"platformName": "Android",
"platformVersion": "6.0",
"deviceName": "Emulator-Api23-Default",
"noReset": true,
"appium-version": "1.7.1"
}
}
================================================
FILE: e2e/config/mocha.opts
================================================
--timeout 1000000
--recursive e2e
--exit
================================================
FILE: e2e/groceries.e2e.ts
================================================
import { AppiumDriver, createDriver, SearchOptions } from "nativescript-dev-appium";
import { expect } from "chai";
describe("Groceries", async function () {
let driver: AppiumDriver;
const loginButtonText = "Login";
const email = "groceries@mailinator.com";
const password = "123";
const fruit = "apple";
const recentButtonText = "Recent";
const doneButtonText = "Done";
const logOffButtonText = "Log Off";
const invalidEmail = "groceries@mailinator";
const invalidEmailWarningText = "valid email";
const okButtonText = "OK";
const cancelButtonText = "Cancel";
const signUpHereButtonText = "Sign up here";
const signUpButtonText = "Sign up";
const backToLoginButtonText = "Back to login";
const forgotPasswordButtonText = "Forgot";
const forgotPasswordFormText = "reset";
const clickOnCrossOrCheckboxBtn = async () => {
if (driver.isAndroid) {
// First image is the menu, second is the cross button. The rest are pairs checkbox/bin per list item.
const allImages = await driver.findElementsByClassName(driver.locators.image);
await allImages[2].click(); // Checkbox button
} else {
await driver.clickPoint(26, 160); // Checkbox button
}
};
const clickOnBinButton = async () => {
if (driver.isAndroid) {
// First image is the menu, second is the cross button. The rest are pairs checkbox/bin per list item.
const allImages = await driver.findElementsByClassName(driver.locators.image);
for (let i = 3; i < allImages.length; i = i + 2) {
await allImages[3].click(); // Bin button of the first list item
}
} else {
const allImages = await driver.findElementsByText(fruit);
for (let i = 0; i < allImages.length; i++) {
await driver.clickPoint(345, 166); // Bin button of the first list item
}
}
};
before(async () => {
driver = await createDriver();
driver.defaultWaitTime = 15000;
});
after(async () => {
if (driver.nsCapabilities.isSauceLab) {
driver.sessionId().then(function (sessionId) {
console.log("Report: https://saucelabs.com/beta/tests/" + sessionId);
});
}
await driver.quit();
console.log("Driver quits!");
});
it("should log in", async () => {
const loginButton = await driver.findElementByText(loginButtonText, SearchOptions.exact);
await loginButton.click();
if (driver.isAndroid) {
const allFields = await driver.findElementsByClassName(driver.locators.getElementByName("textfield"));
await allFields[0].sendKeys(email);
await allFields[1].sendKeys(password);
if (driver.nsCapabilities.isSauceLab) {
await driver.driver.hideDeviceKeyboard("Done");
}
} else {
const usernameField = await driver.findElementByClassName(driver.locators.getElementByName("textfield"));
await usernameField.sendKeys(email);
const passField = await driver.findElementByClassName(driver.locators.getElementByName("securetextfield"));
await passField.sendKeys(password);
const done = await driver.findElementByText("Done", SearchOptions.contains);
await done.click();
}
const loginBtn = await driver.findElementByText(loginButtonText, SearchOptions.exact);
await loginBtn.click();
const recentButton = await driver.findElementByText(recentButtonText, SearchOptions.exact);
expect(recentButton).to.exist;
});
it("should add element in the list", async () => {
const addField = await driver.findElementByClassName(driver.locators.getElementByName("textfield"));
await addField.sendKeys(fruit);
const allImages = await driver.findElementsByClassName(driver.locators.image); // First image is the menu, second is the cross adding to the list.
await allImages[1].click(); // Cross image button to add the item.
const appleItem = await driver.findElementByText(fruit);
expect(appleItem).to.exist;
});
it("should mark element as Done", async () => {
await clickOnCrossOrCheckboxBtn();
const appleItem = await driver.findElementByText(fruit);
const isItemDone = await driver.compareElement(appleItem, "itemDone", 0.07);
expect(isItemDone).to.be.true;
});
it("should delete item from the list", async () => {
await clickOnBinButton();
const appleListItemXpath = await driver.elementHelper.getXPathByText(fruit, SearchOptions.exact);
const appleItem = await driver.findElementByXPathIfExists(appleListItemXpath, 10000);
expect(appleItem).to.be.undefined;
});
it("should find deleted item in Recent", async () => {
const recentButton = await driver.findElementByText(recentButtonText);
await recentButton.click();
const appleItem = await driver.findElementByText(fruit);
expect(appleItem).to.exist;
});
it("should return back an item from the Recent list", async () => {
await clickOnCrossOrCheckboxBtn();
const doneButton = await driver.findElementByText(doneButtonText);
await doneButton.click();
const appleItem = await driver.findElementByText(fruit);
expect(appleItem).to.exist;
});
it("should delete item from the Groceries list and remove it from Recent", async () => {
await clickOnBinButton();
const recentButton = await driver.findElementByText(recentButtonText);
await recentButton.click();
await clickOnBinButton();
const appleListItemXpath = await driver.elementHelper.getXPathByText(fruit, SearchOptions.contains);
const appleItem = await driver.findElementByXPathIfExists(appleListItemXpath, 10000);
expect(appleItem).to.be.undefined;
});
it("should log off", async () => {
// First image is the menu, second is the clock/cross button. The rest are pairs checkbox/bin per list item.
await driver.sleep(2000);
const allImages = await driver.findElementsByClassName(driver.locators.image);
await allImages[0].click(); // Menu button
const logOffButton = await driver.findElementByText(logOffButtonText);
await logOffButton.click();
const loginButton = await driver.findElementByText(loginButtonText, SearchOptions.contains);
expect(loginButton).to.exist;
});
it("should warn for invalid email", async () => {
const loginButton = await driver.findElementByText(loginButtonText, SearchOptions.exact);
await loginButton.click();
const usernameField = await driver.findElementByClassName(driver.locators.getElementByName("textfield"));
await usernameField.sendKeys(invalidEmail);
if (driver.isAndroid) {
if (driver.nsCapabilities.isSauceLab) {
await driver.driver.hideDeviceKeyboard("Done");
}
} else {
const done = await driver.findElementByText("Done", SearchOptions.contains);
await done.click();
}
const loginBtn = await driver.findElementByText(loginButtonText, SearchOptions.exact);
await loginBtn.click();
const invalidEmailWarning = await driver.findElementByText(invalidEmailWarningText, SearchOptions.contains);
expect(invalidEmailWarning).to.exist;
const okButton = await driver.findElementByText(okButtonText);
await okButton.click();
});
it("should open sign up form", async () => {
const signUpHereButton = await driver.findElementByText(signUpHereButtonText);
await signUpHereButton.click();
const signUpButton = await driver.findElementByText(signUpButtonText, SearchOptions.exact);
expect(signUpButton).to.exist;
const backToLoginButton = await driver.findElementByText(backToLoginButtonText);
await backToLoginButton.click();
});
it("should open Forgot password form", async () => {
const forgotPasswordButton = await driver.findElementByText(forgotPasswordButtonText, SearchOptions.contains);
await forgotPasswordButton.click();
const forgotPasswordForm = await driver.findElementByText(forgotPasswordFormText, SearchOptions.contains);
expect(forgotPasswordForm).to.exist;
const cancelButton = await driver.findElementByText(cancelButtonText);
await cancelButton.click();
});
});
================================================
FILE: e2e/setup.ts
================================================
import { startServer, stopServer } from "nativescript-dev-appium";
before("start server", async () => {
await startServer();
});
after("stop server", async () => {
await stopServer();
});
================================================
FILE: e2e/tsconfig.json
================================================
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"importHelpers": false,
"types": [
"node",
"mocha",
"chai"
],
"lib": [
"es2015",
"dom"
]
}
}
================================================
FILE: karma.conf.js
================================================
module.exports = function (config) {
const options = {
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: ['app/tests/**/*.*'],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: [],
customLaunchers: {
android: {
base: 'NS',
platform: 'android'
},
ios: {
base: 'NS',
platform: 'ios'
},
ios_simulator: {
base: 'NS',
platform: 'ios',
arguments: ['--emulator']
}
},
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
};
setWebpackPreprocessor(config, options);
setWebpack(config, options);
config.set(options);
}
function setWebpackPreprocessor(config, options) {
if (config && config.bundle) {
if (!options.preprocessors) {
options.preprocessors = {};
}
options.files.forEach(file => {
if (!options.preprocessors[file]) {
options.preprocessors[file] = [];
}
options.preprocessors[file].push('webpack');
});
}
}
function setWebpack(config, options) {
if (config && config.bundle) {
const env = {};
env[config.platform] = true;
env.sourceMap = config.debugBrk;
options.webpack = require('./webpack.config')(env);
delete options.webpack.entry;
delete options.webpack.output.libraryTarget;
const invalidPluginsForUnitTesting = ["GenerateBundleStarterPlugin", "GenerateNativeScriptEntryPointsPlugin"];
options.webpack.plugins = options.webpack.plugins.filter(p => !invalidPluginsForUnitTesting.includes(p.constructor.name));
}
}
================================================
FILE: package.json
================================================
{
"name": "sample-groceries",
"version": "1.0.0",
"description": "A NativeScript-built iOS and Android app for managing grocery lists",
"repository": {
"type": "git",
"url": "https://github.com/nativescript/sample-Groceries.git"
},
"keywords": [
"NativeScript"
],
"author": "TJ VanToll <tj.vantoll@gmail.com> (https://www.tjvantoll.com/)",
"license": "MIT",
"bugs": {
"url": "https://github.com/nativescript/sample-Groceries/issues"
},
"homepage": "https://github.com/nativescript/sample-Groceries/groceries",
"nativescript": {
"id": "org.nativescript.groceries",
"tns-android": {
"version": "6.0.1"
},
"tns-ios": {
"version": "6.0.2"
}
},
"scripts": {
"tslint": "tslint -p tsconfig.json",
"ns-bundle": "ns-bundle",
"start-android-bundle": "npm run ns-bundle --android --run-app",
"start-ios-bundle": "npm run ns-bundle --ios --run-app",
"build-android-bundle": "npm run ns-bundle --android --build-app",
"build-ios-bundle": "npm run ns-bundle --ios --build-app",
"publish-ios-bundle": "npm run ns-bundle --ios --publish-app",
"generate-android-snapshot": "generate-android-snapshot --targetArchs arm,arm64,ia32 --install",
"e2e": "tsc -p e2e && mocha --opts ./e2e/config/mocha.opts",
"watch-tests": "tsc -p e2e --watch",
"update-app-ng-deps": "update-app-ng-deps",
"ns-verify-bundle": "ns-verify-bundle",
"update-ns-webpack": "update-ns-webpack"
},
"dependencies": {
"@angular/common": "~8.2.0",
"@angular/compiler": "~8.2.0",
"@angular/core": "~8.2.0",
"@angular/forms": "~8.2.0",
"@angular/platform-browser": "~8.2.0",
"@angular/platform-browser-dynamic": "~8.2.0",
"@angular/router": "~8.2.0",
"email-validator": "^2.0.4",
"nativescript-angular": "~8.2.0",
"nativescript-iqkeyboardmanager": "~1.3.0",
"nativescript-social-share": "~1.5.1",
"nativescript-unit-test-runner": "0.7.0",
"reflect-metadata": "~0.1.8",
"rxjs": "^6.4.0",
"tns-core-modules": "~6.0.1",
"zone.js": "^0.9.1"
},
"devDependencies": {
"@angular/compiler-cli": "8.2.0",
"@ngtools/webpack": "8.2.0",
"@types/chai": "~4.1.7",
"@types/mocha": "~5.2.5",
"@types/node": "~10.12.18",
"babel-traverse": "6.26.0",
"babel-types": "6.26.0",
"babylon": "6.18.0",
"codelyzer": "^4.5.0",
"filewalker": "^0.1.3",
"jasmine-core": "^3.3.0",
"karma": "4.1.0",
"karma-jasmine": "2.0.1",
"karma-nativescript-launcher": "^0.4.0",
"karma-webpack": "3.0.5",
"lazy": "1.0.11",
"mocha": "~5.2.0",
"mocha-junit-reporter": "~1.18.0",
"mocha-multi": "~1.0.1",
"nativescript-dev-appium": "next",
"nativescript-dev-webpack": "~1.1.0",
"tslint": "^5.4.2",
"typescript": "~3.5.3"
}
}
================================================
FILE: references.d.ts
================================================
/// <reference path="./node_modules/tns-core-modules/tns-core-modules.d.ts" /> Needed for autocompletion and compilation.
================================================
FILE: tsconfig.esm.json
================================================
{
"extends": "./tsconfig",
"compilerOptions": {
"module": "es2015",
"moduleResolution": "node"
}
}
================================================
FILE: tsconfig.json
================================================
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"noEmitHelpers": true,
"noEmitOnError": true,
"lib": [
"dom",
"es6",
"es2015.iterable"
],
"baseUrl": ".",
"paths": {
"*": [
"./node_modules/tns-core-modules/*",
"./node_modules/*"
],
"~/*": [
"app/*"
]
}
},
"exclude": [
"node_modules",
"platforms",
"e2e"
]
}
================================================
FILE: tsconfig.tns.json
================================================
{
"extends": "./tsconfig",
"compilerOptions": {
"module": "es2015",
"moduleResolution": "node"
}
}
================================================
FILE: tslint.json
================================================
{
"rulesDirectory": [
"node_modules/codelyzer"
],
"rules": {
"class-name": true,
"comment-format": [
true,
"check-space"
],
"indent": [
true,
"spaces"
],
"no-duplicate-variable": true,
"no-eval": true,
"no-internal-module": true,
"no-trailing-whitespace": true,
"no-var-keyword": true,
"one-line": [
true,
"check-open-brace",
"check-whitespace"
],
"quotemark": [
true,
"double"
],
"semicolon": [
true,
"always"
],
"triple-equals": [
true,
"allow-null-check"
],
"typedef-whitespace": [
true,
{
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
}
],
"variable-name": [
true,
"ban-keywords"
],
"whitespace": [
true,
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type"
],
"directive-selector": [true, "attribute", "gr", "camelCase"],
"component-selector": [true, "element", "gr", "kebab-case"],
"use-input-property-decorator": true,
"use-output-property-decorator": true,
"use-host-property-decorator": true,
"no-attribute-parameter-decorator": true,
"no-input-rename": true,
"no-output-rename": true,
"no-forward-ref" :true,
"use-life-cycle-interface": true,
"use-pipe-transform-interface": true,
"component-class-suffix": true,
"directive-class-suffix": true,
"import-destructuring-spacing": true
}
}
================================================
FILE: webpack.config.js
================================================
const { join, relative, resolve, sep, dirname } = require("path");
const webpack = require("webpack");
const nsWebpack = require("nativescript-dev-webpack");
const nativescriptTarget = require("nativescript-dev-webpack/nativescript-target");
const { nsReplaceBootstrap } = require("nativescript-dev-webpack/transformers/ns-replace-bootstrap");
const { nsReplaceLazyLoader } = require("nativescript-dev-webpack/transformers/ns-replace-lazy-loader");
const { nsSupportHmrNg } = require("nativescript-dev-webpack/transformers/ns-support-hmr-ng");
const { getMainModulePath } = require("nativescript-dev-webpack/utils/ast-utils");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
const { NativeScriptWorkerPlugin } = require("nativescript-worker-loader/NativeScriptWorkerPlugin");
const TerserPlugin = require("terser-webpack-plugin");
const { getAngularCompilerPlugin } = require("nativescript-dev-webpack/plugins/NativeScriptAngularCompilerPlugin");
const hashSalt = Date.now().toString();
module.exports = env => {
// Add your custom Activities, Services and other Android app components here.
const appComponents = [
"tns-core-modules/ui/frame",
"tns-core-modules/ui/frame/activity",
];
const platform = env && (env.android && "android" || env.ios && "ios");
if (!platform) {
throw new Error("You need to provide a target platform!");
}
const AngularCompilerPlugin = getAngularCompilerPlugin(platform);
const projectRoot = __dirname;
// Default destination inside platforms/<platform>/...
const dist = resolve(projectRoot, nsWebpack.getAppPath(platform, projectRoot));
const {
// The 'appPath' and 'appResourcesPath' values are fetched from
// the nsconfig.json configuration file.
appPath = "src",
appResourcesPath = "App_Resources",
// You can provide the following flags when running 'tns run android|ios'
aot, // --env.aot
snapshot, // --env.snapshot,
production, // --env.production
uglify, // --env.uglify
report, // --env.report
sourceMap, // --env.sourceMap
hiddenSourceMap, // --env.hiddenSourceMap
hmr, // --env.hmr,
unitTesting, // --env.unitTesting
verbose, // --env.verbose
} = env;
const isAnySourceMapEnabled = !!sourceMap || !!hiddenSourceMap;
const externals = nsWebpack.getConvertedExternals(env.externals);
const appFullPath = resolve(projectRoot, appPath);
const appResourcesFullPath = resolve(projectRoot, appResourcesPath);
const tsConfigName = "tsconfig.tns.json";
const entryModule = `${nsWebpack.getEntryModule(appFullPath, platform)}.ts`;
const entryPath = `.${sep}${entryModule}`;
const entries = { bundle: entryPath };
const areCoreModulesExternal = Array.isArray(env.externals) && env.externals.some(e => e.indexOf("tns-core-modules") > -1);
if (platform === "ios" && !areCoreModulesExternal) {
entries["tns_modules/tns-core-modules/inspector_modules"] = "inspector_modules";
};
const ngCompilerTransformers = [];
const additionalLazyModuleResources = [];
if (aot) {
ngCompilerTransformers.push(nsReplaceBootstrap);
}
if (hmr) {
ngCompilerTransformers.push(nsSupportHmrNg);
}
// when "@angular/core" is external, it's not included in the bundles. In this way, it will be used
// directly from node_modules and the Angular modules loader won't be able to resolve the lazy routes
// fixes https://github.com/NativeScript/nativescript-cli/issues/4024
if (env.externals && env.externals.indexOf("@angular/core") > -1) {
const appModuleRelativePath = getMainModulePath(resolve(appFullPath, entryModule), tsConfigName);
if (appModuleRelativePath) {
const appModuleFolderPath = dirname(resolve(appFullPath, appModuleRelativePath));
// include the lazy loader inside app module
ngCompilerTransformers.push(nsReplaceLazyLoader);
// include the new lazy loader path in the allowed ones
additionalLazyModuleResources.push(appModuleFolderPath);
}
}
const ngCompilerPlugin = new AngularCompilerPlugin({
hostReplacementPaths: nsWebpack.getResolver([platform, "tns"]),
platformTransformers: ngCompilerTransformers.map(t => t(() => ngCompilerPlugin, resolve(appFullPath, entryModule), projectRoot)),
mainPath: join(appFullPath, entryModule),
tsConfigPath: join(__dirname, tsConfigName),
skipCodeGeneration: !aot,
sourceMap: !!isAnySourceMapEnabled,
additionalLazyModuleResources: additionalLazyModuleResources
});
let sourceMapFilename = nsWebpack.getSourceMapFilename(hiddenSourceMap, __dirname, dist);
const itemsToClean = [`${dist}/**/*`];
if (platform === "android") {
itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "src", "main", "assets", "snapshots")}`);
itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "build", "configurations", "nativescript-android-snapshot")}`);
}
nsWebpack.processAppComponents(appComponents, platform);
const config = {
mode: production ? "production" : "development",
context: appFullPath,
externals,
watchOptions: {
ignored: [
appResourcesFullPath,
// Don't watch hidden files
"**/.*",
]
},
target: nativescriptTarget,
entry: entries,
output: {
pathinfo: false,
path: dist,
sourceMapFilename,
libraryTarget: "commonjs2",
filename: "[name].js",
globalObject: "global",
hashSalt
},
resolve: {
extensions: [".ts", ".js", ".scss", ".css"],
// Resolve {N} system modules from tns-core-modules
modules: [
resolve(__dirname, "node_modules/tns-core-modules"),
resolve(__dirname, "node_modules"),
"node_modules/tns-core-modules",
"node_modules",
],
alias: {
'~': appFullPath
},
symlinks: true
},
resolveLoader: {
symlinks: false
},
node: {
// Disable node shims that conflict with NativeScript
"http": false,
"timers": false,
"setImmediate": false,
"fs": "empty",
"__dirname": false,
},
devtool: hiddenSourceMap ? "hidden-source-map" : (sourceMap ? "inline-source-map" : "none"),
optimization: {
runtimeChunk: "single",
splitChunks: {
cacheGroups: {
vendor: {
name: "vendor",
chunks: "all",
test: (module, chunks) => {
const moduleName = module.nameForCondition ? module.nameForCondition() : '';
return /[\\/]node_modules[\\/]/.test(moduleName) ||
appComponents.some(comp => comp === moduleName);
},
enforce: true,
},
}
},
minimize: !!uglify,
minimizer: [
new TerserPlugin({
parallel: true,
cache: true,
sourceMap: isAnySourceMapEnabled,
terserOptions: {
output: {
comments: false,
semicolons: !isAnySourceMapEnabled
},
compress: {
// The Android SBG has problems parsing the output
// when these options are enabled
'collapse_vars': platform !== "android",
sequences: platform !== "android",
}
}
})
],
},
module: {
rules: [
{
include: join(appFullPath, entryPath),
use: [
// Require all Android app components
platform === "android" && {
loader: "nativescript-dev-webpack/android-app-components-loader",
options: { modules: appComponents }
},
{
loader: "nativescript-dev-webpack/bundle-config-loader",
options: {
angular: true,
loadCss: !snapshot, // load the application css if in debug mode
unitTesting,
appFullPath,
projectRoot,
ignoredFiles: nsWebpack.getUserDefinedEntries(entries, platform)
}
},
].filter(loader => !!loader)
},
{ test: /\.html$|\.xml$/, use: "raw-loader" },
// tns-core-modules reads the app.css and its imports using css-loader
{
test: /[\/|\\]app\.css$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "css-loader", options: { url: false } }
]
},
{
test: /[\/|\\]app\.scss$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "css-loader", options: { url: false } },
"sass-loader"
]
},
// Angular components reference css files and their imports using raw-loader
{ test: /\.css$/, exclude: /[\/|\\]app\.css$/, use: "raw-loader" },
{ test: /\.scss$/, exclude: /[\/|\\]app\.scss$/, use: ["raw-loader", "resolve-url-loader", "sass-loader"] },
{
test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
use: [
"nativescript-dev-webpack/moduleid-compat-loader",
"nativescript-dev-webpack/lazy-ngmodule-hot-loader",
"@ngtools/webpack",
]
},
// Mark files inside `@angular/core` as using SystemJS style dynamic imports.
// Removing this will cause deprecation warnings to appear.
{
test: /[\/\\]@angular[\/\\]core[\/\\].+\.js$/,
parser: { system: true },
},
],
},
plugins: [
// Define useful constants like TNS_WEBPACK
new webpack.DefinePlugin({
"global.TNS_WEBPACK": "true",
"process": "global.process",
}),
// Remove all files from the out dir.
new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }),
// Copy assets to out dir. Add your own globs as needed.
new CopyWebpackPlugin([
{ from: { glob: "fonts/**" } },
{ from: { glob: "**/*.jpg" } },
{ from: { glob: "**/*.png" } },
], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),
new nsWebpack.GenerateNativeScriptEntryPointsPlugin("bundle"),
// For instructions on how to set up workers with webpack
// check out https://github.com/nativescript/worker-loader
new NativeScriptWorkerPlugin(),
ngCompilerPlugin,
// Does IPC communication with the {N} CLI to notify events when running in watch mode.
new nsWebpack.WatchStateLoggerPlugin(),
],
};
if (report) {
// Generate report files for bundles content
config.plugins.push(new BundleAnalyzerPlugin({
analyzerMode: "static",
openAnalyzer: false,
generateStatsFile: true,
reportFilename: resolve(projectRoot, "report", `report.html`),
statsFilename: resolve(projectRoot, "report", `stats.json`),
}));
}
if (snapshot) {
config.plugins.push(new nsWebpack.NativeScriptSnapshotPlugin({
chunk: "vendor",
angular: true,
requireModules: [
"reflect-metadata",
"@angular/platform-browser",
"@angular/core",
"@angular/common",
"@angular/router",
"nativescript-angular/platform-static",
"nativescript-angular/router",
],
projectRoot,
webpackConfig: config,
}));
}
if (hmr) {
config.plugins.push(new webpack.HotModuleReplacementPlugin());
}
return config;
};
gitextract_9481lv8a/ ├── .ctags-exclude ├── .gitignore ├── .travis.yml ├── .vscode/ │ ├── launch.json │ └── settings.json ├── CODE_OF_CONDUCT.md ├── LICENSE ├── README.md ├── app/ │ ├── App_Resources/ │ │ ├── Android/ │ │ │ ├── app.gradle │ │ │ └── src/ │ │ │ └── main/ │ │ │ ├── AndroidManifest.xml │ │ │ └── res/ │ │ │ ├── drawable-nodpi/ │ │ │ │ └── splash_screen.xml │ │ │ ├── values/ │ │ │ │ ├── colors.xml │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ └── values-v21/ │ │ │ ├── colors.xml │ │ │ └── styles.xml │ │ └── iOS/ │ │ ├── Assets.xcassets/ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ └── Contents.json │ │ │ ├── Contents.json │ │ │ ├── LaunchImage.launchimage/ │ │ │ │ └── Contents.json │ │ │ ├── LaunchScreen.AspectFill.imageset/ │ │ │ │ └── Contents.json │ │ │ └── LaunchScreen.Center.imageset/ │ │ │ └── Contents.json │ │ ├── Info.plist │ │ ├── LaunchScreen.storyboard │ │ └── build.xcconfig │ ├── app.component.ts │ ├── app.css │ ├── app.module.ngfactory.d.ts │ ├── app.module.ts │ ├── app.routing.ts │ ├── auth-guard.service.ts │ ├── groceries/ │ │ ├── groceries-common.css │ │ ├── groceries.component.android.css │ │ ├── groceries.component.html │ │ ├── groceries.component.ios.css │ │ ├── groceries.component.ts │ │ ├── groceries.module.ts │ │ ├── groceries.routing.ts │ │ ├── grocery-list/ │ │ │ ├── grocery-list.component.css │ │ │ ├── grocery-list.component.html │ │ │ ├── grocery-list.component.ts │ │ │ └── item-status.pipe.ts │ │ └── shared/ │ │ ├── grocery.model.ts │ │ ├── grocery.service.ts │ │ └── index.ts │ ├── login/ │ │ ├── login-common.css │ │ ├── login.component.android.css │ │ ├── login.component.html │ │ ├── login.component.ios.css │ │ ├── login.component.ts │ │ ├── login.module.ts │ │ └── login.routing.ts │ ├── main.aot.ts │ ├── main.ts │ ├── package.json │ ├── platform.android.css │ ├── platform.ios.css │ ├── shared/ │ │ ├── backend.service.ts │ │ ├── dialog-util.ts │ │ ├── index.ts │ │ ├── login.service.ts │ │ ├── status-bar-util.ts │ │ └── user.model.ts │ └── tests/ │ └── shared/ │ └── user/ │ └── user.spec.ts ├── e2e/ │ ├── config/ │ │ ├── appium.capabilities.json │ │ └── mocha.opts │ ├── groceries.e2e.ts │ ├── setup.ts │ └── tsconfig.json ├── karma.conf.js ├── package.json ├── references.d.ts ├── tsconfig.esm.json ├── tsconfig.json ├── tsconfig.tns.json ├── tslint.json └── webpack.config.js
SYMBOL INDEX (71 symbols across 17 files)
FILE: app/app.component.ts
class AppComponent (line 7) | class AppComponent { }
FILE: app/app.module.ts
class AppModule (line 35) | class AppModule { }
FILE: app/auth-guard.service.ts
class AuthGuard (line 7) | class AuthGuard implements CanActivate {
method constructor (line 8) | constructor(private router: Router) { }
method canActivate (line 10) | canActivate() {
FILE: app/groceries/groceries.component.ts
class GroceriesComponent (line 18) | class GroceriesComponent implements OnInit {
method constructor (line 25) | constructor(private router: Router,
method ngOnInit (line 30) | ngOnInit() {
method handleAndroidFocus (line 36) | handleAndroidFocus(textField, container) {
method showActivityIndicator (line 44) | showActivityIndicator() {
method hideActivityIndicator (line 47) | hideActivityIndicator() {
method add (line 51) | add(target: string) {
method toggleRecent (line 90) | toggleRecent() {
method showMenu (line 94) | showMenu() {
method share (line 108) | share() {
method logoff (line 117) | logoff() {
FILE: app/groceries/groceries.module.ts
class GroceriesModule (line 22) | class GroceriesModule {}
FILE: app/groceries/grocery-list/grocery-list.component.ts
class GroceryListComponent (line 15) | class GroceryListComponent implements AfterViewInit {
method constructor (line 24) | constructor(store: GroceryService) {
method ngAfterViewInit (line 27) | ngAfterViewInit() {
method load (line 30) | load() {
method makeBackgroundTransparent (line 46) | makeBackgroundTransparent(args) {
method imageSource (line 54) | imageSource(grocery) {
method toggleDone (line 61) | toggleDone(grocery: Grocery) {
method delete (line 81) | delete(grocery: Grocery) {
FILE: app/groceries/grocery-list/item-status.pipe.ts
class ItemStatusPipe (line 8) | class ItemStatusPipe implements PipeTransform {
method transform (line 10) | transform(items: Array<Grocery>, deleted: boolean) {
FILE: app/groceries/shared/grocery.model.ts
class Grocery (line 1) | class Grocery {
method constructor (line 2) | constructor(
FILE: app/groceries/shared/grocery.service.ts
class GroceryService (line 14) | class GroceryService {
method constructor (line 19) | constructor(private http: HttpClient, private zone: NgZone) { }
method load (line 21) | load() {
method add (line 45) | add(name: string) {
method setDeleteFlag (line 60) | setDeleteFlag(item: Grocery) {
method unsetDeleteFlag (line 71) | unsetDeleteFlag(item: Grocery) {
method toggleDoneFlag (line 83) | toggleDoneFlag(item: Grocery) {
method permanentlyDelete (line 89) | permanentlyDelete(item: Grocery) {
method put (line 105) | private put(grocery: Grocery) {
method publishUpdates (line 118) | private publishUpdates() {
method getCommonHeaders (line 126) | private getCommonHeaders() {
method handleErrors (line 133) | private handleErrors(error: HttpErrorResponse) {
FILE: app/login/login.component.ts
class LoginComponent (line 18) | class LoginComponent implements OnInit {
method constructor (line 30) | constructor(private router: Router,
method ngOnInit (line 37) | ngOnInit() {
method focusPassword (line 41) | focusPassword() {
method startBackgroundAnimation (line 45) | startBackgroundAnimation(background) {
method submit (line 52) | submit() {
method login (line 66) | login() {
method signUp (line 85) | signUp() {
method forgotPassword (line 109) | forgotPassword() {
method toggleDisplay (line 128) | toggleDisplay() {
method showMainContent (line 137) | showMainContent() {
FILE: app/login/login.module.ts
class LoginModule (line 19) | class LoginModule { }
FILE: app/shared/backend.service.ts
class BackendService (line 6) | class BackendService {
method isLoggedIn (line 12) | static isLoggedIn(): boolean {
method token (line 16) | static get token(): string {
method token (line 20) | static set token(theToken: string) {
FILE: app/shared/dialog-util.ts
function alert (line 3) | function alert(message: string) {
FILE: app/shared/login.service.ts
class LoginService (line 10) | class LoginService {
method constructor (line 11) | constructor(private http: HttpClient) { }
method register (line 13) | register(user: User) {
method login (line 26) | login(user: User) {
method logoff (line 43) | logoff() {
method resetPassword (line 47) | resetPassword(email) {
method getCommonHeaders (line 55) | private getCommonHeaders() {
method handleErrors (line 62) | private handleErrors(error: HttpErrorResponse) {
FILE: app/shared/status-bar-util.ts
function setStatusBarColors (line 6) | function setStatusBarColors() {
FILE: app/shared/user.model.ts
class User (line 3) | class User {
method isValidEmail (line 6) | isValidEmail() {
FILE: karma.conf.js
function setWebpackPreprocessor (line 82) | function setWebpackPreprocessor(config, options) {
function setWebpack (line 97) | function setWebpack(config, options) {
Condensed preview — 76 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (128K chars).
[
{
"path": ".ctags-exclude",
"chars": 56,
"preview": "node_modules\nplatforms\nandroid17.d.ts\nios.d.ts\n*.js\nbin\n"
},
{
"path": ".gitignore",
"chars": 146,
"preview": "npm-debug.log\n.DS_Store\n\n*.js.map\napp/**/*.js\ne2e/**/*.js\ne2e/reports/\nhooks/\nlib/\nnode_modules/\nplatforms/\ntmp/\ntypings"
},
{
"path": ".travis.yml",
"chars": 2633,
"preview": "env:\n global:\n - ANDROID_PACKAGE='sampleGroceries.apk'\n - ANDROID_PACKAGE_FOLDER=$TRAVIS_BUILD_DIR/platforms/andr"
},
{
"path": ".vscode/launch.json",
"chars": 2203,
"preview": "{\n \"version\": \"0.2.0\",\n \"configurations\": [\n {\n \"type\": \"node\",\n \"request\": \"launch\",\n \"name\": \"Moch"
},
{
"path": ".vscode/settings.json",
"chars": 207,
"preview": "// Place your settings in this file to overwrite default and user settings.\n{\n \"files.exclude\": {\n \"**/*.js\": "
},
{
"path": "CODE_OF_CONDUCT.md",
"chars": 6449,
"preview": "# NativeScript Community Code of Conduct\n\nOur community members come from all walks of life and are all at different sta"
},
{
"path": "LICENSE",
"chars": 11366,
"preview": " Apache License\n Version 2.0, January 2004\n "
},
{
"path": "README.md",
"chars": 6050,
"preview": "# Groceries [](https://travis-ci.o"
},
{
"path": "app/App_Resources/Android/app.gradle",
"chars": 484,
"preview": "// Add your native dependencies here:\n\n// Uncomment to add recyclerview-v7 dependency\n//dependencies {\n//\tcompile 'com.a"
},
{
"path": "app/App_Resources/Android/src/main/AndroidManifest.xml",
"chars": 1468,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n\tpackage=\"__"
},
{
"path": "app/App_Resources/Android/src/main/res/drawable-nodpi/splash_screen.xml",
"chars": 305,
"preview": "<layer-list xmlns:android=\"http://schemas.android.com/apk/res/android\" android:gravity=\"fill\">\n <item>\n <bitma"
},
{
"path": "app/App_Resources/Android/src/main/res/values/colors.xml",
"chars": 237,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<resources>\n <color name=\"ns_primary\">#F5F5F5</color>\n\t<color name=\"ns_primary"
},
{
"path": "app/App_Resources/Android/src/main/res/values/strings.xml",
"chars": 174,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<resources>\r\n <string name=\"app_name\">Groceries</string>\r\n <string name=\"t"
},
{
"path": "app/App_Resources/Android/src/main/res/values/styles.xml",
"chars": 1724,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<resources xmlns:android=\"http://schemas.android.com/apk/res/android\">\n\n <!-- "
},
{
"path": "app/App_Resources/Android/src/main/res/values-v21/colors.xml",
"chars": 104,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<resources>\n\t<color name=\"ns_accent\">#3d5afe</color>\n</resources>"
},
{
"path": "app/App_Resources/Android/src/main/res/values-v21/styles.xml",
"chars": 902,
"preview": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<resources>\n\n <!-- Application theme -->\n <style name=\"AppTheme\" parent=\"Ap"
},
{
"path": "app/App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/Contents.json",
"chars": 2464,
"preview": "{\n \"images\" : [\n {\n \"size\" : \"29x29\",\n \"idiom\" : \"iphone\",\n \"filename\" : \"icon-29.png\",\n \"scale\""
},
{
"path": "app/App_Resources/iOS/Assets.xcassets/Contents.json",
"chars": 62,
"preview": "{\n \"info\" : {\n \"version\" : 1,\n \"author\" : \"xcode\"\n }\n}"
},
{
"path": "app/App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Contents.json",
"chars": 3771,
"preview": "{\n \"images\" : [\n {\n \"extent\" : \"full-screen\",\n \"idiom\" : \"iphone\",\n \"subtype\" : \"736h\",\n \"filena"
},
{
"path": "app/App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/Contents.json",
"chars": 373,
"preview": "{\n \"images\" : [\n {\n \"idiom\" : \"universal\",\n \"filename\" : \"LaunchScreen-AspectFill.png\",\n \"scale\" : \"1"
},
{
"path": "app/App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/Contents.json",
"chars": 365,
"preview": "{\n \"images\" : [\n {\n \"idiom\" : \"universal\",\n \"filename\" : \"LaunchScreen-Center.png\",\n \"scale\" : \"1x\"\n "
},
{
"path": "app/App_Resources/iOS/Info.plist",
"chars": 1589,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/P"
},
{
"path": "app/App_Resources/iOS/LaunchScreen.storyboard",
"chars": 3933,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.Storyboard"
},
{
"path": "app/App_Resources/iOS/build.xcconfig",
"chars": 504,
"preview": "// You can add custom settings here\n// for example you can uncomment the following line to force distribution code signi"
},
{
"path": "app/app.component.ts",
"chars": 169,
"preview": "import { Component } from \"@angular/core\";\n\n@Component({\n selector: \"gr-main\",\n template: \"<page-router-outlet></page-"
},
{
"path": "app/app.css",
"chars": 239,
"preview": "@import url(\"./platform.css\");\n\nPage {\n font-size: 15;\n background-color: black;\n}\nActionBar {\n background-color: bla"
},
{
"path": "app/app.module.ngfactory.d.ts",
"chars": 37,
"preview": "export const AppModuleNgFactory: any;"
},
{
"path": "app/app.module.ts",
"chars": 1030,
"preview": "import { NativeScriptModule } from \"nativescript-angular/nativescript.module\";\nimport { NgModule, NO_ERRORS_SCHEMA } fro"
},
{
"path": "app/app.routing.ts",
"chars": 188,
"preview": "import { AuthGuard } from \"./auth-guard.service\";\n\nexport const authProviders = [\n AuthGuard\n];\n\nexport const appRoutes"
},
{
"path": "app/auth-guard.service.ts",
"chars": 431,
"preview": "import { Injectable } from \"@angular/core\";\nimport { Router, CanActivate } from \"@angular/router\";\n\nimport { BackendServ"
},
{
"path": "app/groceries/groceries-common.css",
"chars": 1193,
"preview": ".background {\n background-image: url(\"res://bg_inner\");\n background-repeat: no-repeat;\n background-position: center;\n"
},
{
"path": "app/groceries/groceries.component.android.css",
"chars": 55,
"preview": ".add-bar-recent-toggle {\n text-transform: uppercase;\n}"
},
{
"path": "app/groceries/groceries.component.html",
"chars": 1890,
"preview": "<GridLayout #container\n class=\"background\"\n rows=\"auto, auto, *\">\n\n <!-- Row 1: The custom action bar -->\n <GridLayo"
},
{
"path": "app/groceries/groceries.component.ios.css",
"chars": 41,
"preview": ".action-bar-custom {\n margin-top: 12;\n}\n"
},
{
"path": "app/groceries/groceries.component.ts",
"chars": 3353,
"preview": "import { Component, ElementRef, OnInit, ViewChild } from \"@angular/core\";\nimport { Router } from \"@angular/router\";\nimpo"
},
{
"path": "app/groceries/groceries.module.ts",
"chars": 731,
"preview": "import { NativeScriptCommonModule } from \"nativescript-angular/common\";\nimport { NativeScriptFormsModule } from \"natives"
},
{
"path": "app/groceries/groceries.routing.ts",
"chars": 434,
"preview": "import { ModuleWithProviders } from \"@angular/core\";\nimport { Routes, RouterModule } from \"@angular/router\";\n\nimport { "
},
{
"path": "app/groceries/grocery-list/grocery-list.component.css",
"chars": 601,
"preview": "ListView {\n background-color: transparent;\n opacity: 0;\n}\n.visible {\n animation-name: show;\n animation-duration: 1s;"
},
{
"path": "app/groceries/grocery-list/grocery-list.component.html",
"chars": 966,
"preview": "<ListView\n [row]=\"row\"\n [class.visible]=\"listLoaded\"\n [items]=\"store.items | async | itemStatus:showDeleted\"\n (itemL"
},
{
"path": "app/groceries/grocery-list/grocery-list.component.ts",
"chars": 2471,
"preview": "import { Component, ChangeDetectionStrategy, EventEmitter, Input, Output, AfterViewInit } from \"@angular/core\";\n\nimport "
},
{
"path": "app/groceries/grocery-list/item-status.pipe.ts",
"chars": 442,
"preview": "import { Pipe, PipeTransform } from \"@angular/core\";\n\nimport { Grocery } from \"../shared\";\n\n@Pipe({\n name: \"itemStatus\""
},
{
"path": "app/groceries/shared/grocery.model.ts",
"chars": 148,
"preview": "export class Grocery {\n constructor(\n public id: string,\n public name: string,\n public done: boolean,\n publ"
},
{
"path": "app/groceries/shared/grocery.service.ts",
"chars": 3349,
"preview": "import { Injectable, NgZone } from \"@angular/core\";\nimport {\n HttpClient,\n HttpHeaders,\n HttpErrorResponse,\n} from \"@"
},
{
"path": "app/groceries/shared/index.ts",
"chars": 94,
"preview": "export { GroceryService } from \"./grocery.service\";\nexport { Grocery } from \"./grocery.model\";"
},
{
"path": "app/login/login-common.css",
"chars": 1577,
"preview": "/* Hide a bunch of things to setup the initial animations */\n.form-controls, .sign-up-stack {\n opacity: 0;\n}\n\n.backgrou"
},
{
"path": "app/login/login.component.android.css",
"chars": 472,
"preview": ".main-container {\n height: 360;\n width: 275;\n}\n.initial-label {\n font-size: 32;\n letter-spacing: 0.35;\n}\n.main-label"
},
{
"path": "app/login/login.component.html",
"chars": 2412,
"preview": "<GridLayout>\n\n <GridLayout #background\n scaleX=\"1.4\"\n scaleY=\"1.4\"\n class=\"background\"\n (loaded)=\"startBack"
},
{
"path": "app/login/login.component.ios.css",
"chars": 614,
"preview": ".main-container {\n height: 425;\n width: 300;\n}\n.initial-label {\n font-size: 40;\n letter-spacing: 0.2;\n}\n.main-label "
},
{
"path": "app/login/login.component.ts",
"chars": 5549,
"preview": "import { Component, ElementRef, OnInit, ViewChild } from \"@angular/core\";\nimport { Router } from \"@angular/router\";\nimpo"
},
{
"path": "app/login/login.module.ts",
"chars": 515,
"preview": "import { NativeScriptCommonModule } from \"nativescript-angular/common\";\nimport { NativeScriptFormsModule } from \"natives"
},
{
"path": "app/login/login.routing.ts",
"chars": 329,
"preview": "import { ModuleWithProviders } from \"@angular/core\";\nimport { Routes, RouterModule } from \"@angular/router\";\n\nimport { "
},
{
"path": "app/main.aot.ts",
"chars": 314,
"preview": "// this import should be first in order to load some required settings (like globals and reflect-metadata)\nimport { plat"
},
{
"path": "app/main.ts",
"chars": 178,
"preview": "import { platformNativeScriptDynamic } from \"nativescript-angular/platform\";\nimport { AppModule } from \"./app.module\";\n\n"
},
{
"path": "app/package.json",
"chars": 100,
"preview": "{\n \"android\": {\n \"v8Flags\": \"--expose_gc\",\n \"markingMode\": \"none\"\n },\n \"main\": \"main.js\"\n}\n"
},
{
"path": "app/platform.android.css",
"chars": 0,
"preview": ""
},
{
"path": "app/platform.ios.css",
"chars": 55,
"preview": "TextField {\n border-width: 1;\n border-color: black;\n}"
},
{
"path": "app/shared/backend.service.ts",
"chars": 602,
"preview": "import { Injectable } from \"@angular/core\";\nimport { getString, setString } from \"tns-core-modules/application-settings\""
},
{
"path": "app/shared/dialog-util.ts",
"chars": 212,
"preview": "import * as dialogsModule from \"tns-core-modules/ui/dialogs\";\n\nexport function alert(message: string) {\n return dialogs"
},
{
"path": "app/shared/index.ts",
"chars": 163,
"preview": "export * from \"./backend.service\";\nexport * from \"./user.model\";\nexport * from \"./login.service\";\nexport * from \"./dialo"
},
{
"path": "app/shared/login.service.ts",
"chars": 1748,
"preview": "import { Injectable } from \"@angular/core\";\nimport { HttpHeaders, HttpClient, HttpErrorResponse } from \"@angular/common/"
},
{
"path": "app/shared/status-bar-util.ts",
"chars": 940,
"preview": "import * as application from \"tns-core-modules/application\";\nimport * as platform from \"tns-core-modules/platform\";\n\ndec"
},
{
"path": "app/shared/user.model.ts",
"chars": 171,
"preview": "const validator = require(\"email-validator\");\n\nexport class User {\n email: string;\n password: string;\n isValidEmail()"
},
{
"path": "app/tests/shared/user/user.spec.ts",
"chars": 817,
"preview": "import \"reflect-metadata\";\nimport { User } from \"../../../shared\";\n\ndeclare var describe: any;\ndeclare var expect: any;\n"
},
{
"path": "e2e/config/appium.capabilities.json",
"chars": 3115,
"preview": "{\n \"android19\": {\n \"platformName\": \"Android\",\n \"platformVersion\": \"4.4\",\n \"deviceName\": \"Emulato"
},
{
"path": "e2e/config/mocha.opts",
"chars": 40,
"preview": "--timeout 1000000\n--recursive e2e\n--exit"
},
{
"path": "e2e/groceries.e2e.ts",
"chars": 8679,
"preview": "import { AppiumDriver, createDriver, SearchOptions } from \"nativescript-dev-appium\";\nimport { expect } from \"chai\";\n\ndes"
},
{
"path": "e2e/setup.ts",
"chars": 197,
"preview": "import { startServer, stopServer } from \"nativescript-dev-appium\";\n\nbefore(\"start server\", async () => {\n await start"
},
{
"path": "e2e/tsconfig.json",
"chars": 357,
"preview": "{\n \"compilerOptions\": {\n \"module\": \"commonjs\",\n \"target\": \"es6\",\n \"experimentalDecorators\": true"
},
{
"path": "karma.conf.js",
"chars": 2759,
"preview": "module.exports = function (config) {\n const options = {\n\n // base path that will be used to resolve all patterns (eg"
},
{
"path": "package.json",
"chars": 2821,
"preview": "{\n \"name\": \"sample-groceries\",\n \"version\": \"1.0.0\",\n \"description\": \"A NativeScript-built iOS and Android app for man"
},
{
"path": "references.d.ts",
"chars": 121,
"preview": "/// <reference path=\"./node_modules/tns-core-modules/tns-core-modules.d.ts\" /> Needed for autocompletion and compilation"
},
{
"path": "tsconfig.esm.json",
"chars": 127,
"preview": "{\n \"extends\": \"./tsconfig\",\n \"compilerOptions\": {\n \"module\": \"es2015\",\n \"moduleResolution\": \"node\"\n "
},
{
"path": "tsconfig.json",
"chars": 643,
"preview": "{\n \"compilerOptions\": {\n \"module\": \"commonjs\",\n \"target\": \"es5\",\n \"experimentalDecorators\": true"
},
{
"path": "tsconfig.tns.json",
"chars": 127,
"preview": "{\n \"extends\": \"./tsconfig\",\n \"compilerOptions\": {\n \"module\": \"es2015\",\n \"moduleResolution\": \"node\"\n "
},
{
"path": "tslint.json",
"chars": 2026,
"preview": "{\n \"rulesDirectory\": [\n \"node_modules/codelyzer\"\n ],\n \"rules\": {\n \"class-name\": true,\n \"co"
},
{
"path": "webpack.config.js",
"chars": 13374,
"preview": "const { join, relative, resolve, sep, dirname } = require(\"path\");\n\nconst webpack = require(\"webpack\");\nconst nsWebpack "
}
]
About this extraction
This page contains the full source code of the NativeScript/sample-Groceries GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 76 files (113.9 KB), approximately 30.8k tokens, and a symbol index with 71 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.