Friendica/friendica-github
1
0
Fork 0
mirror of https://github.com/friendica/friendica synced 2025-04-26 21:50:11 +00:00
Code Issues Projects Releases Packages Wiki Activity

bug fix #1135, show more is usable again

Browse source
This commit is contained in:
hauke 2014-09-22 13:53:16 +02:00
parent 4ec5974074
commit 2743514791
10 changed files with 206 additions and 111 deletions
Download patch file Download diff file Expand all files Collapse all files

192
view/theme/frost-mobile/js/readmore.js Normal file
View file

@ -0,0 +1,192 @@
/*!
* Readmore.js jQuery plugin
* Author: @jed_foster
* Project home: jedfoster.github.io/Readmore.js
* Licensed under the MIT license
*/
;(function($) {
var readmore = 'readmore',
defaults = {
speed: 100,
maxHeight: 200,
heightMargin: 16,
moreLink: '<a href="#">Read More</a>',
lessLink: '<a href="#">Close</a>',
embedCSS: true,
sectionCSS: 'display: block; width: 100%;',
startOpen: false,
expandedClass: 'readmore-js-expanded',
collapsedClass: 'readmore-js-collapsed',
// callbacks
beforeToggle: function(){},
afterToggle: function(){}
},
cssEmbedded = false;
function Readmore( element, options ) {
this.element = element;
this.options = $.extend( {}, defaults, options);
$(this.element).data('max-height', this.options.maxHeight);
$(this.element).data('height-margin', this.options.heightMargin);
delete(this.options.maxHeight);
if(this.options.embedCSS && ! cssEmbedded) {
var styles = '.readmore-js-toggle, .readmore-js-section { ' + this.options.sectionCSS + ' } .readmore-js-section { overflow: hidden; }';
(function(d,u) {
var css=d.createElement('style');
css.type = 'text/css';
if(css.styleSheet) {
css.styleSheet.cssText = u;
}
else {
css.appendChild(d.createTextNode(u));
}
d.getElementsByTagName('head')[0].appendChild(css);
}(document, styles));
cssEmbedded = true;
}
this._defaults = defaults;
this._name = readmore;
this.init();
}
Readmore.prototype = {
init: function() {
var $this = this;
$(this.element).each(function() {
var current = $(this),
maxHeight = (current.css('max-height').replace(/[^-\d\.]/g, '') > current.data('max-height')) ? current.css('max-height').replace(/[^-\d\.]/g, '') : current.data('max-height'),
heightMargin = current.data('height-margin');
if(current.css('max-height') != 'none') {
current.css('max-height', 'none');
}
$this.setBoxHeight(current);
if(current.outerHeight(true) <= maxHeight + heightMargin) {
// The block is shorter than the limit, so there's no need to truncate it.
return true;
}
else {
current.addClass('readmore-js-section ' + $this.options.collapsedClass).data('collapsedHeight', maxHeight);
var useLink = $this.options.startOpen ? $this.options.lessLink : $this.options.moreLink;
current.after($(useLink).on('click', function(event) { $this.toggleSlider(this, current, event) }).addClass('readmore-js-toggle'));
if(!$this.options.startOpen) {
current.css({height: maxHeight});
}
}
});
$(window).on('resize', function(event) {
$this.resizeBoxes();
});
},
toggleSlider: function(trigger, element, event)
{
event.preventDefault();
var $this = this,
newHeight = newLink = sectionClass = '',
expanded = false,
collapsedHeight = $(element).data('collapsedHeight');
if ($(element).height() <= collapsedHeight) {
newHeight = $(element).data('expandedHeight') + 'px';
newLink = 'lessLink';
expanded = true;
sectionClass = $this.options.expandedClass;
}
else {
newHeight = collapsedHeight;
newLink = 'moreLink';
sectionClass = $this.options.collapsedClass;
}
// Fire beforeToggle callback
$this.options.beforeToggle(trigger, element, expanded);
$(element).animate({'height': newHeight}, {duration: $this.options.speed, complete: function() {
// Fire afterToggle callback
$this.options.afterToggle(trigger, element, expanded);
$(trigger).replaceWith($($this.options[newLink]).on('click', function(event) { $this.toggleSlider(this, element, event) }).addClass('readmore-js-toggle'));
$(this).removeClass($this.options.collapsedClass + ' ' + $this.options.expandedClass).addClass(sectionClass);
}
});
},
setBoxHeight: function(element) {
var el = element.clone().css({'height': 'auto', 'width': element.width(), 'overflow': 'hidden'}).insertAfter(element),
height = el.outerHeight(true);
el.remove();
element.data('expandedHeight', height);
},
resizeBoxes: function() {
var $this = this;
$('.readmore-js-section').each(function() {
var current = $(this);
$this.setBoxHeight(current);
if(current.height() > current.data('expandedHeight') || (current.hasClass($this.options.expandedClass) && current.height() < current.data('expandedHeight')) ) {
current.css('height', current.data('expandedHeight'));
}
});
},
destroy: function() {
var $this = this;
$(this.element).each(function() {
var current = $(this);
current.removeClass('readmore-js-section ' + $this.options.collapsedClass + ' ' + $this.options.expandedClass).css({'max-height': '', 'height': 'auto'}).next('.readmore-js-toggle').remove();
current.removeData();
});
}
};
$.fn[readmore] = function( options ) {
var args = arguments;
if (options === undefined || typeof options === 'object') {
return this.each(function () {
if ($.data(this, 'plugin_' + readmore)) {
var instance = $.data(this, 'plugin_' + readmore);
instance['destroy'].apply(instance);
}
$.data(this, 'plugin_' + readmore, new Readmore( this, options ));
});
} else if (typeof options === 'string' && options[0] !== '_' && options !== 'init') {
return this.each(function () {
var instance = $.data(this, 'plugin_' + readmore);
if (instance instanceof Readmore && typeof instance[options] === 'function') {
instance[options].apply( instance, Array.prototype.slice.call( args, 1 ) );
}
});
}
}
})(jQuery);