Observatory grab-bag for 1.4 release.

runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html

Index: runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html
diff --git a/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html b/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html
index 75f316ce418a9b07da7ad3bd494133c856753d85..6abf9988409fc2232e44ceba609b8f201c07511c 100644
--- a/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html
+++ b/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/library_view.html
@@ -29,18 +29,8 @@
       <div class="memberList">
         <div class="memberItem">
           <div class="memberName">url</div>
-          <div class="memberValue">{{ library['url'] }}</div>
+          <div class="memberValue">{{ library.url }}</div>
         </div>
-        <template if="{{ library['imports'].length > 0 }}">
-          <div class="memberItem">
-            <div class="memberName">imports</div>
-            <div class="memberValue">
-              <template repeat="{{ import in library['imports'] }}">
-                <library-ref ref="{{ import }}"></library-ref>
-              </template>
-            </div>
-          </div>
-        </template>
         <template if="{{ library.name != library.vmName }}">
           <div class="memberItem">
             <div class="memberName">vm name</div>
@@ -53,11 +43,27 @@
     <hr>
 
     <div class="content">
-      <template if="{{ library['scripts'].isNotEmpty }}">
-        scripts ({{ library['scripts'].length }})
-        <curly-block>
+      <template if="{{ library.imports.isNotEmpty }}">
+        imports ({{ library.imports.length }})
+        <curly-block expand="{{ library.imports.length <= 8 }}">
+          <div class="memberList">
+            <template repeat="{{ imp in library.imports }}">
+              <div class="memberItem">
+                <div class="memberValue">
+                  <library-ref ref="{{ imp }}"></library-ref>
+                </div>
+              </div>
+            </template>
+          </div>
+        </curly-block><br>
+        <br>
+      </template>
+
+      <template if="{{ library.scripts.isNotEmpty }}">
+        scripts ({{ library.scripts.length }})
+        <curly-block expand="{{ library.scripts.length <= 8 }}">
           <div class="memberList">
-            <template repeat="{{ script in library['scripts'] }}">
+            <template repeat="{{ script in library.scripts }}">
               <div class="memberItem">
                 <div class="memberValue">
                   <script-ref ref="{{ script }}"></script-ref>
@@ -66,13 +72,14 @@
             </template>
           </div>
         </curly-block><br>
+        <br>
       </template>
 
-      <template if="{{ library['classes'].isNotEmpty }}">
-        classes ({{ library['classes'].length }})
-        <curly-block>
+      <template if="{{ library.classes.isNotEmpty }}">
+        classes ({{ library.classes.length }})
+        <curly-block expand="{{ library.classes.length <= 8 }}">
           <div class="memberList">
-            <template repeat="{{ cls in library['classes'] }}">
+            <template repeat="{{ cls in library.classes }}">
               <div class="memberItem">
                 <div class="memberValue">
                   <class-ref ref="{{ cls }}"></class-ref>
@@ -81,13 +88,14 @@
             </template>
           </div>
         </curly-block><br>
+        <br>
       </template>
 
-      <template if="{{ library['variables'].isNotEmpty }}">
-        variables ({{ library['variables'].length }})
-        <curly-block>
+      <template if="{{ library.variables.isNotEmpty }}">
+        variables ({{ library.variables.length }})
+        <curly-block expand="{{ library.variables.length <= 8 }}">
           <div class="memberList">
-            <template repeat="{{ field in library['variables'] }}">
+            <template repeat="{{ field in library.variables }}">
               <div class="memberItem">
                 <div class="memberName">
                   <field-ref ref="{{ field }}"></field-ref>
@@ -101,13 +109,14 @@
             </template>
           </div>
         </curly-block><br>
+        <br>
       </template>
 
-      <template if="{{ library['functions'].isNotEmpty }}">
-        functions ({{ library['functions'].length }})
-        <curly-block>
+      <template if="{{ library.functions.isNotEmpty }}">
+        functions ({{ library.functions.length }})
+        <curly-block expand="{{ library.functions.length <= 8 }}">
           <div class="memberList">
-            <template repeat="{{ function in library['functions'] }}">
+            <template repeat="{{ function in library.functions }}">
               <div class="memberItem">
                 <div class="memberValue">
                   <function-ref ref="{{ function }}"></function-ref>
@@ -116,6 +125,7 @@
             </template>
           </div>
         </curly-block><br>
+        <br>
       </template>
     </div>