Skip to content

Commit

Permalink
chore: readme update
Browse files Browse the repository at this point in the history
  • Loading branch information
@farfromrefug
farfromrefug committed Jan 5, 2023
1 parent 19b569f commit 946a7f6
Show file tree
Hide file tree
Showing 5 changed files with 197 additions and 278 deletions.
177 changes: 167 additions & 10 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,80 @@
# Nativescript GPS Plugin
<!-- ⚠️ This README has been generated from the file(s) "blueprint.md" ⚠️--><!-- ⚠️ This README has been generated from the file(s) "blueprint.md" ⚠️-->
<!-- !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
DO NOT EDIT THIS READEME DIRECTLY! Edit "bluesprint.md" instead.
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<h1 align="center">@nativescript-community/gps</h1>
<p align="center">
<a href="https://npmcharts.com/compare/@nativescript-community/gps?minimal=true"><img alt="Downloads per month" src="https://img.shields.io/npm/dm/@nativescript-community/gps.svg" height="20"/></a>
<a href="https://www.npmjs.com/package/@nativescript-community/gps"><img alt="NPM Version" src="https://img.shields.io/npm/v/@nativescript-community/gps.svg" height="20"/></a>
</p>

## NOTE
<p align="center">
<b>Tracks GPS location updates regardless of the app state. Does not depend on Google Play Services.</b></br>
<sub><sub>
</p>

This is a plugin to receive gps location updates regardless of the app state.
It differentiates itself from `nativescript-geolocation``` by NOT using google play services
<br />

## Getting started

If using N < 8.0:
`tns plugin add @nativescript-community/[email protected]`
| <img src="https://raw.githubusercontent.com/nativescript-community/gps/master/images/demo-ios.gif" height="500" /> | <img src="https://raw.githubusercontent.com/nativescript-community/gps/master/images/demo-android.gif" height="500" /> |
| --- | ----------- |
| iOS Demo | Android Demo |

Else
`tns plugin add @nativescript-community/gps`

[](#table-of-contents)


[](#table-of-contents)

## Table of Contents

You are responsible for updating permissions your `AndroidManifest.xml` and `Info.plist`
* [Installation](#installation)
* [Usage](#usage)
* [Examples:](#examples)
* [Demos and Development](#demos-and-development)
* [Repo Setup](#repo-setup)
* [Build](#build)
* [Demos](#demos)
* [Contributing](#contributing)
* [Update repo ](#update-repo-)
* [Update readme ](#update-readme-)
* [Update doc ](#update-doc-)
* [Publish](#publish)
* [Questions](#questions)


[](#installation)


[](#installation)

## Installation
Run the following command from the root of your project:

`ns plugin add @nativescript-community/gps`


[](#usage)


[](#usage)

## Usage

Here is a simple example. You can find more in the doc [here](https://nativescript-community.github.io/gps)
Expand All @@ -31,3 +91,100 @@ const location = await gps.getCurrentLocation<LatLonKeys>({
});
```

### Examples:

- [Basic](demo-snippets/vue/Basic.vue)
- A basic sliding drawer.

[](#demos-and-development)


[](#demos-and-development)

## Demos and Development


### Repo Setup

The repo uses submodules. If you did not clone with ` --recursive` then you need to call
```
git submodule update --init
```

The package manager used to install and link dependencies must be `pnpm` or `yarn`. `npm` wont work.

To develop and test:
if you use `yarn` then run `yarn`
if you use `pnpm` then run `pnpm i`

**Interactive Menu:**

To start the interactive menu, run `npm start` (or `yarn start` or `pnpm start`). This will list all of the commonly used scripts.

### Build

```bash
npm run build.all
```

### Demos

```bash
npm run demo.[ng|react|svelte|vue].[ios|android]

npm run demo.svelte.ios # Example
```


[](#contributing)


[](#contributing)

## Contributing

### Update repo

You can update the repo files quite easily

First update the submodules

```bash
npm run update
```

Then commit the changes
Then update common files

```bash
npm run sync
```
Then you can run `yarn|pnpm`, commit changed files if any

### Update readme
```bash
npm run readme
```

### Update doc
```bash
npm run doc
```

### Publish

The publishing is completely handled by `lerna` (you can add `-- --bump major` to force a major release)
Simply run
```shell
npm run publish
```


[](#questions)


[](#questions)

## Questions

If you have any questions/issues/comments please feel free to create an issue or start a conversation in the [NativeScript Community Discord](https://nativescript.org/discord).
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
"commitmsg": "commitlint -e $GIT_PARAMS",
"postinstall": "npm run setup",
"publish": "npm run clean && npm run build.all && npm run readme && lerna publish --no-private --create-release=github --force-publish",
"readme": "node ./tools/readme.js",
"readme": "lerna run readme && node ./tools/readme.js",
"setup": "npm run submodules && ts-patch install",
"start": "./node_modules/.bin/ntl -A -s 15 -o",
"submodules": "git submodule update --init",
Expand Down
162 changes: 15 additions & 147 deletions packages/gps/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@
<br />


| <img src="https://raw.githubusercontent.com/nativescript-community/ui-drawer/master/images/demo-ios.gif" height="500" /> | <img src="https://raw.githubusercontent.com/nativescript-community/ui-drawer/master/images/demo-android.gif" height="500" /> |
| <img src="https://raw.githubusercontent.com/nativescript-community/gps/master/images/demo-ios.gif" height="500" /> | <img src="https://raw.githubusercontent.com/nativescript-community/gps/master/images/demo-android.gif" height="500" /> |
| --- | ----------- |
| iOS Demo | Android Demo |

Expand All @@ -42,19 +42,8 @@
## Table of Contents

* [Installation](#installation)
* [Configuration](#configuration)
* [API](#api)
* [Properties](#properties)
* [Methods](#methods)
* [Events](#events)
* [Usage in Angular](#usage-in-angular)
* [Usage](#usage)
* [Examples:](#examples)
* [Usage in React](#usage-in-react)
* [Examples:](#examples-1)
* [Usage in Svelte](#usage-in-svelte)
* [Examples:](#examples-2)
* [Usage in Vue](#usage-in-vue)
* [Examples:](#examples-3)
* [Demos and Development](#demos-and-development)
* [Repo Setup](#repo-setup)
* [Build](#build)
Expand All @@ -75,149 +64,28 @@ Run the following command from the root of your project:
`ns plugin add @nativescript-community/gps`


[](#configuration)
[](#usage)

## Configuration
For gestures to work, make sure to add the following code block inside the main application file (e.g. app.ts):
## Usage

```typescript
import { install } from '@nativescript-community/ui-drawer';
install();
```


[](#api)

## API

### Properties

| Property | Default | Type | Description |
| ------------------- | --------------------------------- | --------------------------- | ------------------------------------------------------- |
| leftDrawer | `undefined` | `View` | View containing the content for the left side drawer |
| rightDrawer | `undefined` | `View` | View containing the content for the right side drawer |
| topDrawer | `undefined` | `View` | View containing the content for the top side drawer |
| bottomDrawer | `undefined` | `View` | View containing the content for the bottom side drawer |
| mainContent | `undefined` | `View` | View containing the main content of the app |
| gestureEnabled | `true` | `boolean` | Boolean setting if swipe gestures are enabled |
| backdropColor | `new Color('rgba(0, 0, 0, 0.7)')` | `Color` | The color of the backdrop behind the drawer |
| leftDrawerMode | `slide` | `Mode ('under' or 'slide')` | The color of the backdrop behind the drawer |
| rightDrawerMode | `slide` | `Mode ('under' or 'slide')` | The color of the backdrop behind the drawer |
| gestureMinDist | `10` | number | The min "swipe" distance to trigger the menu gesture |
| gestureHandlerOptions | `null` | PanGestureHandlerOptions | Options to customize the pan gesture handler |
| leftSwipeDistance | `40` | number | The "left" zone size from where the gesture is recognized |
| rightSwipeDistance | `40` | number | The "right" zone size from where the gesture is recognized |
| topSwipeDistance | `40` | number | The "top" zone size from where the gesture is recognized |
| bottomSwipeDistance | `40` | number | The "bottom" zone size from where the gesture is recognized |
| leftOpenedDrawerAllowDraging | `true` | boolean | Allow dragging the opened menu |
| rightOpenedDrawerAllowDraging | `true` | boolean | Allow dragging the opened menu |
| topOpenedDrawerAllowDraging | `true` | boolean | Allow dragging the opened menu |
| bottomOpenedDrawerAllowDraging | `true` | boolean | Allow dragging the opened menu |



### Methods

| Name | Return | Description |
| ------------ | ------ | ----------------------------------------------- |
| open() | `void` | Programatically open the drawer |
| close() | `void` | Programatically close the drawer |
| toggle() | `void` | Programatically toggle the state of the drawer |
| install() | `void` | Install gestures |

### Events

| Name | Event Data | Description |
| --------- | ------------------ | ---------------------------- |
| open | `side`, `duration` | Drawer opens |
| close | `side`, `duration` | Drawer closes |


[](#usage-in-angular)

## Usage in Angular
Import the module into your project.

```typescript
import { DrawerModule } from "@nativescript-community/ui-drawer/angular";

@NgModule({
imports: [
DrawerModule
]
schemas: [
NO_ERRORS_SCHEMA
]
})

export class AppModule { }
```

### Examples:

- [Basic Drawer](demo-snippets/ng/basic-drawer)
- A basic sliding drawer.
- [All Sides](demo-snippets/ng/all-sides)
- An example of drawers on all sides: left, right, top, bottom.



[](#usage-in-react)

## Usage in React

Register the plugin in your `app.ts`.
Here is a simple example. You can find more in the doc [here](https://nativescript-community.github.io/gps)

```typescript
import DrawerElement from '@nativescript-community/ui-drawer/react';
DrawerElement.register();
import { GPS } from '@nativescript-community/gps';

const gps = new GPS();
const location = await gps.getCurrentLocation<LatLonKeys>({
minimumUpdateTime,
desiredAccuracy,
timeout,
skipPermissionCheck: true
});
```

### Examples:

- [Basic Drawer](demo-snippets/react/BasicDrawer.tsx)
- [Basic](demo-snippets/vue/Basic.vue)
- A basic sliding drawer.
- [All Sides](demo-snippets/react/AllSides.tsx)
- An example of drawers on all sides: left, right, top, bottom.


[](#usage-in-svelte)

## Usage in Svelte

Register the plugin in your `app.ts`.

```typescript
import DrawerElement from '@nativescript-community/ui-drawer/svelte';
DrawerElement.register();
```

### Examples:

- [Basic Drawer](demo-snippets/svelte/BasicDrawer.svelte)
- A basic sliding drawer.
- [All Sides](demo-snippets/svelte/AllSides.svelte)
- An example of drawers on all sides: left, right, top, bottom.


[](#usage-in-vue)

## Usage in Vue

Register the plugin in your `app.js`.

```typescript
import DrawerPlugin from '@nativescript-community/ui-drawer/vue'
Vue.use(DrawerPlugin);
```

### Examples:

- [Basic Drawer](demo-snippets/vue/BasicDrawer.vue)
- A basic sliding drawer.
- [All Sides](demo-snippets/vue/AllSides.vue)
- An example of drawers on all sides: left, right, top, bottom.


[](#demos-and-development)

Expand Down
Loading

0 comments on commit 946a7f6

Please sign in to comment.