make it more user-friendly

This commit is contained in:
Filip Gralinski 2015-11-11 13:25:09 +01:00
parent 3dfb0465a8
commit 1846e10016
8 changed files with 34 additions and 72 deletions

View File

@ -104,6 +104,7 @@ instance Yesod App where
isAuthorized (AuthR _) _ = return Authorized isAuthorized (AuthR _) _ = return Authorized
isAuthorized FaviconR _ = return Authorized isAuthorized FaviconR _ = return Authorized
isAuthorized RobotsR _ = return Authorized isAuthorized RobotsR _ = return Authorized
isAuthorized HomeR _ = return Authorized
-- Default to Authorized for now. -- Default to Authorized for now.
isAuthorized _ _ = isTrustedAuthorized isAuthorized _ _ = isTrustedAuthorized

View File

@ -13,29 +13,12 @@ import Yesod.Form.Bootstrap3 (BootstrapFormLayout (..), renderBootstrap3,
-- inclined, or create a single monolithic file. -- inclined, or create a single monolithic file.
getHomeR :: Handler Html getHomeR :: Handler Html
getHomeR = do getHomeR = do
(formWidget, formEnctype) <- generateFormPost sampleForm maybeUser <- maybeAuth
let submission = Nothing :: Maybe (FileInfo, Text) let maybeLocalId = case maybeUser of
handlerName = "getHomeR" :: Text Just user -> userLocalId $ entityVal user
Nothing -> Nothing
defaultLayout $ do defaultLayout $ do
aDomId <- newIdent aDomId <- newIdent
setTitle "Welcome To Yesod!" setTitle "Welcome To Gonito.net!"
$(widgetFile "homepage") $(widgetFile "homepage")
$(fayFile "Home") $(fayFile "Home")
postHomeR :: Handler Html
postHomeR = do
((result, formWidget), formEnctype) <- runFormPost sampleForm
let handlerName = "postHomeR" :: Text
submission = case result of
FormSuccess res -> Just res
_ -> Nothing
defaultLayout $ do
aDomId <- newIdent
setTitle "Welcome To Yesod!"
$(widgetFile "homepage")
sampleForm :: Form (FileInfo, Text)
sampleForm = renderBootstrap3 BootstrapBasicForm $ (,)
<$> fileAFormReq "Choose a file"
<*> areq textField (withSmallInput "What's on the file?") Nothing

View File

@ -5,7 +5,7 @@
/favicon.ico FaviconR GET /favicon.ico FaviconR GET
/robots.txt RobotsR GET /robots.txt RobotsR GET
/ HomeR GET POST / HomeR GET
/create-challenge CreateChallengeR GET POST /create-challenge CreateChallengeR GET POST
/view-progress/#Int ViewProgressR GET /view-progress/#Int ViewProgressR GET

View File

@ -18,3 +18,4 @@ AboutMe: about me
AccountName: name AccountName: name
Id: ID Id: ID
SshPubKey: your SSH public key SshPubKey: your SSH public key
Home: home

View File

@ -1,6 +1,7 @@
<div id="heading"> <div id="heading">
$maybe user <- maybeUser $maybe user <- maybeUser
_{MsgLoggedAs} #{userIdent $ entityVal user} _{MsgLoggedAs} #{userIdent $ entityVal user}
\ | <a href="@{HomeR}">_{MsgHome}</a>
\ | <a href="@{CreateChallengeR}">_{MsgCreateChallenge}</a> \ | <a href="@{CreateChallengeR}">_{MsgCreateChallenge}</a>
\ | <a href="@{ListChallengesR}">_{MsgListChallenges}</a> \ | <a href="@{ListChallengesR}">_{MsgListChallenges}</a>
\ | <a href="@{YourAccountR}">_{MsgYourAccount}</a> \ | <a href="@{YourAccountR}">_{MsgYourAccount}</a>
@ -8,5 +9,5 @@
$nothing $nothing
<a href="@{AuthR LoginR}">_{MsgLogIn}</a> <a href="@{AuthR LoginR}">_{MsgLogIn}</a>
$maybe msg <- mmsg $maybe msg <- mmsg
<div #message>#{msg} <div #message .alert .alert-warning><a href="#" class="close" data-dismiss="alert">&times;</a> #{msg}
^{widget} ^{widget}

View File

@ -1,46 +1,22 @@
<h1>Welcome to Yesod! <h1>Welcome to Gonito.net!
<ol> <p>Gonito (pronounced <i>ɡɔ̃ˈɲitɔ</i>) is a Kaggle-like platform for machine learning competitions.
<li>Now that you have a working project you should use the #
\<a href="http://www.yesodweb.com/book/">Yesod book<span class="glyphicon glyphicon-book"></span></a> to learn more. #
You can also use this scaffolded site to explore some basic concepts.
<li> This page was generated by the #{handlerName} handler in # <p>What's so special about Gonito:
\<em>Handler/Home.hs</em>.
<li> The #{handlerName} handler is set to generate your site's home screen in Routes file # <ul>
<em>config/routes <li>free & open-source (AGPL), you can use it your own, in your company, at your university, etc. (git repo: <tt>git://gonito.net/gonito</tt>)
<li>git-based (challenges and solutions are submitted only with git)
<li> The HTML you are seeing now is actually composed by a number of <em>widgets</em>, # $maybe _ <- maybeUser
most of them are brought together by the <em>defaultLayout</em> function which # $maybe _ <- maybeLocalId
is defined in the <em>Foundation.hs</em> module, and used by <em>#{handlerName}</em>. # <p>Go to the <a href="@{ListChallengesR}">challenge list</a> and choose a challenge for you!
All the files for templates and wigdets are in <em>templates</em>. $nothing
<h2>How to setup your account?
<p>Click <a href="@{YourAccountR}">your account</a> to setup your name, ID and SSH public key.
$nothing
<h2>How to log in?
<li> <p>Gonito uses <a href="https://developer.mozilla.org/en-US/Persona">Persona</a> authentication system available in Mozilla Firefox. Other authentication systems are on the way, but for the time being you need to use Firefox.
A Widget's Html, Css and Javascript are separated in three files with the #
\<em>.hamlet</em>, <em>.lucius</em> and <em>.julius</em> extensions.
<li ##{aDomId}>If you had javascript enabled then you wouldn't be seeing this. <p>So, just click <a href="@{AuthR LoginR}">log in</a>, then "Sign in with Persona" button and Firefox will guide you!
<hr />
<li #form>
This is an example trivial Form. Read the #
\<a href="http://www.yesodweb.com/book/forms">Forms chapter<span class="glyphicon glyphicon-bookmark"></span></a> #
on the yesod book to learn more about them.
$maybe (info,con) <- submission
<div .message .alert .alert-success>
Your file's type was <em>#{fileContentType info}</em>. You say it has: <em>#{con}</em>
<form method=post action=@{HomeR}#form enctype=#{formEnctype}>
^{formWidget}
<button .btn .btn-primary type="submit">
Send it! <span class="glyphicon glyphicon-upload"></span>
<hr />
<li> And last but not least, Testing. In <em>test/Spec.hs</em> you will find a #
test suite that performs tests on this page. #
You can run your tests by doing: <pre>yesod test</pre>
<li>
Let's test out some Fay! Enter a number in this box and we'll calculate the Fibonacci value.
<input #fibindex placeholder="Fibonacci Index">
<span #fibresult>

View File

@ -5,13 +5,6 @@ h1 {
h2##{aDomId} { h2##{aDomId} {
color: #990 color: #990
} }
li {
line-height: 2em;
font-size: 16px
}
ol {
margin-bottom: 30px
}
footer { footer {
text-align: center text-align: center
} }

View File

@ -5,3 +5,10 @@
^{formWidget} ^{formWidget}
<button .btn .btn-primary type="submit"> <button .btn .btn-primary type="submit">
_{MsgSubmit} <span class="glyphicon glyphicon-upload"></span> _{MsgSubmit} <span class="glyphicon glyphicon-upload"></span>
<ul>
<li><b>name</b> is your human-readable name (to be shown on the leaderboard)
<li><b>ID</b> is used in the URLs for your repos (must be composed of lower-case letters, digits or hyphyns, must start with a lower-case letter)
<li><b>SSH public key</b> is needed if you want to access repos hosted on Gonito.net
<li>ID cannot be changed once it is set up
<li>you don't need to specify your ID and SSH public key, if you don't use private repos hosted on Gonito.net