Skip to content

Instantly share code, notes, and snippets.

@zachdrago
Created August 26, 2017 01:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zachdrago/8c7ff99a976030ba67d4c04e8b48e6c0 to your computer and use it in GitHub Desktop.
Save zachdrago/8c7ff99a976030ba67d4c04e8b48e6c0 to your computer and use it in GitHub Desktop.
Remove auto-scroll from Carousel widget
/* global Callbacks, Strings, $, _, Mustache, CryptoJS */
/* jshint strict: false, maxparams: 5 */
// // Tips: Load the JavaScript libraries you need
// Stackla.loadJS([
// 'https://cdnjs.cloudflare.com/ajax/libs/slabText/2.3/jquery.slabtext.min.js'
// ]).then(function () {
// // After all JS urls are loaded
// });
$.extend(Callbacks.prototype, {
/**
* #1 Invoked befored tiles are rendered.
* Use it when you want to add, remove, or update tiles before rendering.
*/
onBeforeRenderTiles: function (addedIds, addedData) {
//console.log('[onBeforeRenderTiles]', addedIds, addedData);
},
/**
* #2 Invoked before each tile is appended to container.
* Use it when you need to modify the tile HTML structure according to its data.
*/
onCompleteJsonToHtml: function ($tile, tileData) {
// FIND THE TILE-CONTENT ELEMENT
// AND PREPEND OUR NEW HOVER ELEMENT CALLED TILE-HOVER
var $content = $tile.find('.tile-content');
$content.prepend('<div class="tile-hover"></div>');
// REPOSITION TILE-SOURCE TO BOTTOM OF TILE-CONTNENT
$content.append($tile.find('.tile-source'));
// FIND TILE-HOVER ELEMENT
// AND MOVE TILE-CAPTION INTO IT
var $hover = $tile.find('.tile-hover');
// CREATE AND APPEND A NEW TILE-USER ELEMENT
// MOVE POST'S USER INFO TO TILE-USER ELEMENT
$hover.prepend('<div class="tile-user"></div>');
$tile.find('.tile-user').append($tile.find('.tile-user-top'));
$hover.append($tile.find('.tile-caption'));
$hover.prepend($tile.find('.tile-timestamp'));
// REMOVE ALL LEFTOVER ELEMENTS THAT AREN'T NEEDED
//$tile.find('.tile-timestamp').remove();
$tile.find('.tile-details').remove();
$tile.find('.tile-belt').remove();
$tile.find('.tile-avatar-wrapper').remove();
$tile.find('.tile-twitter-intent').remove();
$tile.find('.tile-interactions').remove();
$tile.find('.tile-tags').remove();
return $tile;
},
/**
* #3 Invoked after each tile is appended to container.
* Use it when you need to resize inside elements according to actual tile dimension.
*/
onCalculateDimensions: function ($tile) {
var tileWidth = $tile.width();
$tile.height(tileWidth);
},
/**
* #4 Invoked after each tile is appended to container.
*/
onCompleteAddingToDom: function ($tile) {
//console.log('[onCompleteAddingToDom]', $tile);
},
/**
* #5 Invoked after each tile image is loaded.
*/
onCompleteRenderImage: function ($image) {
//console.log('[onCompleteRenderImage]', $image);
},
/**
* #6 Invoked after tiles are rendered.
* Use it when you need to update tiles after they are rendered.
*/
onCompleteRenderTiles: function ($addedTiles, addedData) {
//console.log('[onCompleteRenderTiles]', $addedTiles, addedData);
},
/**
* Invoked after filter is changed.
* Use it when you need to prompt user the filter has been changed.
*/
onCompleteChangeFilter: function ($tiles, prevFilterId, nextFilterId) {
//console.log('[onCompleteChangeFilter]', $tiles, prevFilterId, nextFilterId);
},
/**
* Invoked when a widget receives customised message from parent page.
*/
onMessage: function (type, data) {
//console.log('[onMessage]', type, data);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment