Work with GPS data in Creatio Mobile

Level: intermediate

Use GPS functionality in Creatio Mobile to retrieve real-time latitude and longitude data directly from the mobile app as well as gain deeper insights using additional GPS-related information, for example, accuracy, permissions, and mock location detection.

To work with GPS data in Creatio Mobile, implement a custom request handler using remote module. Learn more: Custom request handler implemented using remote module in Creatio Mobile. Requires using the GeolocationService service that returns current location using the getCurrentCoordinates() method. Learn more: GeolocationService service.

To call the request handler, use the Button component added to the Freedom UI page in the Creatio Mobile. Learn more: Button component.

1. Create a TypeScript project

Instructions: Create a TypeScript project.

2. Create a custom request

Instructions: Create a custom request.

3. Create a custom request handler

Instructions: Create a custom request handler.

View the example that uses the GeolocationService service while implementing a request handler below.

index.ts file
/* Import the required functionality from the libraries. */
import {
    BaseRequest,
    CrtRequest,
    BaseRequestHandler,
    CrtRequestHandler,
    CrtModule,
    bootstrapCrtModule,
    DoBootstrap,
    GeolocationService,
    GeolocationServicePosition,
    GeolocationAccuracy
} from "@creatio/mobile-common";

/* Add the "CrtRequest" decorator to the "SomeRequestNameRequest" class. */
@CrtRequest({
    type: 'usr.SomeRequestNameRequest'
})

export class SomeRequestNameRequest extends BaseRequest {}

/* Add the "CrtRequestHandler" decorator to the "SomeRequestNameHandler" class. */
@CrtRequestHandler({
    requestType: 'usr.SomeRequestNameRequest',
    type: 'usr.SomeRequestNameHandler',
    scopes: ['MobileFUIContactRecordPageSettingsDefaultWorkplace'],
})

export class SomeRequestNameHandler extends BaseRequestHandler<SomeRequestNameRequest> {

    public async handle(request: SomeRequestNameRequest): Promise<unknown> {

        /* Implement a custom business logic to get and save GPS data.
        For example, save GPS data to the contact page in Creatio Mobile. */
        const coords: GeolocationServicePosition = await new GeolocationService()
            .getCurrentCoordinates(GeolocationAccuracy.low);
        request.$context['Name'] = "GPS coords: Lat:" + coords.latitude + ", Long:" + coords.longitude;
        ...;

        return this.next?.handle(request);

    }
}

/* Required for this module to function correctly as a JS source in package file content. */
@CrtModule({
    ...,
    /* Specify that "SomeRequestNameHandler" is request handler. */
    requestHandlers: [
        SomeRequestNameHandler
    ],
})

export class SomeMainAppClass implements DoBootstrap {
    bootstrap(): void {
        bootstrapCrtModule('SomeMainAppClass', SomeMainAppClass);
    }
}

4. Add the custom request handler to the Freedom UI page

Instructions: Add the custom request handler to the Freedom UI page.

As a result, Creatio Mobile will return current location data when you click the button.

1. Create a TypeScript project​

2. Create a custom request​

3. Create a custom request handler​

4. Add the custom request handler to the Freedom UI page​

See also​

1. Create a TypeScript project

2. Create a custom request

3. Create a custom request handler

4. Add the custom request handler to the Freedom UI page

See also