[web-devel] Wrapping the widget generated by the authEmail backend.

Michael Snoyman michael at snoyman.com
Tue Jan 4 11:50:25 CET 2011

Just to throw in my two cents here:

* I'm not able to test any code right now (not on my devel system),
but you may want to look at the addSubWidget function that Matt added,
it might help here[1]
* Making these forms more CSS friendly and easier to embed is
definitely something we should fix for the next version. If anyone
wants to submit a patch, that's appreciated. Otherwise, can someone
open up a Github issue so I don't forget about this by the time I get


[1] http://hackage.haskell.org/packages/archive/yesod/0.6.7/doc/html/Yesod-Widget.html#v:addSubWidget

On Tue, Jan 4, 2011 at 12:38 PM, Christian Klauser <ch27k89 at gmail.com> wrote:
> ---------- Forwarded message ----------
> From: Christian Klauser <ch27k89 at gmail.com>
> Date: 4 January 2011 11:35
> Subject: Re: [web-devel] Wrapping the widget generated by the authEmail backend.
> To: Nubis <nubis at woobiz.com.ar>
> Hi,
> I hit the very same problem a couple of days ago. You can certainly
> just build a "compatible" form (with the same field names) and that
> will just work fine. If you want to use the hamlet provided by the
> plugins, here is what I did:
> loginHandler = defaultLayout $ do
>        setTitle $ string "Login"
>        tm <- liftHandler getRouteToMaster
>        let renderPlugin :: AuthPlugin YourSiteHere -> SubWidget Auth
> () -- necessary
>            renderPlugin = flip apLogin tm
>            openidForm = renderPlugin authOpenId
>            emailForm = renderPlugin authEmail
>        addWidget $(widgetFile "login")
> In 'login.hamlet' I can then use ^openidForm^ and ^emailForm^ like any
> other widget. Neat as it is, you'll still have a hard time styling
> these login forms, as don't have any CSS classes assigned to them. It
> will be difficult to distinguish between %input!type=text and
> %input!type=submit, so you might end up re-creating those forms anyway
> :-(
> Hope this helps
> Regards
> Chris
> On 4 January 2011 03:38, Nubis <nubis at woobiz.com.ar> wrote:
>> Hi guys,
>> I'm trying to build a good looking login page, but I noticed the
>> loginHandler that comes with yesod-auth just concatenates all the widgets
>> from all the used auth backends. To make matters worse, the markup some of
>> the backends generate is not even my preferred brand! :)
>> So I try to at least wrap the authEmail widget inside my own html, with a
>> login.hamlet file that looks a bit like this:
>> .box
>>   %h1 Login
>>   .wrapper
>>     ^email^
>> I manage to get the widget out of the authEmail backend, but then I can't
>> use it inside my hamlet file that I add using addHamlet b/c it doesn't
>> typecheck.
>> loginHandler = do
>>   let tm = liftHandler getRouteToMaster
>>   let email = tm >>= apLogin authEmail
>>   defaultLayout $ do
>>     setTitle $ string "Login"
>>     addHamlet $(Settings.hamletFile "login")
>> Is there any way around this? Am I approaching this the wrong way?
>> This could also be solved if instead of a widget I could get the url and
>> fieldname information from the backend, so I can use those things inside my
>> ad-hoc html.
>> Moreso, as a way to customize the html I'm tempted to override or redefine
>> apLogin inside my app's domain so I can customize the html it generates. But
>> just to keep taking advantage of haskell's strenghts it would be nice to
>> formalize this idea a bit more (and I don't know how to approach that).
>> thanks in advance for your help
>> cheers!
>> ----nubis :)
>> _______________________________________________
>> web-devel mailing list
>> web-devel at haskell.org
>> http://www.haskell.org/mailman/listinfo/web-devel
> _______________________________________________
> web-devel mailing list
> web-devel at haskell.org
> http://www.haskell.org/mailman/listinfo/web-devel

More information about the web-devel mailing list