npm - @everymatrix/casino-winners - Versions diffs - 0.0.336 - Mend

@everymatrix/casino-winners 0.0.336

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/README.md +30 -0
package/dist/casino-winners.js +7091 -0
package/dist/casino-winners.js.map +1 -0
package/documentation.md +59 -0
package/index.html +100 -0
package/index.js +1 -0
package/package.json +40 -0
package/public/favicon.png +0 -0
package/public/reset.css +48 -0
package/rollup.config.js +59 -0
package/src/CasinoWinners.svelte +409 -0
package/src/i18n.js +27 -0
package/src/index.ts +4 -0
package/src/translations.js +107 -0
package/stories/CasinoWinners.stories.js +13 -0
package/tsconfig.json +6 -0

package/documentation.md ADDED Viewed

@@ -0,0 +1,59 @@
+## Installation
+___
+#### Installing via NPM:
+Installing the footer widget via NPM is the recommended way of adding it to your project, if you want to use it in a bundle. Since the widgets are versioned, you can load a specific version - or the latest version - based on your needs, from the `package.json` file, simply by adding it as a dependency and then installing the packages by running `npm install`:
+```sh
+  "dependencies": {
+    "@everymatrix/casino-winners": "^0.0.278"
+  },
+```
+## Displaying the widget
+___
+After the widget is imported inside your project either the NPM way or via CDN, in order to display the widget you simply need to place the `<casino-winners endpoint="${norway_api_endpoint}"></casino-winners>` tag on the page or in the specific container you would like to have it displayed. Please see the example below:
+```sh
+<casino-winners
+endpoint="https://demo-api.stage.norway.everymatrix.com/v1"
+>
+</casino-winners>
+```
+## Parameters of the widget
+___
+| Parameter | Mandatory | Description |
+| ------ | ------ | ------ |
+| endpoint | yes | NorWAy endpoint; __Has__ to be the __last__ parameter passed to the widget |
+| lang | no | Language of the website - Default: 'en' |
+| session | no | EM SessionID of the logged in user |
+| defaultcurrency | no | Default currency displayed for logged out users, necessary if no session is present; if session is present the currency will be the user's currency|
+| periodrecent | no | Timeframe in which the recent wins should be shown - Default: 'Today' - /Last30Days/Last7Days/Yesterday |
+| numberusersrecent | no | Number of recent winners to be displayed - Default: 20 |
+| amountlimit | no | Amount threshold of recent wins - Default: 1 |
+| isrecentavailable | no | Type: Boolean - Display configuration for the recent winners section - Default: 'true' |
+| periodtop | no | Timeframe in which the top wins should be shown Default: 'Last7Days' - /Last30Days/Yesterday/Today  |
+| numberuserstop | no | Number of top winners to be displayed - Default: 20 |
+| istopavailable | no | Type: Boolean - Display configuration for the top winners section - Default: 'true' |
+| clientstyling | no | A set of CSS rules that can override the current CSS of the widget |
+| clientstylingurl | no | An URL to a `.css` file to be injected inside the widget and override the current CSS of it |
+## Widget Events
+___
+The widget has the ability to send Javascript events to the parent website to extend the functionality.
+The widget currently supports the following events:
+| EventName | Description | Params |
+| ------ | ------ | ------ |
+| OpenCasinoWinnersGame | This `postMessage` event is triggered when the game thumbnail is clicked | gameId |

package/index.html ADDED Viewed

@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+    <title>casino-winners</title>
+    <link rel="stylesheet" href="public/reset.css" />
+    <script src="dist/casino-winners.js"></script>
+  </head>
+  <body>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        height: 100%;
+        font-family: "Helvetica Neue", "Helvetica", sans-serif;
+      }
+      .header {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        padding: 10px 20px;
+        margin-bottom: 20px;
+        background: #42a3e2;
+        box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.2);
+      }
+      .header__logo svg {
+        height: 50px;
+        width: 50px;
+        margin-right: 5px;
+      }
+      .header__name {
+        color: #fff;
+      }
+      .header__name span {
+        margin-right: 10px;
+        font-weight: bold;
+      }
+    </style>
+    <header class="header">
+      <div class="header__logo">
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width="161"
+          height="132"
+          viewBox="0 0 161 132"
+        >
+          <defs>
+            <linearGradient x1="0%" y1="50%" y2="50%" id="a">
+              <stop stop-color="#2A3B8F" offset="0%" />
+              <stop stop-color="#29ABE2" offset="100%" />
+            </linearGradient>
+            <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="c">
+              <stop stop-color="#B4D44E" offset="0%" />
+              <stop stop-color="#E7F716" offset="100%" />
+            </linearGradient>
+          </defs>
+          <g fill="none" fill-rule="evenodd">
+            <path
+              fill="#166DA5"
+              d="M160.6 65.9l-17.4 29.3-24.4-29.7 24.4-28.9z"
+            />
+            <path
+              fill="#8FDB69"
+              d="M141.3 100.2l-26.5-31.7-15.9 26.6 24.7 36.1z"
+            />
+            <path fill="#166DA5" d="M141 31.4l-26.2 31.8-15.9-26.6L123.6.9z" />
+            <path
+              fill="url(#a)"
+              opacity=".95"
+              d="M61.1 31.4H141L123.4.7H78.7z M114.8 63.3H159l-15.9-26.8H98.8"
+            />
+            <path
+              fill="url(#c)"
+              opacity=".95"
+              d="M141.3 100.3H61l17.6 30.5h45z M114.8 68.4H159l-15.9 26.8H98.8"
+            />
+            <path
+              fill="#010101"
+              d="M78.6 130.8L41 65.8 79.1.8H37.9L.4 65.8l37.5 65z"
+            />
+          </g>
+        </svg>
+      </div>
+      <h1 class="header__name"><span>WEBCOMPONENT:</span> casino-winners</h1>
+    </header>
+    <div class="webcomponent">
+      <casino-winners
+        session="dda66eed-e55f-4116-a66e-f031849e8068"
+        periodrecent="Last30Days"
+        periodtop="Last30Days"
+        endpoint="https://demo-api.stage.norway.everymatrix.com/v1"
+      ></casino-winners>
+    </div>
+  </body>
+</html>

package/index.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ import './dist/casino-winners.js';

package/package.json ADDED Viewed

@@ -0,0 +1,40 @@
+{
+  "name": "@everymatrix/casino-winners",
+  "version": "0.0.336",
+  "main": "index.js",
+  "svelte": "src/index.ts",
+  "scripts": {
+    "start": "sirv public",
+    "build": "cross-env NODE_ENV=production && rollup -c",
+    "dev": "cross-env NODE_ENV=\"development\" rollup -c -w",
+    "validate": "svelte-check",
+    "test": "echo"
+  },
+  "devDependencies": {
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-commonjs": "^16.0.0",
+    "@rollup/plugin-node-resolve": "^10.0.0",
+    "@rollup/plugin-typescript": "^6.0.0",
+    "@tsconfig/svelte": "^1.0.0",
+    "node-sass": "^5.0.0",
+    "rollup": "^2.3.4",
+    "rollup-plugin-dev-server": "^0.4.3",
+    "rollup-plugin-livereload": "^2.0.0",
+    "rollup-plugin-svelte": "^7.0.0",
+    "rollup-plugin-terser": "^7.0.0",
+    "rollup-plugin-uglify": "^6.0.4",
+    "svelte-check": "^1.0.0",
+    "svelte-preprocess": "^4.0.0",
+    "tslib": "^2.0.0",
+    "typescript": "^3.9.3"
+  },
+  "dependencies": {
+    "cross-env": "^7.0.3",
+    "sirv-cli": "^1.0.0",
+    "svelte": "^3.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "492a51ae1dc21e31c604ae74469094ddd4c52159"
+}

package/public/favicon.png ADDED Viewed

Binary file

package/public/reset.css ADDED Viewed

@@ -0,0 +1,48 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+	display: block;
+}
+body {
+	line-height: 1;
+}
+ol, ul {
+	list-style: none;
+}
+blockquote, q {
+	quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: '';
+	content: none;
+}
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}

package/rollup.config.js ADDED Viewed

@@ -0,0 +1,59 @@
+import svelte from 'rollup-plugin-svelte';
+import commonjs from '@rollup/plugin-commonjs';
+import resolve from '@rollup/plugin-node-resolve';
+import serve from 'rollup-plugin-dev-server';
+import livereload from 'rollup-plugin-livereload';
+import { terser } from 'rollup-plugin-terser';
+import sveltePreprocess from 'svelte-preprocess';
+import typescript from '@rollup/plugin-typescript';
+const production = process.env.NODE_ENV === 'production';
+const dev = process.env.NODE_ENV === 'development';
+export default {
+  input: 'src/index.ts',
+  output: {
+    sourcemap: true,
+    format: 'umd',
+    name: 'app',
+    file: 'dist/casino-winners.js'
+  },
+  plugins: [
+    svelte({
+      preprocess: sveltePreprocess(),
+      compilerOptions: {
+        // enable run-time checks when not in production
+        customElement: true,
+        dev: !production
+      }
+    }),
+    commonjs(),
+    resolve({
+      browser: true,
+      dedupe: ['svelte']
+    }),
+    dev && serve({
+      open: true,
+      verbose: true,
+      allowCrossOrigin: true,
+      historyApiFallback: false,
+      host: 'localhost',
+      port: 5050,
+    }),
+    dev && livereload({ watch: ['', 'dist'] }),
+    typescript({
+      sourceMap: !production,
+      inlineSources: !production,
+    }),
+    // If we're building for production (npm run build
+    // instead of npm run dev), minify
+    production &&
+    terser({
+      output: {
+        comments: "all"
+      },
+    })
+  ],
+  watch: {
+    clearScreen: false
+  }
+};