Fix to prevent multiple inits

jekuer · jekuer · commit 3826ecb2974c · 2021-11-29T20:04:47.000+01:00
diff --git a/README.md b/README.md
@@ -63,7 +63,7 @@ See [jekuer.github.io/add-to-calendar-button](https://jekuer.github.io/add-to-ca
 2. Run **`npm install add-to-calendar-button`**.
 3. Import the module into your project/component. For example with Angular/React: `import { atcb_init } from 'add-to-calendar-button';`.
 4. Init the js after the DOM has been loaded. To determine the right moment and execute, ...
-  1. with Angular, you would use `ngAfterViewInit()` with `atcb_init();`; 
+  1. with Angular, you would use `ngAfterViewInit()` with `atcb_init();` (mind that, depending on your app, other hooks might be better); 
   2. with React, you might want to include an event listener like `document.addEventListener('DOMContentLoaded', atcb_init, false);`.
 5. Include the css. For example with Angular or React, add the following to the global style.css: `@import 'add-to-calendar-button/assets/css/atcb.min'`;
 6. Create your button as can be seen in the "Configuration" section below.
diff --git a/assets/css/atcb.css b/assets/css/atcb.css
@@ -3,7 +3,7 @@
  * Add-to-Calendar Button
  * ++++++++++++++++++++++
  * 
- * Version: 1.2.0
+ * Version: 1.2.1
  * Creator: Jens Kuerschner (https://jenskuerschner.de)
  * Project: https://github.com/jekuer/add-to-calendar-button
  * License: GNU General Public License v3.0	(gpl-3.0)
diff --git a/assets/js/atcb.js b/assets/js/atcb.js
@@ -3,7 +3,7 @@
  * Add-to-Calendar Button
  * ++++++++++++++++++++++
  */
-const atcbVersion = '1.2.0';
+const atcbVersion = '1.2.1';
 /* Creator: Jens Kuerschner (https://jenskuerschner.de)
  * Project: https://github.com/jekuer/add-to-calendar-button
  * License: GNU General Public License v3.0	(gpl-3.0)
@@ -259,6 +259,9 @@ function atcb_generate(button, buttonId, data) {
   bgOverlay.addEventListener('click', atcb_close_all, {passive: true});
   bgOverlay.addEventListener('touchstart', atcb_close_all, {passive: true});
   bgOverlay.addEventListener('mouseenter', atcb_close_all, false);
+  // update the placeholder class to prevent multiple initializations
+  button.classList.remove('atcb');
+  button.classList.add('atcb_initialized');
   // show the placeholder div
   if (data['inline']) {
     button.style.display = 'inline-block';
diff --git a/assets/js/atcb.min.js b/assets/js/atcb.min.js
diff --git a/assets/js/atcb.min.js.map b/assets/js/atcb.min.js.map
diff --git a/index.html b/index.html
@@ -121,7 +121,7 @@
   <body>
     <div class="container">
 
-      <h1>Add-to-Calendar Button <span id="tinyVersion">v1.2.0</span></h1>
+      <h1>Add-to-Calendar Button <span id="tinyVersion">v1.2.1</span></h1>
       <h2>A convenient JavaScript snippet, which lets you create beautiful buttons, where people can add events to their calendars.</h2>
       <p class="github">
         <a target="_blank" href="https://github.com/jekuer/add-to-calendar-button">
@@ -143,7 +143,7 @@ <h3>Example 1: The usual One</h3>
           <div class="atcb" style="display:none;">
             {
               "title":"Reminder to check the add-to-calendar-button repo",
-              "description":"Check<br> out<br /> the<br/> maybe\neasiest way to include add-to-calendar-buttons to your website at: https://github.com/jekuer/add-to-calendar-button",
+              "description":"Check out the maybe easiest way to include add-to-calendar-buttons to your website at: https://github.com/jekuer/add-to-calendar-button",
               "dateStart":"01-14-2022",
               "dateEnd":"01-18-2022",
               "timeStart":"10:15",
@@ -444,7 +444,7 @@ <h3>Example 6: Timezone Offset</h3>
 
 
     <!-- load the button js -->
-    <script src="./assets/js/atcb.min.js?v=1.2.0" defer></script>
+    <script src="./assets/js/atcb.min.js?v=1.2.1" defer></script>
 
     
   </body>
diff --git a/npm_dist/atcb_npm.js b/npm_dist/atcb_npm.js
@@ -3,7 +3,7 @@
  * Add-to-Calendar Button
  * ++++++++++++++++++++++
  */
-const atcbVersion = '1.2.0';
+const atcbVersion = '1.2.1';
 /* Creator: Jens Kuerschner (https://jenskuerschner.de)
  * Project: https://github.com/jekuer/add-to-calendar-button
  * License: GNU General Public License v3.0	(gpl-3.0)
@@ -259,6 +259,9 @@ function atcb_generate(button, buttonId, data) {
   bgOverlay.addEventListener('click', atcb_close_all, {passive: true});
   bgOverlay.addEventListener('touchstart', atcb_close_all, {passive: true});
   bgOverlay.addEventListener('mouseenter', atcb_close_all, false);
+  // update the placeholder class to prevent multiple initializations
+  button.classList.remove('atcb');
+  button.classList.add('atcb_initialized');
   // show the placeholder div
   if (data['inline']) {
     button.style.display = 'inline-block';
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "add-to-calendar-button",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "A convenient JavaScript snippet, which lets you create beautiful buttons, where people can add events to their calendars.",
   "main": "npm_dist/atcb_npm.js",
   "types": "index.d.ts",

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@`
`3`	`3`	`* Add-to-Calendar Button`
`4`	`4`	`* ++++++++++++++++++++++`
`5`	`5`	`*`
`6`		`- * Version: 1.2.0`
	`6`	`+ * Version: 1.2.1`
`7`	`7`	`* Creator: Jens Kuerschner (https://jenskuerschner.de)`
`8`	`8`	`* Project: https://github.com/jekuer/add-to-calendar-button`
`9`	`9`	`* License: GNU General Public License v3.0 (gpl-3.0)`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "add-to-calendar-button",`
`3`		`- "version": "1.2.0",`
	`3`	`+ "version": "1.2.1",`
`4`	`4`	`"description": "A convenient JavaScript snippet, which lets you create beautiful buttons, where people can add events to their calendars.",`
`5`	`5`	`"main": "npm_dist/atcb_npm.js",`
`6`	`6`	`"types": "index.d.ts",`