From 8db889e2d466ce68b4eca3d2be8f206b419d0c1b Mon Sep 17 00:00:00 2001
From: Joseph Schorr <jschorr@gmail.com>
Date: Tue, 12 Aug 2014 14:30:59 -0400
Subject: [PATCH] Prevent the logs view table from normally growing too large

---
 static/css/quay.css              | 12 ++++++++++++
 static/directives/logs-view.html |  4 +++-
 static/js/app.js                 | 16 +++++++++++-----
 3 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/static/css/quay.css b/static/css/quay.css
index 4da887da9..844f36779 100644
--- a/static/css/quay.css
+++ b/static/css/quay.css
@@ -565,6 +565,14 @@ i.toggle-icon:hover {
   line-height: 25px;
 }
 
+.logs-view-element .log .log-description code {
+  max-width: 300px;
+  display: inline-block; 
+  vertical-align: middle;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 .logs-view-element .log-performer {
   white-space: nowrap;
 }
@@ -3168,6 +3176,10 @@ p.editable:hover i {
   display: inline-block;
 }
 
+.table-container {
+  max-width: 100%;
+}
+
 .billing-invoices-element .invoice-title {
   padding: 6px;
   cursor: pointer;
diff --git a/static/directives/logs-view.html b/static/directives/logs-view.html
index 695ef266e..5ccea2f3f 100644
--- a/static/directives/logs-view.html
+++ b/static/directives/logs-view.html
@@ -37,7 +37,8 @@
         <input id="log-filter" class="form-control" placeholder="Filter Logs" type="text" ng-model="search.$">
       </div>
     </div> 
-
+    
+    <div class="table-container">
     <table class="table">
       <thead>
         <th>Description</th>
@@ -77,5 +78,6 @@
         </tr>
       </tbody>
     </table>
+    </div>
   </div>
 </div>
diff --git a/static/js/app.js b/static/js/app.js
index 2908580e3..f799b5228 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -398,15 +398,19 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
 
     $provide.factory('UtilService', ['$sanitize', function($sanitize) {
       var utilService = {};
-      
-      utilService.textToSafeHtml = function(text) {
+
+      utilService.escapeHtmlString = function(text) {
         var adjusted = text.replace(/&/g, "&amp;")
           .replace(/</g, "&lt;")
           .replace(/>/g, "&gt;")
           .replace(/"/g, "&quot;")
           .replace(/'/g, "&#039;");
         
-        return $sanitize(adjusted);
+        return adjusted;
+      };
+      
+      utilService.textToSafeHtml = function(text) {
+        return $sanitize(utilService.escapeHtmlString(text));
       };
       
       return utilService;
@@ -526,7 +530,7 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
       return builderService;
     }]);
 
-    $provide.factory('StringBuilderService', ['$sce', function($sce) {
+    $provide.factory('StringBuilderService', ['$sce', 'UtilService', function($sce, UtilService) {
       var stringBuilderService = {};
 
       stringBuilderService.buildString = function(value_or_func, metadata) {
@@ -581,6 +585,8 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
             if (key.indexOf('image') >= 0) {
               value = value.substr(0, 12);
             }
+
+            var safe = UtilService.escapeHtmlString(value);
             var markedDown = getMarkedDown(value);
             markedDown = markedDown.substr('<p>'.length, markedDown.length - '<p></p>'.length);
 
@@ -589,7 +595,7 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
               markedDown = '<i class="fa fa-' + icon + '"></i>' + markedDown;
             }
 
-            description = description.replace('{' + key + '}', '<code>' + markedDown + '</code>');
+            description = description.replace('{' + key + '}', '<code title="' + safe  + '">' + markedDown + '</code>');
           }
         }
         return $sce.trustAsHtml(description.replace('\n', '<br>'));