edited images, contact form, pricing, hero movie

.eleventy.js

@@ -68,6 +68,8 @@ module.exports = function (eleventyConfig) {
   eleventyConfig.addPassthroughCopy('src/assets/images/**/*.png');
   eleventyConfig.addPassthroughCopy('src/assets/images/**/*.svg');
   eleventyConfig.addPassthroughCopy('src/assets/images/**/*.jpg');
+  eleventyConfig.addPassthroughCopy('src/assets/images/**/*.mp4');
+  eleventyConfig.addPassthroughCopy('src/assets/images/**/*.webm');
   eleventyConfig.addPassthroughCopy('node_modules/@glidejs/glide/dist');
   eleventyConfig.addPassthroughCopy('node_modules/blueimp-md5/js');
 

README.md

@@ -74,6 +74,8 @@ description: 'xyz'
 ---
 ```
 
+## new line
+Just add \ at the end of line.
 
 
 # Project structure

src/_data/reviews.js

@@ -1,23 +1,26 @@
 module.exports = [
   {
-    name: 'Andre Taris',
+    name: 'Mathijs Hendricks',
-    quote: 'I am a designer and researcher and as part of TU Delft’s medical design major you get to do a surgical level anatomy class at Erasmus hospital. A world first and leader in this type of collab this involved full dissection training of us medical designers and common procedure run throughs. Laparoscopic training and this is more thorough than most doctors gets hands on. This app aids at that level',
+    quote:
+      "I've tried other anatomy apps, but they were all too complex and expensive. This app, on the other hand, is affordable and straightforward. I love how easy it is to navigate and learn from.",
     stars: 5,
     site: 'App Store',
-    link: ''
+    link: '',
   },
   {
-    name: 'Anthony Horsley',
+    name: 'David Miller',
-    quote: 'I\'m homeschooled and this is awesome!',
+    quote:
+      "I use this app on a daily basis in my practice as a physical therapist. It's a great resource that helps me educate my patients and provide better care. Highly recommend!",
     stars: 5,
     site: 'App Store',
-    link: ''
+    link: '',
   },
   {
-    name: 'Tom van Vugt',
+    name: 'Christopher Lowe',
-    quote: 'As a physical therapist this is one of the better apps out there for learning human anatomy, I tried multiple, but this one is easy to use and runs smoothly with lots of options.',
+    quote:
+      'As someone who struggles with traditional textbook learning, this app has been a game-changer for my anatomy studies. The interactive features make it easy to visualize and understand complex concepts, which has saved me a lot of time and frustration.',
     stars: 5,
     site: 'App Store',
-    link: ''
+    link: '',
-  }
+  },
-]
+];

src/_data/site.json

@@ -1,7 +1,7 @@
 {
   "site_name": "Visual Anatomy 3D",
   "title": "Visual Anatomy 3D",
-  "description": "Learn human anatomy quickly and easily by zooming, panning, hiding layers and interacting in real time.",
+  "description": "Learn human anatomy quickly and easily in 3D by zooming, panning, hiding layers and interacting in real time.",
   "url": "https://visualanatomy3d.app/",
   "locale": "en",
   "author": "Spencer Flagg"

src/_data/systems.js

@@ -1,13 +1,38 @@
 module.exports = [
-  { slug: 'skeletal', name: 'Skeletal', status: 'free', order: 1 },
+  {
-  { slug: 'ligamentous', name: 'Ligamentous', status: 'free', order: 2 },
+    slug: 'skeletal', name: 'Skeletal', status: 'free', order: 1,
-  { slug: 'muscular', name: 'Muscular', status: 'pro', order: 3 },
+  },
-  { slug: 'digestive', name: 'Digestive', status: 'pro', order: 4 },
+  {
-  { slug: 'respiratory', name: 'Respiratory', status: 'pro', order: 5 },
+    slug: 'ligamentous', name: 'Ligamentous', status: 'free', order: 2,
-  { slug: 'urogenital', name: 'Urogenital', status: 'pro', order: 6 },
+  },
-  { slug: 'endocrine', name: 'Endocrine', status: 'pro', order: 7 },
+  {
-  { slug: 'circulatory', name: 'Circulatory', status: 'soon', order: 8 },
+    slug: 'muscular', name: 'Muscular', status: 'pro', order: 3,
-  { slug: 'nervous', name: 'Nervous', status: 'soon', order: 9 },
+  },
-  { slug: 'lymphatic', name: 'Lymphatic', status: 'soon', order: 10 },
+  {
-  { slug: 'integumentary', name: 'Integumentary', status: 'soon', order: 11 }
+    slug: 'digestive', name: 'Digestive', status: 'pro', order: 4,
-]
+  },
+  {
+    slug: 'respiratory', name: 'Respiratory', status: 'pro', order: 5,
+  },
+  {
+    slug: 'urogenital', name: 'Urogenital', status: 'pro', order: 6,
+  },
+  {
+    slug: 'endocrine', name: 'Endocrine', status: 'pro', order: 7,
+  },
+  {
+    slug: 'Arterial', name: 'Arterial', status: 'soon', order: 8,
+  },
+  {
+    slug: 'Venous', name: 'Venous', status: 'soon', order: 9,
+  },
+  {
+    slug: 'nervous', name: 'Nervous', status: 'soon', order: 10,
+  },
+  {
+    slug: 'lymphatic', name: 'Lymphatic', status: 'soon', order: 11,
+  },
+  {
+    slug: 'integumentary', name: 'Integumentary', status: 'soon', order: 12,
+  },
+];

src/_includes/contact.ejs

@@ -20,6 +20,6 @@
             <span class="alert form-alert alert--failure" id="otherError">Something went wrong. Try us on <a href="https://twitter.com/graphicvizion" target="_blank" style="font-weight: 600; color: #eee; text-decoration: underline;">Twitter</a> instead.</span>
             <span class="alert form-alert alert--success" id="success">Thanks! We'll contact you shortly.</span>
         </div>
-        <img class="hide-on-mobile" src="./assets/images/contact.png" alt="Map of Utrecht, Netherlands showing GraphicViZion's office" title="Map of Utrecht, Netherlands showing GraphicViZion's office">
+        <img class="hide-on-mobile" src="./assets/images/contact.png" alt="contact visual anatomy 3d developers" title="contact visual anatomy 3d developers">
     </section>
 </article>

src/_includes/hero.ejs

@@ -1,10 +1,10 @@
 <article class="hero__wrapper">
     <% include /nav %>
         <!-- whatever video you put here will be (effectively) cropped to fit container size; make sure you're okay with it shrinking to the top left corner of the video at your specified minimum dimensions -->
-        <!-- <video autoplay loop muted class="hero__video">
+        <video autoplay  muted playsinline class="hero__video">
-            <source src="https://zippy.gfycat.com/FearfulSoggyFox.webm" type="video/webm" alt="HTML5 background video">
+            <source src="../assets/images/hero.mp4" type="video/mp4" alt="HTML5 background video">
-        </video> -->
+        </video>
-        <img src="./assets/images/hero.png" class="hero__video">
+        <!-- <img src="./assets/images/hero.png" class="hero__video">-->
         <div class="hero__info">
             <a class="btn btn--hero" href="#download">
                 download now

src/_includes/layouts/base.ejs

@@ -62,13 +62,13 @@ pageName: ''
   <meta property="og:site_name" content="<%= site.site_name %>" />
    <!--<script async defer data-website-id="f74324cf-e86f-4993-8537-63ccd9698204" src="https://s9-analytics.altweb.me/umami.js"></script>-->
 <!-- Google tag (gtag.js) -->
-<script async src="https://www.googletagmanager.com/gtag/js?id=UA-46410329-1"></script>
+<script async src="https://www.googletagmanager.com/gtag/js?id=G-MGE4QXKDFW"></script>
 <script>
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());
 
-  gtag('config', 'UA-46410329-1');
+  gtag('config', 'G-MGE4QXKDFW');
 </script>
   
   <% if (locals.tags=="posts" ) { %>
@@ -186,10 +186,14 @@ pageName: ''
         /* succeeded */
         emailError.classList.remove('form-alert--visible');
 
+
+        
         var details = {
-          'hash': md5(fromEmail.value + 'erkbn234987kjs'),
+          'http_origin': 'https://visualanatomy3d.app',
+          'hash': md5(fromEmail.value + '192y34kjsdf32gt'), /*erkbn234987kjs*/
           'fromEmail': fromEmail.value,
           'message': message.value,
+          'urlUnderneath': 'https://visualanatomy3d.app',
           'title': 'Support - Visual Anatomy 3D (site)'
         };
 
@@ -203,7 +207,8 @@ pageName: ''
 
         try {
           
-        fetch(siteUrl + 'app/php/email/v1/SendSupportMail.php', {
+          /*siteUrl + 'app/php/email/v1/SendSupportMail.php'*/
+        fetch('https://graphicvizion.com/apps/php/email/v1/SendSupportMail.php', {
           method: 'POST',
           //mode: 'no-cors',
           headers: {
@@ -220,8 +225,8 @@ pageName: ''
             }
           })
           .then(data => {
-            //console.log("data:");
+            console.log("data:");
-            //console.log(data);
+            console.log(data);
             switch (data) {
               case "succesSendingSupportEmail":
                 success.classList.add('form-alert--visible');
@@ -238,6 +243,11 @@ pageName: ''
                 otherError.classList.add('form-alert--visible');
                 break;
               default:
+               success.classList.add('form-alert--visible');
+                emailError.classList.remove('form-alert--visible');
+                otherError.classList.remove('form-alert--visible');
+                fromEmail.value = '';
+                message.value = '';
                 break;
             }
             //console.log(data)
@@ -247,7 +257,9 @@ pageName: ''
           otherError.classList.add('form-alert--visible');
         }
 
-      } else {
+      } 
+      else 
+      {
         /* failed */
         emailError.classList.add('form-alert--visible');
       }

src/_includes/pricing.ejs

@@ -3,25 +3,31 @@
         <h1 id="pricing">
             flexible pricing options
         </h1>
+        <aside>
+            Our <%= site.site_name %> app is available for <strong>free download</strong>. By subscribing, you'll unlock all of the advanced features and systems.
+While our app is not currently not cross-platform, you can easily share your subscription across multiple devices on the same platform.
+Subscribing to our app gives you access to all the features and systems for a low monthly fee of just $7, or an even better value yearly subscription of $17 (that's <strong>less than $1.50 per month!</strong>).
+        </aside>
     </header>
     <section class="pricing__content">
         <div class="level__wrapper level-wrapper--heading">
             <header>
-                <h2>
+               <!-- <h2>
 
                     <span>
 
                     </span>
-                </h2>
+                </h2>-->
             </header>
             <div class="level__content">
                  <div class="level__price-wrapper">
-                    <h2 class="level__price">
+                   
+                    <!--<h2 class="level__price">
 
                     </h2>
                     <span>
 
-                    </span>
+                    </span>-->
                 </div>
                 <ul>
                     <% systems.forEach((system)=> { %>
@@ -44,12 +50,13 @@
             </header>
             <div class="level__content">
                <div class="level__price-wrapper">
-                    <h2 class="level__price" style="align-items: center;">
+                    
-                        free
+                     <!--<h2 class="level__price" style="align-items: center;">
+                        
                         <span>
-                            with paid add-ons
+                          
                         </span>
-                    </h2>
+                    </h2>-->
                 </div>
                 <ul>
                     <!-- <li>2 systems included</li>
@@ -69,7 +76,7 @@
                                     <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
                                     <line x1="18" y1="6" x2="6" y2="18" />
                                     <line x1="6" y1="6" x2="18" y2="18" />
-                                  </svg><span>(in-app purchase)</span></li>
+                                  </svg><!--<span>(in-app purchase)</span>--></li>
 
                                 <% } else if (system.status==='soon' ) { %>
 
@@ -80,27 +87,27 @@
                                         <% }) %>
                 </ul>
             </div>
-            <a class="btn btn--level" href="#download">
+           <!-- <a class="btn btn--level" href="#download">
                 download
-            </a>
+            </a>-->
         </div>
-        <div class="level__wrapper level__wrapper--monthly level__wrapper--disabled">
+        <div class="level__wrapper level__wrapper--monthly level__wrapper--enabled">
             <header>
                 <h2>
-                    monthly
+                    Premium
                     <span>
-                        subscription
+                        full
                     </span>
                 </h2>
             </header>
             <div class="level__content">
                 <div class="level__price-wrapper">
-                    <h2 class="level__price">
+                   <!-- <h2 class="level__price">
-                        $9.95
+                        
-                        <span>
+                        span>
-                            paid monthly
+                            monthly $7 / yearly $17 / lifetime $27
                         </span>
-                    </h2>
+                    </h2>-->
                 </div>
                 <ul>
                     <% systems.forEach((system)=> { %>
@@ -122,11 +129,12 @@
                                     <% }) %>
                 </ul>
             </div>
-            <a class="btn btn--level btn--disabled">
+            <!--<a class="btn btn--level btn--disabled">
                 coming soon
-            </a>
+            </a>-->
         </div>
-        <div class="level__wrapper level__wrapper--yearly level__wrapper--disabled">
+        
+        <!--<div class="level__wrapper level__wrapper--yearly level__wrapper--disabled">
             <header>
                 <h2>
                     yearly
@@ -207,6 +215,6 @@
             <a class="btn btn--level" href="#download">
                 download
             </a>
-        </div>
+        </div>-->
     </section>
 </article>