<!-- views/pages/index.ejs -->
<!doctype html>
<html>
  <head>
    <title>Page Inspector - Page Analysis Tool</title>
    <meta name="description" content="Web Page Inspection Tool. Sentiment Analysis, Keyword Extraction & Named Entity Recognition"/>

    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/node_modules/@fortawesome/fontawesome-free/css/all.min.css">
    <link rel="stylesheet" href="/style.css">

  </head>
  <body data-ng-app="app">
    
    <div class="container" data-ng-controller="mainController">
      
    <div class="col-md-12">
      <h1>Page Inspector - Page Analysis Tool</h1>
      <p>Web Page Inspection Tool. Sentiment Analysis, Keyword Extraction & Named Entity Recognition</p>
      <form>
        <div class="form-group">
          <label for="exampleInputEmail1">Page URL</label>
          <input type="url" class="form-control" id="m" placeholder="e.g. google.com" data-ng-model="search.url" data-ng-disabled="proccessing">
        </div>
        <div class="checkbox">
          <label><input type="checkbox" value="" data-ng-model="search.tor">Use Tor Proxy (Enables analysis of .onion URLs)</label>
        </div>
        <button type="submit" class="btn btn-default" data-ng-click="getResults()" data-ng-disabled="proccessing">Analyse <i class="fas fa-circle-notch fa-spin" data-ng-if="proccessing"></i></button>
      </form>
    </div>

      <div class="article col-sm-12" data-ng-if="status">
        <pre class="status">{{status}}</pre>
      </div>

      <div class="article col-sm-6" data-ng-if="article">

        <h3>Google Preview</h3>
        <div class="google-preview">
          <a class="title">{{article.title}}</a>
          <span class="url">{{article.url}}</span>
          <p class="description">{{article.metadescription}}</p>
        </div>

        <div data-ng-if="article.sentiment" class="sentiment">
          <h3>Sentiment</h3>
          <span class="label place label-default">{{article.sentiment.result}}</span>
        </div>
        <div data-ng-if="article.keyphrases.length > 0" class="keyphrases">
          <h3>Keyphrases</h3>
          <span data-ng-repeat="keyphrase in article.keyphrases" class="label keyphrase label-default">{{keyphrase.keyphrase}}</span>
        </div>
        <div data-ng-if="article.people.length > 0" class="people">
          <h3>People</h3>
          <span data-ng-repeat="person in article.people" class="label person label-default">{{person}}</span>
        </div>
        <div data-ng-if="article.orgs.length > 0" class="orgs">
          <h3>Organisations & Groups</h3>
          <span data-ng-repeat="org in article.orgs" class="label org label-default">{{org}}</span>
        </div>
        <div data-ng-if="article.places.length > 0" class="places">
          <h3>Places</h3>
          <span data-ng-repeat="place in article.places" class="label place label-default">{{place}}</span>
        </div>
        <div data-ng-if="article.spelling.length > 0" class="spelling">
          <h3>Spelling</h3>
          <ul>
            <li data-ng-repeat="warning in article.spelling"><span class="label label-default">Line {{warning.line}}</span>{{warning.reason}}</li>
          </ul>
        </div>
      </div>
      <div class="screenshot col-sm-6" data-ng-if="article">

      <uib-tabset active="active">
        <uib-tab index="0" heading="Text">
          <pre class="content article-text-content" ng-bind-html="article.text.html"></pre>
        </uib-tab>
        <uib-tab index="1" heading="HTML">
          <h1>{{article.title}}</h1>
          <img ng-src="{{article.image}}" alt="Description" />
          <div class="content article-text-content" ng-bind-html="article.html"></div>
        </uib-tab>
        <uib-tab index="2" heading="Screenshot">
          <img data-ng-src="data:image/png;base64,{{article.screenshot}}" />
        </uib-tab>
        <uib-tab index="3" heading="Analysis JSON">
          <pre class="content article-text-content" ng-bind-html="jsonData"></pre>
        </uib-tab>
      </uib-tabset>

      </div>

    </div>
    <script src="/node_modules/jquery/dist/jquery.min.js"></script>
    <script src="/node_modules/angular/angular.js"></script>
    <script src="/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="/node_modules/angular-socket-io/socket.min.js"></script>
    <script src="/node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js"></script>
    <script src="/node_modules/angular-sanitize/angular-sanitize.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script src="/app.js"></script>
  </body>
</html>