datahub/web/app/views/schemaHistory.scala.html

@(user: String)
  @main(user, "") {
  <link rel="stylesheet" media="screen" href="@routes.Assets.at("vendors/jsondiffpatch-master/html.css")">
  <link rel="stylesheet" media="screen" href="@routes.Assets.at("vendors/jsondiffpatch-master/annotated.css")">
  <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/scriptFinder.css")">
    <div id="content">
      <div class="row">
        <div class="col-xs-12">
          <form class="form-inline">
            <div class="form-group">
              <label for="name">Name</label>
              <input id="name" type="text" class="form-control" placeholder="Filter by Name"/>
            </div>
          </form>
        </div>
      </div>
      <script type="text/x-handlebars" id="schemas">
        <div id="schemaView" class="container-fluid">
          <div class="row-fluid">
            <div class="span9">
              <div class="search-pagination">
                <ul class="pager">
                  {{#unless first}}
                    <li class="previous">
                      {{#link-to 'page' previousPage}}
                        &larr; Prev
                      {{/link-to}}
                    </li>
                  {{/unless}}
                  <li>
                    {{ model.data.count }} scripts - page {{ model.data.page }} of {{ model.data.totalPages }}
                  </li>
                  {{#unless last}}
                    <li class="next">
                      {{#link-to 'page' nextPage}}
                        Next &rarr;
                      {{/link-to}}
                    </li>
                  {{/unless}}
                </ul>
              </div>
              <table id="schematable" class="table table-bordered table-hover search-results">
                <thead>
                  <tr class="results-header">
                    <th class="span3">Dataset Name</th>
                    <th class="span6">Dataset URN</th>
                    <th class="span3">Last Modified Date</th>
                  </tr>
                </thead>
                <tbody>
                  {{#each dataset in model.data.datasets}}
                    <tr {{action 'onSelect' dataset this}} class="schema-row">
                      <td class="dataset-info">
                        {{dataset.name}}
                      </td>
                      <td >{{ dataset.urn }}</td>
                      <td>{{ dataset.lastModified }}</td>
                    </tr>
                  {{/each}}
                </tbody>
              </table>
            </div>
            <div class="span9">
              {{outlet}}
            </div>
          </div>
        </div>
        <div>
        <ul id="historytabs" class="nav nav-tabs">
          <li id="timelinepage"><a id="timelinetablink" data-toggle="tab" href="#timelinetab">Timeline</a></li>
          <li id="diffviewpage"><a id="diffviewtablink" data-toggle="tab" href="#diffviewtab">Schema</a></li>
        </ul>
        <div class="tab-content">
          <div id="timelinetab" class="tab-pane">
            <div id="timeline"></div>
          </div>
          <div id="diffviewtab" class="tab-pane">
            <div class="col-xs-10">
              <div class="control-group">
                <div class="controls">
                  <div class="row">
                    <div class="col-xs-1 text-right">
                      <label>Source</label>
                    </div>
                    <div class="col-xs-3">
                      <select id="leftSchemaSelector" class="col-xs-8 form-control">
                        <option value="na">-- choose a date --</option>
                      </select>
                    </div>
                    <div class="col-xs-1 text-right">
                      <label>Target</label>
                    </div>
                    <div class="col-xs-3">
                      <select id="rightSchemaSelector" class="col-xs-8 form-control">
                        <option value="na">-- choose a date --</option>
                      </select>
                    </div>
                  </div>
                </div>
              </div>
              <div id="schemaContent">
              </div>
            </div>
          </div>
        </div>
      </div>
      </script>
    </div>

    <script src="@routes.Assets.at("vendors/ember-1.12.0/ember-template-compiler.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("vendors/ember-1.12.0/ember.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("vendors/jsondiffpatch-master/diff_match_patch_uncompressed.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("vendors/jsondiffpatch-master/jsondiffpatch.min.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("vendors/jsondiffpatch-master/jsondiffpatch-formatters.min.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("javascripts/highcharts.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("javascripts/search.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("javascripts/schemaHistory.js")" type="text/javascript"></script>
  }