Generates tree representations of data model items.

dump.ftl

<#-- dump.ftl
--
-- Generates tree representations of data model items.
--
-- Usage:
-- <#import "dump.ftl" as dumper>
--
-- When used within html pages you've to use <pre>-tags to get the wanted
-- result:
-- <pre>
-- <@dumper.dump .data_model />
-- <pre>
-->

<#-- The black_list contains bad hash keys. Any hash key which matches a
-- black_list entry is prevented from being displayed.
-->
<#assign black_list = [
  "session",
  "class",
  "application",
  "springmacrorequestcontext",
  "request",
  "jsptaglibs",
  "org.springframework"
  ] />

<#--
-- The main macro.
-->
<#macro dump data>
<#if RequestParameters.debugger>
    <@printStyle />
    <@printScript />
    <div class="debugger-tool">
        <a href="javascript:void(0);" class="debugger-button open">Debugger</a>
        <ul>
          <li class="debugger-wrapper">
            <span class="debugger-toggle open">root</span>
              <#if data?is_enumerable>
              <@printList data,[] />
              <#elseif data?is_hash_ex>
              <@printHashEx data,[] />
              </#if>
          </li>
        </ul>
    </div>
</#if>
</#macro>

<#-- private helper macros. it's not recommended to use these macros from
-- outside the macro library.
-->
<#macro printList list has_next_array>
<#local counter=0 />
<#list list as item>
  <@printItem item?if_exists,has_next_array+[item_has_next], counter />
  <#local counter = counter + 1/>
</#list>
</#macro>

<#macro printHashEx hash has_next_array>
<ul class="debugger-content">
<#list hash?keys as key>
  <@printItem hash[key]?if_exists,has_next_array+[key_has_next], key />
</#list>
</ul>
</#macro>

<#-- // -->
<#function omit key>
  <#local what = key?lower_case>
  <#list black_list as item>
    <#if what?index_of(item) gte 0>
      <#return true>
    </#if>
  </#list>
  <#return false>
</#function>

<#-- // -->
<#macro printItem item has_next_array key>
<li>
<#if item?is_enumerable>
  <#-- TOO SLOW: ${key} -->
  <@printList item, has_next_array /><#t>
<#elseif omit(key?string)><#-- omit bean-wrapped java.lang.Class objects -->
  <#-- ${key} (省略) -->
<#elseif item?is_hash_ex>
  <span class="debugger-toggle">${key}</span>
  <@printHashEx item, has_next_array /><#t>
<#elseif item?is_number>
  <span class="debugger-key">${key}</span> : <span class="debugger-value number">${item}</span>
<#elseif item?is_string>
  <span class="debugger-key">${key}</span> : <span class="debugger-value string">"${item}"</span>
<#elseif item?is_boolean>
  <span class="debugger-key">${key}</span> : <span class="debugger-value bool">${item?string}</span>
<#elseif item?is_date>
  <span class="debugger-key">${key}</span> : <span class="debugger-value time">${item?string("yyyy-MM-dd HH:mm:ss zzzz")}</span>
<#elseif item?is_transform>
  <span class="debugger-key">${key}</span> : ?? <span class="debugger-value">(transform)</span>
<#elseif item?is_macro>
  <span class="debugger-key">${key}</span> : ?? <span class="debugger-value">(macro)</span>
<#elseif item?is_hash>
  <span class="debugger-key">${key}</span> : ?? <span class="debugger-value">(hash)</span>
<#elseif item?is_node>
  <span class="debugger-key">${key}</span> : ?? <span class="debugger-value">(node)</span>
</#if>
</li>
</#macro>

<#macro printStyle>
<style>
.debugger-tool {
  left: 100%;
  right: 0;
  color: #fff;
  z-index: 999;
  position: fixed;
  transition: 0.25s;
  font-family: monospace;
  border: 2px solid #2ecc71;
}
.debugger-tool.open{
  left: 30%;
}
.debugger-button {
  color: #fff;
  top:-2px;
  left: -100px;
  width: 100px;
  line-height: 50px;
  position: absolute;
  text-align: center;
  transition: 0.25s ;
  background-color: #2ecc71;
}
.debugger-button:hover {
  background-color: #55d98d;
}
.debugger-wrapper {
  height: 80%;
  padding: 20px;
  font-size: 16px;
  line-height: 17px;
  max-height: 500px;
  overflow-y: scroll;
  background:#34495e;
}
.debugger-toggle {
  margin: 5px 0;
  color: #2ecc71;
  cursor: pointer;
}
.debugger-toggle:before {
  content: '▶️';
  font-size: 12px;
  transition: 0.2s;
  margin-right: 5px;
  display: inline-block;
  vertical-align: bottom;
}
.debugger-content {
  display: none;
  padding-left: 10px;
}
.debugger-content li {
    margin: 5px 0;
}
.debugger-value {
    color: #D8FFB0;
    font-size: 14px;
}
.debugger-value.bool {
    color: #FF3333;
}

.open > .debugger-content {
  display: block;
}
.open > .debugger-toggle:before {
  transform: rotate(90deg);
}
</style>
</#macro>

<#macro printScript>
<#-- TODO: remove lib -->
<script>
;(function(win, $, undefined){

  $.on(document, 'DOMContentLoaded', function(){
    var debuggerTool = $('.debugger-tool');

    $.on($('.debugger-button'),'click', function(){
      $.toggleClass(debuggerTool, 'open');
    });

    $.on(debuggerTool, 'click', function(ev){
      var target = ev.toElement;
      if($.hasClass(target, 'debugger-toggle')){
        $.toggleClass(target.parentNode, 'open');
      }
    });

  });

})(window, (function(){

  var $ = function(selector, el){
    return (el || document).querySelector(selector);
  };
  $.on = function(el, event, handler){
    el.addEventListener(event, handler);
  };
  $.hasClass = function(el, cls){
    return !!~el.className.indexOf(cls);
  };
  $.addClass = function(el, cls){
    el.className += ' ' + cls;
  };
  $.removeClass = function(el, cls){
    el.className = el.className.replace(cls,'');
  };
  $.toggleClass = function(el, cls){
    if($.hasClass(el, cls)){
      $.removeClass(el, cls);
    }else{
      $.addClass(el, cls);
    }
  };

  return $;

})());
</script>
</#macro>