0
I am just trying to display a div with the login fields
{-# LANGUAGE NoImplicitPrelude #-}
{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE TemplateHaskell #-}
{-# LANGUAGE QuasiQuotes #-}
{-# LANGUAGE MultiParamTypeClasses #-}
{-# LANGUAGE TypeFamilies #-}
module Handler.Share where
import Import
import Text.Lucius
import Database.Persist.Postgresql
menu :: Widget
menu = [whamlet|
<nav .navbar .navbar-default .navbar-fixed-top>
<div .container-fluid>
<div .navbar-header>
<button type="button" .navbar-toggle .collapsed data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span .sr-only>Toggle navigation</span>
<span .icon-bar></span>
<span .icon-bar></span>
<span .icon-bar></span>
<div .collapse .navbar-collapse id="bs-example-navbar-collapse-1">
<ul .nav .navbar-nav .navbar-right>
<li>
<a>
Cadastrar-se
<li>
<a onclick="showlogin()">
Entrar
<div #login>
<h2>
Login
<p>Usuário:
<p>Senha:
<p>
<a>
Esqueci minha senha
<br>
<a>
Novo cadastro
|]
getShareR :: Handler Html
getShareR = do
defaultLayout $ do
addStylesheet $ StaticR css_bootstrap_css
addScriptRemote "https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"
toWidgetHead [julius|
$(document).mouseup(function (e) {
var div = $("#login");
if (!div.is(e.target) && div.has(e.target).length === 0) {
if (div.is(':visible')) {
div.toggle("slow");
}
}
});
function showlogin(){
$("#login").show("slow");
}
|]
toWidget $ $(luciusFile "templates/share.lucius")
$(whamletFile "templates/share.hamlet")
And returns: Uncaught Referenceerror: $ is not defined