Skip to content

Issues with Imgur images in Fancybox chat module

Bugs

11/12

12 May 2023, 20:10

Related Topics
  • Fancybox zoom

    Unsolved Customisation 24 Sept 2024, 20:38
    0 Votes
    2 Posts
    59 Views

    @DownPW Technically, it should be possible with the addition of the below

    Toolbar: { display: { left: ["infobar"], middle: [ "zoomIn", "zoomOut", "toggle1to1", "rotateCCW", "rotateCW", "flipX", "flipY", ], right: ["slideshow", "thumbs", "close"], }, },

    Meaning your code block becomes

    function fancybox() { if (top.location.pathname !== '/login') { $(document).ready(function() { $('a').not('.forum-logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { $('a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"], a[href*=".svg"]').addClass("noanimate"); }); }); Fancybox.bind( 'a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"], a[href*=".svg"]', { Toolbar: { display: { left: ["infobar"], middle: [ "zoomIn", "zoomOut", "toggle1to1", "rotateCCW", "rotateCW", "flipX", "flipY", ], right: ["slideshow", "thumbs", "close"], }, }, } ); } }

    Note, that you just need to add/remove the elements in the toolbar you do not need. Obviously, zoomIn and zoomOut are the ones you are specifically interested in. However, if Fancybox detects that the image has already been zoomed as far as possible, then this will not work. You’d need an external library such as zoom.js to add this functionality, or perhaps simpler

    https://www.jacklmoore.com/zoom/

    A good example of how you’d make these two independent libraries work together is below

    https://codepen.io/ezra_siton/pen/VgrjKw

    It’s worth nothing that this specific code is based on Fancybox 3, so may need to be refactored to work with the latest version 5.

  • Loading Image Problem

    Bugs 21 Dec 2023, 05:13
    6 Votes
    24 Posts
    2k Views

    Thank you Mark.

  • 4 Votes
    7 Posts
    767 Views

    @phenomlab oh no, that is 1 cent on the video, but you are right, symbols are similar… I just converted it to $1 , since it is more intuitive in daily life…

  • Permission issues

    Solved Bugs 5 Jul 2023, 10:17
    2 Votes
    8 Posts
    467 Views

    @Panda I forked this topic out of the previous thread as it’s an issue in it’s own right. Having checked, I see the reason why

    06d082f0-6c7d-443b-98bc-94db5f3e5d0e-image.png

    As you can see from the screenshot, category “Announcements” does not permit editing. This specific category was originally read only, which I then changed to members could reply. Looks like I forgot to add the right to edit 😕

    Should be fixed now

    a533d8ff-23f1-432e-a4a6-3d10cb05a46d-image.png

  • 4 Votes
    3 Posts
    356 Views

    EDIT: Sorry all, I found a bug that causes Fancybox to be bound twice.

    Please remove the original functions I provided (the original post has been updated for anyone who did not use the original code and is new here) and replace with just this block

    // Chat fancybox - fires when chat module loaded and AJAX calls new chat $(document).ready(function() { $(window).on('action:chat.loaded', function(data) { this.$('img').not('.forum-logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { var newHref = $(this).attr("src"); $(this).wrap("<a class='fancybox' href='" + newHref + "'/>"); $('a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"]').addClass("noanimate"); data.preventDefault(); // Strip out the images contained inside blockquotes as this looks nasty :) $('blockquote img').remove(); }); Fancybox.bind( 'a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"]', { groupAll: true, } ); }); });
  • 5 Votes
    29 Posts
    3k Views

    @phenomlab said in nodebb chat roll dice game:

    @DownPW I still think you could do something much quicker with jQuery.

    Why not but like I said, I have no skills to do that.

    If you are motivated, why not but I don’t want to bother you especially since it will only be for a certain period of time.

  • 3 Votes
    6 Posts
    1k Views

    @phenomlab

    haha!!
    You are crazy. In a good way, of course 🙂

    It’s a way of saying you’re awesome !

  • 6 Votes
    16 Posts
    976 Views

    And it seems to be less conflicting!