Header: Display current scope in header

cribjs_launcher.js

@@ -80,6 +80,23 @@
         }
       });
   }
+
+  function updateHeaderScope(gadget) {
+    return new RSVP.Queue()
+      .push(function () {
+        return gadget.getDeclaredGadget("crib_sw_gadget");
+      })
+      .push(function (crib_sw_gadget) {
+        return crib_sw_gadget.getScope();
+      })
+      .push(function (scope) {
+        return gadget.getDeclaredGadget("header")
+          .push(function (header_gadget) {
+            return header_gadget.updateScope(scope);
+          });
+      });
+  }
+
   function callCribSWGadget(gadget, method, param_list) {
     var called = true;
     return new RSVP.Queue()
@@ -385,7 +402,11 @@
     })
     .allowPublicAcquisition("crib_sw_setCribEnableGadgetUrl",
                             function (param_list) {
-      return callCribSWGadget(this, "setCribEnableGadgetUrl", param_list);
+      var gadget = this;
+      return callCribSWGadget(this, "setCribEnableGadgetUrl", param_list)
+        .push(function () {
+          return updateHeaderScope(gadget);
+        });
     })
     .allowPublicAcquisition("crib_sw_getCribEnableGadgetUrl",
                             function (param_list) {
@@ -409,7 +430,10 @@
       //initHeaderOptions(gadget);
       return new RSVP.Queue()
         .push(function () {
-          return increaseLoadingCounter(gadget);
+          return RSVP.all([
+            updateHeaderScope(gadget),
+            increaseLoadingCounter(gadget)
+          ]);
         })
         .push(function () {
           return gadget.getDeclaredGadget('router');

gadget/gadget_cribjs_header.html

@@ -56,6 +56,7 @@
             <li><a class="tools" href="#page=tools">Tools</a></li>
           </ul>
           <ul class="nav navbar-nav navbar-right">
+            <li><a class="crib-scope" href=""></a></li>
             <li><li><a class="rotate loader" style="font-size: xx-large;">🌀</a></li>
           </ul>
 

gadget/gadget_cribjs_header.js

@@ -77,16 +77,27 @@
         return this.render(this.stats.options);
       }
     })
+    .declareMethod('updateScope', function (scope) {
+      if (this.stats.scope !== scope) {
+        this.stats.scope = scope;
+        return this.render(this.stats.options);
+      }
+    })
     .declareMethod('render', function (options) {
       var gadget = this,
         page_list = ["cribjs_home", "url_list", "tools"],
-        promise_list = [];
+        promise_list = [],
+        scope_link;
       if (gadget.stats.loaded) {
         gadget.props.element.querySelector(".loader").style.display = "none";
       } else {
         gadget.props.element.querySelector(".loader").style.display = "";
       }
-
+      if (gadget.stats.scope) {
+        scope_link = gadget.props.element.querySelector(".crib-scope");
+        scope_link.href = gadget.stats.scope;
+        scope_link.innerHTML = "Site: " + gadget.stats.scope;
+      }
       gadget.stats.options = options;
       page_list.forEach(function (page) {
         promise_list.push(gadget.getUrlFor({page: page}));