Ticket #1055 - For Timeline.

modules/boonex/timeline/classes/BxTimelineModule.php

@@ -2097,7 +2097,7 @@ class BxTimelineModule extends BxBaseModNotificationsModule implements iBxDolCon
 
     protected function _prepareTextForSave($s)
     {
-        return bx_process_input($s, BX_DATA_TEXT_MULTILINE);
+        return bx_process_input($s, BX_DATA_HTML);
     }
 
     protected function _getFieldValue($sField, $iContentId)

modules/boonex/timeline/classes/BxTimelineTemplate.php

@@ -78,6 +78,7 @@ class BxTimelineTemplate extends BxBaseModNotificationsTemplate
             'empty' => $sEmpty, 
             'content' => $sContent,
             'load_more' =>  $sLoadMore,
+            'show_more' => $this->_getShowMore($aParams),
         	'view_image_popup' => $this->_getImagePopup($aParams),
             'js_content' => $this->getJsCode('view', array(
             	'oRequestParams' => array(
@@ -877,6 +878,14 @@ class BxTimelineTemplate extends BxBaseModNotificationsTemplate
         return $this->getComments($sSystem, $iObjectId);
     }
 
+    protected function _getShowMore($aParams)
+    {
+        return $this->parseHtmlByName('show_more.html', array(
+        	'style_prefix' => $this->_oConfig->getPrefix('style'),
+            'js_object' => $this->_oConfig->getJsObject('view'),
+        ));
+    }
+
     protected function _getImagePopup($aParams)
     {
         $sViewImagePopupId = $this->_oConfig->getHtmlIds('view', 'photo_popup_' . $aParams['view']);
@@ -955,27 +964,7 @@ class BxTimelineTemplate extends BxBaseModNotificationsTemplate
             ));
 
         $sText = isset($aContent['text']) ? $aContent['text'] : '';
-        $sTextMore = '';
-
-        if($bBrowseItem)
-        	 $sText = strip_tags($sText, '<br><br/><p>');
-        else {
-        	$sText = strip_tags($sText);
-
-        	$iMaxLength = $this->_oConfig->getCharsDisplayMax();
-        	if(strlen($sText) > $iMaxLength) {
-            	$iLength = strpos($sText, ' ', $iMaxLength);
-
-            	$sTextMore = trim(substr($sText, $iLength));
-            	$sText = trim(substr($sText, 0, $iLength));
-        	}
-
-            $sTextMore = nl2br($sTextMore);
-            $sText = nl2br($sText);
-        }
-
         $sText = $this->_prepareTextForOutput($sText, $aEvent['id']);
-        $sTextMore = $this->_prepareTextForOutput($sTextMore, $aEvent['id']);
 
         //--- Process Links ---//
         $bAddNofollow = $this->_oDb->getParam('sys_add_nofollow') == 'on';
@@ -1100,15 +1089,7 @@ class BxTimelineTemplate extends BxBaseModNotificationsTemplate
                 'condition' => !empty($sText),
                 'content' => array(
                     'style_prefix' => $sStylePrefix,
-                    'item_content' => $sText,
-                    'bx_if:show_more' => array(
-                        'condition' => !empty($sTextMore),
-                        'content' => array(
-                            'style_prefix' => $sStylePrefix,
-                            'js_object' => $sJsObject,
-                            'item_content_more' => $sTextMore
-                        )
-                    ),
+                    'item_content' => $sText
                 )
             ),
             'bx_if:show_content_raw' => array(

modules/boonex/timeline/install/sql/install.sql

@@ -293,7 +293,7 @@ INSERT INTO `sys_form_inputs` (`object`, `module`, `name`, `value`, `values`, `c
 ('bx_timeline_post', @sName, 'type', 'post', '', 0, 'hidden', '_bx_timeline_form_post_input_sys_type', '', '', 0, 0, 0, '', '', '', '', '', '', 'Xss', '', 0, 0),
 ('bx_timeline_post', @sName, 'action', '', '', 0, 'hidden', '_bx_timeline_form_post_input_sys_action', '', '', 0, 0, 0, '', '', '', '', '', '', 'Xss', '', 0, 0),
 ('bx_timeline_post', @sName, 'owner_id', '0', '', 0, 'hidden', '_bx_timeline_form_post_input_sys_owner_id', '', '', 0, 0, 0, '', '', '', '', '', '', 'Int', '', 0, 0),
-('bx_timeline_post', @sName, 'text', '', '', 0, 'textarea', '_bx_timeline_form_post_input_sys_text', '_bx_timeline_form_post_input_text', '', 0, 0, 0, 'a:1:{s:12:"autocomplete";s:3:"off";}', '', '', '', '', '', 'Xss', '', 1, 0),
+('bx_timeline_post', @sName, 'text', '', '', 0, 'textarea', '_bx_timeline_form_post_input_sys_text', '_bx_timeline_form_post_input_text', '', 0, 0, 3, 'a:1:{s:12:"autocomplete";s:3:"off";}', '', '', '', '', '', 'XssHtml', '', 1, 0),
 ('bx_timeline_post', @sName, 'object_privacy_view', '', '', 0, 'custom', '_bx_timeline_form_post_input_sys_object_privacy_view', '_bx_timeline_form_post_input_object_privacy_view', '', 1, 0, 0, '', '', '', '', '', '', '', '', 1, 0),
 ('bx_timeline_post', @sName, 'location', '', '', 0, 'location', '_sys_form_input_sys_location', '', '', 0, 0, 0, '', '', '', '', '', '', '', '', 1, 0),
 ('bx_timeline_post', @sName, 'link', '', '', 0, 'custom', '_bx_timeline_form_post_input_sys_link', '', '', 0, 0, 0, '', '', '', '', '', '', '', '', 1, 0),

modules/boonex/timeline/js/main.js

@@ -53,6 +53,8 @@ BxTimelineMain.prototype.initMasonry = function(onComplete) {
 
 	oItems.resize(function(){
 		$this.reloadMasonry();
+	}).find('.bx-tl-item-text .bx-tl-content').checkOverflowHeight(this.sSP + '-overflow', function(oElement) {
+		$this.onFindOverflow(oElement);
 	});
 
 	oHolder.addClass(this.sClassMasonry).masonry({
@@ -141,6 +143,10 @@ BxTimelineMain.prototype.initFlickity = function() {
 	});
 };
 
+BxTimelineMain.prototype.onFindOverflow = function(oElement) {
+	$(oElement).after($(oElement).parents('.' + this.sClassView + ':first').find('.' + this.sSP + '-content-show-more:hidden:first').clone().show());
+};
+
 BxTimelineMain.prototype.loadingInButton = function(e, bShow) {
 	if($(e).length)
 		bx_loading_btn($(e), bShow);
@@ -221,3 +227,23 @@ BxTimelineMain.prototype._getDefaultData = function(oElement) {
 		_t:oDate.getTime()
     });
 };
+
+(function($) {
+    $.fn.checkOverflowHeight = function(sClass, onFind) {
+    	if(!sClass)
+    		sClass = 'bx-overflow';
+
+        return this.each(function() {
+            var oElement = $(this);
+            if(oElement.hasClass(sClass) || oElement.css('overflow') != 'hidden')
+            	return;
+
+            if(oElement.prop('scrollHeight') <= oElement.height())
+            	return;
+
+            oElement.addClass(sClass);
+            if(typeof onFind === 'function')
+            	onFind(oElement);
+        });
+    };
+})(jQuery);

modules/boonex/timeline/js/post.js

@@ -263,6 +263,9 @@ BxTimelinePost.prototype._onGetPost = function(oData) {
 			oItem = bDivider ? oDivider.after(oContent).next('.' + this.sClassItem + ':hidden') : oContent.prependTo(oItems);
 			oItem.bx_anim('show', this._sAnimationEffect, this._iAnimationSpeed, function() {
 				$(this).find('a.bx-link').dolConverLinks();
+				$(this).find('.bx-tl-item-text .bx-tl-content').checkOverflowHeight($this.sSP + '-overflow', function(oElement) {
+					$this.onFindOverflow(oElement);
+				});
 
 				$this.initFlickity();
 			});
@@ -271,6 +274,9 @@ BxTimelinePost.prototype._onGetPost = function(oData) {
 		case 'outline':
 			this.prependMasonry(oContent, function(oItems) {
 				$(oItems).find('a.bx-link').dolConverLinks();
+				$(oItems).find('.bx-tl-item-text .bx-tl-content').checkOverflowHeight($this.sSP + '-overflow', function(oElement) {
+					$this.onFindOverflow(oElement);
+				});
 
 				$this.initFlickity();
 			});

modules/boonex/timeline/js/view.js

@@ -46,6 +46,9 @@ BxTimelineView.prototype.init = function() {
 		this._oRequestParams['timeline'] = jQuery.extend({}, this._oRequestParams['general']);
 
 		var oItems = this.oViewTimeline.find('.' + this.sClassItem);
+		oItems.find('.bx-tl-item-text .bx-tl-content').checkOverflowHeight(this.sSP + '-overflow', function(oElement) {
+			$this.onFindOverflow(oElement);
+		});
 
 		//--- Hide timeline Events which are outside the viewport
 		this.hideEvents(oItems, this._fOutsideOffset);
@@ -156,10 +159,12 @@ BxTimelineView.prototype.changeTimeline = function(oLink, iYear) {
 	this._getPosts(oLink);
 };
 
-BxTimelineView.prototype.showMoreContent = function(oLink) {
+BxTimelineView.prototype.showMore = function(oLink) {
 	var sView = this._getView(oLink);
+	var sClassOverflow = this.sSP + '-overflow';
 
-	$(oLink).parent('span').next('span').show().prev('span').remove();
+	$(oLink).parents('.' + this.sClassItem + ':first').find('.' + sClassOverflow).css('max-height', 'none').removeClass(sClassOverflow);
+	$(oLink).parents('.' + this.sSP + '-content-show-more:first').remove();
 
 	switch(sView) {
 		case 'timeline':

modules/boonex/timeline/template/block_view.html

@@ -7,6 +7,7 @@
         </div>
 		<div class="__style_prefix__-load-more-holder">__load_more__</div>
 	</div>
+	__show_more__
 	__view_image_popup__
     __js_content__
 </div>

modules/boonex/timeline/template/css/view.css

@@ -104,13 +104,25 @@ div.bx-tl-item-content div.bx-tl-title {
 	text-overflow: ellipsis;
     overflow: hidden;
 }
-div.bx-tl-item-content div.bx-tl-content {
-	text-overflow: ellipsis;
-	overflow: hidden;
-}
 div.bx-tl-item-content div.bx-tl-content iframe {
 	width: 100%;
 }
+div.bx-tl-item-text div.bx-tl-content {
+	position: relative;
+    max-height: 200px;
+
+	text-overflow: ellipsis;
+    overflow: hidden;
+}
+div.bx-tl-item-text div.bx-tl-content.bx-tl-overflow {
+    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+}
+div.bx-tl-item-text div.bx-tl-content-show-more {
+    position: relative;
+
+    text-transform: lowercase;
+    text-align: center;
+}
 
 /*--- Item Images Style ---*/
 div.bx-tl-item div.bx-tl-item-images {
@@ -206,7 +218,7 @@ div.bx-tl-view-outline div.bx-tl-item-cnt {
 div.bx-tl-view-outline div.bx-tl-item-text div.bx-tl-title {
 	font-weight: bold;
 }
-div.bx-tl-view-outline span.bx-tl-content-see-more a {
+div.bx-tl-view-outline div.bx-tl-content-show-more a {
 	font-weight: bold;
 }
 

modules/boonex/timeline/template/show_more.html

@@ -0,0 +1 @@
+<div class="__style_prefix__-content-show-more bx-def-padding-thd-top bx-def-font-small" style="display:none;"><a href="javascript:void(0)" onclick="__js_object__.showMore(this);"><bx_text:_see_more /></a></div>

modules/boonex/timeline/template/type_post.html

@@ -17,9 +17,7 @@
 		<div class="__style_prefix__-title bx-def-margin-sec-bottom bx-def-font-h3">__title__</div>
 	</bx_if:show_title>
 	<bx_if:show_content>
-		<div class="__style_prefix__-content">
-		__item_content__<bx_if:show_more><span class="__style_prefix__-content-see-more">... <a class="bx-def-font-small" href="javascript:void(0)" onclick="__js_object__.showMoreContent(this);"><bx_text:_see_more /></a></span><span style="display:none;"> __item_content_more__</span></bx_if:show_more>
-		</div>
+		<div class="__style_prefix__-content">__item_content__</div>
 	</bx_if:show_content>
 	<bx_if:show_content_raw>__item_content_raw__</bx_if:show_content_raw>
 </div>