Ori.livneh has uploaded a new change for review. https://gerrit.wikimedia.org/r/180045
Change subject: xenon: gzip svgs; add custom header/footer + stylesheet ...................................................................... xenon: gzip svgs; add custom header/footer + stylesheet * Generate .svgz files instead of .svg. * Customize Apache index page using <http://adamwhitcroft.com/apaxy/> Change-Id: If4cb6a4b630bc71c30a698103d05aaf77109ac57 --- A files/xenon/theme/footer.html A files/xenon/theme/header.html A files/xenon/theme/style.css M manifests/role/xenon.pp M modules/xenon/files/xenon-generate-svgs M templates/apache/sites/xenon.erb 6 files changed, 173 insertions(+), 5 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/operations/puppet refs/changes/45/180045/1 diff --git a/files/xenon/theme/footer.html b/files/xenon/theme/footer.html new file mode 100644 index 0000000..a42b930 --- /dev/null +++ b/files/xenon/theme/footer.html @@ -0,0 +1,11 @@ + <div class="block"> + To learn more about how to interpret flame graphs, see <a href="http://www.brendangregg.com/flamegraphs.html">Brendan Gregg's page.</a> + </div> +</div> + +<div class="footer"> +</div> +<script> +// grab the 2nd child and add the parent class. tr:nth-child(2) +document.getElementsByTagName('tr')[1].className = 'parent'; +</script> diff --git a/files/xenon/theme/header.html b/files/xenon/theme/header.html new file mode 100644 index 0000000..3ccfc4d --- /dev/null +++ b/files/xenon/theme/header.html @@ -0,0 +1,3 @@ +<div class="wrapper"> + <h1>MediaWiki Flame Graphs</h1> + <p>These flame graphs visualize MediaWiki stack traces, sampled at 10-minute intervals, showing which code paths are most frequent.</p> diff --git a/files/xenon/theme/style.css b/files/xenon/theme/style.css new file mode 100644 index 0000000..ed37ff3 --- /dev/null +++ b/files/xenon/theme/style.css @@ -0,0 +1,126 @@ +/*------------------------------------*\ + Apaxy + by @adamwhitcroft + + Theme name: Apaxy + Theme author: @adamwhitcroft +\*------------------------------------*/ +@import url('//fonts.googleapis.com/css?family=Open+Sans'); +/* Have to use @import for the font, as you can only specify a single stylesheet */ +* { + margin:0; + padding:0; + -webkit-box-sizing:border-box; + -moz-box-sizing:border-box; + box-sizing: border-box; +} + +html { + min-height:100%; + border-top:10px solid #ECEEF1; + border-bottom:10px solid #ECEEF1; + color:#61666c; + font-weight:400; + font-size:1em; + font-family:'Open Sans', sans-serif; + line-height:2em; +} +body { + padding:20px; + -webkit-backface-visibility:hidden; +} +p { + padding: 10px 0; +} + +code { + font-family:consolas,monospace; +} +a { + color:#61666c; + text-decoration:none; +} +a:hover { + color:#2a2a2a; +} +/*------------------------------------*\ + Wrapper +\*------------------------------------*/ +.wrapper { + margin:0 auto; + padding-top:20px; + max-width:500px; +} +/*------------------------------------*\ + Demo block +\*------------------------------------*/ +.block { + font-size:.875em; + margin:20px 0; + padding:20px; + color:#9099A3; +} +/*------------------------------------*\ + Table (directory listing) +\*------------------------------------*/ +table { + width:100%; + border-collapse:collapse; + font-size:.875em; +} +tr { + outline:0; + border:0; +} +tr:hover td { + background:#f6f6f6; +} +th { + text-align:left; + font-size:.75em; + padding-right:20px; +} +/* 2nd Column: Filename */ +th + th { + width:65%; +} +/* 3rd Column: Last Modified */ +th + th + th { +} +/* 4th Column: Size */ +th + th + th + th { + width:5%; +} +tr td:first-of-type { + padding-left:10px; + padding-right:10px; +} +td { + padding:5px 0; + outline:0; + border:0; + border-bottom:1px solid #edf1f5; + vertical-align:middle; + text-align:left; + -webkit-transition:background 300ms ease; + -moz-transition:background 300ms ease; + -ms-transition:background 300ms ease; + -o-transition:background 300ms ease; + transition:background 300ms ease; +} +td a{ + display: block; +} +tr.parent a[href^="/"] { + color:#9099A3; +} + .parent a[href^="/"]:hover { + color:#2281d0; + } +/*------------------------------------*\ + Footer +\*------------------------------------*/ +.footer { + text-align:center; + font-size:.75em; +} diff --git a/manifests/role/xenon.pp b/manifests/role/xenon.pp index 2c25392..374433d 100644 --- a/manifests/role/xenon.pp +++ b/manifests/role/xenon.pp @@ -4,9 +4,11 @@ # application servers, showing where time is spent. # class role::xenon { + include ::xenon + + include ::apache::mod::mime include ::apache::mod::proxy include ::apache::mod::proxy_http - include ::xenon class { '::redis': maxmemory => '1Mb', @@ -16,6 +18,16 @@ Service['redis'] ~> Service['xenon-log'] + file { '/srv/xenon/theme': + ensure => directory, + source => 'puppet:///files/xenon/theme', + owner => 'www-data', + group => 'www-data', + mode => 0755, + recurse => true, + before => Apache::Site['xenon'], + } + apache::site { 'xenon': content => template('apache/sites/xenon.erb'), } diff --git a/modules/xenon/files/xenon-generate-svgs b/modules/xenon/files/xenon-generate-svgs index 57a6d4f..524d0b3 100755 --- a/modules/xenon/files/xenon-generate-svgs +++ b/modules/xenon/files/xenon-generate-svgs @@ -2,10 +2,11 @@ set +C # OK to clobber out-of-date SVGs shopt -s globstar nullglob for log in /srv/xenon/**/*.log; do - svg="${log//log/svg}" + svg="${log//log/svg}z" period="$(basename "$(dirname "$log")")" time="$(basename "$log" ".log")" title="MediaWiki - ${period} - ${time/_/ }" mkdir -m0755 -p "$(dirname $svg)" - [ ! -f "$svg" -o "$svg" -ot "$log" ] && /usr/local/bin/flamegraph.pl --minwidth=2 --title="$title" "$log" > "$svg" + [ ! -f "$svg" -o "$svg" -ot "$log" ] && \ + /usr/local/bin/flamegraph.pl --minwidth=2 --title="$title" "$log" | gzip -9 > "$svg" done diff --git a/templates/apache/sites/xenon.erb b/templates/apache/sites/xenon.erb index 2225bc2..ff952e4 100644 --- a/templates/apache/sites/xenon.erb +++ b/templates/apache/sites/xenon.erb @@ -9,10 +9,25 @@ AllowOverride None </Directory> - <Directory /srv/xenon/svgs> - Options Indexes + <Directory /srv/xenon> + Options +Indexes AllowOverride None Order allow,deny allow from all + + IndexOptions +Charset=UTF-8 +FancyIndexing +IgnoreCase +FoldersFirst +XHTML +HTMLTable +SuppressRules +SuppressDescription +NameWidth=* +IconsAreLinks + IndexHeadInsert "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">" + IndexIgnore .htaccess /theme + + AddIcon /xenon/theme/icons/blank.png ^^BLANKICON^^ + AddIcon /xenon/theme/icons/folder.png ^^DIRECTORY^^ + AddIcon /xenon/theme/icons/folder-home.png .. + AddIcon /xenon/theme/icons/draw.png .svg + AddIcon /xenon/theme/icons/doc.png .log + DefaultIcon /xenon/theme/icons/default.png + + HeaderName /xenon/theme/header.html + ReadmeName /xenon/theme/footer.html + IndexStyleSheet "/xenon/theme/style.css" </Directory> </VirtualHost> -- To view, visit https://gerrit.wikimedia.org/r/180045 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: If4cb6a4b630bc71c30a698103d05aaf77109ac57 Gerrit-PatchSet: 1 Gerrit-Project: operations/puppet Gerrit-Branch: production Gerrit-Owner: Ori.livneh <[email protected]> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
