!!! %html

%head
  %title
    Snuffle:
    = summary.class_name
  %link{href: "http://cdn.datatables.net/1.10.0/css/jquery.dataTables.css", rel: "stylesheet"}
  %script{language: "javascript", src: "http://code.jquery.com/jquery-1.11.0.min.js", type: "text/javascript"}
  %script{language: "javascript", src: "http://code.jquery.com/jquery-migrate-1.2.1.min.js", type: "text/javascript"}
  %script{language: "javascript", src: "http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.0/highlight.min.js", type: "text/javascript"}
  :css
    #{Rouge::Theme.find('thankful_eyes').render(scope: '.highlight')}
    a:link, a:visited { color: #fff }
    body { line-height: 1.5em; background: #49525a; color: #fff; font-family: arial, sans-serif; font-size: 14px; padding: 2em; }
    div.column { float: left; width: 45%; margin-left: 4%; }
    div.file_listing { padding: .1em; border-radius: 5px; background: #000; width: 100%; border: 1px solid #000;}
    div.file_meta { padding: 1em; border-radius: 5px; background: #440013; width: 98%; border: .5em solid #000;}
    h1 { color:#fff; font-size: 1.25em; margin-top: .25em; }
    h2 { color:#fff; font-size: .75em; margin-top: -1em; }
    h3 { color:#fff; font-size: 1.1em;margin-top: 1em; }
    h3.highlighted { background: rgba(170, 161, 57, .6); border-radius: 100px; padding: .25em; padding-left: 1em; color: #000;}
    h3.highlighted-method { background: rgba(153, 51, 80, .6); border-radius: 100px; padding-left: 1em; }
    li { margin-bottom: 1em;}
    pre { line-height: 1.75em;}
    pre.lineno { margin-top: -1.4em !important;}
    span.highlighted { padding-left: 1em; display: inline-block; position: absolute; left: 0px; padding-right: 90%}
    table { width: 100%; box-shadow: 0 5px 0 rgba(0,0,0,.8); border-spacing: 0; border: 5px solid #000; border-radius: 5px; border-collapse: collapse; min-width: 50%; }
    td { text-align: left; padding: .5em; padding-left: 1.25em !important;}
    td.gutter { background-color: rgb(41, 80, 109) !important; }
    tfoot { background: #000; border-top: 10px solid #000; font-family: courier; margin-top: 4em; font-size: .75em;  }
    th { background: #000; text-align: left; padding: .5em; }
    tr.even { background: rgba(128, 128, 128, 0.5) !important;}
    tr.even:hover, tr.odd:hover { background: rgba(128, 128, 128, 0.75) !important;}
    tr.faint td { opacity: 0.5; font-style: italic; }
    tr.header { background-color: #222; }
    tr.header th:first-child { border-radius: 5px 0 0 0; }
    tr.header th:last-child { border-radius: 0 5px 0 0; }
    tr.header th:only-child { border-radius: 5px 5px 0 0; }
    tr.odd { background: rgba(128, 128, 128, 0.25) !important}
    .btn.float-right { float: right; margin-top: -4em;}
    .center { text-align: center; }
    .clear { clear: both; }
    .highlighted { background: rgba(170, 161, 57, .6); border-radius: 100px; }
    .highlighted-method { background: rgba(153, 51, 80, .6); padding: .25em; border-radius: 100px; color: #fff; }
    p.indented {margin-left: 2em; }
    .summary {padding: 1em; border-radius: 5px; background: rgb(41, 80, 109); width: 98%; border: .5em solid #000;}
    .btn {
      -webkit-border-radius: 28;
      -moz-border-radius: 28;
      border: none;
      border-radius: 28px;
      color: #ffffff;
      background: #7d99af;
      padding: 10px 20px 10px 20px;
      text-decoration: none;
    }

    .btn:hover {
      background: #4c708c;
      border: none;
      text-decoration: none;
    }

  .file_meta
    %h1
      = summary.class_name
    %h2
      = summary.path_to_file
    %input.btn.float-right{onclick: "history.back(-1)", type: "button", value: "Back"}

  %br.clear

  %div.summary
    %div.column
      %h3.indented.highlighted
        Data Clumps:
      - unless summary.cohorts.any? || summary.arg_clumps.any?
        %p.indented
          %em None
      - else
        %ul.indented
          - summary.cohorts.group_by{|c| c.values.map(&:to_s).sort }.each do |values, cohorts|
            - if cohorts.count > 0
              %li
                = values.map{|c| ".#{c}" }.join(", ")
                %br
                (line
                = ":#{cohorts.map(&:line_numbers).join(', :')}"
                )
          - summary.arg_clumps.group_by{|c| c.values.map(&:to_s).sort }.each do |args, clumps|
            - if clumps.count > 0
              %li
                = args.map{|c| ".#{c}" }.join(", ")
                %br
                (line
                = ":#{clumps.map(&:line_numbers).join(', :')}"
                )
    %div.column
      %h3.indented.highlighted-method
        Possible Latent Objects:
      - if summary.latent_objects.count == 0
        %p.indented
          %em None
      - else
        %ul.indented
          - summary.latent_objects.each do |latent_object|
            %li
              = latent_object.object_candidate.titleize
              %br
              (
              = ".#{latent_object.source_methods.join(', .')}"
              )
    %br.clear

  %br.clear

  .file_listing
    = source_lines

  %br
  %input.btn{onclick: "history.back(-1)", type: "button", value: "Back"}

  %p.center
    %em
      Analyzed on
      = date
      at
      = time
      by
      %a{href: "https://gitlab.com/coraline/snuffle", target: "_new"}
        Snuffle

  :javascript

    /*
     * jQuery Highlight plugin
     *
     * Based on highlight v3 by Johann Burkard
     * http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
      *
     * Copyright (c) 2009 Bartek Szopka
     *
     * Licensed under MIT license.
     *
     */

    jQuery.extend({
        highlight: function (node, re, nodeName, className) {
            if (node.nodeType === 3) {
                var match = node.data.match(re);
                if (match) {
                    var highlight = document.createElement(nodeName || 'span');
                    highlight.className = className || 'highlight';
                    var wordNode = node.splitText(match.index);
                    wordNode.splitText(match[0].length);
                    var wordClone = wordNode.cloneNode(true);
                    highlight.appendChild(wordClone);
                    wordNode.parentNode.replaceChild(highlight, wordNode);
                    return 1; //skip added node in parent
                }
            } else if ((node.nodeType === 1 && node.childNodes) && // only element nodes that have children
                    !/(script|style)/i.test(node.tagName) && // ignore script and style nodes
                    !(node.tagName === nodeName.toUpperCase() && node.className === className)) { // skip if already highlighted
                for (var i = 0; i < node.childNodes.length; i++) {
                    i += jQuery.highlight(node.childNodes[i], re, nodeName, className);
                }
            }
            return 0;
        }
    });

    jQuery.fn.unhighlight = function (options) {
        var settings = { className: 'highlight', element: 'span' };
        jQuery.extend(settings, options);

        return this.find(settings.element + "." + settings.className).each(function () {
            var parent = this.parentNode;
            parent.replaceChild(this.firstChild, this);
            parent.normalize();
        }).end();
    };

    jQuery.fn.highlight = function (words, options) {
        var settings = { className: 'highlight', element: 'span', caseSensitive: false, wordsOnly: false };
        jQuery.extend(settings, options);

        if (words.constructor === String) {
            words = [words];
        }
        words = jQuery.grep(words, function(word, i){
          return word != '';
        });
        words = jQuery.map(words, function(word, i) {
          return word.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
        });
        if (words.length == 0) { return this; };

        var flag = settings.caseSensitive ? "" : "i";
        var pattern = "(" + words.join("|") + ")";
        if (settings.wordsOnly) {
            pattern = "\\b" + pattern + "\\b";
        }
        var re = new RegExp(pattern, flag);

        return this.each(function () {
            jQuery.highlight(this, re, settings.element, settings.className);
        });
    };

    var line_numbers = #{summary.cohorts.map(&:line_numbers).flatten};
    var method_names = #{summary.latent_objects.map(&:object_candidate).flatten};

    $('pre.lineno').html($('pre.lineno').html().split(/\s+/).map(function(val){ if (line_numbers.indexOf(parseInt(val)) > -1) { return "<span class='highlighted'>" + val + "</span>\n" } else { return "<span class='foo'>" + val + "</span>\n"};}));

    $('.nf').highlight(method_names, { className: 'highlighted-method'});