examples work
This commit is contained in:
Sam Tobin-Hochstadt
Matthew Flatt
parent
6b100291e0
commit
bcb1c40f93
|
|
@ -127,55 +127,22 @@
|
|||
(set-box! navbar-info (list (lazy pages) (lazy top) (lazy help)))))
|
||||
|
||||
(define navbar-info (box #f))
|
||||
(define (navbar-maker logo)
|
||||
(define pages-promise
|
||||
(lazy (car (or (unbox navbar-info)
|
||||
(error 'navbar "no navbar info set")))))
|
||||
(define top-promise (lazy (cadr (unbox navbar-info))))
|
||||
(define help-promise (lazy (caddr (unbox navbar-info))))
|
||||
(define pages-parts-of-promise
|
||||
(lazy (map pages->part-of (force pages-promise))))
|
||||
(define (middle-text size x)
|
||||
(span style: `("font-size: ",size"px; vertical-align: middle;")
|
||||
class: 'navtitle
|
||||
x))
|
||||
(define OPEN
|
||||
(list (middle-text 100 "(")
|
||||
(middle-text 80 "(")
|
||||
(middle-text 60 "(")
|
||||
(middle-text 40 nbsp)))
|
||||
(define CLOSE
|
||||
(list (middle-text 80 "Racket")
|
||||
(middle-text 40 nbsp)
|
||||
(middle-text 60 ")")
|
||||
(middle-text 80 ")")
|
||||
(middle-text 100 ")")))
|
||||
(define (header-cell)
|
||||
(td (a href: (url-of (force top-promise))
|
||||
OPEN
|
||||
(img src: logo alt: "[logo]"
|
||||
style: '("vertical-align: middle; "
|
||||
"margin: 13px 0.25em 0 0; border: 0;"))
|
||||
CLOSE)))
|
||||
(define (links-table this)
|
||||
(table width: "100%"
|
||||
(tr (map (λ (nav navpart)
|
||||
(td class: 'navlinkcell
|
||||
(span class: 'navitem
|
||||
(span class: (if (eq? (pages->part-of this) navpart)
|
||||
'navcurlink 'navlink)
|
||||
nav))))
|
||||
(force pages-promise)
|
||||
(force pages-parts-of-promise)))))
|
||||
(λ(this)
|
||||
(div class: 'racketnav
|
||||
(div class: 'navcontent
|
||||
(table border: 0 cellspacing: 0 cellpadding: 0 width: "100%"
|
||||
(tr (header-cell)
|
||||
(td class: 'helpiconcell
|
||||
(let ([help (force help-promise)])
|
||||
(span class: 'helpicon (if (eq? this help) nbsp help)))))
|
||||
(tr (td colspan: 2 (links-table this))))))))
|
||||
(define ((navbar-maker logo) this)
|
||||
(define (icon name) @i[class: name]{})
|
||||
(define (row . content) (apply div class: "row" content))
|
||||
|
||||
@div[class: "navbar" gumby-fixed: "top" id: "nav1"]{
|
||||
@row{
|
||||
@a[class: "toggle" gumby-trigger: "#nav1 > .row > ul" href: "#"]{
|
||||
@icon{icon-menu}}
|
||||
@a[class: "five columns logo" href: ""]{
|
||||
@img[class: "logo" src: logo]}
|
||||
@ul[class: "five columns"]{
|
||||
@li{@a[href: "https://pkg.racket-lang.org"]{Packages}}
|
||||
@li{@a[href: "https://docs.racket-lang.org"]{Documentation}}
|
||||
@li{@a[href: "https://blog.racket-lang.org"]{Blog}}
|
||||
@li{@div[class: "medium metro info btn icon-left entypo icon-install"]{
|
||||
@a[href: "./download/"]{Download}}}}}})
|
||||
|
||||
(define html-preamble
|
||||
@list{
|
||||
|
|
@ -230,9 +197,10 @@
|
|||
@; CSS imports non-minified for staging, minify before moving to
|
||||
@; production
|
||||
@link[rel: "stylesheet" href: (resources "gumby.css")]
|
||||
@;@link[rel: "stylesheet" href: (resources "style.css")]
|
||||
@; TODO: Modify `racket-style' definition (and what it depends on)
|
||||
@; in "resources.rkt", possibly do something similar with the new files
|
||||
@link[rel: "stylesheet" type: "text/css" href: style title: "default"]
|
||||
@;@link[rel: "stylesheet" type: "text/css" href: style title: "default"]
|
||||
@; TODO: Edit the `more.css' definition in www/index.rkt
|
||||
@; More ideas for your <head> here: h5bp.com/d/head-Tips
|
||||
@; All JavaScript at the bottom, except for Modernizr / Respond.
|
||||
|
|
@ -240,7 +208,7 @@
|
|||
@; a polyfill for min/max-width CSS3 Media Queries
|
||||
@; For optimal performance, use a custom Modernizr build:
|
||||
@; www.modernizr.com/download/
|
||||
@script[src: "js/libs/modernizr-2.6.2.min.js"]
|
||||
@script[src: (resources "modernizr-2.6.2.min.js")]
|
||||
})
|
||||
|
||||
(define (make-resources files)
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ html, body { height: 100%; }
|
|||
.text-right { text-align: right; }
|
||||
|
||||
/* Fonts */
|
||||
@font-face { font-family: "entypo"; font-style: normal; font-weight: 400; src: url(../fonts/icons/entypo.eot); src: url("../fonts/icons/entypo.eot?#iefix") format("ie9-skip-eot"), url("../fonts/icons/entypo.woff") format("woff"), url("../fonts/icons/entypo.ttf") format("truetype"); }
|
||||
@font-face { font-family: "entypo"; font-style: normal; font-weight: 400; src: url(./entypo.eot); src: url("./entypo.eot?#iefix") format("ie9-skip-eot"), url("./entypo.woff") format("woff"), url("./entypo.ttf") format("truetype"); }
|
||||
|
||||
h1, h2, h3, h4, h5, h6 { font-family: "Open Sans"; font-weight: 500; color: black; text-rendering: optimizeLegibility; padding-top: 0.273em; line-height: 1.15538em; padding-bottom: 0.273em; }
|
||||
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #d04526; }
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@ However, this blank file is available if you prefer
|
|||
#growboxes { margin-top: 10pt; }
|
||||
.panetitle { color: red; font-size: 120%; margin-bottom: 4pt }
|
||||
|
||||
pre.codesnip { font-size: 140%; }
|
||||
.codesnip { display: none; }
|
||||
.codesnip.active { display: block; }
|
||||
|
||||
.racketnav { display: none }
|
||||
|
||||
.wide_only { display: block; }
|
||||
.narrow_only { display: none; }
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
#lang meta/web
|
||||
|
||||
(require "resources.rkt" "code.rkt" "download.rkt" "learning.rkt")
|
||||
(require racket/format)
|
||||
|
||||
(define (doc path . text)
|
||||
(apply a href: (list "http://docs.racket-lang.org/" path) text))
|
||||
|
|
@ -259,7 +260,7 @@
|
|||
(when news-flashes (error 'set-news-flashes! "text already set"))
|
||||
(set! news-flashes text))
|
||||
|
||||
(require racket/format)
|
||||
|
||||
(define (css url) @link[href: url rel: "stylesheet" type: "text/css"]{})
|
||||
(define (icon name) @i[class: name]{})
|
||||
(define (row . content) (apply div class: "row" content))
|
||||
|
|
@ -288,22 +289,6 @@
|
|||
(define prev @img[src: (copyfile (in-here "img/prev.png")) style: "width: 50px"])
|
||||
(define next @img[src: (copyfile (in-here "img/next.png")) style: "width: 50px"])
|
||||
|
||||
(define gumby-css (copyfile (in-here "css/gumby.css")
|
||||
"css/gumby.css"))
|
||||
(define style (copyfile (in-here "css/style.css")
|
||||
"css/style.css"))
|
||||
(define scribble-css (copyfile (in-here "css/scribble.css")
|
||||
"css/scribble.css"))
|
||||
(define gumby-js (copyfile (in-here "js/libs/gumby.min.js")))
|
||||
(define plugins-js (copyfile (in-here"js/plugins.js")))
|
||||
(define main-js (copyfile (in-here "js/main.js")))
|
||||
(define jquery-js (copyfile (in-here "js/libs/jquery-1.9.1.min.js")))
|
||||
|
||||
(copyfile (in-here "fonts/icons/entypo.woff") "fonts/icons/entypo.woff")
|
||||
(copyfile (in-here "fonts/icons/entypo.ttf") "fonts/icons/entypo.ttf")
|
||||
(copyfile (in-here "fonts/icons/entypo.eot") "fonts/icons/entypo.eot")
|
||||
|
||||
|
||||
(provide index)
|
||||
|
||||
(define index
|
||||
|
|
@ -316,24 +301,14 @@
|
|||
integrated development environment, and many batteries-included @;
|
||||
libraries.}
|
||||
@; Ask google to not use the ODP description
|
||||
#:extra-headers @list{@meta[name: "robots" content: "NOODP"]{
|
||||
@div[class: "navbar" gumby-fixed: "top" id: "nav1"]{
|
||||
@row{
|
||||
@a[class: "toggle" gumby-trigger: "#nav1 > .row > ul" href: "#"]{
|
||||
@icon{icon-menu}}
|
||||
@a[class: "five columns logo" href: ""]{
|
||||
@img[class: "logo" src: (copyfile (in-here "img/logo-new.png"))]}
|
||||
@ul[class: "five columns"]{
|
||||
@li{@a[href: "https://pkg.racket-lang.org"]{Packages}}
|
||||
@li{@a[href: "https://docs.racket-lang.org"]{Documentation}}
|
||||
@li{@a[href: "https://blog.racket-lang.org"]{Blog}}
|
||||
@li{@button[class: "medium metro info btn icon-left entypo icon-install"]{
|
||||
@a[href: "#"]{Download}}}}}}
|
||||
|
||||
#:extra-headers @list{@css[(copyfile (in-here "css/frontpage-style.css"))]
|
||||
@css[(copyfile (in-here "css/scribble.css"))]
|
||||
@script[src: (copyfile (in-here "js/slideshow.js"))]
|
||||
@meta[name: "robots" content: "NOODP"]}]{
|
||||
@columns[10 #:row? #t #:center? #t]{
|
||||
@h2[style: "font-size: 180%; margin-bottom: 10pt"]{
|
||||
@strong{Racket} @|nbsp mdash nbsp|
|
||||
@tagline{a programmable programming language}}}
|
||||
@strong{Racket} @|nbsp|@|mdash|@|nbsp|
|
||||
@tagline{a programmable programming language}}}
|
||||
|
||||
@columns[8 #:center? #t #:row? #t
|
||||
style: "margin-bottom: 10pt; font-size: 120%; text-align:justify;"]{
|
||||
|
|
@ -352,24 +327,25 @@ computing and from databases to charts.
|
|||
@h2[style: "font-size: 180%; margin-bottom: 10pt"]{Start Quickly}
|
||||
@div[style: "position: relative"]{
|
||||
@p[class: "metro primary btn"
|
||||
style: "position: absolute; top: -10%; right: 0%;"]{
|
||||
@a[href: "#" class: "switch" gumby-trigger: "#modal1"]{
|
||||
style: "position: absolute; top: -20%; right: 0%;"]{
|
||||
@a[href: "#" class: "switch question_button" gumby-trigger: "#modal1"]{
|
||||
@icon["icon-help"]}}
|
||||
@a[href: "#" class: "toggle narrow_only"
|
||||
@a[href: "#" class: "toggle narrow_only prev_toggle"
|
||||
gumby-trigger: ".unique_lines|.web_scraper"
|
||||
style: "position: absolute; top: -40%; left: 35%"]{@prev}
|
||||
|
||||
@a[href: "#" class: "toggle narrow_only"
|
||||
@a[href: "#" class: "toggle narrow_only next_toggle"
|
||||
gumby-trigger: ".unique_lines|.web_scraper"
|
||||
style: "position: absolute; top: -40%; right: 35%"]{@next}
|
||||
|
||||
@a[href: "#" class: "toggle wide_only"
|
||||
@a[href: "#" class: "toggle wide_only prev_toggle"
|
||||
gumby-trigger: ".unique_lines|.web_scraper"
|
||||
style: "position: absolute; top: 40%; left: -15%"]{@prev}
|
||||
|
||||
@a[href: "#" class: "toggle wide_only"
|
||||
@a[href: "#" class: "toggle wide_only next_toggle"
|
||||
gumby-trigger: ".unique_lines|.web_scraper"
|
||||
style: "position: absolute; top: 40%; right: -15%"]{@next}}}
|
||||
style: "position: absolute; top: 40%; right: -15%"]{@next}
|
||||
@(apply slideshow-panel examples)}}
|
||||
|
||||
@columns[1]
|
||||
|
||||
|
|
@ -549,8 +525,15 @@ File, query and maybe fix existing reports.}}}
|
|||
(set! button-ids+labels (cons (cons id txt) button-ids+labels))
|
||||
(a href: "#" id: id onclick: (list onclick "; return false;") title: tip
|
||||
nbsp)) ; empty, filled by JS code, so JS-less browsers won't see it
|
||||
(define next (img src: (copyfile (in-here "img/next.png")) width: 10))
|
||||
(define prev (img src: (copyfile (in-here "img/prev.png")) width: 10))
|
||||
;(define next (img src: (copyfile (in-here "img/next.png")) width: 10))
|
||||
;(define prev (img src: (copyfile (in-here "img/prev.png")) width: 10))
|
||||
|
||||
|
||||
(for/list ([elem (in-list l)] [pos (in-naturals)])
|
||||
@pre[style: "font-size: 140%;"
|
||||
class: (append (list "codesnip") (if (zero? pos) (list " active") null))
|
||||
id: @list{codesnip@pos}]{@(example-code elem)})
|
||||
#;
|
||||
(div class: 'slideshow
|
||||
(div class: 'buttonpanel
|
||||
@button[prev "Previous example" 'rewindbutton "rewind_show()"]
|
||||
|
|
|
|||
39
new-racket-web/web/www/js/slideshow.js
Normal file
39
new-racket-web/web/www/js/slideshow.js
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
onload = function() {
|
||||
var elems = $(".codesnip");
|
||||
|
||||
console.log("in slideshow")
|
||||
|
||||
var current = 0;
|
||||
var last = elems.length;
|
||||
var cur_elem = $("#codesnip"+current);
|
||||
|
||||
var question = $(".question_button")
|
||||
window.question = question;
|
||||
function prev() {
|
||||
console.log("in prev");
|
||||
console.log(question);
|
||||
if (current === 0) return;
|
||||
current -= 1;
|
||||
cur_elem.removeClass('active')
|
||||
var next_elem = $("#codesnip"+current);
|
||||
next_elem.addClass('active')
|
||||
cur_elem = next_elem;
|
||||
question.attr("gumby-trigger","#modal"+current)
|
||||
}
|
||||
|
||||
function next() {
|
||||
|
||||
if (current+1 === last) return;
|
||||
current += 1;
|
||||
console.log("in next " + current)
|
||||
|
||||
cur_elem.removeClass('active')
|
||||
var next_elem = $("#codesnip"+current);
|
||||
next_elem.addClass('active')
|
||||
cur_elem = next_elem;
|
||||
question.attr("gumby-trigger","#modal"+current)
|
||||
}
|
||||
|
||||
$(".prev_toggle").on("click",prev);
|
||||
$(".next_toggle").on("click",next);
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user