Deprecated Clerk.js v1 and added Clerk.js v2

clerkio · Oct 7, 2019 · 90d60d0 · 90d60d0
1 parent 5ba3d5a
commit 90d60d0
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 28 deletions.
diff --git a/code/etc/config.xml b/code/etc/config.xml
@@ -2,7 +2,7 @@
 <config>
     <modules>
         <Clerk_Clerk>
-            <version>3.7.2</version>
+            <version>4.0.0</version>
         </Clerk_Clerk>
     </modules>
     <global>

diff --git a/design/frontend/template/powerpopup.phtml b/design/frontend/template/powerpopup.phtml
@@ -2,7 +2,7 @@
 /** @var Clerk_Clerk_Block_Powerstep $this */
 if ($this->shouldShow()) :
 ?>
-<span id="clerk-power-popup" style="display:none">
+<span id="clerk-power-popup" class="clerk-popup">
     <div class="clerk-top-wrapper">
         <div class="col6 left padding10">
             <div class="col12 ">

diff --git a/design/frontend/template/tracking.phtml b/design/frontend/template/tracking.phtml
@@ -7,29 +7,28 @@ $currentCurrencySymbol = Mage::app()->getLocale()->currency($currentCurrencyCode
 $rates = Mage::getModel('directory/currency')->getCurrencyRates($baseCurrencyCode, $currentCurrencyCode);
 ?>
 <script type="text/javascript">
-    window.clerkAsyncInit = function() {
-        Clerk.config({
-            key: '<?php echo $this->getPublicKey(); ?>',
-            collect_email: <?php echo $this->collectEmails() ? 'true' : 'false'; ?>,
-            templateFormatters: {
-                form_key: function () {
-                    return '<?php echo $this->getFormKey(); ?>';
-                },
-                <?php if ($rates && isset($rates[$currentCurrencyCode])) : ?>
-                price_in_currency: function(price) {
-                    price =  Math.round(price * 100) / 100;
-                    var price_converted = Math.round((price * <?php echo (float)$rates[$currentCurrencyCode]; ?>) * 100) / 100;
-                    var retVal = <?php echo json_encode($currentCurrencySymbol); ?> + ' ' + price_converted.toFixed(2).toString();
+    (function(w,d){
+        var e=d.createElement('script');e.type='text/javascript';e.async=true;
+        e.src=(d.location.protocol=='https:'?'https':'http')+'://cdn.clerk.io/clerk.js';
+        var s=d.getElementsByTagName('script')[0];s.parentNode.insertBefore(e,s);
+        w.__clerk_q=w.__clerk_q||[];w.Clerk=w.Clerk||function(){w.__clerk_q.push(arguments)};
+    })(window,document);
+    Clerk('config', {
+        key: '<?php echo $this->getPublicKey(); ?>',
+        collect_email: <?php echo $this->collectEmails() ? 'true' : 'false'; ?>,
+        templateFormatters: {
+            form_key: function () {
+                return '<?php echo $this->getFormKey(); ?>';
+            },
+            <?php if ($rates && isset($rates[$currentCurrencyCode])) : ?>
+            price_in_currency: function(price) {
+                price =  Math.round(price * 100) / 100;
+                var price_converted = Math.round((price * <?php echo (float)$rates[$currentCurrencyCode]; ?>) * 100) / 100;
+                var retVal = <?php echo json_encode($currentCurrencySymbol); ?> + ' ' + price_converted.toFixed(2).toString();
 
-                    return retVal;
-                }
-                <?php endif; ?>
+                return retVal;
             }
-        });
-    };
-    (function(){
-        var e = document.createElement('script'); e.type='text/javascript'; e.async = true;
-        e.src = document.location.protocol + '//api.clerk.io/static/clerk.js';
-        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(e, s);
-    })();
+            <?php endif; ?>
+        }
+    });
 </script>
diff --git a/etc/modules/Clerk_Clerk.xml b/etc/modules/Clerk_Clerk.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<config>
+  <modules>
+    <Clerk_Clerk>
+      <active>true</active>
+      <codePool>community</codePool>
+    </Clerk_Clerk>
+  </modules>
+</config>
diff --git a/skin/style.css b/skin/style.css
@@ -2,9 +2,16 @@
 GENERAL
 --------------------------------------------------------- */
 #clerk-power-popup {
-    max-width: 1000px;
-    width: 100%;
-    margin: 30px auto;
+    position: fixed;
+    top: 10%;
+    z-index: 16777271;
+    width: 90%;
+    padding: 20px;
+    margin: 0 5%;
+    background-color: white;
+    border: 1px solid #eee;
+    border-radius: 5px;
+    box-shadow: 0px 8px 40px 0px rgba(0,0,60,0.15);
 }
 
 #clerk-power-popup .clerk-top-wrapper {