added form

src/templates/data_form.html

@@ -0,0 +1,57 @@
+
+<h2> Filter </h2>
+<div class="container" padding:50px>
+  <div class="row" min-height:150px>
+  {% for input in inputs %}
+    <div class='col-sm-3'>
+      {{ input }}: <input type='text' class='text_input' id={{ input }} name='{{ input }}'>
+    </div>
+  {% endfor %}
+  </div>
+  <div class="row" min-height:150px>
+  {% for dropdown in dropdowns %}
+    <div class="col-sm-3"> 
+      {{ dropdown }}:
+      <select id={{ dropdown }} class="chosen" multiple="true">
+        {% for item in dropdowns[dropdown] %}
+          <option>{{ item }}</option>
+        {% endfor %}
+      </select>
+    </div>
+    {% endfor %}
+    </div>
+  </div>
+</div>
+
+<div id='word_cloud'></div>
+
+<script type="text/javascript">
+jQuery(document).ready(function(){
+  jQuery(".chosen").chosen();
+  update_words()
+
+});
+
+$('#top').change(function(){update_words()})
+
+function update_words(){
+  var top = $('#top').val()
+  //+ '&language=' + language + '&country=' + country + '&genre=' + genre + '&end_year=' + end_year + ' &start_year=' + start_year
+  var words = $.get('http://localhost:5000/api/keywords?top=' + top)
+  words.done(function(data){
+    $('#word_cloud').html('')
+    $('#word_cloud').jQCloud(words.responseJSON, {
+  width: 500,
+  height: 350,
+  classPattern: null,
+  colors: ['#800026', '#bd0026', '#e31a1c', '#fc4e2a', '#fd8d3c', '#feb24c', '#fed976', '#ffeda0', '#ffffcc'],
+  fontSize: {
+    from: 0.1,
+    to: 0.02
+  }
+});
+    
+  })
+}
+
+</script>

src/templates/enthusiast.html

@@ -4,7 +4,13 @@
 {% block head %}
   {{ super() }}
 <!-- Load d3.js and c3.js -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqcloud/1.0.4/jqcloud.css">
 <script src='http://d3js.org/d3.v3.min.js' charset='utf-8'></script>
 <script src='http://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js'></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+<link rel="stylesheet" href="static/node_modules/chosen-js/chosen.css">
+<script src="static/node_modules/chosen-js/chosen.jquery.js"></script>
+<script src='https://cdnjs.cloudflare.com/ajax/libs/jqcloud/1.0.4/jqcloud-1.0.4.min.js'></script>
+<link rel='stylesheet' type='text/css' href='static/css/custom.css'>
+
 {% endblock %}

src/templates/investor.html

@@ -4,7 +4,12 @@
 {% block head %}
   {{ super() }}
 <!-- Load d3.js and c3.js -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqcloud/1.0.4/jqcloud.css">
 <script src='http://d3js.org/d3.v3.min.js' charset='utf-8'></script>
 <script src='http://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js'></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+<link rel="stylesheet" href="static/node_modules/chosen-js/chosen.css">
+<script src="static/node_modules/chosen-js/chosen.jquery.js"></script>
+<script src='https://cdnjs.cloudflare.com/ajax/libs/jqcloud/1.0.4/jqcloud-1.0.4.min.js'></script>
+<link rel='stylesheet' type='text/css' href='static/css/custom.css/'>
 {% endblock %}

src/templates/layout.html

@@ -10,6 +10,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
   <link href='https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css' rel='stylesheet' type='text/css'/>
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+  <link rel='stylesheet' type='text/css' href='static/css/custom.css'>
   {% endblock %}
 
 </head>