@bridgeline-digital/hawksearch-handlebars-ui 1.0.0-beta.0

package/src/services/tracking.service.ts

@@ -0,0 +1,136 @@
+import { AutocompleteItemType, EventType, HawksearchGlobal, PageType, SearchType } from '@models';
+import { BaseService } from './base.service';
+
+declare let Hawksearch: HawksearchGlobal;
+
+export class TrackingService extends BaseService {
+    protected baseUrl = Hawksearch.config.endpoints?.tracking || 'https://tracking-dev.hawksearch.net/api';
+
+    trackAutocompleteClick(query: string, itemType: AutocompleteItemType, title: string, url: string): Promise<void> {
+        const data = {
+            Keyword: query,
+            Name: title,
+            SuggestType: itemType,
+            Url: url
+        };
+
+        return this.trackEvent(EventType.AutocompleteClick, data);
+    }
+
+    trackBannerClick(bannerId: number, campaignId: number): Promise<void> {
+        if (!Hawksearch.searchResponse?.trackingId) {
+            return Promise.resolve();
+        }
+
+        const data = {
+            BannerId: bannerId,
+            CampaignId: campaignId,
+            TrackingId: Hawksearch.searchResponse.trackingId
+        };
+
+        return this.trackEvent(EventType.BannerClick, data);
+    }
+
+    trackBannerImpression(bannerId: number, campaignId: number): Promise<void> {
+        if (!Hawksearch.searchResponse?.trackingId) {
+            return Promise.resolve();
+        }
+
+        const data = {
+            BannerId: bannerId,
+            CampaignId: campaignId,
+            TrackingId: Hawksearch.searchResponse.trackingId
+        };
+
+        return this.trackEvent(EventType.BannerImpression, data);
+    }
+
+    trackPageLoad(pageType: PageType): Promise<void> {
+        const data = {
+            PageTypeId: pageType,
+            RequestPath: window.location.pathname,
+            Qs: window.location.search,
+            ViewportHeight: document.documentElement.clientHeight,
+            ViewportWidth: document.documentElement.clientWidth
+        };
+
+        return this.trackEvent(EventType.PageLoad, data);
+    }
+
+    trackSearchResultClick(id: string, url: string, event?: PointerEvent): Promise<void> {
+        if (!Hawksearch.searchResponse?.trackingId) {
+            return Promise.resolve();
+        }
+
+        const data = {
+            UniqueId: id,
+            Url: url,
+            TrackingId: Hawksearch.searchResponse.trackingId,
+            RequestPath: window.location.pathname,
+            Qs: window.location.search,
+            ScrollX: window.scrollX,
+            ScrollY: window.scrollY,
+            ViewportHeight: document.documentElement.clientHeight,
+            ViewportWidth: document.documentElement.clientWidth,
+            MouseX: event?.pageX,
+            MouseY: event?.pageY
+        };
+
+        return this.trackEvent(EventType.Click, data);
+    }
+
+    trackSearch(query: string | undefined, newSearch: boolean): Promise<void> {
+        if (!Hawksearch.searchResponse?.trackingId) {
+            return Promise.resolve();
+        }
+
+        const data = {
+            QueryId: newSearch ? this.setNewQueryId() : this.getQueryId(),
+            TrackingId: Hawksearch.searchResponse.trackingId,
+            TypeId: newSearch ? SearchType.Initial : SearchType.Refinement,
+            ViewportHeight: document.documentElement.clientHeight,
+            ViewportWidth: document.documentElement.clientWidth,
+            keyword: query
+        };
+
+        return this.trackEvent(EventType.Search, data);
+    }
+
+    trackEvent(type: EventType, data: any): Promise<void> {
+        if (Hawksearch.config.trackingEnabled === false) {
+            return Promise.resolve();
+        }
+
+        const request = {
+            ClientGuid: Hawksearch.config.clientId,
+            EventType: type,
+            EventData: btoa(JSON.stringify(data)),
+            VisitorId: this.getVisitorId(),
+            VisitId: this.getVisitId()
+        };
+
+        return this.httpPost<void>('/trackevent', request);
+    }
+
+    private getQueryId(): string {
+        const key = 'QueryId';
+
+        let queryId = localStorage.getItem(key);
+
+        if (!queryId) {
+            queryId = this.setNewQueryId();
+        }
+
+        return queryId;
+    }
+
+    private setNewQueryId(): string {
+        const queryId = this.generateGuid();
+
+        localStorage.setItem('QueryId', queryId);
+
+        return queryId;
+    }
+}
+
+export const trackingService = new TrackingService();

package/tsconfig.json

@@ -0,0 +1,22 @@
+{
+    "compilerOptions": {
+        "strict": true,
+        "outDir": "./dist/",
+        "sourceMap": true,
+        "noImplicitAny": true,
+        "module": "es6",
+        "target": "es6",
+        "allowJs": true,
+        "moduleResolution": "node",
+        "forceConsistentCasingInFileNames": true,
+        "baseUrl": "./",
+        "paths": {
+            "@assets/*": ["src/assets/*"],
+            "@components": ["src/components/index"],
+            "@helpers": ["src/helpers/index"],
+            "@models": ["src/models/index"],
+            "@services": ["src/services/index"]
+        }
+    },
+    "include": ["src", "typings.d.ts"]
+}

package/typings.d.ts

@@ -0,0 +1,21 @@
+declare module '*.scss';
+
+declare module '*.hbs' {
+    const content: any;
+    export default content;
+}
+
+declare module '*.html' {
+    const content: any;
+    export default content;
+}
+
+declare module '*.png' {
+    const content: any;
+    export default content;
+}
+
+declare module '*.svg' {
+    const content: any;
+    export default content;
+}

package/webpack.config.js

@@ -0,0 +1,75 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+
+module.exports = {
+    mode: 'development',
+    entry: {
+        'hawksearch-ui': './src/index.ts'
+    },
+    devtool: 'source-map',
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: './index.html',
+            filename: 'index.html'
+        }),
+        new HtmlWebpackPlugin({
+            template: './custom1.html',
+            filename: 'custom1.html'
+        }),
+        new HtmlWebpackPlugin({
+            template: './custom2.html',
+            filename: 'custom2.html'
+        })
+    ],
+    module: {
+        rules: [
+            {
+                test: /\.scss$/i,
+                use: [
+                    'raw-loader',
+                    {
+                        loader: 'sass-loader',
+                        options: {
+                            sassOptions: {
+                                includePaths: [path.resolve(__dirname, 'node_modules')]
+                            }
+                        }
+                    }
+                ]
+            },
+            {
+                test: /\.(png|svg|jpg|jpeg|gif)$/i,
+                type: 'asset/resource'
+            },
+            {
+                test: /\.hbs$/i,
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.html$/i,
+                loader: 'html-loader'
+            },
+            {
+                test: /\.ts$/i,
+                use: 'ts-loader',
+                exclude: /node_modules/
+            }
+        ]
+    },
+    resolve: {
+        extensions: ['.ts', '.js'],
+        fallback: {
+            fs: false
+        },
+        plugins: [new TsconfigPathsPlugin()]
+    },
+    output: {
+        filename: 'handlebars-ui.js',
+        path: path.resolve(__dirname, 'dist'),
+        clean: true
+    },
+    devServer: {
+        static: './dist'
+    }
+};