FlashHub/app.html at master · mrdanley/FlashHub · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!doctype html>
<html>
  	<head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
      <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
      <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
  	  <style type="text/css">
        body  {
          font-family: 'Arial Black';
          background-image: url("background.png");
        }
  		  .popupContainerDiv {
	  		     width: 350px;
  		  }
        #search{
            width: 200px;
            padding: 7px;
            border: 1px solid #607d8b;
        }
        #submitButton{
            padding: 8px;
            background: #607d8b;
            border: 1px solid #607d8b;
            color: white;
            margin-left: -5px;
            cursor: pointer;
        }
        #sumbitBuuton:hover{
            background: #333;
            transition: all 0.40s;
        }
      </style>
    	<script src="app.js"></script>
      <script src="canvasjs.min.js"></script>
  	</head>

  <body class="popupContainerDiv">
    <header class="w3-container" style="padding-top:22px">
      <h5>
          Search:<br>
          <input type="text" placeholder="Search..." maxlength="20" id="search">
          <button id="submitButton">Submit</button>
      </h5>
    </header>

    <div class="w3-row-padding">
      <div class="w3-quarter">
        <p id="results">
          This extension gives some insight on the human aspect of
          stock-trading decisions using sentiment and emotion.
        </p>
      </div>
    </div>
    <div class="w3-row-padding">
        <div id="sentimentGraph" style="height: 300px; width: 300px; display: none;" > </div>
        <br \>
        <div id="emotionGraph" style="height: 300px; width: 300px; display: none;" > </div>
    </div>
    <img id="newspaperImage" style="display: none;" src="paper.png" alt="googleNews" usemap="#googleNews" background-color:"transparent"/>
    <p class="w3-container" id="newspaperCaption"></p>
    <map name="googleNews" id="ImageMapsCom-image-maps-2017-11-25-185612">
      <area title="google news1" id="link1" href="" shape="rect" coords="44,149,117,275" style="outline:none;" target="_blank"/>
      <area title="google news2" id="link2" href="" shape="rect" coords="128,149,202,210" style="outline:none;" target="_blank"/>
      <area title="google news3" id="link3" href="" shape="rect" coords="129,220,203,274" style="outline:none;" target="_blank"/>
      <area title="google news4" id="link4" href="" shape="rect" coords="214,175,286,275" style="outline:none;" target="_blank"/>
      <area shape="rect" coords="372,371,374,373" alt="Image Map" style="outline:none;" title="Image Map" />
    </map>
  </body>
</html>