From: stephen@cubedesigners.com <stephen@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Date: Wed, 3 Aug 2016 17:23:16 +0000 (+0000)
Subject: Fix Masonry error on mobile and fix #587 @2
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=710fe4e6a195f7eb4478fd22b4ac421a7f3b494c;p=fluidbook-v3.git

Fix Masonry error on mobile and fix #587 @2
---

diff --git a/framework/application/views/helpers/Exemples.php b/framework/application/views/helpers/Exemples.php
index c7a1cf9..82d6a54 100644
--- a/framework/application/views/helpers/Exemples.php
+++ b/framework/application/views/helpers/Exemples.php
@@ -13,6 +13,7 @@ class Fluidbook_View_Helper_Exemples extends CubeIT_View_Helper_Abstract {
 			->addMasonry()
 			->addJQueryTransform()
 			->addTinysort()
+            ->addDotDotDot()
 			->addScriptAndStyle('220-exemples');
 
 		$exemples = Fluidbook_Model_Reference::factory()->order('date DESC')->find();
@@ -95,7 +96,7 @@ class Fluidbook_View_Helper_Exemples extends CubeIT_View_Helper_Abstract {
 		$res .= $this->htmlElement($f->getTitle(), 'h3');
 		if ($featured && !is_array($f->getText())) {
 
-			$res .= $this->htmlElement($f->getText(), 'p');
+			$res .= $this->htmlElement($f->getText(), 'p', ['class' => 'feature-description']);
 		}
 
 		$image = CubeIT_Util_Cms::extractFile($f->getImage());
diff --git a/js/220-exemples.js b/js/220-exemples.js
index e5e10ee..b9ff778 100644
--- a/js/220-exemples.js
+++ b/js/220-exemples.js
@@ -1,8 +1,11 @@
-registerLoader(load_exemples);
+registerLoader(load_exemples, true);
 
 var sort = '';
 
 function load_exemples() {
+
+    $('.feature-description').dotdotdot({});
+
     $(window).on('fluidbookresize', resizeExemples);
     resizeExemples();
 }
@@ -11,6 +14,7 @@ function resizeExemples() {
     var ww = $(window).width();
     var mw = Math.floor($('main').width() * 0.9 / 4) * 4;
     var changeSort = false;
+    var msnry;
 
     if (ww > 1100) {
         if (sort != 'j') {
@@ -34,7 +38,12 @@ function resizeExemples() {
 
     if (changeSort) {
         try {
-            $(".publications").css('visibility', 'hidden').masonry('destroy');
+            $('.publications').css('visibility', 'hidden');
+
+            if (msnry) {
+                $('.publications').masonry('destroy');
+            }
+
         } catch (e) {
             
         }
@@ -46,7 +55,7 @@ function resizeExemples() {
         return;
     }
 
-    $(".publications").css({width: mw, visibility: 'visible'})
+    msnry = $(".publications").css({width: mw, visibility: 'visible'})
         .masonry({
             itemSelector: "article",
             fitWidth: true,
@@ -74,4 +83,7 @@ function resizeExemples() {
 
         $(this).css({width: w, height: h, left: left, fontSize: (w / 600) * 10});
     });
+
+    // Update ellipsis
+    $('.feature-description').trigger('update.dot');
 }
diff --git a/less/220-exemples.less b/less/220-exemples.less
index d23f1ae..efd5379 100644
--- a/less/220-exemples.less
+++ b/less/220-exemples.less
@@ -80,6 +80,11 @@
 					padding: 25px 30px;
 				}
 
+				.feature-description {
+					max-height: 21%;
+					overflow: hidden; // jQueryDotDotDot should handle the text but this is a fallback
+				}
+
 				img {
 					height: auto;
 				}