/*************************************************************************
*
* VLOCITY, INC. CONFIDENTIAL
* __________________
*
* [2014] - [2020] Vlocity, Inc.
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Vlocity, Inc. and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Vlocity, Inc. and its suppliers and may be
* covered by U.S. and Foreign Patents, patents in process, and are
* protected by trade secret or copyright law. Dissemination of this
* information and reproduction, modification or reverse-engineering
* of this material, is prohibited unless prior written permission
* is obtained from Vlocity, Inc.
*
*/
import { LitElement, html } from "lit-element";
import VlocityDCSignin from "../../../../vlocity-dc-signin/vlocity-dc-signin";
import { digitalCommerceSDKInstance } from "../../../vlocity-dc-sdk-utils";
import customSignInTemplate from "./vlocity-dc-firebase-redirect-strategy-template";
/**
* @class VlocityDCFirebaseRedirectStrategy
* @extends {VlocityDCSignin} Extends the VlocityDCSignin class
*
* @classdesc
* VlocityDCFirebaseRedirectStrategy is the component created as a reference implementation for sign-in or sign-up done using redirect mechanism.<br/><br/>
*
*
* @example
* Sample Usage -
*
* Include the component in your template by adding <vlocity-dc-firebase-redirect-strategy> custom tag
*
* <vlocity-dc-firebase-redirect-strategy></vlocity-dc-firebase-redirect-strategy>
*
* You could also use it inside the slot for example-
*
* <vlocity-dc-checkout>
* <div slot="dc-signIn">
* <vlocity-dc-firebase-redirect-strategy></vlocity-dc-firebase-redirect-strategy>
* </div>
* </vlocity-dc-checkout>
*
* KEY INFO -
*
* events fired : "vlocity-dc-sign-in"
*
* events registered : none
*
* Dependency - vlocity-dc-firebase-redirect-strategy is an independent component and has no dependency on any parent component.
*
* Sample with slots -
*
* <vlocity-dc-firebase-redirect-strategy>
* <span slot="{slot_name}">
* Custom HTML elements goes here
* </span>
* </vlocity-dc-firebase-redirect-strategy>
*
* List of available slots -
*
* | Slot names | Dynamic | Description | Impact |
* |-------------------------------|-------------|----------------------------------------|-------------------------------------|
* | dc-firebase-redirect-wrapper | - | Wrapper for firebase redirect template | Replaces component template |
* | dc-firebase-redirect-loader | - | Wrapper for loader | Replaces loader |
* | dc-firebase-redirect-content | - | Wrapper for firebase redirect content | Replaces template content |
*/
export default class VlocityDCFirebaseRedirectStrategy extends VlocityDCSignin {
constructor() {
super();
this.template = customSignInTemplate;
this.statusMessage = "";
this.serverUrl = "https://firebase-redirect-auth.herokuapp.com/login";
this.websocketUrl = "ws://firebase-redirect-auth.herokuapp.com";
this.digitalCommerceSDK = digitalCommerceSDKInstance().digitalCommerce;
this.digitalCommerceTranslation = digitalCommerceSDKInstance().digitalCommerceTranslation;
}
static get properties() {
return {
loading: Boolean,
statusMessage: String,
serverUrl: String,
websocketUrl: String
};
}
connectedCallback() {
super.connectedCallback();
}
render() {
return this.template(this);
}
/**
* Method called to redirect user to authentication server.
* @memberof VlocityDCFirebaseRedirectStrategy
*/
serverRedirect() {
this.loading = true;
this.statusMessage = "Waiting for user to login...";
window.open(this.serverUrl);
let webSocket = new WebSocket(this.websocketUrl);
webSocket.onmessage = event => {
this.loading = false;
if (this.digitalCommerceSDK) {
this.statusMessage = "Authorizing user to secure server...";
this.digitalCommerceSDK.fire(
"vlocity-dc-sign-in",
"result",
JSON.parse(event.data)
);
}
};
}
/**
* doSignIn method of VlocityDCSignin component overrided for custom signIn logic.
* @memberof VlocityDCFirebaseRedirectStrategy
*/
async doSignIn(response) {
let input = this.signInGetInput(response);
let udpatedInput = await this.signInPreHook(input);
this.signInPreSDKCalls();
this.signInSDKCall(udpatedInput);
}
/**
* signInGetInput method of VlocityDCSignin component overrided to create custom input.
* @memberof VlocityDCFirebaseRedirectStrategy
*/
signInGetInput(input) {
return Object.assign(
this.digitalCommerceSDK.createAuthenticateUserInput(),
{
firstName: input.firstName,
lastName: input.lastName,
email: input.email,
phoneNumber: input.phoneNumber ? input.userDetail.phoneNumber : " ",
sessionToken: input.sessionToken
}
);
}
}
customElements.define(
"vlocity-dc-firebase-redirect-strategy",
VlocityDCFirebaseRedirectStrategy
);