❤
npm
Sign UpSign In

@evokegroup/js

3.3.6 • Public • Published

@evokegroup/js - Version 3

Version 3 is similar to version 2. Major differences include:

  • Source file origanization
  • Analytics overhaul
  • TypeScript definitions generated from JSDoc
  • Create your own bundle using node custom-bundle

Requires NodeJS v16+ to build and bundle

Use

To support asynchronous loading, it is recommended that you render the source of a few files in the head, load your bundle using async defer, and the wait for the Evoke.ready() Promise to resolve.

<html>
  <head>
    <script>
      (window.Evoke = window.Evoke || {}).Settings = {
        // Override default settings
      };
    </script>
    <script>
      /* If loading scripts asynchronously, render code directly in head for best results
       * /dist/index.min.js - Defines Evoke
       * /dist/ready.min.js - Defines Evoke.ready() asynchronous loading helper
       * /dist/browser/webp.min.js - For WebP support detection; best before the CSS
       * /dist/lazyload/index.min.js - Lazy loading
       * If you use the custom bundler, your scripts will be bundled in the proper order
       */
    </script>
  </head>
  <body>
    <h1>My Awesome Web Site</h1>
    <script>
      // Override default settings after Evoke has partially loaded
      Evoke.Settings.Console = Evoke.Settings.merge({
        enabled: location.hostname === 'production'
      }, Evoke.Settings.Console || {});
    </script>
    <!--
      /core.js - Should always be first in bundle
      * Some modules (i.e. Analytics) require jQuery or Evoke's $query DOM helper library
      * /jquery/evoke.$.js
      * OR
      * /query/index.js
      * /query/evoke.$.js
      Other scripts
      /ready-resolve.js - Always should be last when using Evoke.ready()
      If you use the custom bundler, your scripts will be bundled in the proper order
    -->
    <script src="evoke-v3-bundle.js" async defer></script>
    <script>
      Evoke.ready()
        .then(() => {
          // do something
        });
    </script>
  </body>
</html>

Production Scripts

Minified production scripts can be found in the dist folder.

Documentation

Markdown files are autogenerated from JSDoc comments and can be found in the docs folder.

TypeScript Types

TypeScript type definition files are autogenerated from JSDoc comments and can be found in the dist-types folder.


Custom Bundler

Create custom bundles using a browser-based UI. See the custom bundler readme.


Modules

Core

File Documentation Description
index Markdown Defines the window.Evoke namespace and base functionality.
ready Markdown Defines Evoke.ready, useful (but not required) for asynchronous script loading.
core Markdown Adds code Evoke functionality required by most modules.
scrolling Markdown Adds smooth scrolling functionality.
utility Markdown Utility functions.
ready-resolve When using Evoke.ready, resolves the Promise. For be results make sure this is the last script included in your bundle.

Accessibility

File Documentation Description
accessibility/index Markdown Add accessibility support for modal dialogs.

AJAX

File Documentation Description
ajax/index Markdown AJAX helper.

Analytics

File Documentation Description
analytics/index Markdown Core analytics functionality.
analytics/plugins/timer Markdown Add timer functionality.
analytics/plugins/legacy-v1 Markdown Add support for legacy evoke analytics tracking.
Video
analytics/plugins/video Markdown Add core video tracking functionality.
analytics-video/azure Markdown Implements Azure video tracking.
analytics-video/vimeo Markdown Implements Vimeo video tracking.
analytics-video/wistia Markdown Implements Wistia video tracking.
analytics-video/youtube Markdown Implements YouTube video tracking.
Platforms - Google
analytics-google/index Markdown Core Google Analytics functionality.
analytics-google/ga4 Send data to GA4.
analytics-google/gtm Send data to GTM. See analytics-google/gtm-container/*.json container files.
analytics-google/plugins/timer Markdown Send analytics timer data to Google.
analytics-google/plugins/video Markdown Send analytics video data to Google.

Browser

File Documentation Description
browser/index Markdown Core browser detection functionality.
browser/api Markdown API for accessing browser detection data.
browser/fingerprint Markdown Generate a browser fingerprint. Does not require core browser functionality.
browser/webp Markdown WebP support detection. Standalone. Use in head for best results.

Casing

File Documentation Description
casing/index Markdown Manipulate the casing of a string.

Date/Time

File Documentation Description
datetime/index Markdown Date/time string formatting (english).
datetime/locale-es Markdown Spanish support.
datetime/locale-fr Markdown French support.

Forms

File Documentation Description
forms/index Markdown Base forms functionality.
forms/inputs Markdown Specialized form input formatting.
forms/validation Markdown Form validation.

Geolocation

File Documentation Description
geolocation/index Markdown Core geolocation functionality.
Evoke.Geolocation.geocode
geolocation/arcgis-geocode Markdown Implement Evoke.Geolocation.geocode using ArcGIS. Requires an ArcGIS API key.
geolocation/census-geocode Markdown Implement Evoke.Geolocation.geocode using Census.gov data.
Evoke.Geolocation.reverseGeocode
geolocation/arcgis-reverse-geocode Markdown Implement Evoke.Geolocation.reverseGeocode using ArcGIS.

Google

File Documentation Description
google/recaptcha Markdown Add Google reCAPTCHA support.

jQuery

File Documentation Description
jquery/evoke.$ Markdown Define Evoke.$ for use in various modules.

Lazy Loading

File Documentation Description
lazyload/index Markdown Add lazy loading functionality.

Messages

File Documentation Description
message-listener/index Markdown Listen for messages sent using window.postMessage.

Network

File Documentation Description
network/index Markdown Core network functionality.
network/cloudflare Markdown Get client-side IP information using Cloudflare.
network/ipify Markdown Get client-side IP information using ipify.

$query

A lighter weight, less robust jQuery alternative.

File Documentation Description
query/index Markdown Define $query.
query/evoke.$ Markdown Define Evoke.$ for use in various modules.

Screenshots

File Documentation Description
screenshots/index Markdown Integrate with the Evoke screenshooter.
screenshots/ui Markdown Add screenshooter UI elements.

Social

File Documentation Description
social/index Markdown Social network sharing helper.

Storage

File Documentation Description
storage/index Markdown Browser storage access helper.
storage/cookie Markdown Add browser cookie access.

String Generator

File Documentation Description
string-generator/index Markdown Generate random strings using specified characters and formats.
string-generator/generate-address Markdown Generate random address data for testing.

Templates

File Documentation Description
template/index Markdown Render templated HTML.

UI

File Documentation Description
ui/accordion Markdown Create accordions.
ui/modal Markdown Create a modal dialog.

USPS

File Documentation Description
usps/index Markdown Validate addressed using the USPS API. Requires an API key.

Video

File Documentation Description
video/index Markdown Video embedding and control core functionality.
video/azure Markdown Support Azure hosted videos.
video/vimeo Markdown Support Vimeo hosted videos.
video/wistia Markdown Support Wistia hosted videos.
video/youtube Markdown Support YouTube hosted videos.

Readme

Keywords

none

Package Sidebar

Install

npm i @evokegroup/js

Weekly Downloads

422

Version

3.3.6

License

ISC

Unpacked Size

1.39 MB

Total Files

278

Last publish

Collaborators

  • ybevoke
  • jtsuyuki
  • evokejames
  • evoke-cjamodeo
Try on RunKit
Report malware