<commit_before><!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>Roadmap Demo - vue-github</title>
  <link rel="stylesheet" type="text/css" href="semantic-ui/css/semantic.min.css" />
  <style type="text/css">
  .accordion .title.active{position:relative}
  .accordion .content{overflow:auto}
  </style>
</head>
<body>

  <a href="https://github.com/bigbluehat/vue-github">
    <img style="position: absolute; z-index: 1; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/52760788cde945287fbb584134c4cbc2bc36f904/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f77686974655f6666666666662e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png">
  </a>

  <section>
    <h1 class="ui header">Roadmap Demo</h1>
    <p>It's possible to constructe HTML pages + vue-github components to
    dynamically represent the state of a "roadmap" as seen across multiple
    GitHub projects (aka repos).</p>
  </section>

  <div class="ui one column page grid">
    <div id="roadmap-hypothesis" class="column">
      <h1 class="ui header">{{user}} / {{project}}</h1>
      <div v-component="github-milestone-flattened"
          v-with="user: user, project: project"
          data-milestone="{}">
      </div>
      <h3 class="ui disabled header">Completed Milestones</h3>
      <div v-component="github-milestone-accordion"
        v-with="user: user, project: project" data-state="closed" data-milestone="{}">
      </div>
    </div>
  </div>

  <script id="template-github-commit" type="text/vuejs+html">
  <a href="{{html_url}}" target="_blank" class="commit">
  {{sha.slice(0, 7)}}</a>
  - <span class="message">{{commit.message | truncate}}</span>
  <br>
  by <strong class="author">{{commit.author.name}}</strong>
  at <strong class="date">{{commit.author.date | formatDate}}</strong>
  </script>

  <script id="template-github-milestone-list" type="text/vuejs+html">
  <h5 class="ui header">Milestones
    <a v-if="htmlUrl" href="{{htmlUrl}}" target="_blank" class="ui top right attached label">
      <i class="basic url icon"></i></a>
    <a v-if="milestone.number" v-on="click: milestone = {}" title="clear milestone">
      <i class="basic cancel circle icon link"></i></a></h5>
  <div class="ui fluid vertical menu">
    <div class="item" v-if="!items.length">
      <h4 class="disabled">No Milestones.</h4>
    </div>
    <a class="item" v-class="active: milestone.number == number" v-repeat="items" target="_blank"
      v-on="click: toggleMilestone">
      {{title}}
      <strong v-if="open_issues" class="ui label red">{{open_issues}}</strong>
      <strong v-if="closed_issues" class="ui label">{{closed_issues}}</strong>
    </a>
  </div>
  </script>

  <script id="template-github-milestone-accordion" type="text/vuejs+html">
  <div class="ui fluid accordion">
    <div class="item" v-if="!items.length">
      <h4 class="disabled">No Milestones</h4>
    </div>
    <div class="item" v-repeat="items">
      <div class="title" v-class="active: milestone.number == number"
        v-on="click: toggleMilestone">
        <i class="dropdown icon"></i>
        {{title}}
        <strong v-if="open_issues" class="ui label red">{{open_issues}}</strong>
        <strong v-if="closed_issues" class="ui label">{{closed_issues}}</strong>
        <span v-if="due_on" class="ui label" style="float: right">{{due_on | formatDate}}</span>
      </div>
      <div class="content" v-class="active: milestone.number == number">
        <div v-component="github-issue-accordion"
            v-with="user: user, project: project, milestone: milestone, items: $root.items">
        </div>
      </div>
    </div>
  </div>
  </script>

  <script id="template-github-milestone-flattened" type="text/vuejs+html">
  <div class="ui fluid list">
    <div class="item" v-if="!items.length">
      <div class="content">
        <h4 class="header disabled">No Milestones</h4>
      </div>
    </div>
    <div class="item" v-repeat="item: items">
      <i class="list layout basic outline icon"></i>
      <div class="content" v-class="active: milestone.number == item.number">
        <div class="header">
          {{item.title}}
          <strong v-if="item.open_issues" class="ui label red">{{item.open_issues}}</strong>
          <strong v-if="item.closed_issues" class="ui label">{{item.closed_issues}}</strong>
          <span v-if="item.due_on" class="ui label" style="float: right">{{item.due_on | formatDate}}</span>
        </div>
        <div v-component="github-issue-flattened"
            v-with="user: user, project: project, milestone: item, items: $root.items">
        </div>
      </div>
    </div>
  </div><commit_msg>added external links to milestones<commit_after><!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>Roadmap Demo - vue-github</title>
  <link rel="stylesheet" type="text/css" href="semantic-ui/css/semantic.min.css" />
  <style type="text/css">
  .accordion .title.active{position:relative}
  .accordion .content{overflow:auto}
  </style>
</head>
<body>

  <a href="https://github.com/bigbluehat/vue-github">
    <img style="position: absolute; z-index: 1; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/52760788cde945287fbb584134c4cbc2bc36f904/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f77686974655f6666666666662e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png">
  </a>

  <section>
    <h1 class="ui header">Roadmap Demo</h1>
    <p>It's possible to constructe HTML pages + vue-github components to
    dynamically represent the state of a "roadmap" as seen across multiple
    GitHub projects (aka repos).</p>
  </section>

  <div class="ui one column page grid">
    <div id="roadmap-hypothesis" class="column">
      <h1 class="ui header">{{user}} / {{project}}</h1>
      <div v-component="github-milestone-flattened"
          v-with="user: user, project: project"
          data-milestone="{}">
      </div>
      <h3 class="ui disabled header">Completed Milestones</h3>
      <div v-component="github-milestone-accordion"
        v-with="user: user, project: project" data-state="closed" data-milestone="{}">
      </div>
    </div>
  </div>

  <script id="template-github-commit" type="text/vuejs+html">
  <a href="{{html_url}}" target="_blank" class="commit">
  {{sha.slice(0, 7)}}</a>
  - <span class="message">{{commit.message | truncate}}</span>
  <br>
  by <strong class="author">{{commit.author.name}}</strong>
  at <strong class="date">{{commit.author.date | formatDate}}</strong>
  </script>

  <script id="template-github-milestone-list" type="text/vuejs+html">
  <h5 class="ui header">Milestones
    <a v-if="htmlUrl" href="{{htmlUrl}}" target="_blank" class="ui top right attached label">
      <i class="basic url icon"></i></a>
    <a v-if="milestone.number" v-on="click: milestone = {}" title="clear milestone">
      <i class="basic cancel circle icon link"></i></a></h5>
  <div class="ui fluid vertical menu">
    <div class="item" v-if="!items.length">
      <h4 class="disabled">No Milestones.</h4>
    </div>
    <a class="item" v-class="active: milestone.number == number" v-repeat="items" target="_blank"
      v-on="click: toggleMilestone">
      {{title}}
      <strong v-if="open_issues" class="ui label red">{{open_issues}}</strong>
      <strong v-if="closed_issues" class="ui label">{{closed_issues}}</strong>
    </a>
  </div>
  </script>

  <script id="template-github-milestone-accordion" type="text/vuejs+html">
  <div class="ui fluid accordion">
    <div class="item" v-if="!items.length">
      <h4 class="disabled">No Milestones</h4>
    </div>
    <div class="item" v-repeat="items">
      <div class="title" v-class="active: milestone.number == number"
        v-on="click: toggleMilestone">
        <i class="dropdown icon"></i>
        {{title}}
        <strong v-if="open_issues" class="ui label red">{{open_issues}}</strong>
        <strong v-if="closed_issues" class="ui label">{{closed_issues}}</strong>
        <span v-if="due_on" class="ui label" style="float: right">{{due_on | formatDate}}</span>
      </div>
      <div class="content" v-class="active: milestone.number == number">
        <div v-component="github-issue-accordion"
            v-with="user: user, project: project, milestone: milestone, items: $root.items">
        </div>
      </div>
    </div>
  </div>
  </script>

  <script id="template-github-milestone-flattened" type="text/vuejs+html">
  <div class="ui fluid list">
    <div class="item" v-if="!items.length">
      <div class="content">
        <h4 class="header disabled">No Milestones</h4>
      </div>
    </div>
    <div class="item" v-repeat="item: items">
      <i class="list layout basic outline icon"></i>
      <div class="content" v-class="active: milestone.number == item.number">
        <div class="header">
          <a href="{{htmlUrl}}" target="_blank"><i class="small basic url icon"></i></a>
          {{item.title}}
          <strong v-if="item.open_issues" class="ui label red">{{item.open_issues}}</strong>
          <strong v-if="item.closed_issues" class="ui label">{{item.closed_issues}}</strong>
          <span v-if="item.due_on" class="ui label" style="float: right">{{item.due_on | formatDate}}</span>
        </div>
        <div v-component="github-issue-flattened"
            v-with="user: user, project: project, milestone: item, items: $root.items">
        </div>
      </div>
    </div>
  </div>
{'fraction_non_alphanumeric': 0.18491307947019867, 'fraction_numerical': 0.03373344370860927, 'mean_word_length': 3.710038986354776, 'pattern_counts': {'":': 0, '<': 239, '<?xml version=': 0, '>': 239, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 2, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6133353', 'n_tokens_mistral': 3518, 'n_tokens_neox': 3256, 'n_words': 664}