Make newui ready to dev on with closure compiler, plus misc cleanup.

Added env var in dev-server and rules in Makefile to build
all.js with the closure compiler from the js files in newui.

Misc related changes:
-fixed a few closure annotations and added a few as well.
-added missing options to dev-server usage.
-renamed CAM_HTTP_DEBUG into CAMLI_HTTP_DEBUG for consistency.

Change-Id: Ica2c12358150aec24147628201e6f7a5852f9383

Makefile

@@ -13,9 +13,14 @@ presubmit:
 embeds:
 	go install ./pkg/fileembed/genfileembed/ && genfileembed ./server/camlistored/ui && genfileembed ./pkg/server
 
-checkjs:
+getclosure:
 	perl -e 'require "misc/get_closure.pl"; get_closure_lib(); get_closure_compiler();'
-	if [ -f server/camlistored/newui/all.js ]; then rm server/camlistored/newui/all.js; fi
+
+NEWUIDIR = server/camlistored/newui
+
+minijs: $(NEWUIDIR)/all.js
+
+$(NEWUIDIR)/all.js: $(NEWUIDIR)/blob_item.js $(NEWUIDIR)/blob_item_container.js $(NEWUIDIR)/create_item.js $(NEWUIDIR)/index.js $(NEWUIDIR)/server_connection.js $(NEWUIDIR)/server_connection.js $(NEWUIDIR)/server_type.js $(NEWUIDIR)/toolbar.js
 	# This will generate non working code for now, since camli.js, SHA1.js, Crypto.js,
 	# and base64.js are not explicitely declared as dependencies.
 	tmp/closure-lib/closure/bin/build/closurebuilder.py\
@@ -26,4 +31,7 @@ checkjs:
 		--output_mode=compiled \
 		--compiler_jar=tmp/closure-compiler/compiler.jar \
 		--compiler_flags="--compilation_level=ADVANCED_OPTIMIZATIONS" \
-	> server/camlistored/newui/all.js
+		--compiler_flags="--jscomp_warning=checkTypes" \
+		--compiler_flags="--debug" \
+		--compiler_flags="--formatting=PRETTY_PRINT" \
+	> $(NEWUIDIR)/all.js

dev-server

@@ -7,7 +7,10 @@ require "$Bin/misc/devlib.pl";
 require "$Bin/misc/get_closure.pl";
 
 sub usage {
-    die "Usage: dev-server [--wipe] [--mongo|--mysql|--postgres] [--tls] <portnumber> -- [other_blobserver_opts]";
+    die "Usage: dev-server [--wipe] [--mongo|--mysql|--postgres] [--tls] <portnumber>" .
+    "[--all] [--nobuild] [--staticres] [--offline] [--KBps] <number>" .
+    "[--latency_ms] <number> [--fast] [--verbose] [--hostname] <name> [--compile-js]" .
+    " -- [other_blobserver_opts]";
 }
 
 chdir $Bin or die;
@@ -23,6 +26,7 @@ my $opt_offline;   # don't use the network ("airplane mode")
 my $opt_staticres; # use static resources, not those on disk
 my $opt_tls;
 my $opt_wipe;
+my $opt_closure; # run the Closure compiler
 my $opt_verbose;
 
 # keep indexes in memory only. often used with --wipe, but not
@@ -47,6 +51,7 @@ GetOptions("wipe" => \$opt_wipe,
            "fast" => \$opt_fast,
            "verbose" => \$opt_verbose,
            "hostname=s" => \$opt_hostname,
+           "compile-js" => \$opt_closure,
     )
     or usage();
 
@@ -66,7 +71,7 @@ unless ($opt_fast) {
     $ENV{DEV_THROTTLE_LATENCY_MS} = $opt_latency_ms;
 }
 
-$ENV{CAM_HTTP_DEBUG} = 1 if $opt_verbose;
+$ENV{CAMLI_HTTP_DEBUG} = 1 if $opt_verbose;
 
 my $camlistored;
 my $camdbinit; # closure to return path
@@ -181,6 +186,10 @@ unless ($opt_staticres) {
         get_closure_compiler();
         chdir $Bin or die;
     }
+    if ($opt_closure) {
+        $ENV{CAMLI_USE_COMPILED_JS} = 1;
+        system("make", "minijs") and die "Failed to compress javascript with closure compiler.\n";
+    }
 }
 
 print "Starting dev server on $base/ui/ with password \"pass$port\"\n";

pkg/server/ui.go

@@ -445,6 +445,11 @@ func (ui *UIHandler) serveNewUI(rw http.ResponseWriter, req *http.Request) {
 		ui.serveDepsJS(rw, req)
 		return
 	}
+	// TODO(mpl): temporary hack to ease the work on the newui with
+	// the closure compiler.
+	if strings.HasSuffix(file, "index.html") && os.Getenv("CAMLI_USE_COMPILED_JS") == "1" {
+		file = "/index-compiled.html"
+	}
 	serveStaticFile(rw, req, newuiFiles, file)
 }
 

pkg/webserver/webserver.go

@@ -53,7 +53,7 @@ type Server struct {
 func New() *Server {
 	return &Server{
 		mux:     http.NewServeMux(),
-		verbose: os.Getenv("CAM_HTTP_DEBUG") == "1",
+		verbose: os.Getenv("CAMLI_HTTP_DEBUG") == "1",
 	}
 }
 

server/camlistored/newui/blob_item_container.js

@@ -327,7 +327,7 @@ camlistore.BlobItemContainer.prototype.handleBlobItemChecked_ = function(e) {
 
 
 /**
- * @param {Object} result JSON response to this request.
+ * @param {camlistore.ServerType.IndexerMetaBag} result JSON response to this request.
  * @private
  */
 camlistore.BlobItemContainer.prototype.showRecentDone_ = function(result) {

server/camlistored/newui/index-compiled.html

@@ -0,0 +1,23 @@
+<!doctype html>
+<html>
+  <head>
+    <script src="?camli.mode=config&var=CAMLISTORE_CONFIG"></script>
+    <script src="all.js"></script>
+    <script>
+      window["Camli"].onConfiguration(CAMLISTORE_CONFIG);
+    </script>
+    <!-- easier css handling: https://code.google.com/p/camlistore/issues/detail?id=98 -->
+    <link rel="stylesheet" href="blob_item.css" type="text/css">
+    <link rel="stylesheet" href="blob_item_container.css" type="text/css">
+    <link rel="stylesheet" href="create_item.css" type="text/css">
+    <link rel="stylesheet" href="index.css" type="text/css">
+    <link rel="stylesheet" href="toolbar.css" type="text/css">
+    <link rel="stylesheet" href="closure/goog/css/common.css" type="text/css">
+    <link rel="stylesheet" href="closure/goog/css/toolbar.css" type="text/css">
+  </head>
+  <body>
+    <script>
+      window["newIndexPage"](CAMLISTORE_CONFIG, document.body);
+    </script>
+  </body>
+</html>

server/camlistored/newui/index.html

@@ -1,14 +1,6 @@
 <!doctype html>
 <html>
   <head>
-   <!-- TODO(mpl): conditional include of all.js vs camli.js et al. -->
-<!--
-    <script src="all.js"></script>
-    <script src="?camli.mode=config&var=CAMLISTORE_CONFIG"></script>
-    <script>
-      Camli.onConfiguration(CAMLISTORE_CONFIG);
-    </script>
--->
     <script src="closure/goog/base.js"></script>
     <script src="./deps.js"></script>
     <script src="?camli.mode=config&var=CAMLISTORE_CONFIG"></script>

server/camlistored/newui/index.js

@@ -15,6 +15,14 @@ goog.require('camlistore.ServerConnection');
 goog.require('camlistore.Toolbar');
 goog.require('camlistore.Toolbar.EventType');
 
+// TODO(mpl): Brett, this is just a quick hack so that IndexPage
+// can be called from index.html when the js has been minified.
+// Please feel free to remove when you've moved forward with this.
+window["newIndexPage"] = function(config, body) {
+  var page = new camlistore.IndexPage(config);
+  page.decorate(body);
+};
+
 
 /**
  * @param {camlistore.ServerType.DiscoveryDocument} config Global config
@@ -149,7 +157,7 @@ camlistore.IndexPage.prototype.exitDocument = function() {
 
 
 /**
- * @param {Array.<camlistore.BlobItem>}
+ * @param {Array.<camlistore.BlobItem>} blobItems Items to add to the permanode.
  * @private
  */
 camlistore.IndexPage.prototype.createNewSetWithItems_ = function(blobItems) {

server/camlistored/newui/server_connection.js

@@ -24,7 +24,7 @@ camlistore.ServerConnection = function(config, opt_sendXhr) {
   this.config_ = config;
 
   /**
-   * @type {function}
+   * @type {function()}
    * @private
    */
   this.sendXhr_ = opt_sendXhr || goog.net.XhrIo.send;

server/camlistored/newui/server_type.js

@@ -8,7 +8,7 @@ goog.provide('camlistore.ServerType');
  * @typedef {{
  *   currentPermanode: string,
  *   name: string,
- *   prefix: Array.<string>,
+ *   prefix: Array.<string>
  * }}
  */
 camlistore.ServerType.DiscoveryRoot;
@@ -25,7 +25,7 @@ camlistore.ServerType.DiscoveryRoot;
  *   searchRoot: string,
  *   storageGeneration: string,
  *   storageInitTime: string,
- *   uploadHelper: string,
+ *   uploadHelper: string
  * }}
  */
 camlistore.ServerType.DiscoveryDocument;
@@ -35,7 +35,7 @@ camlistore.ServerType.DiscoveryDocument;
  * @typedef {{
  *   fileName: string,
  *   mimeType: string,
- *   size: number,
+ *   size: number
  * }}
  */
 camlistore.ServerType.IndexerFileMeta;
@@ -43,7 +43,16 @@ camlistore.ServerType.IndexerFileMeta;
 
 /**
  * @typedef {{
- *   attr: Object.<string, Array.<string>>
+ *   title: string,
+ *   camliContent: Array.<camlistore.ServerType.IndexerMeta>
+ * }}
+ */
+camlistore.ServerType.IndexerPermanodeAttrMeta;
+
+
+/**
+ * @typedef {{
+ *   attr: camlistore.ServerType.IndexerPermanodeAttrMeta?
  * }}
  */
 camlistore.ServerType.IndexerPermanodeMeta;
@@ -59,7 +68,7 @@ camlistore.ServerType.IndexerPermanodeMeta;
  *   size: number,
  *   thumbnailHeight: number?,
  *   thumbnailWidth: number?,
- *   thumbnailSrc: string?,
+ *   thumbnailSrc: string?
  * }}
  */
 camlistore.ServerType.IndexerMeta;

server/camlistored/newui/toolbar.js

@@ -134,7 +134,7 @@ camlistore.Toolbar.prototype.exitDocument = function() {
 
 /**
  * TODO: i18n.
- * @param {number>}
+ * @param {number} count Number of items.
  */
 camlistore.Toolbar.prototype.setCheckedBlobItemCount = function(count) {
   if (count) {