Instead of an autocompleting box, make the index list of commands wit…

…h a filter.
hunterashner · Aug 19, 2014 · b761a69 · b761a69
1 parent 6d08fe7
commit b761a69
Show file tree

Hide file tree

Showing 5 changed files with 149 additions and 40 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,4 @@
 /htdocs
 /*.pyc
+/html/copy/jquery-ui.min.js
+/html/copy/jquery.min.js
diff --git a/compile.py b/compile.py
@@ -77,8 +77,94 @@ def create_directory(dir):
 search_fp = open("html/docs.gl.search.js")
 search = search_fp.read()
 search_fp.close()
+
+index_fp = open("html/index.html")
+index = index_fp.read()
+index_fp.close()
 print "Done."
 
+if os.path.exists('html/copy/jquery.min.js'):
+  index = index.replace("{$jquery}", "<script src='jquery.min.js'></script>")
+else:
+  index = index.replace("{$jquery}", "<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>")
+
+if os.path.exists('html/copy/jquery-ui.min.js'):
+  index = index.replace("{$jqueryui}", "<script src='jquery-ui.min.js'></script>")
+else:
+  index = index.replace("{$jqueryui}", "<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery-ui.min.js'></script>")
+
+index_commands_version = opengl.commands_version_flat.keys()
+index_commands_version.sort()
+index_versions_commands = ""
+for command in index_commands_version:
+  major_versions = opengl.get_major_versions_available(command)
+
+  aliases = {}
+  # Add aliases to this command. Need to do this because ES has glClearDepthf while GL has glClearDepth
+  for alias in opengl.aliased_functions[command]:
+    if alias == command:
+      continue
+    if alias in index_commands_version:
+      for version in opengl.get_major_versions_available(alias):
+        if not version in major_versions:
+          major_versions.append(version)
+          aliases[version] = alias
+
+  # If the command is an alias we've already done it, skip
+  if command in opengl.function_aliases and command != opengl.function_aliases[command] and opengl.function_aliases[command] in index_commands_version:
+    continue
+
+  latest_version = ''
+  all_major_versions_available = []
+  for version in major_versions:
+    if len(latest_version) == 0 or (latest_version[:2] == 'es' and version[:2] == 'gl') or (latest_version[:2] == version[:2] and float(version[2:]) > float(latest_version[2:])):
+      latest_version = version
+
+    all_major_versions_available.append(version)
+
+  index_versions_commands += "<span id='command_" + command + "' class='indexcommand"
+  versions_added = []
+  for version in opengl.commands_version_flat[command]:
+    version = version.replace(".", "")
+    if version in versions_added:
+      continue
+    index_versions_commands += " " + version
+    versions_added.append(version)
+
+  for alias_version in aliases:
+    for version in opengl.commands_version_flat[aliases[alias_version]]:
+      version = version.replace(".", "")
+      if version in versions_added:
+        continue
+      index_versions_commands += " " + version
+      versions_added.append(version)
+
+  index_versions_commands += "'><span class='commandcolumn'>" + command + "</span>"
+
+  all_major_versions = opengl.get_major_versions(opengl.version_commands_flat.keys())
+  for version in all_major_versions:
+    if int(version[2:3]) < 2:
+      continue
+    alias = command
+
+    if version in aliases:
+      alias = aliases[version]
+
+    if version in all_major_versions_available:
+      index_versions_commands += "<span class='versioncolumn'><a href='" + version + "/" + alias + "'>" + version + "</a></span>"
+    else:
+      index_versions_commands += "<span class='versioncolumn'>&nbsp;</span>"
+  index_versions_commands += "<br /></span>\n"
+
+index = index.replace("{$commandlist}", index_versions_commands)
+
+index_fp = open(output_dir + "/index.html", "w")
+index_fp.write(index)
+index_fp.close()
+
+
+
+
 search_versions_commands = "var search_versions = {"
 search_function_aliases = {}
 for version in opengl.version_commands:

diff --git a/html/copy/style_dark.css b/html/copy/style_dark.css
@@ -15,6 +15,10 @@ a:hover {
 	color: #71acf1;
 }
 
+.commandcolumn, .versioncolumn {
+	background-color: #111;
+}
+
 .function {
 	color: #ccc;
 	background-color: #252525;

diff --git a/html/copy/style_light.css b/html/copy/style_light.css
@@ -15,6 +15,10 @@ a:hover {
 	color: #358acc;
 }
 
+.commandcolumn, .versioncolumn {
+	background-color: #eee;
+}
+
 .function {
 	color: #333;
 	background-color: #e5e5e5;

diff --git a/html/copy/index.html → html/index.html b/html/copy/index.html → html/index.html
@@ -4,41 +4,67 @@
 <meta charset='utf-8'>
 <title>docs.gl</title>
 
-<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+{$jquery}
 <link rel="stylesheet" href="jquery-ui.css" />
-<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js"></script>
+{$jqueryui}
 <script src="jquery-cookie/jquery.cookie.js"></script>
 
 <link href="style.css" rel="stylesheet" type="text/css" />
 <link id="pagestyle" href="style_light.css" rel="stylesheet" type="text/css" />
 
+<style>
+#commandlist {
+	width: 550px;
+	margin-top: 20px;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.commandcolumn, .versioncolumn {
+	display: block;
+	float: left;
+	margin: 4px;
+}
+
+.commandcolumn {
+	width: 350px;
+	text-align: left;
+}
+
+.versioncolumn {
+	width: 30px;
+}
+</style>
+
 <script>
 $(function() {
 	window.search_api = "all";
 
-	front_search_fn = function(value) {
-		version = window.search_api;
+	front_filter_fn = function() {
+		version = window.search_api.replace(".", "");
 		if (!version || typeof version == 'undefined')
 			version = 'all';
 
-		if (search_versions[version].indexOf(value) < 0)
-			return;
-
-		var alias_api = window.search_api.substring(0, 2);
-		var alias = value;
-		var directory = version.substring(0, 3) + "/";
-		if (window.search_api == 'all')
-		{
-			alias_api = value.substring(0, 2);
-			alias = value.substring(4);
-			directory = value.substring(0, 4);
-		}
+		hide_commands = function() {
+			$(this).addClass("hidden");
 
-		var command_page = alias;
-		if (alias in function_aliases[alias_api])
-			command_page = function_aliases[alias_api][alias]
+			if ($(this).attr('id').toLowerCase().indexOf($("#frontsearch").val().toLowerCase()) == -1)
+				return;
 
-		window.location.href = window.base_directory + directory + command_page;
+			if (version == 'all') {
+				$(this).removeClass("hidden");
+			} else {
+				var classList = $(this).attr('class').split(/\s+/);
+				for (var i = 0; i < classList.length; i++) {
+					if (classList[i] === version) {
+						$(this).removeClass("hidden");
+						break;
+					}
+				}
+			}
+		};
+
+		$(".indexcommand").each(hide_commands);
 	}
 
 	$( "#es_api" ).buttonset();
@@ -49,33 +75,20 @@
 	$( "#es_api" ).change(function( event, ui ) {
 		id = event.target.id;
 		window.search_api = id.substring(0, 3) + "." + id.substring(3, 4);
-		$("#frontsearch").autocomplete( "option", "source", search_versions[window.search_api] );
-		$("#frontsearch").val("");
+		front_filter_fn();
 	});
 	$( "#gl_api" ).change(function( event, ui ) {
 		id = event.target.id;
 		window.search_api = id.substring(0, 3) + "." + id.substring(3, 4);
-		$("#frontsearch").autocomplete( "option", "source", search_versions[window.search_api] );
-		$("#frontsearch").val("");
+		front_filter_fn();
 	});
 	$( "#allapi" ).change(function( event, ui ) {
 		id = event.target.id;
 		window.search_api = 'all';
-		$("#frontsearch").autocomplete( "option", "source", search_versions[window.search_api] );
-		$("#frontsearch").val("");
-	});
-
-	$( "#frontsearch_button" ).button().click(function(event) {
-		front_search_fn($("#frontsearch").val());
-	});
-
-	$( "#frontsearch" ).autocomplete({
-		source: search_versions["all"],
-		minLength: 3,
-		select: function( event, ui ) {
-			front_search_fn(event.target.value);
-		},
+		front_filter_fn();
 	});
+
+	$("#frontsearch").keyup(front_filter_fn);
 
 	if ($.cookie("pagestyle") == 'light')
 		$("#pagestyle").attr("href", "style_light.css");
@@ -118,9 +131,9 @@
 </div>
 </div>
 <br clear="both" />
-<div><input id="frontsearch" size=50 /><input id="frontsearch_button" type="submit" value="Go" /></div>
+<div><input id="frontsearch" size=50 /></div>
+<div id="commandlist">{$commandlist}</div>
 </div>
 
-<script src="docs.gl.search.js"></script>
 </body>
 </html>