Git Product home page Git Product logo

Comments (9)

seeekr avatar seeekr commented on August 27, 2024

Great you enjoy it!

Currently it's not possible. But since your post I've started playing around with an implementation for that. Haven't figured it out fully yet, but it looks like it's doable.
Will comment here when there's something ready to test!

from blaze-magic-events.

mordrax avatar mordrax commented on August 27, 2024

That's great to hear!

I've had a smashing time replacing all my jQuery imperative code with this magic function. This is SOOOO much cleaner than finding elements via #id .class etc... felt like I was going backwards from angular land.

from blaze-magic-events.

seeekr avatar seeekr commented on August 27, 2024

I think it's accomplished. Check out the latest version from Github here and pull that into your project (basically clone it either directly into your app's packages folder or clone it somewhere else and then symlink it and meteor will pick that version up before looking on atmosphere). See if it works and doesn't break anything. I've done some basic sanity checks but nothing beyond that, with code changes being minimal. So there's a good chance it just works :)

The syntax (see README.md) I'm not 100% happy with, but don't have a better idea right now. I'm referring to the order of the arguments to the "sort of merged" version of this event handler / helper hybrid aka "magic helper". Because it still needs to have event and templateInstance as parameters, but now we have additional custom parameters. Going with e, t first seems like more straightforward because it's still an event handler in the Meteor sense and as such should probably adhere to parameter ordering as with regular event handlers.

Ideally I imagine it would be great if it could be automatically recognized if the function needs and expects the event and templateInstance parameters and if not, just pass in the helper arguments first, without requiring unused e, t declarations.
(If you can't fully follow it's no problem, just take this as "thinking out loud to myself" :) )

from blaze-magic-events.

mordrax avatar mordrax commented on August 27, 2024

This is very nice! I'm able to not only pass in constant strings, basic parameters but also any arbitrary objects and function results from helpers!
I want to look at how this magic works but I fear I will go bat shit crazy!

There is one artifact argument at the end, something to do with blaze that gives you an additional argument. Had me debugging my code for a day earlier this week, if you were to put e, t at the end, it will be confusing, arg1, arg2, artifact, e, t. As it is now, we just get e, t for free and then our args, I'm a happy man already.

Aside: The reason why I wanted this was because I'm doing this:

//template
.btn.btn-primary.btn-xs(data-id="{{_id}}" onclick="{{addScript}}") {{name}}

//js
'addScript': function (evt, t) {
    var script = db.Scripts.findOne($(evt.target).data('id'));
});

and I want to do this:

//template
.btn.btn-primary.btn-xs(onclick="{{addScript _id}}") {{name}}

//js
'addScript': function (evt, t, id) {
    var script = db.Scripts.findOne(id);
});

However, just earlier today someone told me I could do this:

'addScript': function (evt, t) {
    var script = db.Scripts.findOne(this.id));
});

because in a +each loop, the this context of a event gets extended with the actual object it's looping over! I did not know this!!!

But now I've found another use for having parameters

.btn.btn-primary.btn-xs(onclick="{{updateScript -1}}") {{name}}
.btn.btn-primary.btn-xs(onclick="{{updateScript 1}}") {{name}}
.btn.btn-primary.btn-xs(onclick="{{updateScript 'delete'}}") {{name}}

This is awesome, I shall shout it out to the world!

from blaze-magic-events.

seeekr avatar seeekr commented on August 27, 2024

Glad you've learned and solved some things! Yeah, the Spacebars.kw parameter can make for unexpected outcomes. It's there so you can pass in things in a key=value fashion to helpers, but it's rarely used and so it's easy to forget what it's there for and that it is there in the first place.

from blaze-magic-events.

mordrax avatar mordrax commented on August 27, 2024

I'm unable to pass NaN, undefined, null into the magic functions

.btn(onclick="{{doSomething null NaN}}")

I'm thinking this is more a spacebars related constraint?

from blaze-magic-events.

seeekr avatar seeekr commented on August 27, 2024

null, NaN, undefined are not defined in Spacebars, so they evaluate to "helper missing" which is passed on as a null value to your doSomething helper in this case. If you define a helper that returns either of those I would have guessed that Spacebars would pass on exactly that value. But just checked it and it doesn't, it just passes null in all of those cases. And it sort of makes sense. The template-related part of your code should really not distinguish between all those null-ish/invalid values. Rather use meaningful values or compact multiple helpers into a single one that does more involved/precise computations without exposing things like NaN and undefined to template code.
Makes sense?

from blaze-magic-events.

seeekr avatar seeekr commented on August 27, 2024

0.0.4 is out on atmosphere, closing this issue!

from blaze-magic-events.

mordrax avatar mordrax commented on August 27, 2024

Great to hear, sorry I forgot to reply to your comment, read and agreed with it. This should be in core, it's changed all my templates' workflows, thanks for making this package.

from blaze-magic-events.

Related Issues (7)

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.