Create addNavBar.js

addNavBar.js

@@ -0,0 +1,47 @@
+$( document ).ready(function() {
+	let rootPath = "";
+	let visPath = "";
+	if(window.location.pathname.indexOf("vis/index.html") > 0){
+		visPath = "vis/";
+	} else{
+		rootPath = "../";
+	}
+
+	let navBarStr = "";
+
+	navBarStr += '<nav class="navbar navbar-expand-lg navbar-light bg-light">';
+	navBarStr += '  <a class="navbar-brand" href="'+rootPath+'index.html">ManyLanguagesManyColors</a>';
+	navBarStr += '  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">';
+	navBarStr += '    <span class="navbar-toggler-icon"></span>';
+	navBarStr += '  </button>';
+
+	navBarStr += '  <div class="collapse navbar-collapse" id="navbarSupportedContent">';
+ 	navBarStr += '   <ul class="navbar-nav mr-auto">';
+	navBarStr += '      <li class="nav-item active">';
+ 	navBarStr += '       <a class="nav-link" href="'+rootPath+'index.html">Home <span class="sr-only">(current)</span></a>';
+	navBarStr += '      </li>';
+	navBarStr += '      <li class="nav-item">';
+	navBarStr += '        <a class="nav-link" href="http://labinthewild.org/studies/color_perception/" target="_blank">Take the Survey</a>';
+	navBarStr += '      </li>';
+	navBarStr += '      <li class="nav-item dropdown">';
+	navBarStr += '        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">';
+	navBarStr += '         Visualizations';
+	navBarStr += '        </a>';
+	navBarStr += '        <div class="dropdown-menu" aria-labelledby="navbarDropdown">';
+	navBarStr += '          <a class="dropdown-item" href="'+rootPath+'color_translator.html">Color Translator</a>';
+	navBarStr += '          <a class="dropdown-item" href="'+rootPath+'stacked-spectrum.html">Hue Color Comparisons (more languages)</a>';
+	navBarStr += '          <a class="dropdown-item" href="'+rootPath+'full_color_maps.html">Color Maps</a>';
+	navBarStr += '          <a class="dropdown-item" href="'+rootPath+'en-ko-translation-comparison.html">Korean-English Translation Comparison</a>';
+	navBarStr += '          <a class="dropdown-item" href="'+rootPath+'viridis.html">Korean-English Viridis Color Spectrum</a>';
+	navBarStr += '        </div>';
+	navBarStr += '      </li>';
+	navBarStr += '      <li class="nav-item">';
+	navBarStr += '        <a class="nav-link" href="https://github.com/composarc/color-naming-in-different-languages/">Dataset</a>';
+	navBarStr += '      </li>';
+	navBarStr += '    </ul>';
+	navBarStr += '  </div>';
+	navBarStr += '</nav>';
+
+	$("body").prepend(navBarStr);
+
+});