Fix for multi-gpu not showing appropriately

Slight visual improvement for custom model load breadcrumbs

aiserver.py

@@ -1031,6 +1031,7 @@ def get_model_info(model, directory=""):
     key_value = ""
     break_values = []
     url = False
+    gpu_count = torch.cuda.device_count()
     if model in [x[1] for x in model_menu['apilist']]:
         if path.exists("settings/{}.settings".format(model)):
             with open("settings/{}.settings".format(model), "r") as file:
@@ -1059,10 +1060,10 @@ def get_model_info(model, directory=""):
                     break_values = file.read().split(",")
             else:
                 break_values = [layer_count]
-                break_values += [0] * (gpu+1 - len(break_values))
+            break_values += [0] * (gpu_count - len(break_values))
     emit('from_server', {'cmd': 'selected_model_info', 'key_value': key_value, 'key':key, 
                          'gpu':gpu, 'layer_count':layer_count, 'breakmodel':breakmodel, 
-                         'break_values': break_values, 'gpu_count': torch.cuda.device_count(),
+                         'break_values': break_values, 'gpu_count': gpu_count,
                          'url': url}, broadcast=True)
     if key_value != "":
         get_oai_models(key_value)

static/application.js

@@ -997,7 +997,7 @@ function buildLoadModelList(ar, menu, breadcrumbs) {
 	$("#loadmodellistbreadcrumbs").html("");
 	var i;
 	for(i=0; i<breadcrumbs.length; i++) {
-		$("#loadmodellistbreadcrumbs").append("<button id='model_breadcrumbs"+i+"' name='"+ar[0][1]+"' value='"+breadcrumbs[i][0]+"'>"+breadcrumbs[i][1]+"</button>");
+		$("#loadmodellistbreadcrumbs").append("<button class=\"breadcrumbitem\" id='model_breadcrumbs"+i+"' name='"+ar[0][1]+"' value='"+breadcrumbs[i][0]+"'>"+breadcrumbs[i][1]+"</button><font color=white>\\</font>");
 		$("#model_breadcrumbs"+i).off("click").on("click", (function () {
 				return function () {
 					socket.send({'cmd': 'selectmodel', 'data': $(this).attr("name"), 'folder': $(this).attr("value")});
@@ -1005,6 +1005,9 @@ function buildLoadModelList(ar, menu, breadcrumbs) {
 				}
 			})(i));
 	}
+	if (breadcrumbs.length > 0) {
+		$("#loadmodellistbreadcrumbs").append("<hr size='1'>")  
+	}
 	for(i=0; i<ar.length; i++) {
 		var html
 		html = "<div class=\"flex\">\

static/custom.css

@@ -1035,7 +1035,7 @@ body.connected .statusiconlabel, .statusiconlabel.always-available {
 }
 
 .loadlistitem {
-	padding: 5px 10px 5px 10px;
+	padding: 0px 0px 0px 0px;
 	display: flex;
 	flex-grow: 1;
 	color: #ffffff;
@@ -1051,6 +1051,28 @@ body.connected .statusiconlabel, .statusiconlabel.always-available {
 	background-color: #688f1f;
 }
 
+.breadcrumbitem {
+	padding: 5px 10px 5px 10px;
+	color: #ffffff;
+	background-color: transparent;
+	border: none;
+	
+	-moz-transition: background-color 0.25s ease-in;
+	-o-transition: background-color 0.25s ease-in;
+	-webkit-transition: background-color 0.25s ease-in;
+	transition: background-color 0.25s ease-in;
+}
+
+.breadcrumbitem:hover {
+	cursor: pointer;
+	background-color: #688f1f;
+}
+
+hr {
+    padding: 0px;
+    margin: 0px;    
+}
+
 .loadlistpadding {
 	padding-right: 10px;
 }