Christian Mueller
12 years ago
6 changed files with 164 additions and 150 deletions
@ -1,62 +1,104 @@ |
|||||||
var themes = { |
var themes = { |
||||||
"dark": { |
"dark": { |
||||||
background: { |
background: { |
||||||
normal: '#333', |
normal: '#333', |
||||||
halftone: '#444' |
halftone: '#444' |
||||||
}, |
}, |
||||||
foreground: { |
foreground: { |
||||||
normal: '#ccc', |
normal: '#ccc', |
||||||
halftone: '#bbb' |
halftone: '#bbb' |
||||||
}, |
}, |
||||||
link: { |
link: { |
||||||
fresh: '#6b8', |
fresh: '#6b8', |
||||||
visited: '#496', |
visited: '#496', |
||||||
hover: '#7c9' |
hover: '#7c9' |
||||||
} |
} |
||||||
}, |
}, |
||||||
"solarized-light": { |
"solarized-light": { |
||||||
background: { |
background: { |
||||||
normal: '#fdf6e3', |
normal: '#fdf6e3', |
||||||
halftone: '#eee8d5' |
halftone: '#eee8d5' |
||||||
}, |
}, |
||||||
foreground: { |
foreground: { |
||||||
normal: '#657b83', |
normal: '#657b83', |
||||||
halftone: '#839496' |
halftone: '#839496' |
||||||
}, |
}, |
||||||
link: { |
link: { |
||||||
fresh: '#b58900', |
fresh: '#b58900', |
||||||
visited: '#cb4b16', |
visited: '#cb4b16', |
||||||
hover: '#dc322f' |
hover: '#dc322f' |
||||||
} |
} |
||||||
}, |
}, |
||||||
"solarized-dark": { |
"solarized-dark": { |
||||||
background: { |
background: { |
||||||
normal: '#073642', |
normal: '#073642', |
||||||
halftone: '#002b36' |
halftone: '#002b36' |
||||||
}, |
}, |
||||||
foreground: { |
foreground: { |
||||||
normal: '#93a1a1', |
normal: '#93a1a1', |
||||||
halftone: '#eee8d5' |
halftone: '#eee8d5' |
||||||
}, |
}, |
||||||
link: { |
link: { |
||||||
fresh: '#cb4b16', |
fresh: '#cb4b16', |
||||||
visited: '#b58900', |
visited: '#b58900', |
||||||
hover: '#dc322f' |
hover: '#dc322f' |
||||||
} |
} |
||||||
}, |
}, |
||||||
"default": { |
"default": { |
||||||
background: { |
background: { |
||||||
normal: '#fff', |
normal: '#fff', |
||||||
halftone: '#efefef' |
halftone: '#efefef' |
||||||
}, |
}, |
||||||
foreground: { |
foreground: { |
||||||
normal: '#333', |
normal: '#333', |
||||||
halftone: '#888' |
halftone: '#888' |
||||||
}, |
}, |
||||||
link: { |
link: { |
||||||
fresh: '#097', |
fresh: '#097', |
||||||
visited: '#054', |
visited: '#054', |
||||||
hover: '#0a8' |
hover: '#0a8' |
||||||
} |
|
||||||
} |
} |
||||||
|
} |
||||||
}; |
}; |
||||||
|
|
||||||
|
function applyTheme() { |
||||||
|
if (location.search.length > 0) { |
||||||
|
var ui = { theme: "default" }; |
||||||
|
location.search.slice(1).split("&").reduce(function(acc, e){ |
||||||
|
var p = e.split("="); |
||||||
|
acc[p[0]] = p[1]; |
||||||
|
return acc |
||||||
|
}, ui); |
||||||
|
|
||||||
|
var vars = { |
||||||
|
'@background': themes[ui.theme].background.normal, |
||||||
|
'@background_halftone': themes[ui.theme].background.halftone, |
||||||
|
'@foreground': themes[ui.theme].foreground.normal, |
||||||
|
'@foreground_halftone': themes[ui.theme].foreground.halftone, |
||||||
|
'@link_fresh': themes[ui.theme].link.fresh, |
||||||
|
'@link_visited': themes[ui.theme].link.visited, |
||||||
|
'@link_hover': themes[ui.theme].link.hover |
||||||
|
}; |
||||||
|
|
||||||
|
if(ui["header-font"] || ui["text-font"]) { |
||||||
|
var fontURL = "http://fonts.googleapis.com/" + |
||||||
|
"css?family=PT+Serif:700|Noticia+Text:700%s" + |
||||||
|
"&subset=latin,cyrillic"; |
||||||
|
|
||||||
|
var injection = ["header-font", "text-font"].reduce(function(acc, font){ |
||||||
|
if(ui[font]) { |
||||||
|
vars['@' + font.replace(/-/, "_")] = ui[font].replace(/\+/g," "); |
||||||
|
return acc + "|" + ui[font]; |
||||||
|
} else return acc; |
||||||
|
}, ""); |
||||||
|
|
||||||
|
fontURL = fontURL.replace(/%s/, injection); |
||||||
|
var fileref = document.createElement("link") |
||||||
|
fileref.setAttribute("rel", "stylesheet") |
||||||
|
fileref.setAttribute("type", "text/css") |
||||||
|
fileref.setAttribute("href", fontURL) |
||||||
|
document.getElementsByTagName("head")[0].appendChild(fileref) |
||||||
|
} |
||||||
|
less.modifyVars(vars); |
||||||
|
} |
||||||
|
} |
||||||
@ -1,66 +0,0 @@ |
|||||||
(ns NoteHub.views.common |
|
||||||
(:use |
|
||||||
[NoteHub.settings :only [get-message]] |
|
||||||
[noir.core :only [defpartial]] |
|
||||||
[noir.options :only [dev-mode?]] |
|
||||||
[hiccup.util :only [escape-html]] |
|
||||||
[ring.util.codec :only [url-encode]] |
|
||||||
[hiccup.core] |
|
||||||
[hiccup.page :only [include-js html5]] |
|
||||||
[hiccup.element :only [javascript-tag]])) |
|
||||||
|
|
||||||
(defn url |
|
||||||
"Creates a local url from the given substrings" |
|
||||||
[& args] |
|
||||||
(apply str (interpose "/" (cons "" (map url-encode args))))) |
|
||||||
|
|
||||||
; Creates the main html layout |
|
||||||
(defpartial generate-layout |
|
||||||
[params title & content] |
|
||||||
; for the sake of security: escape all symbols of the param values |
|
||||||
(let [params (into {} (for [[k v] params] [k (escape-html v)])) |
|
||||||
theme (:theme params "default") |
|
||||||
header-font (:header-font params) |
|
||||||
text-font (:text-font params)] |
|
||||||
(html5 |
|
||||||
[:head |
|
||||||
[:title (print-str (get-message :name) "—" title)] |
|
||||||
[:meta {:charset "UTF-8"}] |
|
||||||
; generating a link to google's webfonts |
|
||||||
[:link {:href |
|
||||||
(clojure.string/replace |
|
||||||
(str "http://fonts.googleapis.com/css?family=" |
|
||||||
(apply str |
|
||||||
(interpose "|" ["PT+Serif:700" "Noticia+Text:700" header-font text-font])) |
|
||||||
"&subset=latin,cyrillic") " " "+") |
|
||||||
:rel "stylesheet" |
|
||||||
:type "text/css"}] |
|
||||||
[:link {:rel "stylesheet/less" :type "text/css" :href "/style.less"}] |
|
||||||
(html |
|
||||||
(include-js "/js/less.js") |
|
||||||
(include-js "/js/md5.js") |
|
||||||
(include-js "/js/marked.js") |
|
||||||
(include-js "/js/main.js") |
|
||||||
(include-js "/js/themes.js") |
|
||||||
(javascript-tag (str "less.modifyVars({ |
|
||||||
'@background': themes['" theme "'].background.normal, |
|
||||||
'@background_halftone': themes['" theme "'].background.halftone, |
|
||||||
'@foreground': themes['" theme "'].foreground.normal, |
|
||||||
'@foreground_halftone': themes['" theme "'].foreground.halftone, |
|
||||||
'@link_fresh': themes['" theme "'].link.fresh, |
|
||||||
'@link_visited': themes['" theme "'].link.visited, |
|
||||||
'@link_hover': themes['" theme "'].link.hover" |
|
||||||
(when header-font (str ", '@header_font': '" header-font "'")) |
|
||||||
(when text-font (str ",'@text_font': '" text-font "'")) |
|
||||||
"});"))) |
|
||||||
; google analytics code should appear in prod mode only |
|
||||||
(if-not (dev-mode?) (include-js "/js/google-analytics.js"))] |
|
||||||
[:body {:onload "loadPage()"} content]))) |
|
||||||
|
|
||||||
(defn layout |
|
||||||
"Generates the main html layout" |
|
||||||
[& args] |
|
||||||
; if some parameter weren't added we provide an empty map |
|
||||||
(if (map? (first args)) |
|
||||||
(apply generate-layout args) |
|
||||||
(apply generate-layout {} args))) |
|
||||||
Loading…
Reference in new issue