From 2b88eae74b2e6b83b8feb17bc481944d49386e5c Mon Sep 17 00:00:00 2001 From: Mathieu Cornic Date: Thu, 17 Mar 2016 17:48:18 +0100 Subject: [PATCH] feat: implemented functionnalities on Markdown images: 1. featherlight for full size view in popup 2. Height/Width customizables 3. Possibility to add css classes --- layouts/partials/footer.html | 3 +- layouts/partials/header.html | 11 ++----- layouts/partials/menu.html | 4 ++- layouts/shortcodes/warn.html | 1 + static/css/featherlight.min.css | 8 +++++ static/js/clippy.svg | 3 -- static/js/hugo-learn.js | 56 +++++++++++++++++++++++++++++++++ static/js/learn.js | 6 ++-- 8 files changed, 76 insertions(+), 16 deletions(-) create mode 100644 layouts/shortcodes/warn.html create mode 100644 static/css/featherlight.min.css delete mode 100644 static/js/clippy.svg create mode 100644 static/js/hugo-learn.js diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index b598ede0e6..a4c0e0f07e 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -6,7 +6,7 @@ @@ -24,5 +24,6 @@ + diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 68f06d056f..112c4ab9e8 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -10,19 +10,14 @@ {{ .Scratch.Add "title" "" }}{{ if isset .Site.Data.titles .Title }}{{ .Scratch.Set "title" (index .Site.Data.titles .Title).title }}{{ else }}{{ .Scratch.Set "title" .Title}}{{end}} Hugo - {{ .Scratch.Get "title" }} - + + - - - - - - - + {{ partial "menu.html" . }} diff --git a/layouts/partials/menu.html b/layouts/partials/menu.html index a41cbd1c57..6a9c24e9ae 100644 --- a/layouts/partials/menu.html +++ b/layouts/partials/menu.html @@ -2,11 +2,13 @@
diff --git a/layouts/shortcodes/warn.html b/layouts/shortcodes/warn.html new file mode 100644 index 0000000000..d685b0bf79 --- /dev/null +++ b/layouts/shortcodes/warn.html @@ -0,0 +1 @@ +
{{ .Inner }}
diff --git a/static/css/featherlight.min.css b/static/css/featherlight.min.css new file mode 100644 index 0000000000..f225bec519 --- /dev/null +++ b/static/css/featherlight.min.css @@ -0,0 +1,8 @@ +/** + * Featherlight - ultra slim jQuery lightbox + * Version 1.2.3 - http://noelboss.github.io/featherlight/ + * + * Copyright 2015, Noël Raoul Bossart (http://www.noelboss.com) + * MIT Licensed. +**/ +@media all{.featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483647;text-align:center;white-space:nowrap;cursor:pointer;background:#333;background:rgba(0,0,0,0)}.featherlight:last-of-type{background:rgba(0,0,0,.8)}.featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-.25em}.featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:25px 25px 0;border-bottom:25px solid transparent;min-width:30%;margin-left:5%;margin-right:5%;max-height:95%;background:#fff;cursor:auto;white-space:normal}.featherlight .featherlight-inner{display:block}.featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:0;right:0;line-height:25px;width:25px;cursor:pointer;text-align:center;font:Arial,sans-serif;background:#fff;background:rgba(255,255,255,.3);color:#000}.featherlight .featherlight-image{width:100%}.featherlight-iframe .featherlight-content{border-bottom:0;padding:0}.featherlight iframe{border:0}}@media only screen and (max-width:1024px){.featherlight .featherlight-content{margin-left:10px;margin-right:10px;max-height:98%;padding:10px 10px 0;border-bottom:10px solid transparent}} \ No newline at end of file diff --git a/static/js/clippy.svg b/static/js/clippy.svg deleted file mode 100644 index e1b1703590..0000000000 --- a/static/js/clippy.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/static/js/hugo-learn.js b/static/js/hugo-learn.js new file mode 100644 index 0000000000..66e90934a1 --- /dev/null +++ b/static/js/hugo-learn.js @@ -0,0 +1,56 @@ +// Get Parameters from some url +var getUrlParameter = function getUrlParameter(sPageURL) { + var url = sPageURL.split('?'); + var obj = {}; + if (url.length == 2) { + var sURLVariables = url[1].split('&'), + sParameterName, + i; + for (i = 0; i < sURLVariables.length; i++) { + sParameterName = sURLVariables[i].split('='); + obj[sParameterName[0]] = sParameterName[1]; + } + return obj; + } else { + return undefined; + } +}; + +// Execute actions on images generated from Markdown pages +var images = $("div#body-inner img"); +// Wrap image inside a featherlight (to get a full size view in a popup) +images.wrap(function(){ + var image =$(this); + return ""; +}); + +// Change styles, depending on parameters set to the image +images.each(function(index){ + var image = $(this) + var o = getUrlParameter(image[0].src); + if (typeof o !== "undefined") { + var h = o["height"]; + var w = o["width"]; + var c = o["classes"]; + image.css("width", function() { + if (typeof w !== "undefined") { + return w; + } else { + return "auto"; + } + }); + image.css("height", function() { + if (typeof h !== "undefined") { + return h; + } else { + return "auto"; + } + }); + if (typeof c !== "undefined") { + var classes = c.split(','); + for (i = 0; i < classes.length; i++) { + image.addClass(classes[i]); + } + } + } +}); diff --git a/static/js/learn.js b/static/js/learn.js index 73bd860674..67c3286346 100644 --- a/static/js/learn.js +++ b/static/js/learn.js @@ -127,7 +127,7 @@ jQuery(document).ready(function() { var input = jQuery(this), value = input.val(), items = jQuery('[data-nav-id]'); - + console.log(input, value, items); items.removeClass('search-match'); if (!value.length) { $('ul.topics').removeClass('searched'); @@ -207,7 +207,7 @@ jQuery(document).ready(function() { }); } }); - + // allow keyboard control for prev/next links jQuery(function() { jQuery('.nav-prev').click(function(){ @@ -228,7 +228,7 @@ jQuery(document).ready(function() { if(e.which == '39') { jQuery('.nav.nav-next').click(); } - }); + }); });