1/* global NexT: true */ 2 3$(document).ready(function () { 4 NexT.motion = {}; 5 6 var sidebarToggleLines = { 7 lines: [], 8 push: function (line) { 9 this.lines.push(line); 10 }, 11 init: function () { 12 this.lines.forEach(function (line) { 13 line.init(); 14 }); 15 }, 16 arrow: function () { 17 this.lines.forEach(function (line) { 18 line.arrow(); 19 }); 20 }, 21 close: function () { 22 this.lines.forEach(function (line) { 23 line.close(); 24 }); 25 } 26 }; 27 28 function SidebarToggleLine(settings) { 29 this.el = $(settings.el); 30 this.status = $.extend({}, { 31 init: { 32 width: '100%', 33 opacity: 1, 34 left: 0, 35 rotateZ: 0, 36 top: 0 37 } 38 }, settings.status); 39 } 40 41 SidebarToggleLine.prototype.init = function () { 42 this.transform('init'); 43 }; 44 SidebarToggleLine.prototype.arrow = function () { 45 this.transform('arrow'); 46 }; 47 SidebarToggleLine.prototype.close = function () { 48 this.transform('close'); 49 }; 50 SidebarToggleLine.prototype.transform = function (status) { 51 this.el.velocity('stop').velocity(this.status[status]); 52 }; 53 54 var sidebarToggleLine1st = new SidebarToggleLine({ 55 el: '.sidebar-toggle-line-first', 56 status: { 57 arrow: {width: '50%', rotateZ: '-45deg', top: '2px'}, 58 close: {width: '100%', rotateZ: '-45deg', top: '5px'} 59 } 60 }); 61 var sidebarToggleLine2nd = new SidebarToggleLine({ 62 el: '.sidebar-toggle-line-middle', 63 status: { 64 arrow: {width: '90%'}, 65 close: {opacity: 0} 66 } 67 }); 68 var sidebarToggleLine3rd = new SidebarToggleLine({ 69 el: '.sidebar-toggle-line-last', 70 status: { 71 arrow: {width: '50%', rotateZ: '45deg', top: '-2px'}, 72 close: {width: '100%', rotateZ: '45deg', top: '-5px'} 73 } 74 }); 75 76 sidebarToggleLines.push(sidebarToggleLine1st); 77 sidebarToggleLines.push(sidebarToggleLine2nd); 78 sidebarToggleLines.push(sidebarToggleLine3rd); 79 80 var SIDEBAR_WIDTH = '320px'; 81 var SIDEBAR_DISPLAY_DURATION = 200; 82 var xPos, yPos; 83 84 var sidebarToggleMotion = { 85 toggleEl: $('.sidebar-toggle'), 86 dimmerEl: $('#sidebar-dimmer'), 87 sidebarEl: $('.sidebar'), 88 isSidebarVisible: false, 89 init: function () { 90 this.toggleEl.on('click', this.clickHandler.bind(this)); 91 this.dimmerEl.on('click', this.clickHandler.bind(this)); 92 this.toggleEl.on('mouseenter', this.mouseEnterHandler.bind(this)); 93 this.toggleEl.on('mouseleave', this.mouseLeaveHandler.bind(this)); 94 this.sidebarEl.on('touchstart', this.touchstartHandler.bind(this)); 95 this.sidebarEl.on('touchend', this.touchendHandler.bind(this)); 96 this.sidebarEl.on('touchmove', function(e){e.preventDefault();}); 97 98 $(document) 99 .on('sidebar.isShowing', function () { 100 NexT.utils.isDesktop() && $('body').velocity('stop').velocity( 101 {paddingRight: SIDEBAR_WIDTH}, 102 SIDEBAR_DISPLAY_DURATION 103 ); 104 }) 105 .on('sidebar.isHiding', function () { 106 }); 107 }, 108 clickHandler: function () { 109 this.isSidebarVisible ? this.hideSidebar() : this.showSidebar(); 110 this.isSidebarVisible = !this.isSidebarVisible; 111 }, 112 mouseEnterHandler: function () { 113 if (this.isSidebarVisible) { 114 return; 115 } 116 sidebarToggleLines.arrow(); 117 }, 118 mouseLeaveHandler: function () { 119 if (this.isSidebarVisible) { 120 return; 121 } 122 sidebarToggleLines.init(); 123 }, 124 touchstartHandler: function(e) { 125 xPos = e.originalEvent.touches[0].clientX; 126 yPos = e.originalEvent.touches[0].clientY; 127 }, 128 touchendHandler: function(e) { 129 var _xPos = e.originalEvent.changedTouches[0].clientX; 130 var _yPos = e.originalEvent.changedTouches[0].clientY; 131 if (_xPos-xPos > 30 && Math.abs(_yPos-yPos) < 20) { 132 this.clickHandler(); 133 } 134 }, 135 showSidebar: function () { 136 var self = this; 137 138 sidebarToggleLines.close(); 139 140 this.sidebarEl.velocity('stop').velocity({ 141 width: SIDEBAR_WIDTH 142 }, { 143 display: 'block', 144 duration: SIDEBAR_DISPLAY_DURATION, 145 begin: function () { 146 $('.sidebar .motion-element').velocity( 147 'transition.slideRightIn', 148 { 149 stagger: 50, 150 drag: true, 151 complete: function () { 152 self.sidebarEl.trigger('sidebar.motion.complete'); 153 } 154 } 155 ); 156 }, 157 complete: function () { 158 self.sidebarEl.addClass('sidebar-active'); 159 self.sidebarEl.trigger('sidebar.didShow'); 160 } 161 } 162 ); 163 164 this.sidebarEl.trigger('sidebar.isShowing'); 165 }, 166 hideSidebar: function () { 167 NexT.utils.isDesktop() && $('body').velocity('stop').velocity({paddingRight: 0}); 168 this.sidebarEl.find('.motion-element').velocity('stop').css('display', 'none'); 169 this.sidebarEl.velocity('stop').velocity({width: 0}, {display: 'none'}); 170 171 sidebarToggleLines.init(); 172 173 this.sidebarEl.removeClass('sidebar-active'); 174 this.sidebarEl.trigger('sidebar.isHiding'); 175 176 // Prevent adding TOC to Overview if Overview was selected when close & open sidebar. 177 if (!!$('.post-toc-wrap')) { 178 if ($('.site-overview-wrap').css('display') === 'block') { 179 $('.post-toc-wrap').removeClass('motion-element'); 180 } else { 181 $('.post-toc-wrap').addClass('motion-element'); 182 } 183 } 184 } 185 }; 186 sidebarToggleMotion.init(); 187 188 NexT.motion.integrator = { 189 queue: [], 190 cursor: -1, 191 add: function (fn) { 192 this.queue.push(fn); 193 return this; 194 }, 195 next: function () { 196 this.cursor++; 197 var fn = this.queue[this.cursor]; 198 $.isFunction(fn) && fn(NexT.motion.integrator); 199 }, 200 bootstrap: function () { 201 this.next(); 202 } 203 }; 204 205 NexT.motion.middleWares = { 206 logo: function (integrator) { 207 var sequence = []; 208 var $brand = $('.brand'); 209 var $title = $('.site-title'); 210 var $subtitle = $('.site-subtitle'); 211 var $logoLineTop = $('.logo-line-before i'); 212 var $logoLineBottom = $('.logo-line-after i'); 213 214 $brand.size() > 0 && sequence.push({ 215 e: $brand, 216 p: {opacity: 1}, 217 o: {duration: 200} 218 }); 219
220 NexT.utils.isMist() && hasElement([$logoLineTop, $logoLineBottom]) && 221 sequence.push( 222 getMistLineSettings($logoLineTop, '100%'), 223 getMistLineSettings($logoLineBottom, '-100%') 224 ); 225 226 hasElement($title) && sequence.push({ 227 e: $title, 228 p: {opacity: 1, top: 0}, 229 o: { duration: 200 } 230 }); 231 232 hasElement($subtitle) && sequence.push({ 233 e: $subtitle, 234 p: {opacity: 1, top: 0}, 235 o: {duration: 200} 236 }); 237 238 if (CONFIG.motion.async) { 239 integrator.next(); 240 } 241 242 if (sequence.length > 0) { 243 sequence[sequence.length - 1].o.complete = function () { 244 integrator.next(); 245 }; 246 $.Velocity.RunSequence(sequence); 247 } else { 248 integrator.next(); 249 } 250 251 252 function getMistLineSettings (element, translateX) { 253 return { 254 e: $(element), 255 p: {translateX: translateX}, 256 o: { 257 duration: 500, 258 sequenceQueue: false 259 } 260 }; 261 } 262 263 /** 264 * Check if $elements exist. 265 * @param {jQuery|Array} $elements 266 * @returns {boolean} 267 */ 268 function hasElement ($elements) { 269 $elements = Array.isArray($elements) ? $elements : [$elements]; 270 return $elements.every(function ($element) { 271 return $.isFunction($element.size) && $element.size() > 0; 272 }); 273 } 274 }, 275 276 menu: function (integrator) { 277 278 if (CONFIG.motion.async) { 279 integrator.next(); 280 } 281 282 $('.menu-item').velocity('transition.slideDownIn', { 283 display: null, 284 duration: 200, 285 complete: function () { 286 integrator.next(); 287 } 288 }); 289 }, 290 291 postList: function (integrator) { 292 //var $post = $('.post'); 293 var $postBlock = $('.post-block, .pagination, .comments'); 294 var $postBlockTransition = CONFIG.motion.transition.post_block; 295 var $postHeader = $('.post-header'); 296 var $postHeaderTransition = CONFIG.motion.transition.post_header; 297 var $postBody = $('.post-body'); 298 var $postBodyTransition = CONFIG.motion.transition.post_body; 299 var $collHeader = $('.collection-title, .archive-year'); 300 var $collHeaderTransition = CONFIG.motion.transition.coll_header; 301 var $sidebarAffix = $('.sidebar-inner'); 302 var $sidebarAffixTransition = CONFIG.motion.transition.sidebar; 303 var hasPost = $postBlock.size() > 0; 304 305 hasPost ? postMotion() : integrator.next(); 306 307 if (CONFIG.motion.async) { 308 integrator.next(); 309 } 310 311 function postMotion () { 312 var postMotionOptions = window.postMotionOptions || { 313 stagger: 100, 314 drag: true 315 }; 316 postMotionOptions.complete = function () { 317 // After motion complete need to remove transform from sidebar to let affix work on Pisces | Gemini. 318 if (CONFIG.motion.transition.sidebar && (NexT.utils.isPisces() || NexT.utils.isGemini())) { 319 $sidebarAffix.css({ 'transform': 'initial' }); 320 } 321 integrator.next(); 322 }; 323 324 //$post.velocity('transition.slideDownIn', postMotionOptions); 325 if (CONFIG.motion.transition.post_block) { 326 $postBlock.velocity('transition.' + $postBlockTransition, postMotionOptions); 327 } 328 if (CONFIG.motion.transition.post_header) { 329 $postHeader.velocity('transition.' + $postHeaderTransition, postMotionOptions); 330 } 331 if (CONFIG.motion.transition.post_body) { 332 $postBody.velocity('transition.' + $postBodyTransition, postMotionOptions); 333 } 334 if (CONFIG.motion.transition.coll_header) { 335 $collHeader.velocity('transition.' + $collHeaderTransition, postMotionOptions); 336 } 337 // Only for Pisces | Gemini. 338 if (CONFIG.motion.transition.sidebar && (NexT.utils.isPisces() || NexT.utils.isGemini())) { 339 $sidebarAffix.velocity('transition.' + $sidebarAffixTransition, postMotionOptions); 340 } 341 } 342 }, 343 344 sidebar: function (integrator) { 345 if (CONFIG.sidebar.display === 'always') { 346 NexT.utils.displaySidebar(); 347 } 348 integrator.next(); 349 } 350 }; 351 352});
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.