Fix NPE and other small issues with the new image view

external_libraries.py

@@ -21,7 +21,7 @@ EXTERNAL_CSS = [
   'netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css',
   'netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css',
   'fonts.googleapis.com/css?family=Source+Sans+Pro:400,700',
-  'cdn.core-os.net/icons/core-icons.css'
+  's3.amazonaws.com/cdn.core-os.net/icons/core-icons.css'
 ]
 
 EXTERNAL_FONTS = [

static/js/graphing.js

@@ -1157,8 +1157,11 @@ FileTreeBase.prototype.populateAndDraw_ = function() {
   }
 
   this.root_ = this.nodeMap_[''];
-  this.root_.x0 = 0;
-  this.root_.y0 = 0;
+  if (this.root_) {
+    this.root_.x0 = 0;
+    this.root_.y0 = 0;
+  }
+
   this.toggle_(this.root_);
   this.update_(this.root_);
 };

static/js/pages/image-view.js

@@ -73,7 +73,7 @@
     };
 
     $scope.initializeTree = function() {
-      if ($scope.tree) { return; }
+      if ($scope.tree || !$scope.combinedChanges.length) { return; }
 
       $scope.tree = new ImageFileChangeTree($scope.image, $scope.combinedChanges);
       $timeout(function() {

static/partials/image-view.html

@@ -40,8 +40,17 @@
         <div id="changes" class="tab-pane">
           <div class="resource-view" resource="changesResource" error-message="'Could not load image changes'">
             <h3>Image File Changes</h3>
-            <div id="changes-tree-container" class="changes-container"
-                 onresize="tree && tree.notifyResized()"></div>
+            <div class="empty" ng-if="!combinedChanges.length">
+              <div class="empty-primary-msg">No file changes</div>
+              <div class="empty-secondary-msg">
+                There were no file system changes in this image layer.
+              </div>
+            </div>
+
+            <div ng-show="combinedChanges.length">
+              <div id="changes-tree-container" class="changes-container"
+                   onresize="tree && tree.notifyResized()"></div>
+            </div>
           </div>
         </div>
      </div>