Created
August 26, 2017 01:42
-
-
Save zachdrago/8c7ff99a976030ba67d4c04e8b48e6c0 to your computer and use it in GitHub Desktop.
Remove auto-scroll from Carousel widget
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* 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