feat(popover): support template url for partial #220

Closed
0fork opened this Issue Mar 13, 2013 · 328 comments

Comments

Projects
None yet

0fork commented Mar 13, 2013

As requested in #202 by @joshdmiller here's my request for external partial support for popover which would make popover much more versatile and lower the need of duplicate code in the apps. Already working implementation can be found in one of the "competing" Bootstrap implementations at http://mgcrea.github.com/angular-strap/#/popover.

Member

joshdmiller commented Mar 13, 2013

I'm thinking just <a popover popover-template="{{templateUrl}}">Open Me</a> would work well.

The issue we'll need to solve for, however, is getting the scope right. The tooltip and popover use child directives with isolate scopes, so we may have to do some transclusion magic to get this to work as expected. Thoughts?


FWIW - AngularStrap isn't really a "competing implementation" as it's not an "implementation" at all - it just wraps the original jQuery. We can't really translate what they do back here; we really have to re-engineer the original Bootstrap plugins to be in line with the "Angular Way".

0fork commented Mar 15, 2013

I have to confess that I'm not familiar enough to give you any advice on scope. My directives so far has been so basic that I haven't had to deal with them, or transclusion. But I think that transclusion might be problematic if you need A LOT of popovers for different elements. I'm not worried that much about desktop but tablets worry me when it comes to doing a lot of binding etc.

jhiemer commented Apr 4, 2013

Hi,
I took a look into the last commits. The tooltip has the option of loading external content now. In the demo files I could not find any reference to that for popover. Does this work at well?

Member

joshdmiller commented Apr 4, 2013

@jhiemer The tooltip now supports putting HTML into the tooltip text to be unsafely included into the template. The popover doesn't. However, this issue is for external templating or partial support for the popover. i.e.:

<a tooltip-html-unsafe="<strong>Hello!</strong">Hover!</a>

versus

<button popover-template="'partial.tpl.html'">Click me!</button>

It doesn't make any sense, I don't think, to do partials for tooltips, but we can do HTML content in the popover with a fairly simple code change.

jhiemer commented Apr 4, 2013

@joshdmiller I think doing partials for tooltips is not necessary as well. Perhaps there might be some usecases, but the main usage scenarios will cover just plain text. For the popover instead I see many different usage scenarios. For example I got a date picker, which could be put into the popover as well as a color picker.

Which changes would be necessary?

jhiemer commented Apr 10, 2013

@joshdmiller any update on this?

Member

joshdmiller commented Apr 11, 2013

@jhiemer Sorry - I remember responding to this days ago... insanity can be inconvenient.

To implement an independent template, we need to decide on a few things:

Syntax

I think something like this:

<button popover popover-template="'partial.tpl.html'">Click me!</button>

Template

The popover default is this:

<div class="popover {{placement}}" ng-class="{ in: isOpen(), fade: animation() }">
  <div class="arrow"></div>

  <div class="popover-inner">
      <h3 class="popover-title" ng-bind="title" ng-show="title"></h3>
      <div class="popover-content" ng-bind="content"></div>
  </div>
</div>

Should we just, in essence, transclude the contents into the popover-inner element? Or is that too generic? We could also do it in popover-content to keep the default popover design from Twitter.

Scope

In which scope is the template compiled? A new sibling of the directive makes sense to me.

jhiemer commented Apr 11, 2013

@joshdmiller thanks for getting back at this. Essentially I think the provided code could be what I am looking for. I created two examples of small directives which I would like to put into a popover and which you can see here: http://plnkr.co/PQOWFO and here: http://plnkr.co/99HHNd.

Both cases would need to access the parent scope. This issue #315, is reaching for something similar I guess.

jhiemer commented Apr 16, 2013

@joshdmiller do you have a working version of your changes where I might take a look at?

any news on this one ?

jhiemer commented Apr 24, 2013

+1

Member

joshdmiller commented Apr 27, 2013

I just opened a PR for the custom triggers and it changes the $tooltip service somewhat significantly so I won't push this until that PR goes through. But for those curious, here's a rough implementation: http://plnkr.co/edit/RTpGfZG0cl069nkqmm14?p=preview

jhiemer commented Apr 27, 2013

@joshdmiller took a look at it. When I create a real template file, the contents still renders as mypopover.tpl.html so it does not seem to get loaded. Could that be right?

Member

joshdmiller commented Apr 27, 2013

Damn! There seems to a bug in Plunker - I lost a ton of work! I opened a bug report - filearts/plunker#39.

Anyway, here it is re-created: http://plnkr.co/edit/JgeUP0anaU4BmsS5cJNh?p=preview. Can you give it another go?

@joshdmiller this doesn't seem to work for me, I'm getting "Error: selectors not implemented"...

Member

joshdmiller commented Apr 27, 2013

I'm not surprised it doesn't work - there are files missing! Now I'm very frustrated. Plunker's not keeping my most recent changes. This has happened twice now on this same issue - and I re-created it from scratch!

I re-created the changes once again, but it still won't save the changes I'm making even though it tells me it does. I'll just submit a PR later and we can go from there...

Yeh, this happened to me couple of times as well... Now I'm using plunker for rather simple experiments only...

jhiemer commented Apr 27, 2013

Great, waiting for it @joshdmiller. After you submitted it I will review it asap.

Member

joshdmiller commented May 3, 2013

Has anyone had a change to look at #369?

jhiemer commented May 4, 2013

Hi,
taking a detailed look at it today!

jhiemer commented May 4, 2013

@joshdmiller ok took a first look. When using the inline templates it works as expected. When I try to include templates from 'partials/entity/test.html' I get a large digest(); error.

Is this not allowed to load external urls? I think loading external stuff would be great, as I would enable us to put the datepicker directive of @bekos into the popover.

Member

joshdmiller commented May 4, 2013

@jhiemer Can you post a Plunker? It works for me: http://plnkr.co/edit/Mmq5dPi6MIYeEMoCrYSB?p=preview

jhiemer commented May 4, 2013

@joshdmiller indeed you are right. I found the bug. It was an error on my side. Need to do some scope testing now, but I feel comfortable with the solution by now.

jhiemer commented May 4, 2013

Good, did some further test. Exactly what I was looking for...will try the datepicker now.

madhums commented May 7, 2013

+1

aasif commented May 21, 2013

+1

Does the popover template work now ? None of the above plunkr work for me.

Does the popover template work now ? None of the above plunkr work for me.

I think the only pull request for this (that I've found) is #369, and it is yet to be merged. So no, it doesn't work yet.

gunta commented Jun 11, 2013

++1

sunild commented Jun 12, 2013

If anyone is interested, I've forked this project and and merged pull request #369 from @joshdmiller here. Or you can just clone Josh's repo, and pull down his branch named issue220 from about a month ago. The difference being my fork includes all of the changes that occurred in the last month. It works quite well, thanks to all involved!

Member

joshdmiller commented Jun 12, 2013

Just an update: the reason this hasn't been merged is threefold: (1) it's missing tests, though that's not much of an issue; (2) there is a memory leak because the second scope is not destroyed, which is also trivial to fix; and (3) there is a wicked, pernicious little bug that causes scope methods to evaluate only the first time (see the Plunker in PR #369). I am not sure what's causing the bug and haven't had time to dive into it in great detail.

+1 Thanks for the update. ETA on fixing those issues?

+1

Would love to see this feature!

+1

jhiemer commented Jun 27, 2013

@joshdmiller and @pkozlowski-opensource I created a demo with Datepicker and Popover which can be found here:

http://plnkr.co/edit/WtiLvfCsTR4sr0140ke0?p=preview

There two issues I have:

  • The scoping feels really hacky.
  • When the popup was closed and reopened, I am not able to select a date anymore.

johnobe commented Jun 28, 2013

@jhiemer I encountered the same issue you did with the binding not working after the popover had been closed and reopened.

I was able to workaround this by hiding the tooltip using CSS instead of removing it from the DOM. I'm not sure why removing it from the DOM is an issue, I may investigate it more later.

I forked your Plunker, updated lines 1867 and 1869 where I changed tooltip.remove() to tooltip.css('display', 'none'). After that, the binding will work after opening and closing the popover.

You can see the Punker at http://plnkr.co/edit/d73cqVAsRMiAjHh6lkXw?p=preview

jhiemer commented Jul 1, 2013

@johnobe great fix, thanks! Did you get managed to close the popover after date selection?

johnobe commented Jul 2, 2013

@jhiemer I haven't tried that in your Plunker example yet. What I did in the app I am working on is I declared a custom trigger on the popover (see PR #553). Once the trigger was created, I created a directive that would use this trigger to close the popover.

dotcom9 commented Jul 5, 2013

Looks like some interesting work is going on here. I need a tooltip that is capable of showing a partial that has been compiled against the current scope. Is any of this going to happen?

Is the popover-html-unsafe directive going to be in the normal angular-ui or should I get a version that you guys have been working on with it included?

vuldin commented Jul 22, 2013

@jhiemer Thanks for your changes and working example. It is exactly the type of solution I was looking for when I found this issue. I've imported the files used in the plunker (http://plnkr.co/edit/d73cqVAsRMiAjHh6lkXw) to get the functionality.

Looking forward to when this issue is resolved, as manually pulling in libraries breaks my automated build process.

Contributor

ajoslin commented Jul 27, 2013

@pkozlowski-opensource isn't this added in master?

@ajoslin nope, sadly. There was WIP but I don't think it is finished. So not ready to be merged IMO.

Thanks for your works. I looked at address http://plnkr.co/edit/d73cqVAsRMiAjHh6lkXw?p=preview . My suggestion is only tt-load-template-in-sibling directive is not required.

tt-load-template-in-sibling="{{template}}"
same effect as
ng-include="template"

Another little change: ng-model="$parent.$parent.entity.endDate" to ng-model="$parent.$parent.$parent.entity.endDate"

Plunker Link: http://plnkr.co/edit/02nnwt?p=preview

madmed88 commented Aug 6, 2013

instead of writing the html in the attribute it will be nice to just reference an existing item in the DOM via its id. jquery mobile does this.

Member

c0bra commented Aug 8, 2013

+1

Contributor

scamden commented Aug 8, 2013

+1 could really use this functionality

hrasoa commented Aug 16, 2013

+1

thvd commented Aug 16, 2013

+1, looks like there is demand for this feature!

sathify commented Aug 16, 2013

+1

sym3tri commented Aug 16, 2013

+1

+1

+1

jloper3 commented Aug 20, 2013

I was able to achieve the requested feature using $dialog, and styling it as a popover.
Grab $event from ngclick and use it to position the dialog/popover.

@jloper3 I was thinking about doing something similar with new $modal service. I haven't really had time to play with it but it makes me curious if this isn't just the right way to handle absolutely positioned elements.

@pkozlowski-opensource, before I bother with this does it seem like overkill to go this route? I'm mixed on whether a popover really needs its own service instance, but it seems like wrapping the service in a directive would allow significantly more control over popover behavior. Thoughts?

jloper3 commented Aug 20, 2013

@hall5714 I feel you. Feels pretty cruddy, and its a pain managing scope. Just trying to get things done.
Unfortunately I'm not at the level where I feel I could rewrite this as a directive without throwing my current project timeline off track.
I question though, if you were to implement this, when would you ever use $dialog or $modal? A popover as a directive would trump both of those in usability and code cleanliness IMO.

@jloper3 Well that gets us into a bit of UI theory rather than use-cases and slightly derails this issue, but I'll give you a basic rundown on my personal ideas:

A tooltip is intended for a minor attention-getter. It should be non-interactive and only display minimal information. My most recent use-case was to show where the save button is when activity on an application stops for X amount of time if the user had never saved anything. A popover is intended for an interactive attention getter that you can choose to ignore. For example the editable directive I wrote will eventually have a popover option for quick changes to small amounts of data.

A modal is an interactive feature that requires the user intervene. If a modal appears, I MUST do something (either take action in the modal or cancel it) in order to continue what I was doing. An ordering system with line items, and each item requires filling out a form would be a good example of where a modal comes into play. I can't save the form while I'm actively adding an item, so the modal prevents that by disallowing me from doing just that without saving or canceling the add.

This isn't to say this is the right way of doing things, it's simply my personal theory and should be taken with a grain of salt. That said, even if popover was implemented via the $modal service, it certainly wouldn't have the degree of control that $modal has, because you simply aren't going to be doing a huge multi-part form in a popover. Well... you probably shouldn't anyway 😄.

jloper3 commented Aug 20, 2013

@hall5714 I agree to some extent. I get the delineation of non interactive tool tips, but a use case doesn't necessarily have to map to a code base. A single code base can satisfy multiple use cases. In this case, interactive pop ups. Whether that's a modal or a popover is just another name.
Same here with the salt...

Xeroday commented Aug 24, 2013

+1

+1

@ghost

ghost commented Sep 7, 2013

Code Bounty

  • Comment edited * : Sorry, I misunderstood the intent of @jperl.

wow, $5, how generous :-)

jperl commented Sep 8, 2013

@yappli It's more of a gesture, like buying a beer.

@jperl : Sorry, I edited my comment. I thought your message was spam.
I understood the concept now (A short explanation in the pic could help I think).

Thanks @jperl to try to solve this issue.

Did this make it in anywhere? Would be fantastic to just specify a popover-template="url.html".

Contributor

jbruni commented Sep 19, 2013

I also wanted HTML in my popovers. I've accomplished it by overriding the popover template:

<scrlpt id="template/popover/popover.html" type="text/ng-template">
  <div class="popover {{placement}}" ng-class="{ in: isOpen(), fade: animation() }">
    <div class="arrow"></div>

    <div class="popover-inner">
      <h3 class="popover-title" ng-bind="title" ng-show="title"></h3>
      <div class="popover-content"><ng-include src="content"></ng-include></div>
    </div>
  </div>
</script>

The only change from the original template is at the popover-content line.
(side note: I'm writing "scrlpt" tag instead of "script" because GitHub was not highlighting the syntax properly, handling HTML as JavaScript)

How do I use it? I define the popover message HTML as a template:

<scrlpt id="message.html" type="text/ng-template">
  <p>Here comes the <b>HTML</b> popover contents!!!</p>
</script>

And pass the template name as the popover attribute:

<button popover="message.html" class="btn">Example</button>

This works for me. Of course, it is overriding the popover attribute meaning (the "content" is interpreted as "templateUrl")... I'm sharing it anyway, may be useful to others, who can keep tweaking it further.

(Note: you don't need to define your popover template like above. Just think that popover attribute now works exactly as a templateUrl.)

Thanks.

@jbruni thanks, this works. Is there a way to make bindings still work? Example being I'm trying to bind an input using ng-model, and it doesn't look like the bindings are working. I imagine this is because ng-include is creating a child scope.

Will keep investigating.

jloper3 commented Sep 19, 2013

Here is my, admittedly ugly, way of doing it:
https://gist.github.com/jloper3/6366256
On Sep 19, 2013 9:53 AM, "Dave Ackerman" notifications@github.com wrote:

@jbruni https://github.com/jbruni thanks, this works. Is there a way to
make bindings still work? Example being I'm trying to bind an input using
ng-model, and it doesn't look like the bindings are working. I imagine
this is because ng-include is creating a child scope.

Will keep investigating.


Reply to this email directly or view it on GitHubhttps://github.com/angular-ui/bootstrap/issues/220#issuecomment-24740088
.

Contributor

jbruni commented Sep 19, 2013

@dmackerman Indeed, my sharing is only of a very quick and simple workaround to allow "static" HTML inside the popover, without the need of modifying angular-ui-bootstrap code - just using as it is right now.

Bindings would be a whole new chapter...

Contributor

jbruni commented Sep 19, 2013

@dmackerman and guys, I've managed to make it happen... here it is:
https://gist.github.com/jbruni/6629714

This was done without changing AngularJS UI Bootstrap code, and without overriding its templates. It just works, as an extension.

BUT the workaround to "inject" the original scope into the tooltip is terrible. As far as I can see, the only way to make a cleaner code would be by changing AngularJS UI Bootstrap code. Someone could transform this in a PR, making what is necessary to avoid this "trick" to "inject" the scope.

@pkozlowski-opensource... any advice to transform this Gist into a PR? Specifically: a way to pass the "popoverTemplate" directive scope into the "popoverTemplatePopup" directive? Maybe adding a fourth parameter to the "$tooltip" function so it can make the scope available to the "popup" directive?

Also... the template is almost identical to the original popover one... this code duplication may be unnecessary...

I've looked at PR #369, but I have not tested it. But I see something related to "sibling" there... I am using the popover appended to the body... how could something based on "sibling" work in this case? As I've said, I have not tested, I can't tell, but it seems to me that a "sibling" approach would fail for an "appended to body" popover...

Nevermind. Thanks!

Contributor

jbruni commented Sep 19, 2013

@codebountycharlie - Am I eligible to the dollars? :-)

sorry if this been asked before but I remember asking for the popover template feature months ago. Where is this going ? Is there already a 'beta' version I could use ? If so, where's the code ? Thanks !

Contributor

jbruni commented Sep 21, 2013

@graphicsxp I've posted a working solution yesterday. Code is at pull request #1046. The corresponding patch is here: https://gist.github.com/jbruni/6633055. It improves and resolves the issues of pull request #369 - proposed previously. I am waiting for feedback. I think the code is good to merge. Feel free to use it.

@jbruni thanks . I've downloaded the patch and I've run the command git apply --check popover-template.patch but it gives me 'fatal: corrupt patch at line 91'. I've never tried to apply a patch before so maybe I'm doing something dumb. I'm in the clone folder so in theory it should work... Do you think there is indeed a problem with the patch ?

Contributor

jbruni commented Sep 22, 2013

@graphicsxp Please, just add an empty line at the end of the file and try again.

You can also get it from my fork... (use git remote add, then fetch, and checkout the "popover-template" branch... instead of "remote add" you can also clone it directly)

@jbruni Ok, I've managed to get the code and compile it. But how do you actually use it ?

I've tried that:

<button popover-placement="top" popover="On the Top!" content="'app/common/views/templates/gridHeaderString.html'" class="btn">Top</button>

But the content is not loaded. Could you provide the code for calling the directive ?

ThCC commented Sep 24, 2013

+1
Any progress with this feature? @joshdmiller @pkozlowski-opensource
@jbruni I did not understand your talk with @graphicsxp by any chance your solution now supports templates with bindings?

Contributor

jbruni commented Sep 27, 2013

@graphicsxp I haven't been around these days; sorry. Use popover-template to specify the template. Do not use the popover attribute in the same element! Like this:

<button popover-placement="top" popover-template="app/common/views/templates/gridHeaderString.html" class="btn">Top</button>
Contributor

jbruni commented Sep 27, 2013

@ThCC Yes - template with bindings. I've just followed @joshdmiller steps and went further ahead, resolving the remaining issues... problem with ng-model binding, memory leak, etc - all issues resolved.

AFAIK, it only needs the review of someone from inside who also knows the internals...

The patch is really minimal and "unobstrusive" - it does not disturb existing functionality.

It would be extremely easy to review, if it didn't resolve the binding issue (actually, a "hidden" bug, which has been uncovered and fixed). It seems it requires "expert review" - but the experts are extremely busy and unavailable for this task right now... we must wait.

Meanwhile, the code is there. Just:

  1. add the template/popover/popover-template.html file available here;
  2. substitute src/popover/popover.js by this one in my fork here (15 lines added);
  3. substitute src/tooltip/tooltip.js by this one in my fork here (1 line added to provide the functionality; the other changes are the bug fix)
Contributor

jbruni commented Sep 28, 2013

Announcement

Alright, people in this thread, @dmackerman, @ThCC, and everybody else... I've "compiled" AngularUI Bootstrap with the popover-template directive (as implemented at pull request #1046), now it is totally easy for everyone to test.

It is available here: https://gist.github.com/jbruni/6737078
Just download the gist and use either ui-bootstrap-tpls-0.6.0.js or ui-bootstrap-tpls-0.6.0.min.js, just like you already are used to.

(Note: The difference from the official AngularUI Bootstrap 0.6.0 is very little. The patch is minimal.)

Usage

It works exactly like the popover directive, the only difference is: do not use the popover attribute; instead, use the popover-template attribute, informing the templateUrl.

Example:

<button popover-placement="right" popover-template="template.html" class="btn">Right</button>

Features

Of course, HTML is allowed in the template.

The template accepts bindings, which will be relative to the scope where the element containing the directive belongs.

If you close the tooltip and reopen it again later, the binding persists.

As usual, you can define your template through a HTML script tag:

<script id="template.html" type="text/ng-template">
    <div ng-model="meeting.date"><datepicker></datepicker></div>
    <p>A paragraph with a <button>button</button>!</p>
    <p>A paragraph with a binding: {{ user.name }}</p>
</script>

Feedback

Please, let us know if it works for you.

Thank you.

EDIT at October 6, 2013

Updated the PR and the Gist, including the several improvements made since this was first published.

@jbruni dude, thank you! Will test this out tomorrow.

👍 Waiting for this commit to get merged.

Anyone else is having this error ?

Error: [$compile:tpload] Failed to load template: template/popover/popover-template.html

And a modal backdrop shows up, stopping me from interacting with controls on the screen. This is how I call the popover :

<button class="grid-action-filter" popover-placement="right" popover-template="app/common/views/templates/gridHeaderString.html"> test</button>

@graphicsxp +1

<a href="" popover-placement="bottom" popover-template="popie.html" class="btn">open</a>
results in
Error: [$compile:tpload] Failed to load template: template/popover/popover-template.html

+1

I submitted a pull request that adds template functionality into the core library.

#2479

Is @jbruni 's code change pulled into the official release?

naimdjon commented Aug 1, 2014

+1

kavuri commented Aug 7, 2014

+1

hartror commented Aug 12, 2014

+1

sunild commented Aug 12, 2014

+infinity and beyond! This issue makes me laugh. Practically two years later, the only solutions are to use Angular Strap or JBruni's code (and keep patching if you upgrade to the latest version). I gave up long ago on this being included and now use Angular Strap for this functionality. Unwatching this issue b/c I'm tired of all the simple +1 comments in my inbox :) Good luck!

+1
I'm also using AngularStrap for this fonction.

dscerri commented Aug 12, 2014

+1

+1

Contributor

Igosuki commented Aug 18, 2014

Wow guys, pulling a whole other repo for one option on one directive. That's pretty unproductive and overengineering.

+1

Looks like we're probably jumping ship to AngularStrap as well. Don't want to be mean, but the fact that this hasn't been touched in forever despite the fact that it is a highly wanted and clearly important feature seems very lame.

No idea why there has been no progress on this issue for 18 months. Heartbreaking.

If you include angularStrap in your project only for the popover, I recommend you to make your own file with only the following modules (in the same order as mention) :

mgcrea.ngStrap.helpers.dimensions
mgcrea.ngStrap.helpers.parseOptions
mgcrea.ngStrap.tooltip (+ HTML templateCache)
mgcrea.ngStrap.popover (+ HTML templateCache)

With this way my file is smaller and I keep UI bootstrap for everything else.

@yappli, that's what we ended up doing as well. Pulled out just the popover from angularStrap and had to rename the tooltip provider so that it wouldn't conflict with angular ui.

Contributor

Igosuki commented Sep 2, 2014

As shown by @RobJacobs above, you only need to add a few lines and reuse $tooltip. That seems pretty simple. Absolutely no need to drag another lib into this.
The only problem here is that the number of allowed comiters is too low for the number of forks.

I also would like to see this feature, such a shame is stalled like this.

+1

Could anyone post summary here, regarding the issue? Will/Is it [be] solved? Will/Is [be] in development?

@ghost

ghost commented Sep 15, 2014

+2!

+1

Member

chrisirhc commented Sep 16, 2014

Latest status

See #1848 . We need reviewers and testing for that PR.

Urgent here!

ScottKa commented Sep 21, 2014

Could we get an update on this one?

Should we all expect this upgrade to materialise in the near future or we're better off by looking for alternate solutions?

stramel commented Oct 8, 2014

+1

cebor commented Oct 10, 2014

👍

bcherny commented Oct 13, 2014

+1 we're very close to migrating off angular-ui-bootstrap because of stuff like this..

Is this feature available now? Or should we use popover-html-unsafe? Please replay me..

stramel commented Oct 14, 2014

@NeevShah @bcherny You guys can use the popover template that is in the PR #1848 using my repository until it is released officially. I have made it really easy to switch between official and my branch by compiling the code for you.

jokomo commented Oct 16, 2014

can we get some indication of where this is at right now?

stramel commented Oct 16, 2014

@jokomo It is slated for 0.12.0 according to the milestone. If you look at the milestone, it appears about 75% of it is complete. In the mean time you can see my comment above for useful information.

Contributor

RobJacobs commented Oct 16, 2014

I wouldn't mind so much creating custom packages with unreleased pull requests if there was some indication which direction this library was going. Case in point, 2 competing pull requests for this functionality. Which PR is going to be adopted in the 0.12.0 release? If it's going to be #1848 close this PR and reference that one.

stramel commented Oct 16, 2014

@RobJacobs There is only one PR out currently. ( #1848 ) This is a issue which is what was initially filed in order to make the developers aware of the issue. The PR is there to submit proposed changes that address this issue.

@joshdmiller is this bunch of conversation about binding html to popover directive ? is it still a phenomena?:)

danveloper referenced this issue in spinnaker/deck Oct 27, 2014

Closed

Delivery tab and pipeline visualization #219

+1 - would be good to make some progress on this.

stramel commented Nov 3, 2014

@jamesmorgan All progress is being logged at PR #1848. We are still needing people to test and report issues before it can be merged in and officially supported.

+1

Contributor

DaveWM commented Jan 12, 2015

I got fed up waiting for this feature, so I made the ngPopoverButton directive. Posting it here in case some of you guys find it useful.

stramel referenced this issue Jan 22, 2015

Merged

feat(popover): support templates #1848

4 of 4 tasks complete

What is preventing the PR to be merged (apart from conflicts) ?
I'd be glad to help fixing the last issues!
It needs to be merged asap because this is becoming hilarious (1 year issue, with 200+ comments, on a 7k stars project, just to allow html in a popover...)
#opensourcefail

The 0.12.1 milestone only contains the #2996 PR tagged as needs:merging. How can I help to make this happen ?
This will allow us to move forward toward 0.13.

Contributor

karianna commented Jan 29, 2015

We'll be merging that issue at the next maintainers meeting. @chrisirhc will be teaching the rest of us new maintainers to cherry pick the fix and perform a full release. Then we get onto the hard work of triaging the ~120 or so PR's out there :-).

stramel commented Jan 29, 2015

@karianna 👍 This is great news for this library.

Contributor

nnjpp commented Jan 29, 2015

That is such an enormous relief. I was under the impression that the project had seriously lost momentum but it looks like I'll soon be able to start recommending it again.

Contributor

karianna commented Jan 29, 2015

Well I'm not going to promise miracles as there are 187 outstanding Pull Requests to get through for starters, but yes you should start seeing some movement over the coming weeks.

Marvelous !

metanav commented Feb 20, 2015

Any progress? I understand guys are working purely part-time and unpaid and I appreciate that.
But I think this issue is blocking many of us.

Contributor

karianna commented Feb 20, 2015

Meeting tonight to begin the first steps.

Alos commented Feb 23, 2015

Hey guys? Did you got a chance to talk about this?

Contributor

karianna commented Feb 24, 2015

No, our priority is to get Angular 1.3 compatibility - next step is to triage 200 open PRs, step after that is to triage 300 open issues. Then we look at the rest :-)

starf commented Feb 24, 2015

I do not comprehend. Been using 1.3 since beta without a problem. The amount of response here is ridiculous.

Wait, so this wasn't discussed at all? I appreciate that you're trying to get this project back on track after it completely fell of the rails for whatever reason, but this issue is coming up on it's 2 year anniversary (and it wasn't even the first to request this functionality), all the while people are forced to use other libraries like angular-strap, fork this repo and make the fix themselves, or do crazy duck-punches in their projects, all for what is a relatively simple change that has a PR ready to go. If this doesn't come through in 0.13 it's going to be hard to justify recommending this library to anyone anymore.

Guys, use angular strap (http://mgcrea.github.io/angular-strap/) until this issue will be fixed. The same number of features + popover has HTML

seiyria commented Feb 25, 2015

@forza020 it's not a clean switch. You can't put templates / html in your dropdown menus cleanly, for example. You just have to consider what features you need and pick the best one based on that; it's not as simple as "they still don't have feature x, just go use y."

I know. That is why the only way is to combine these 2 modules until
bootstrap ui will not support HTML in popover.

2015-02-25 15:05 GMT+02:00 Kyle J. Kemp notifications@github.com:

@forza020 https://github.com/forza020 it's not a clean switch. You
can't put templates / html in your dropdown menus cleanly, for example. You
just have to consider what features you need and pick the best one based on
that; it's not as simple as "they still don't have feature x, just go use
y."


Reply to this email directly or view it on GitHub
#220 (comment)
.

yordis commented Mar 2, 2015

This was in 2013, today 2015 still without any update about it. This is the reason why people great forks and boom a new javascript framework because even when they take the time for create the PR for contribute.

@forza020 I will take a look to angular-strap, hopefully is a good route to go.

These comments aren't adding anything to the issue, I recommend locking this issue to contributors, and updating it when the feature is added.

yordis commented Mar 2, 2015

@danielcompton your suggestion is shut down the opinion of the people. This add value to the issue, you know why, because you can see the effort from them. People like me trust them and the fact some guys even create the PR + Unit Testing + Doc and they don't do anything about.

This was 2 years ago sir, this wasn't 1 month and look the how many +1 are here ..... Close the comments, "good way" of fix problems.

@yordis I think we're all well aware of the need for this feature, and I too am frustrated that it's not available yet. However GitHub issues aren't the place for complaining about a bug or missing feature - they're for fixing it. The negative comments aren't adding anything of value, and they're bringing down the contributors. If you want something to change, your options are:

  1. Become a contributor to angular-ui, and land the patch in a way that fits with the contribution guidelines
  2. Do nothing and wait for the feature to arrive sometime in the future
  3. Use a different UI library with this feature
  4. Use a fork of angular-ui with this feature

If you just want to complain, then I suggest you save it for your bartender 😉.

This issue is a tough one, largely because it's been buzzing around for so long. I've been debating the merits of closing this for I don't know how long, largely due to a couple of significant fixes for this issue as open PR's. And since I'm not actively contributing to the project right now, it's debatable whether or not I should.

That being said, this project lost momentum as many of the maintainers had to real-life obligations and other projects take over. As a result the current/new maintainers have a lot of work ahead of them with some 200 PR's and over 500 open issues.

As a result, I'm going to close this for now (with the caveat that a current maintainer is more than welcome to re-open for any reason). Not because I have any desire to close down discussion, but because this horse has been dead a long time and it's less a matter of needing a fix and more a matter of needing to fix other things in order for this to get merged in.

hallister closed this Mar 3, 2015

Contributor

DaveWM commented Mar 3, 2015

@hallister surely in the time it took you to write that comment you could've just merged in one of the multiple open PRs for this (#1848,#2479, etc.)

@DaveWM Both of those have merge conflicts that need to be sorted out and I'm not actively contributing to the project right now, so it's highly unlikely that I could have merged it quickly.

Furthermore, because there are so many outstanding PR's, merging into master right now is going to do nothing more than cause more problems. With 200 open PR's, a great deal of care has to be taken on what gets merged.

I realize everyone is frustrated with the pace here, but this is still an open source project developed entirely by volunteers. I realize this issue has been around for a long time, but it's going to take a little more patience before this is merged in.

Contributor

RobJacobs commented Mar 3, 2015

@DaveWM @hallister My thoughts are this should not be part of the library. We should be focusing on making directives that have a single responsibility that people can use as components to build more complex directives. We shouldn't build directives that transcludes 2 different content areas, handles dismissing, and handles popup placement all in one. Rather these should be discreet directives (dismiss, placement, etc...) that are independent and can be re-used. That being said, here is a plunk that demonstrates that approach for the popover. You will notice I am using the native TWBS markup and classes to build the popover and only have a single directive that handles the dismiss. No need to transclude content, or trigger a scope.$apply to reposition the element after content changes, or the numerous other rabbit holes we go down to support a 'god' directive. While it is convenient not to have to write all that html, that should be a convenience reserved for simple cases.

I am also working on an approach for more placement options by using classes (can be bound to ng-class for dynamic placement), which can be seen in this plunk. This does not use pixels to set top, left, right, or bottom so as content grows, the container will resize without losing the anchor point.

If you are set on template support in the existing popup directive, I have a pull request here with all conflicts resolved against the current master branch,

seiyria commented Mar 3, 2015

@RobJacobs I strongly disagree that this shouldn't be part of the library, and clearly so do many others. If the goal of this library is to recreate TWBS functionality with Angular-style markup, anything like this should definitely support templates at the bare minimum.

Contributor

DaveWM commented Mar 4, 2015

Completely agree with @seiyria. @RobJacobs, you seem to be saying that the entire popover directive should be re-written, and regardless of whether that's a good idea or not, it's not really what's up for discussion here. Also, I hardly think adding something as simple as dynamic content would make popover a "god directive".

Interesting thing, but it looks like popover template worked before. I found working plunkr with angular 1.2.9. However 1.3.x doesn't work.
As an alternative, i found nsPopover. Going to give it a try

Contributor

jbruni commented Mar 19, 2015

Since my previous comment on 28 May 2014, I've been away. Surprised to see that this is still an issue, I have just made a new version, mergeable to current HEAD.

There is a difference now. While I was not expecting merge for my previous versions, because I knew they dissonate from the project's "roadmap", so to say... this time the patch does not affect absolutely nothing on existing code and embraces the design decisions taken. (While I previously made it NOT destroy the tooltip when it was hidden, now I kept the tooltip-removal code untouched.)

This is why, unlike many of my previous attempts, at this time I am opening a new PR. Just as I knew chances of merging were poor in the past - this time I sincerely believe there is no reason for not being embraced. The code is absolutely simple, unobstrusive and harmless. Please, take a look and consider. Thank you.

chrisirhc reopened this Mar 23, 2015

Member

chrisirhc commented Mar 23, 2015

#1848 is pending a name poll, otherwise, it's mostly good to merge.

@chrisirhc chrisirhc added a commit to chrisirhc/angular-ui-bootstrap that referenced this issue Mar 28, 2015

@chrisirhc chrisirhc feat(tooltip): add tooltip-template directive
Fixes #220
a169511

chrisirhc closed this in #1848 Mar 28, 2015

Can't believe this just happened 😂
Congratz everybody and especially @chrisirhc

Your guys kicked ass!

I want to cry. Thanks everybody.

Contributor

karianna commented Mar 30, 2015

FYI - Actually resolved in 0.13.0 but due to GitHub DDOS I can't change the milestone

metanav commented Mar 30, 2015

Will it be part of 0.12.2 release?
What is the expected release date (or month) of 0.12.2 or 0.13.0?

Contributor

karianna commented Mar 30, 2015

There won't be a 012.2, 0.13.0 is the next release, no concrete ETA yet.

fantastic !. any ETA yet ?

just wait the release version, the issue last for too much time

@karianna karianna modified the milestone: 0.13.0, 1.0.0 Apr 14, 2015

@ljantzen ljantzen pushed a commit to ljantzen/bootstrap that referenced this issue Apr 14, 2015

@chrisirhc chrisirhc + Leif Jantzen feat(tooltip): add tooltip-template directive
Fixes #220
08b5ae5

+1

chrisirhc self-assigned this Jul 6, 2015

chrisirhc locked and limited conversation to collaborators Jul 6, 2015

Member

chrisirhc commented Jul 6, 2015

Locking this issue as the feature has been released. Please open a new issue if there are further comments.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.