Fetch post and page banners from cloudinary

Author: achan

app/templates/components/page-view.hbs

@@ -11,7 +11,7 @@
   </div>
   {{#if page.bannerUrl}}
     <div class="banner"
-            style="background-image: url('{{page.bannerUrl}}')"
+            style="background-image: url('{{cloudinary-fetch url=page.bannerUrl width=1920}}')"
             data-auto-id="page-view-banner">
     </div>
   {{/if}}

app/templates/components/post-view.hbs

@@ -11,8 +11,8 @@
   </div>
   {{#if post.bannerUrl}}
     <div class="banner"
-            style="background-image: url('{{post.bannerUrl}}')"
-            data-auto-id="post-view-banner">
+         style="background-image: url('{{cloudinary-fetch url=post.bannerUrl width=1920}}')"
+         data-auto-id="post-view-banner">
     </div>
   {{/if}}
   <div class="content" data-auto-id="content">

tests/pages/components/page-view.js

@@ -23,5 +23,8 @@ function imageUrl(elementSelector) {
     css("background-image").
     replace(/['"]+/g, '');
 
-  return backgroundImageStyle.substring(4, backgroundImageStyle.length - 1);
+  const cloudinaryUrl = backgroundImageStyle.substring(4, backgroundImageStyle.length - 1);
+
+  debugger;
+  return cloudinaryUrl.replace("https://res.cloudinary.com/cloudinary-test/image/fetch/w_1920/", "");
 }

tests/pages/components/post-view.js

@@ -23,5 +23,7 @@ function imageUrl(elementSelector) {
     css("background-image").
     replace(/['"]+/g, '');
 
-  return backgroundImageStyle.substring(4, backgroundImageStyle.length - 1);
+  const cloudinaryUrl = backgroundImageStyle.substring(4, backgroundImageStyle.length - 1);
+
+  return cloudinaryUrl.replace("https://res.cloudinary.com/cloudinary-test/image/fetch/w_1920/", "");
 }