Template Component with Action Framework!

edited June 25, 2020 in Ideas
This one started off as a simple task I had to do, and ended up being rather complicated.

I had to make icons placed on a skuid page redirect, when clicked, to another page.

Simple enough right? Well I would have liked to use an image component, and run Action Framework actions when the image was clicked, however the image component can't currently do that. I suppose I could have given the images a special class and jQueried an event handler onto them, but that would have been messy...

So I did it initially with a stock Template component, with the "Allow HTML" option checked, adding a href around my img tag pointing to my page's URL. I was satisfied to some extent with that. There was quite a bit of HTML clutter in the template though, and despite the href giving me the nice mouse-over indicator in chrome like so: 

image

(bottom left of browser window when you hover over a link), the whole thing wasn't very declarative, and still didn't accommodate Action Framework Events.

So, simply, I made an Action Framework-able Template Component!

It assumes that if you are firing Action Framework Events with a mouseClick that you want the resulting template to have the 
cursor: pointer; 
CSS set to make it look like a clickable URL.

DEMO: 
Part 1: the builder! 




Please visit https://github.com/mBlazonry/mBlazonrySupport  for installation instructions, 
updated instructions, new versions of this and other components!

Cheers, A.
4
4 votes

Implemented · Last Updated

Comments

  • edited October 15, 2019
    Nice!
  • Karen WaldschmittKaren Waldschmitt 🛠️ 
    edited March 2, 2017
    Andreas~

    Cool component!

    Thanks for sharing :)
    Karen
  • Barry SchnellBarry Schnell 💎💎
    edited February 25, 2017
    Awesome work Andreas!
  • edited June 25, 2020
    Hey Andreas

    I think this may have stopped working in the latest release of Brooklyn, v 9.3.3. Any ideas?

    Andy
  • Pat VachonPat Vachon 💎💎💎
    edited January 26, 2017
    Hi Andy, Andreas is aware of issue. We're looking into ASAP as we as well make use of the component. Pat
  • edited March 22, 2017
    Hey Andy, I uploaded a new version of the component pack fixing some issues with the builder side of things and making the pack leaner. Please update and let me know if the issue you're having persists.

    Our org also runs skuid v9.3.3 and template tested fine. Please post a screencap/video detailing the issue next time if you can. Cheers

    Edit: I finally managed to replicate the issue. Our event handler isn't binding properly. I'm working on it
    Edit: New version of the template component up!
  • edited October 20, 2017
    New mB Template version is context-aware! See the "Context" tab in the builder UI to set context-specific conditions.
  • edited March 22, 2017
    nicely done! thanks for the update Andréas.
    (I find myself using this custom component over Skuid's default one more-and-more often)
  • edited March 27, 2017
    Thanks Andréas!
  • edited April 5, 2017
    Thanks so much for this Andréas!  Quick question - I just downloaded/installed the component and I'm not seeing the Context tab in the builder UI.  Is this the most recent version of the components pack: mblazonryComponents-min-c622f71d-release.zip?
  • edited January 26, 2018
    Hi William, yes that's the latest version. The Context Tab will only appear in the builder Ui when you're working with a context-specific situation (such as a popup).

    Here's a quick walkthrough illustrating this:


  • edited April 5, 2017
    Perfect, makes sense.  Thanks again!  Loving this component.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!