Giter VIP home page Giter VIP logo

Comments (13)

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

Ah, now I get what your after. Try this:

duplicator.on('constructshow.duplicator', 'li', function(event) {});

(where duplicator is the .frame element)

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

And to explain this a bit more: As the Duplicator instances are added dynamically we use delegated events on the wrapper (the element with the class .frame). In order to make delegation work, the instance has to be added to the DOM already (otherwise it's not a child of the Duplicator). constructstart is fired before the instance is added, constructshow fires after the instance has been added, but right before it gets visible.

from customfieldcaptions.

brendo avatar brendo commented on June 18, 2024

For future proofing, should the event actually be fired on what you pass to the plugin? Attaching to .frame means that other plugins have to know the markup that the duplicator creates.

So at the moment we do:

contents.find('.filters-duplicator').symphonyDuplicator();

To then listen for the event we'll have to go:

contents.find('.filters-duplicator .frame').on('constructshow.duplicator', 'li', function(event) {});

Which means we are always assuming a .frame element and li elements are created by the plugin. If this markup changes in the future, all plugins will need to be updated again. I think we should be able to do:

contents.find('.filters-duplicator').symphonyDuplicator().on('constructshow.duplicator', function() {})

The callback would then provide the instance that was changed. This seems to be the case with all the other events in the Duplicator plugin, except for the constructor? Is there any reason why it's different for that one?

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

admin.js still uses the old API. Actually it's not .filters-duplicator .frame but .frame .filters-duplicator. It's all a bit messy at the moment to support older extensions.

from customfieldcaptions.

brendo avatar brendo commented on June 18, 2024

Can't seem to get this work either:

    jQuery('.frame').on('constructstart.duplicator', 'li', function(event) {
        console.log(event);
    });

Oh, and just realised that .frame actually wraps around the element that you make into a duplicator, so contents.find('.filters-duplicator .frame') would not work either. This seems to be more fragile as it you then are relying on there only being one .frame/duplicator to be on the page at any one time.

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

You need constructshow.

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

You can't expect a delegated event to be fired, when the the element you are looking for has not been attached to the DOM yet.

from customfieldcaptions.

brendo avatar brendo commented on June 18, 2024

Doh, sorry, didn't refresh the page to see your other comment.

Still, do you think we could also trigger this on the object to make this consistent with the other events the duplicator fires?

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

The only problem is that this will break extension compatibility.

from customfieldcaptions.

brendo avatar brendo commented on June 18, 2024

Can we do both?

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

We could try to trigger new events from the old ones, but I'm not sure if this will work consistently. The main problem is that the old Duplicator bundled a lot of options we don't need anymore and that 2.3 uses the unified .frame element that didn't exists in older Symphony versions – that's why we have a difference between duplicator and object. The current code is just a first step in the right direction so there is a lot room for improvement.

from customfieldcaptions.

brendo avatar brendo commented on June 18, 2024

Not so much trigger new events from the old ones, but here and here, if we added object.trigger('constructstart/show.duplicator', [instance]); wouldn't this allow new extensions to listen to these events, and still allow the old extensions to work as well (so don't remove the current triggers)?

from customfieldcaptions.

nilshoerrmann avatar nilshoerrmann commented on June 18, 2024

Ah, right, that would work of course, but it makes things a bit more complex. We'd have to deprecate the old events to make clear which to use in the future.

One general thing that is important to know is that:

  • using the new API object === duplicator === .frame
  • using the old API object !== duplicator
    but duplicator === .frame and object === duplicator > ol

In general: Things would be much easier if we could forget about compatibility. A soon as we can remove the old API in Symphony 2.4 things will become a lot more readable again.

from customfieldcaptions.

Related Issues (13)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.