X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=src%2FWallabag%2FCoreBundle%2FResources%2Fviews%2Fthemes%2Fmaterial%2Fpublic%2Fjs%2Fmaterialize.js;h=f36f94e6d0016f3d9c8b67351aeb233ca5a8dc8b;hb=9c8f7af196e6645525e5ff5b07864eaef8fb5ef5;hp=f19998acaefd9fff5b745dd9f3dc1dc3d1832878;hpb=9e07dc982c92eb35ab82dffaab9c4a0b54ad7364;p=github%2Fwallabag%2Fwallabag.git diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/materialize.js b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/materialize.js index f19998ac..f36f94e6 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/materialize.js +++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/materialize.js @@ -1,5 +1,5 @@ /*! - * Materialize v0.97.0 (http://materializecss.com) + * Materialize v0.97.1 (http://materializecss.com) * Copyright 2014-2015 Materialize * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE) */ @@ -252,7 +252,7 @@ jQuery.extend( jQuery.easing, }; })(Hammer.Manager.prototype.emit); })); -;Materialize = {}; +;window.Materialize = {}; // Unique ID Materialize.guid = (function() { @@ -442,7 +442,8 @@ else { constrain_width: true, // Constrains width of dropdown to the activator hover: false, gutter: 0, // Spacing from edge - belowOrigin: false + belowOrigin: false, + alignment: 'left' }; this.each(function(){ @@ -465,6 +466,8 @@ else { options.gutter = origin.data('gutter'); if (origin.data('beloworigin') !== undefined) options.belowOrigin = origin.data('beloworigin'); + if (origin.data('alignment') !== undefined) + options.alignment = origin.data('alignment'); } updateOptions(); @@ -487,27 +490,46 @@ else { if (options.constrain_width === true) { activates.css('width', origin.outerWidth()); } + else { + activates.css('white-space', 'nowrap'); + } var offset = 0; if (options.belowOrigin === true) { offset = origin.height(); } - // Handle edge alignment + // Offscreen detection var offsetLeft = origin.offset().left; - var width_difference = 0; - var gutter_spacing = options.gutter; - - + var activatesLeft, width_difference, gutter_spacing; if (offsetLeft + activates.innerWidth() > $(window).width()) { - width_difference = origin.innerWidth() - activates.innerWidth(); - gutter_spacing = gutter_spacing * -1; + options.alignment = 'right'; } + else if (offsetLeft - activates.innerWidth() + origin.innerWidth() < 0) { + options.alignment = 'left'; + } + + // Handle edge alignment + if (options.alignment === 'left') { + width_difference = 0; + gutter_spacing = options.gutter; + activatesLeft = origin.position().left + width_difference + gutter_spacing; + // Position dropdown + activates.css({ left: activatesLeft }); + } + else if (options.alignment === 'right') { + var offsetRight = $(window).width() - offsetLeft - origin.innerWidth(); + width_difference = 0; + gutter_spacing = options.gutter; + activatesLeft = ( $(window).width() - origin.position().left - origin.innerWidth() ) + gutter_spacing; + + // Position dropdown + activates.css({ right: activatesLeft }); + } // Position dropdown activates.css({ position: 'absolute', top: origin.position().top + offset, - left: origin.position().left + width_difference + gutter_spacing }); @@ -1100,11 +1122,6 @@ $(document).ready(function(){ window_width = $(window).width(); $this.width('100%'); - // Set Tab Width for each tab - var $num_tabs = $(this).children('li').length; - $this.children('li').each(function() { - $(this).width((100/$num_tabs)+'%'); - }); var $active, $content, $links = $this.find('li.tab a'), $tabs_width = $this.width(), $tab_width = $this.find('li').first().outerWidth(), @@ -1234,153 +1251,164 @@ $(document).ready(function(){ var defaults = { delay: 350 }; + + // Remove tooltip from the activator + if (options === "remove") { + this.each(function(){ + $('#' + $(this).attr('data-tooltip-id')).remove(); + }); + return false; + } + options = $.extend(defaults, options); - //Remove previously created html - $('.material-tooltip').remove(); return this.each(function(){ + var tooltipId = Materialize.guid(); var origin = $(this); - - // Create Text span - var tooltip_text = $('').text(origin.attr('data-tooltip')); - - // Create tooltip - var newTooltip = $('
'); - newTooltip.addClass('material-tooltip').append(tooltip_text); - newTooltip.appendTo($('body')); - - var backdrop = $('
').addClass('backdrop'); - backdrop.appendTo(newTooltip); - backdrop.css({ top: 0, left:0 }); - - - //Destroy previously binded events - $(this).off('mouseenter mouseleave'); - // Mouse In - $(this).on({ - mouseenter: function(e) { - var tooltip_delay = origin.data("delay"); - tooltip_delay = (tooltip_delay === undefined || tooltip_delay === '') ? options.delay : tooltip_delay; - counter = 0; - counterInterval = setInterval(function(){ - counter += 10; - if (counter >= tooltip_delay && started === false) { - started = true; - newTooltip.css({ display: 'block', left: '0px', top: '0px' }); - - // Set Tooltip text - newTooltip.children('span').text(origin.attr('data-tooltip')); - - // Tooltip positioning - var originWidth = origin.outerWidth(); - var originHeight = origin.outerHeight(); - var tooltipPosition = origin.attr('data-position'); - var tooltipHeight = newTooltip.outerHeight(); - var tooltipWidth = newTooltip.outerWidth(); - var tooltipVerticalMovement = '0px'; - var tooltipHorizontalMovement = '0px'; - var scale_factor = 8; - - if (tooltipPosition === "top") { - // Top Position - newTooltip.css({ - top: origin.offset().top - tooltipHeight - margin, - left: origin.offset().left + originWidth/2 - tooltipWidth/2 - }); - tooltipVerticalMovement = '-10px'; - backdrop.css({ - borderRadius: '14px 14px 0 0', - transformOrigin: '50% 90%', - marginTop: tooltipHeight, - marginLeft: (tooltipWidth/2) - (backdrop.width()/2) - - }); - } - // Left Position - else if (tooltipPosition === "left") { + origin.attr('data-tooltip-id', tooltipId); + + // Create Text span + var tooltip_text = $('').text(origin.attr('data-tooltip')); + + // Create tooltip + var newTooltip = $('
'); + newTooltip.addClass('material-tooltip').append(tooltip_text) + .appendTo($('body')) + .attr('id', tooltipId); + + var backdrop = $('
').addClass('backdrop'); + backdrop.appendTo(newTooltip); + backdrop.css({ top: 0, left:0 }); + + + //Destroy previously binded events + origin.off('mouseenter.tooltip mouseleave.tooltip'); + // Mouse In + origin.on({ + 'mouseenter.tooltip': function(e) { + var tooltip_delay = origin.data("delay"); + tooltip_delay = (tooltip_delay === undefined || tooltip_delay === '') ? options.delay : tooltip_delay; + counter = 0; + counterInterval = setInterval(function(){ + counter += 10; + if (counter >= tooltip_delay && started === false) { + started = true; + newTooltip.css({ display: 'block', left: '0px', top: '0px' }); + + // Set Tooltip text + newTooltip.children('span').text(origin.attr('data-tooltip')); + + // Tooltip positioning + var originWidth = origin.outerWidth(); + var originHeight = origin.outerHeight(); + var tooltipPosition = origin.attr('data-position'); + var tooltipHeight = newTooltip.outerHeight(); + var tooltipWidth = newTooltip.outerWidth(); + var tooltipVerticalMovement = '0px'; + var tooltipHorizontalMovement = '0px'; + var scale_factor = 8; + + if (tooltipPosition === "top") { + // Top Position newTooltip.css({ - top: origin.offset().top + originHeight/2 - tooltipHeight/2, - left: origin.offset().left - tooltipWidth - margin - }); - tooltipHorizontalMovement = '-10px'; - backdrop.css({ - width: '14px', - height: '14px', - borderRadius: '14px 0 0 14px', - transformOrigin: '95% 50%', - marginTop: tooltipHeight/2, - marginLeft: tooltipWidth - }); - } - // Right Position - else if (tooltipPosition === "right") { - newTooltip.css({ - top: origin.offset().top + originHeight/2 - tooltipHeight/2, - left: origin.offset().left + originWidth + margin - }); - tooltipHorizontalMovement = '+10px'; - backdrop.css({ - width: '14px', - height: '14px', - borderRadius: '0 14px 14px 0', - transformOrigin: '5% 50%', - marginTop: tooltipHeight/2, - marginLeft: '0px' - }); - } - else { - // Bottom Position - newTooltip.css({ - top: origin.offset().top + origin.outerHeight() + margin, + top: origin.offset().top - tooltipHeight - margin, left: origin.offset().left + originWidth/2 - tooltipWidth/2 }); - tooltipVerticalMovement = '+10px'; + tooltipVerticalMovement = '-10px'; backdrop.css({ + borderRadius: '14px 14px 0 0', + transformOrigin: '50% 90%', + marginTop: tooltipHeight, marginLeft: (tooltipWidth/2) - (backdrop.width()/2) + }); - } + } + // Left Position + else if (tooltipPosition === "left") { + newTooltip.css({ + top: origin.offset().top + originHeight/2 - tooltipHeight/2, + left: origin.offset().left - tooltipWidth - margin + }); + tooltipHorizontalMovement = '-10px'; + backdrop.css({ + width: '14px', + height: '14px', + borderRadius: '14px 0 0 14px', + transformOrigin: '95% 50%', + marginTop: tooltipHeight/2, + marginLeft: tooltipWidth + }); + } + // Right Position + else if (tooltipPosition === "right") { + newTooltip.css({ + top: origin.offset().top + originHeight/2 - tooltipHeight/2, + left: origin.offset().left + originWidth + margin + }); + tooltipHorizontalMovement = '+10px'; + backdrop.css({ + width: '14px', + height: '14px', + borderRadius: '0 14px 14px 0', + transformOrigin: '5% 50%', + marginTop: tooltipHeight/2, + marginLeft: '0px' + }); + } + else { + // Bottom Position + newTooltip.css({ + top: origin.offset().top + origin.outerHeight() + margin, + left: origin.offset().left + originWidth/2 - tooltipWidth/2 + }); + tooltipVerticalMovement = '+10px'; + backdrop.css({ + marginLeft: (tooltipWidth/2) - (backdrop.width()/2) + }); + } - // Calculate Scale to fill - scale_factor = tooltipWidth / 8; - if (scale_factor < 8) { - scale_factor = 8; - } - if (tooltipPosition === "right" || tooltipPosition === "left") { - scale_factor = tooltipWidth / 10; - if (scale_factor < 6) - scale_factor = 6; - } + // Calculate Scale to fill + scale_factor = tooltipWidth / 8; + if (scale_factor < 8) { + scale_factor = 8; + } + if (tooltipPosition === "right" || tooltipPosition === "left") { + scale_factor = tooltipWidth / 10; + if (scale_factor < 6) + scale_factor = 6; + } - newTooltip.velocity({ opacity: 1, marginTop: tooltipVerticalMovement, marginLeft: tooltipHorizontalMovement}, { duration: 350, queue: false }); - backdrop.css({ display: 'block' }) - .velocity({opacity:1},{duration: 55, delay: 0, queue: false}) - .velocity({scale: scale_factor}, {duration: 300, delay: 0, queue: false, easing: 'easeInOutQuad'}); + newTooltip.velocity({ marginTop: tooltipVerticalMovement, marginLeft: tooltipHorizontalMovement}, { duration: 350, queue: false }) + .velocity({opacity: 1}, {duration: 300, delay: 50, queue: false}); + backdrop.css({ display: 'block' }) + .velocity({opacity:1},{duration: 55, delay: 0, queue: false}) + .velocity({scale: scale_factor}, {duration: 300, delay: 0, queue: false, easing: 'easeInOutQuad'}); - } - }, 10); // End Interval + } + }, 10); // End Interval - // Mouse Out - }, - mouseleave: function(){ - // Reset State - clearInterval(counterInterval); - counter = 0; - - // Animate back - newTooltip.velocity({ - opacity: 0, marginTop: 0, marginLeft: 0}, { duration: 225, queue: false, delay: 275 } - ); - backdrop.velocity({opacity: 0, scale: 1}, { - duration:225, - delay: 275, queue: false, - complete: function(){ - backdrop.css('display', 'none'); - newTooltip.css('display', 'none'); - started = false;} + // Mouse Out + }, + 'mouseleave.tooltip': function(){ + // Reset State + clearInterval(counterInterval); + counter = 0; + + // Animate back + newTooltip.velocity({ + opacity: 0, marginTop: 0, marginLeft: 0}, { duration: 225, queue: false, delay: 225 } + ); + backdrop.velocity({opacity: 0, scale: 1}, { + duration:225, + delay: 275, queue: false, + complete: function(){ + backdrop.css('display', 'none'); + newTooltip.css('display', 'none'); + started = false;} + }); + } }); - } - }); }); }; @@ -1799,8 +1827,19 @@ $(document).ready(function(){ toast.classList.add(classes[i]); } } - toast.innerHTML = html; - + // If type of parameter is HTML Element + if ( typeof HTMLElement === "object" ? html instanceof HTMLElement : html && typeof html === "object" && html !== null && html.nodeType === 1 && typeof html.nodeName==="string" +) { + toast.appendChild(html); + } + else if (html instanceof jQuery) { + // Check if it is jQuery object + toast.appendChild(html[0]); + } + else { + // Insert as text; + toast.innerHTML = html; + } // Bind hammer var hammerHandler = new Hammer(toast, {prevent_default: false}); hammerHandler.on('pan', function(e) { @@ -1872,17 +1911,18 @@ $(document).ready(function(){ } // Add Touch Area - $('body').append($('
')); + var dragTarget = $('
'); + $('body').append(dragTarget); if (options.edge == 'left') { menu_id.css('left', -1 * (options.menuWidth + 10)); - $('.drag-target').css({'left': 0}); // Add Touch Area + dragTarget.css({'left': 0}); // Add Touch Area } else { menu_id.addClass('right-aligned') // Change text-alignment to right .css('right', -1 * (options.menuWidth + 10)) .css('left', ''); - $('.drag-target').css({'right': 0}); // Add Touch Area + dragTarget.css({'right': 0}); // Add Touch Area } // If fixed sidenav, bring menu out @@ -1935,7 +1975,7 @@ $(document).ready(function(){ } }); if (options.edge === 'left') { // Reset phantom div - $('.drag-target').css({width: '', right: '', left: '0'}); + dragTarget.css({width: '', right: '', left: '0'}); menu_id.velocity( {left: -1 * (options.menuWidth + 10)}, { duration: 200, @@ -1953,7 +1993,7 @@ $(document).ready(function(){ } else { // Reset phantom div - $('.drag-target').css({width: '', right: '0', left: ''}); + dragTarget.css({width: '', right: '0', left: ''}); menu_id.velocity( {right: -1 * (options.menuWidth + 10)}, { duration: 200, @@ -1976,11 +2016,11 @@ $(document).ready(function(){ var panning = false; var menuOut = false; - $('.drag-target').on('click', function(){ + dragTarget.on('click', function(){ removeMenu(); }); - $('.drag-target').hammer({ + dragTarget.hammer({ prevent_default: false }).bind('pan', function(e) { @@ -2059,7 +2099,7 @@ $(document).ready(function(){ if ((menuOut && velocityX <= 0.3) || velocityX < -0.5) { menu_id.velocity({left: 0}, {duration: 300, queue: false, easing: 'easeOutQuad'}); $('#sidenav-overlay').velocity({opacity: 1 }, {duration: 50, queue: false, easing: 'easeOutQuad'}); - $('.drag-target').css({width: '50%', right: 0, left: ''}); + dragTarget.css({width: '50%', right: 0, left: ''}); } else if (!menuOut || velocityX > 0.3) { // Enable Scrolling @@ -2070,14 +2110,14 @@ $(document).ready(function(){ complete: function () { $(this).remove(); }}); - $('.drag-target').css({width: '10px', right: '', left: 0}); + dragTarget.css({width: '10px', right: '', left: 0}); } } else { if ((menuOut && velocityX >= -0.3) || velocityX > 0.5) { menu_id.velocity({right: 0}, {duration: 300, queue: false, easing: 'easeOutQuad'}); $('#sidenav-overlay').velocity({opacity: 1 }, {duration: 50, queue: false, easing: 'easeOutQuad'}); - $('.drag-target').css({width: '50%', right: '', left: 0}); + dragTarget.css({width: '50%', right: '', left: 0}); } else if (!menuOut || velocityX < -0.3) { // Enable Scrolling @@ -2088,7 +2128,7 @@ $(document).ready(function(){ complete: function () { $(this).remove(); }}); - $('.drag-target').css({width: '10px', right: 0, left: ''}); + dragTarget.css({width: '10px', right: 0, left: ''}); } } @@ -2105,13 +2145,15 @@ $(document).ready(function(){ // Disable Scrolling $('body').css('overflow', 'hidden'); - + // Push current drag target on top of DOM tree + $('body').append(dragTarget); + if (options.edge === 'left') { - $('.drag-target').css({width: '50%', right: 0, left: ''}); + dragTarget.css({width: '50%', right: 0, left: ''}); menu_id.velocity({left: 0}, {duration: 300, queue: false, easing: 'easeOutQuad'}); } else { - $('.drag-target').css({width: '50%', right: '', left: 0}); + dragTarget.css({width: '50%', right: '', left: 0}); menu_id.velocity({right: 0}, {duration: 300, queue: false, easing: 'easeOutQuad'}); menu_id.css('left',''); } @@ -2454,7 +2496,7 @@ $(document).ready(function(){ var input_selector = 'input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], input[type=number], input[type=search], textarea'; $(input_selector).each(function(index, element) { if ($(element).val().length > 0 || $(this).attr('placeholder') !== undefined || $(element)[0].validity.badInput === true) { - $(this).siblings('label, i').addClass('active'); + $(this).siblings('label').addClass('active'); } else { $(this).siblings('label, i').removeClass('active'); @@ -2471,7 +2513,7 @@ $(document).ready(function(){ // Add active if form auto complete $(document).on('change', input_selector, function () { if($(this).val().length !== 0 || $(this).attr('placeholder') !== undefined) { - $(this).siblings('label, i').addClass('active'); + $(this).siblings('label').addClass('active'); } validate_field($(this)); }); @@ -2510,10 +2552,14 @@ $(document).ready(function(){ if ($inputElement.val().length === 0 && $inputElement[0].validity.badInput !== true && $inputElement.attr('placeholder') === undefined) { $inputElement.siblings('label, i').removeClass('active'); } + + if ($inputElement.val().length === 0 && $inputElement[0].validity.badInput !== true && $inputElement.attr('placeholder') !== undefined) { + $inputElement.siblings('i').removeClass('active'); + } validate_field($inputElement); }); - validate_field = function(object) { + window.validate_field = function(object) { var hasLength = object.attr('length') !== undefined; var lenAttr = parseInt(object.attr('length')); var len = object.val().length; @@ -2527,7 +2573,7 @@ $(document).ready(function(){ else { if (object.hasClass('validate')) { // Check for character counter attributes - if ((object.is(':valid') && hasLength && (len < lenAttr)) || (object.is(':valid') && !hasLength)) { + if ((object.is(':valid') && hasLength && (len <= lenAttr)) || (object.is(':valid') && !hasLength)) { object.removeClass('invalid'); object.addClass('valid'); } @@ -2590,20 +2636,24 @@ $(document).ready(function(){ } }); - $('body').on('keyup keydown', text_area_selector, function () { + $('body').on('keyup keydown autoresize', text_area_selector, function () { textareaAutoResize($(this)); }); // File Input Path - $('.file-field').each(function() { - var path_input = $(this).find('input.file-path'); - $(this).find('input[type="file"]').change(function () { - path_input.val($(this)[0].files[0].name); - path_input.trigger('change'); - }); - }); + $(document).on('change', '.file-field input[type="file"]', function () { + var file_field = $(this).closest('.file-field'); + var path_input = file_field.find('input.file-path'); + var files = $(this)[0].files; + var file_names = []; + for (var i = 0; i < files.length; i++) { + file_names.push(files[i].name); + } + path_input.val(file_names.join(", ")); + path_input.trigger('change'); + }); /**************** @@ -2625,7 +2675,7 @@ $(document).ready(function(){ thumb.find('.value').html($(this).val()); }); - $(document).on('mousedown touchstart', range_type, function(e) { + $(document).on('input mousedown touchstart', range_type, function(e) { var thumb = $(this).siblings('.thumb'); // If thumb indicator does not exist yet, create it @@ -2691,9 +2741,8 @@ $(document).ready(function(){ left = width; } thumb.addClass('active').css('left', left); - + thumb.find('.value').html(thumb.siblings(range_type).val()); } - }); $(document).on('mouseout touchleave', range_wrapper, function() { @@ -2725,7 +2774,7 @@ $(document).ready(function(){ // Tear down structure if Select needs to be rebuilt var lastID = $select.data('select-id'); if (lastID) { - $select.parent().find('i').remove(); + $select.parent().find('span.caret').remove(); $select.parent().find('input').remove(); $select.unwrap(); @@ -2783,7 +2832,10 @@ $(document).ready(function(){ if ( $select.is(':disabled') ) dropdownIcon.addClass('disabled'); - var $newSelect = $(''); + // escape double quotes + var sanitizedLabelHtml = label.html().replace(/"/g, '"'); + + var $newSelect = $(''); $select.before($newSelect); $newSelect.before(dropdownIcon); @@ -3204,7 +3256,7 @@ $(document).ready(function(){ $(document).ready(function() { $(document).on('click.card', '.card', function (e) { - if ($(this).find('.card-reveal').length) { + if ($(this).find('> .card-reveal').length) { if ($(e.target).is($('.card-reveal .card-title')) || $(e.target).is($('.card-reveal .card-title i'))) { // Make Reveal animate down and display none $(this).find('.card-reveal').velocity( @@ -3225,6 +3277,14 @@ $(document).ready(function(){ }); + }); +}( jQuery ));;(function ($) { + $(document).ready(function() { + + $(document).on('click.chip', '.chip .material-icons', function (e) { + $(this).parent().remove(); + }); + }); }( jQuery ));;(function ($) { $(document).ready(function() { @@ -3530,7 +3590,7 @@ $(document).ready(function(){ var currentElement = document.querySelector(selector); if ( currentElement !== null) { - var elementOffset = currentElement.getBoundingClientRect().top + document.body.scrollTop; + var elementOffset = currentElement.getBoundingClientRect().top + window.pageYOffset; if (windowScroll > (elementOffset + offset)) { if (value.done !== true) {