Make it possible to sort the HTML tables

OTP-9896

Introduce java scripts in the web pages to enable sorting
of table elements.

1 files changed, 71 insertions, 35 deletions

diff --git a/lib/common_test/src/ct_master_logs.erl b/lib/common_test/src/ct_master_logs.erl
index 2a951bc5cf..9e61d5b16f 100644
--- a/lib/common_test/src/ct_master_logs.erl
+++ b/lib/common_test/src/ct_master_logs.erl
@@ -26,6 +26,8 @@
 -export([start/2, make_all_runs_index/0, log/3, nodedir/2,
 	 stop/0]).
 
+-include("ct_util.hrl").
+
 -record(state, {log_fd, start_time, logdir, rundir, 
 		nodedir_ix_fd, nodes, nodedirs=[]}).
 
@@ -33,7 +35,6 @@
 -define(all_runs_name, "master_runs.html").
 -define(nodedir_index_name, "index.html").
 -define(details_file_name,"details.info").
--define(css_default, "ct_default.css").
 -define(table_color,"lightblue").
 
 %%%--------------------------------------------------------------------
@@ -95,29 +96,30 @@ init(Parent,LogDir,Nodes) ->
 	    put(basic_html, true);
 	BasicHtml ->
 	    put(basic_html, BasicHtml),
-	    %% copy stylesheet to log dir (both top dir and test run
+	    %% copy priv files to log dir (both top dir and test run
 	    %% dir) so logs are independent of Common Test installation
 	    CTPath = code:lib_dir(common_test),
-	    CSSFileSrc = filename:join(filename:join(CTPath, "priv"),
-				       ?css_default),
-	    CSSFileDestTop = filename:join(LogDir, ?css_default),
-	    CSSFileDestRun = filename:join(RunDirAbs, ?css_default),
-	    case file:copy(CSSFileSrc, CSSFileDestTop) of
-		{error,Reason0} ->
+	    PrivFiles = [?css_default,?jquery_script,?tablesorter_script],
+	    PrivFilesSrc = [filename:join(filename:join(CTPath, "priv"), F) ||
+			       F <- PrivFiles],
+	    PrivFilesDestTop = [filename:join(LogDir, F) || F <- PrivFiles],
+	    PrivFilesDestRun = [filename:join(RunDirAbs, F) || F <- PrivFiles],
+	    case copy_priv_files(PrivFilesSrc, PrivFilesDestTop) of
+		{error,Src1,Dest1,Reason1} ->
 		    io:format(user, "ERROR! "++
-			      "CSS file ~p could not be copied to ~p. "++
+			      "Priv file ~p could not be copied to ~p. "++
 			      "Reason: ~p~n",
-			      [CSSFileSrc,CSSFileDestTop,Reason0]),
-		    exit({css_file_error,CSSFileDestTop});
-		_ ->
-		    case file:copy(CSSFileSrc, CSSFileDestRun) of
-			{error,Reason1} ->
+			      [Src1,Dest1,Reason1]),
+		    exit({priv_file_error,Dest1});
+		ok ->
+		    case copy_priv_files(PrivFilesSrc, PrivFilesDestRun) of
+			{error,Src2,Dest2,Reason2} ->
 			    io:format(user, "ERROR! "++
-				      "CSS file ~p could not be copied to ~p. "++
+				      "Priv file ~p could not be copied to ~p. "++
 				      "Reason: ~p~n",
-				      [CSSFileSrc,CSSFileDestRun,Reason1]),
-			    exit({css_file_error,CSSFileDestRun});
-			_ ->
+				      [Src2,Dest2,Reason2]),
+			    exit({priv_file_error,Dest2});
+			ok ->
 			    ok
 		    end
 	    end
@@ -146,6 +148,16 @@ init(Parent,LogDir,Nodes) ->
 					   {N,""}
 				   end,Nodes)}).
 
+copy_priv_files([SrcF | SrcFs], [DestF | DestFs]) ->
+    case file:copy(SrcF, DestF) of
+	{error,Reason} ->
+	    {error,SrcF,DestF,Reason};
+	_ ->
+	    copy_priv_files(SrcFs, DestFs)
+    end;
+copy_priv_files([], []) ->
+    ok.
+
 loop(State) ->
     receive
 	{log,_From,List} ->
@@ -190,7 +202,7 @@ loop(State) ->
 open_ct_master_log(Dir) ->
     FullName = filename:join(Dir,?ct_master_log_name),
     {ok,Fd} = file:open(FullName,[write]),
-    io:format(Fd,header("Common Test Master Log"),[]),
+    io:format(Fd,header("Common Test Master Log", {[],[1,2],[]}),[]),
     %% maybe add config info here later
     io:format(Fd, config_table([]), []),
     io:format(Fd,
@@ -216,11 +228,14 @@ config_table(Vars) ->
 config_table_header() ->
     ["<h2>Configuration</h2>\n",
      xhtml(["<table border=\"3\" cellpadding=\"5\" "
-	    "bgcolor=\"",?table_color,"\"\n"], "<table>\n"),
-     "<tr><th>Key</th><th>Value</th></tr>\n"].
+	    "bgcolor=\"",?table_color,"\"\n"],
+	   ["<table id=\"",?sortable_table_name,"\">\n",
+	    "<thead>\n"]),
+     "<tr><th>Key</th><th>Value</th></tr>\n",
+     xhtml("", "</thead>\n<tbody>\n")].
 
 config_table1([]) ->
-    ["</table>\n"].
+    ["</tbody>\n</table>\n"].
 
 int_header() ->
     "<div class=\"ct_internal\"><b>*** CT MASTER ~s *** ~s</b>".
@@ -250,14 +265,16 @@ close_nodedir_index(Fd) ->
     file:close(Fd).
 
 nodedir_index_header(StartTime) ->
-    [header("Log Files " ++ format_time(StartTime)) |
+    [header("Log Files " ++ format_time(StartTime), {[],[1,2],[]}) |
      ["<center>\n",
       "<p><a href=\"",?ct_master_log_name,"\">Common Test Master Log</a></p>",
       xhtml(["<table border=\"3\" cellpadding=\"5\" "
-	     "bgcolor=\"",?table_color,"\">\n"], "<table>\n"),
+	     "bgcolor=\"",?table_color,"\">\n"],
+	    ["<table id=\"",?sortable_table_name,"\">\n",
+	     "<thead>\n<tr>\n"]),
       "<th><b>Node</b></th>\n",
       "<th><b>Log</b></th>\n",
-      "\n"]].
+      xhtml("", "</tr>\n</thead>\n<tbody>\n")]].
 
 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
 %%% All Run Index functions %%%
@@ -315,14 +332,16 @@ runentry(Dir) ->
      "</tr>\n"].
 
 all_runs_header() ->
-    [header("Master Test Runs") |
+    [header("Master Test Runs", {[1],[2,3],[]}) |
      ["<center>\n",
       xhtml(["<table border=\"3\" cellpadding=\"5\" "
-	     "bgcolor=\"",?table_color,"\">\n"], "<table>\n"),
+	     "bgcolor=\"",?table_color,"\">\n"],
+	    ["<table id=\"",?sortable_table_name,"\">\n",
+	     "<thead>\n<tr>\n"]),
       "<th><b>History</b></th>\n"
       "<th><b>Master Host</b></th>\n"
-      "<th><b>Test Nodes</b></th>\n"
-      "\n"]].
+      "<th><b>Test Nodes</b></th>\n",
+      xhtml("", "</tr></thead>\n<tbody>\n")]].
 
 timestamp(Dir) ->
     [S,Min,H,D,M,Y|_] = lists:reverse(string:tokens(Dir,".-_")),
@@ -346,9 +365,16 @@ read_details_file(Dir) ->
 %%% Internal functions
 %%%--------------------------------------------------------------------
 
-header(Title) ->
+header(Title, TableCols) ->
     CSSFile = xhtml(fun() -> "" end, 
-		    fun() -> make_relative(locate_default_css_file()) end),
+		    fun() -> make_relative(locate_priv_file(?css_default)) end),
+    JQueryFile =
+	xhtml(fun() -> "" end, 
+	      fun() -> make_relative(locate_priv_file(?jquery_script)) end),
+    TableSorterFile =
+	xhtml(fun() -> "" end, 
+	      fun() -> make_relative(locate_priv_file(?tablesorter_script)) end),
+
     [xhtml(["<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 3.2 Final//EN\">\n",
 	    "<html>\n"],
 	   ["<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"\n",
@@ -360,6 +386,16 @@ header(Title) ->
      "<meta http-equiv=\"cache-control\" content=\"no-cache\">\n",
      xhtml("",
 	   ["<link rel=\"stylesheet\" href=\"",CSSFile,"\" type=\"text/css\">"]),
+     xhtml("",
+	   ["<script type=\"text/javascript\" src=\"",JQueryFile,
+	    "\"></script>\n"]),
+     xhtml("",
+	   ["<script type=\"text/javascript\" src=\"",TableSorterFile,
+	    "\"></script>\n"]),
+     xhtml(fun() -> "" end,
+	   fun() -> ct_logs:insert_javascript({tablesorter,
+					       ?sortable_table_name,
+					       TableCols}) end),
      "</head>\n",
      body_tag(),
      "<center>\n",
@@ -367,7 +403,7 @@ header(Title) ->
      "</center>\n"].
 
 index_footer() ->
-    ["</table>\n"
+    ["</tbody>\n</table>\n"
      "</center>\n" | footer()].
 
 footer() ->
@@ -393,7 +429,7 @@ current_time() ->
 
 format_time({{Y, Mon, D}, {H, Min, S}}) ->
     Weekday = weekday(calendar:day_of_the_week(Y, Mon, D)),
-    lists:flatten(io_lib:format("~s ~s ~p ~w ~2.2.0w:~2.2.0w:~2.2.0w",
+    lists:flatten(io_lib:format("~s ~s ~2.2.0w ~w ~2.2.0w:~2.2.0w:~2.2.0w",
 				[Weekday, month(Mon), D, Y, H, Min, S])).
 
 weekday(1) -> "Mon";
@@ -446,8 +482,8 @@ basic_html() ->
 xhtml(HTML, XHTML) ->
     ct_logs:xhtml(HTML, XHTML).
 
-locate_default_css_file() ->
-    ct_logs:locate_default_css_file().
+locate_priv_file(File) ->
+    ct_logs:locate_priv_file(File).
 
 make_relative(Dir) ->
     ct_logs:make_relative(Dir).