Bug Fix #87 - Scroll multiple devices on create job

Disco.Web/ClientSource/Style/User.css

@@ -461,8 +461,10 @@
 #User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments {
   margin-top: 6px;
   background-color: #fff;
-  line-height: 1.3em;
+  line-height: 1.3;
   border: 1px solid #ddd;
+  max-height: 300px;
+  overflow-y: auto;
 }
 #User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment {
   display: block;
@@ -475,16 +477,14 @@
 #User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment:hover {
   background-color: #f4f4f4;
 }
+#User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment tr:first-child td {
+  width: 68px;
+}
 #User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment td:first-child {
   width: 90px;
   font-weight: 600;
 }
 #User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment img.CreateJob_Assignment_Image {
-  float: left;
   width: 64px;
   height: 64px;
-  margin-right: 6px;
-}
-#User_Show_Details_Actions_CreateJob_Dialog #CreateJob_Assignments li.CreateJob_Assignment div.CreateJob_Assignment_Details {
-  float: left;
 }

Disco.Web/ClientSource/Style/User.less

@@ -487,8 +487,10 @@
     #CreateJob_Assignments {
         margin-top: 6px;
         background-color: @white;
-        line-height: 1.3em;
+        line-height: 1.3;
         border: 1px solid #ddd;
+        max-height: 300px;
+        overflow-y: auto;
 
         li.CreateJob_Assignment {
             display: block;
@@ -503,20 +505,18 @@
                 background-color: @TableDataBorderColour;
             }
 
+            tr:first-child td {
+                width: 68px;
+            }
+
             td:first-child {
                 width: 90px;
                 font-weight: @FontWeightBodyBold;
             }
 
             img.CreateJob_Assignment_Image {
-                float: left;
                 width: 64px;
                 height: 64px;
-                margin-right: 6px;
-            }
-
-            div.CreateJob_Assignment_Details {
-                float: left;
             }
         }
     }

Disco.Web/ClientSource/Style/User.min.css

@@ -1 +1 @@
-.tableData{border:solid 1px #f4f4f4;border-collapse:collapse;}.tableData>tbody>tr>td{border:solid 1px #f4f4f4;background-color:#fff;}.tableData>tbody>tr:nth-child(odd)>td{background-color:#fcfcfc;}.tableData>thead>tr>th,.tableData>tbody>tr>th{background-color:#f4f4f4;border:solid 1px #f4f4f4;}.tableData>tbody>tr:hover>td{background-color:#fefefe;}.tableData>tbody>tr:hover:nth-child(odd)>td{background-color:#fafafa;}.tableData>tfoot>tr>th,.tableData>tfoot>tr>td{background-color:#f4f4f4;}.tableDataDark{border:solid 1px #d8d8d8;border-collapse:collapse;}.tableDataDark td{border:solid 1px #d8d8d8;background-color:#fff;}.tableDataDark th{background-color:#eee;border:solid 1px #d8d8d8;}.tableDataContainer{background-color:#fff;}.tableDataVertical{border:solid 1px #f4f4f4;border-collapse:collapse;}.tableDataVertical>tbody>tr:nth-child(odd){background-color:#f4f4f4;margin:0;padding:0;}.tableDataVertical>tbody>tr>th.name{width:170px;text-align:right;}.tableDataVertical table.sub>tbody>tr:not(:first-child)>th,.tableDataVertical table.sub>tbody>tr:not(:first-child)>td{border-top:1px dashed #aaa;}.tableDataVertical table.sub>tbody>tr>th{font-weight:normal;text-align:right;}.tableDataVertical table.sub>tbody>tr>th.name{text-align:right;}.icon16{display:inline-block;height:16px;width:16px;margin-left:2px;cursor:pointer;}.subtleUntilHover{-moz-opacity:.3;opacity:.3;}.subtleUntilHover:hover{-moz-opacity:1;opacity:1;}#layout_PageHeading #User_Show_Flags{display:inline-block;float:right;height:50px;font-size:.6em;}#layout_PageHeading #User_Show_Flags>i{cursor:default;}#layout_PageHeading #User_Show_Flags>i>.details{display:none;}#User_Show #User_Show_Subjects{table-layout:fixed;}#User_Show #User_Show_Subjects>tbody>tr>td{padding-top:0;height:100%;}#User_Show #User_Show_Subjects>tbody>tr>td>div{position:relative;}#User_Show #User_Show_Subjects>tbody>tr>td>div div.status{margin-top:2px;padding-top:2px;border-top:1px dashed #ddd;}#User_Show #User_Show_Subjects>tbody>tr>td>div input.discreet{margin-left:-2px;}#User_Show #User_Show_Subjects>tbody>tr>td:not(:last-child){border-right:1px dashed #aaa;}#User_Show #User_Show_Subjects #User_Show_Details{width:330px;}#User_Show #User_Show_Subjects #User_Show_Details table.verticalHeadings>tbody>tr>td:first-child{width:104px;font-weight:600;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_Details_Identity_Id{font-weight:600;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_GenerateDocument_Container{padding-top:4px;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_GenerateDocument_Container #User_Show_GenerateDocument{padding:0;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_Details_Actions{margin-top:4px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment{border-bottom:1px dashed #ddd;padding:4px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment td:first-child{width:90px;font-weight:600;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment img.User_Show_AssignedDevices_CurrentAssignment_Image{float:left;width:64px;height:64px;margin-right:6px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment div.User_Show_AssignedDevices_CurrentAssignment_Details{float:left;}#User_Show #User_Show_Subjects #User_Show_Subjects_Actions>td{padding-top:4px;}#UserDetailTabs{margin-top:10px;border-radius:0;background-image:none;background-color:#fff;border:none;padding:0;}#UserDetailTabs #UserDetailTabItems{border-radius:0;border-top:1px solid #ddd;border-right:1px solid #ddd;border-left:1px solid #ddd;border-bottom:none;padding:2px 0 0 4px;background-image:none;background-color:#eee;display:table;}#UserDetailTabs #UserDetailTabItems>li{top:0;border-radius:0;margin:0 5px 0 0;padding:0;line-height:normal;margin-right:4px;}#UserDetailTabs #UserDetailTabItems>li>a{padding:5px 8px;}#UserDetailTabs div.ui-tabs-panel{border-radius:0;padding:4px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;border-left:1px solid #ddd;border-top:none;background-color:#eee;}#UserDetailTab-JobsContainer div.jobTable{margin:-1px;border:1px solid #ddd;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_filter{margin-top:-24px;-moz-opacity:1;opacity:1;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_length{margin-top:-24px;-moz-opacity:1;opacity:1;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_showStatusClosed{right:220px;margin-top:-24px;}#User_Show_Details_Actions_AddFlag_Dialog{height:400px;}#User_Show_Details_Actions_AddFlag_Dialog .flagPicker{position:absolute;width:250px;height:300px;overflow-y:auto;background-color:#fcfcfc;border:1px solid #ccc;}#User_Show_Details_Actions_AddFlag_Dialog .flagPicker>div{background-color:#fff;border-bottom:1px solid #ddd;padding:6px 0 6px 6px;cursor:pointer;}#User_Show_Details_Actions_AddFlag_Line truncated
+.tableData{border:solid 1px #f4f4f4;border-collapse:collapse;}.tableData>tbody>tr>td{border:solid 1px #f4f4f4;background-color:#fff;}.tableData>tbody>tr:nth-child(odd)>td{background-color:#fcfcfc;}.tableData>thead>tr>th,.tableData>tbody>tr>th{background-color:#f4f4f4;border:solid 1px #f4f4f4;}.tableData>tbody>tr:hover>td{background-color:#fefefe;}.tableData>tbody>tr:hover:nth-child(odd)>td{background-color:#fafafa;}.tableData>tfoot>tr>th,.tableData>tfoot>tr>td{background-color:#f4f4f4;}.tableDataDark{border:solid 1px #d8d8d8;border-collapse:collapse;}.tableDataDark td{border:solid 1px #d8d8d8;background-color:#fff;}.tableDataDark th{background-color:#eee;border:solid 1px #d8d8d8;}.tableDataContainer{background-color:#fff;}.tableDataVertical{border:solid 1px #f4f4f4;border-collapse:collapse;}.tableDataVertical>tbody>tr:nth-child(odd){background-color:#f4f4f4;margin:0;padding:0;}.tableDataVertical>tbody>tr>th.name{width:170px;text-align:right;}.tableDataVertical table.sub>tbody>tr:not(:first-child)>th,.tableDataVertical table.sub>tbody>tr:not(:first-child)>td{border-top:1px dashed #aaa;}.tableDataVertical table.sub>tbody>tr>th{font-weight:normal;text-align:right;}.tableDataVertical table.sub>tbody>tr>th.name{text-align:right;}.icon16{display:inline-block;height:16px;width:16px;margin-left:2px;cursor:pointer;}.subtleUntilHover{-moz-opacity:.3;opacity:.3;}.subtleUntilHover:hover{-moz-opacity:1;opacity:1;}#layout_PageHeading #User_Show_Flags{display:inline-block;float:right;height:50px;font-size:.6em;}#layout_PageHeading #User_Show_Flags>i{cursor:default;}#layout_PageHeading #User_Show_Flags>i>.details{display:none;}#User_Show #User_Show_Subjects{table-layout:fixed;}#User_Show #User_Show_Subjects>tbody>tr>td{padding-top:0;height:100%;}#User_Show #User_Show_Subjects>tbody>tr>td>div{position:relative;}#User_Show #User_Show_Subjects>tbody>tr>td>div div.status{margin-top:2px;padding-top:2px;border-top:1px dashed #ddd;}#User_Show #User_Show_Subjects>tbody>tr>td>div input.discreet{margin-left:-2px;}#User_Show #User_Show_Subjects>tbody>tr>td:not(:last-child){border-right:1px dashed #aaa;}#User_Show #User_Show_Subjects #User_Show_Details{width:330px;}#User_Show #User_Show_Subjects #User_Show_Details table.verticalHeadings>tbody>tr>td:first-child{width:104px;font-weight:600;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_Details_Identity_Id{font-weight:600;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_GenerateDocument_Container{padding-top:4px;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_GenerateDocument_Container #User_Show_GenerateDocument{padding:0;}#User_Show #User_Show_Subjects #User_Show_Details #User_Show_Details_Actions{margin-top:4px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment{border-bottom:1px dashed #ddd;padding:4px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment td:first-child{width:90px;font-weight:600;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment img.User_Show_AssignedDevices_CurrentAssignment_Image{float:left;width:64px;height:64px;margin-right:6px;}#User_Show #User_Show_Subjects #User_Show_AssignedDevices .User_Show_AssignedDevices_CurrentAssignment div.User_Show_AssignedDevices_CurrentAssignment_Details{float:left;}#User_Show #User_Show_Subjects #User_Show_Subjects_Actions>td{padding-top:4px;}#UserDetailTabs{margin-top:10px;border-radius:0;background-image:none;background-color:#fff;border:none;padding:0;}#UserDetailTabs #UserDetailTabItems{border-radius:0;border-top:1px solid #ddd;border-right:1px solid #ddd;border-left:1px solid #ddd;border-bottom:none;padding:2px 0 0 4px;background-image:none;background-color:#eee;display:table;}#UserDetailTabs #UserDetailTabItems>li{top:0;border-radius:0;margin:0 5px 0 0;padding:0;line-height:normal;margin-right:4px;}#UserDetailTabs #UserDetailTabItems>li>a{padding:5px 8px;}#UserDetailTabs div.ui-tabs-panel{border-radius:0;padding:4px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;border-left:1px solid #ddd;border-top:none;background-color:#eee;}#UserDetailTab-JobsContainer div.jobTable{margin:-1px;border:1px solid #ddd;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_filter{margin-top:-24px;-moz-opacity:1;opacity:1;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_length{margin-top:-24px;-moz-opacity:1;opacity:1;}#UserDetailTab-JobsContainer .dataTables_wrapper .dataTables_showStatusClosed{right:220px;margin-top:-24px;}#User_Show_Details_Actions_AddFlag_Dialog{height:400px;}#User_Show_Details_Actions_AddFlag_Dialog .flagPicker{position:absolute;width:250px;height:300px;overflow-y:auto;background-color:#fcfcfc;border:1px solid #ccc;}#User_Show_Details_Actions_AddFlag_Dialog .flagPicker>div{background-color:#fff;border-bottom:1px solid #ddd;padding:6px 0 6px 6px;cursor:pointer;}#User_Show_Details_Actions_AddFlag_Line truncated

Disco.Web/Views/User/UserParts/_Subject.cshtml

@@ -12,7 +12,8 @@
                     <div id="User_Show_Details_Identity">
                         <table class="none verticalHeadings">
                             <tr>
-                                <td><span>Username (Id):</span>
+                                <td>
+                                    <span>Username (Id):</span>
                                 </td>
                                 <td>
                                     <h4 id="User_Show_Details_Identity_Id" title="Username">@Model.User.UserId</h4>
@@ -115,7 +116,8 @@
                                     <div class="clearfix">
                                         <i class="fa fa-info-circle information"></i>&nbsp;Multiple devices are assigned to this user.
                                         <br />
-                                    <strong>Which device should be associated with this job?
+                                        <strong>
+                                            Which device should be associated with this job?
                                         </strong>
                                     </div>
                                     <div>
@@ -123,19 +125,24 @@
                                             @foreach (var assignment in currentDeviceAssignments)
                                             {
                                         <li class="CreateJob_Assignment clearfix" data-createjoburl="@Url.Action(MVC.Job.Create(assignment.DeviceSerialNumber, Model.User.UserId))">
-                                                <img class="CreateJob_Assignment_Image" alt="Model Image" src="@Url.Action(MVC.API.DeviceModel.Image(assignment.Device.DeviceModel.Id, assignment.Device.DeviceModel.ImageHash()))" />
-                                                <div class="CreateJob_Assignment_Details">
                                             <table class="none">
                                                 <tbody>
                                                     <tr>
-                                                                <td>Serial Number:
+                                                        <td rowspan="5">
+                                                            <img class="CreateJob_Assignment_Image" alt="Model Image" src="@Url.Action(MVC.API.DeviceModel.Image(assignment.Device.DeviceModel.Id, assignment.Device.DeviceModel.ImageHash()))" />
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            Serial Number:
                                                         </td>
                                                         <td>
                                                             <span>@assignment.Device.SerialNumber</span> (<span>@assignment.Device.ComputerName</span>)
                                                         </td>
                                                     </tr>
                                                     <tr>
-                                                                <td>Model:
+                                                        <td>
+                                                            Model:
                                                         </td>
                                                         <td>
                                                             <span>@assignment.Device.DeviceModel.ToString()</span>
@@ -162,9 +169,7 @@
                                                     </tr>
                                                 </tbody>
                                             </table>
-                                                </div>
+                                        </li>}
-                                            </li>   
-                                        }
                                         </ul>
                                     </div>
                                 </div>
@@ -339,7 +344,8 @@
                                             <table class="none">
                                                 <tbody>
                                                     <tr>
-                                                    <td>Serial Number:
+                                                        <td>
+                                                            Serial Number:
                                                         </td>
                                                         <td>
                                                             <span class="User_Show_AssignedDevices_CurrentAssignment_SerialNumber">
@@ -370,7 +376,8 @@
                                                     @if (assignment.Device.DeviceModelId.HasValue)
                                                     {
                                                         <tr>
-                                                        <td>Model:
+                                                            <td>
+                                                                Model:
                                                             </td>
                                                             <td>
                                                                 <span class="User_Show_AssignedDevices_CurrentAssignment_Model">@assignment.Device.DeviceModel.ToString()</span>
@@ -378,7 +385,8 @@
                                                         </tr>
                                                     }
                                                     <tr>
-                                                    <td>Profile:
+                                                        <td>
+                                                            Profile:
                                                         </td>
                                                         <td>
                                                             <span class="User_Show_AssignedDevices_CurrentAssignment_Profile">@assignment.Device.DeviceProfile.ToString()</span>
@@ -387,7 +395,8 @@
                                                     @if (assignment.Device.DeviceBatchId.HasValue)
                                                     {
                                                         <tr>
-                                                        <td>Batch:
+                                                            <td>
+                                                                Batch:
                                                             </td>
                                                             <td>
                                                                 <span class="User_Show_AssignedDevices_CurrentAssignment_Batch">@assignment.Device.DeviceBatch.ToString()</span>