[animgraph] Refactored preview Anim Set

Author: EspeuteClement

bin/style.css

@@ -4269,6 +4269,8 @@ graph-editor-root properties-container graph-parameters {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
+  min-width: 0;
+  min-height: 0;
 }
 graph-editor-root properties-container graph-parameters h1 {
   font-size: 1.2em;
@@ -4279,6 +4281,7 @@ graph-editor-root properties-container graph-parameters > ul {
   flex-direction: column;
   list-style: none;
   align-items: stretch;
+  overflow-y: auto;
   gap: 2px;
 }
 graph-editor-root properties-container graph-parameters > ul graph-parameter {
@@ -4369,6 +4372,10 @@ graph-editor-root properties-container graph-parameters > ul graph-parameter:aft
   bottom: 0px;
   pointer-events: none;
 }
+graph-editor-root properties-container .anim-list {
+  flex-grow: 0;
+  flex-shrink: 0;
+}
 center-content {
   width: 100%;
   height: 100%;

bin/style.less

@@ -5051,6 +5051,9 @@ graph-editor-root {
 			flex-direction: column;
 			flex-grow: 1;
 
+			min-width: 0;
+			min-height: 0;
+
 			h1 {
 				font-size: 1.2em;
 			}
@@ -5062,6 +5065,7 @@ graph-editor-root {
 				list-style: none;
 				align-items: stretch;
 
+				overflow-y: auto;
 				gap: 2px;
 				graph-parameter {
 					display: flex;
@@ -5170,6 +5174,12 @@ graph-editor-root {
 					}
 				}
 			}
+
+		}
+
+		.anim-list {
+			flex-grow: 0;
+			flex-shrink: 0;
 		}
 	}
 }

hide/view/animgraph/AnimGraphEditor.hx

@@ -17,6 +17,8 @@ class AnimGraphEditor extends GenericGraphEditor {
     var previewNode : hrt.animgraph.nodes.AnimNode = null;
     var queuedPreview : hrt.animgraph.nodes.AnimNode = null;
 
+    var customProviderIndex : Int = 0;
+
     override function reloadView() {
         previewNode = null;
         animGraph = cast hide.Ide.inst.loadPrefab(state.path, null,  true);
@@ -44,6 +46,13 @@ class AnimGraphEditor extends GenericGraphEditor {
 
         refreshPamamList();
 
+        var dl = new Element("<dl></dl>").appendTo(propertiesContainer);
+        addAnimSetSelector(dl, undo, () -> customProviderIndex, (i: Int) -> {
+			customProviderIndex = i;
+			refreshPreview();
+		});
+
+
         new AnimList(propertiesContainer, null, getAnims(scenePreview, animGraph.animFolder));
 
         graphEditor.element.get(0).addEventListener("dragover", (e: js.html.DragEvent) -> {
@@ -210,6 +219,43 @@ class AnimGraphEditor extends GenericGraphEditor {
         return options;
     }
 
+    static public function addAnimSetSelector(target: Element, undo: hide.ui.UndoHistory, getIndex: () -> Int, setIndex:(Int) -> Void) {
+        if (hrt.animgraph.AnimGraph.customEditorResolverProvider != null)
+        {
+            var div = new Element("<div></div>").appendTo(target);
+            div.append(new Element("<dt>Anim Set</dt>"));
+
+            var providers = hrt.animgraph.AnimGraph.customEditorResolverProvider(_);
+
+            var button = new hide.comp.Button(div, null, null, {hasDropdown: true});
+            button.label = providers[getIndex()].name;
+
+            var options : Array<hide.comp.ContextMenu.MenuItem> = [];
+            for (i => provider in providers) {
+                options.push({
+                    label: provider.name,
+                    click: () -> {
+                        var old = getIndex();
+                        function exec(isUndo: Bool) {
+                            if (!isUndo) {
+                                setIndex(i);
+                            } else {
+                                setIndex(old);
+                            }
+                            button.label = providers[getIndex()].name;
+                        }
+                        exec(false);
+                        undo.change(Custom(exec));
+                    }
+                });
+            }
+
+            button.onClick = () -> {
+                hide.comp.ContextMenu.createDropdown(button.element.get(0), options, {search: Visible, autoWidth: true});
+            }
+        }
+    }
+
     public function refreshPreview() {
         if (previewNode != null)
             setPreview(previewNode);
@@ -233,7 +279,7 @@ class AnimGraphEditor extends GenericGraphEditor {
             var resolver = null;
             if (AnimGraph.customEditorResolverProvider != null) {
                 var providers = AnimGraph.customEditorResolverProvider(_);
-                resolver = providers != null ? providers[0].resolver : null;
+                resolver = providers != null ? providers[customProviderIndex].resolver : null;
             }
             var anim = animGraph.getAnimation(previewNode, resolver);
             previewModel.playAnimation(anim);

hide/view/animgraph/BlendSpace2DEditor.hx

@@ -451,42 +451,10 @@ class BlendSpace2DEditor extends hide.view.FileView {
 			updatePreviewAxis();
 		});
 
-		if (hrt.animgraph.AnimGraph.customEditorResolverProvider != null)
-		{
-			var dl = preview.find("dl");
-			var div = new Element("<div></div>").appendTo(dl);
-			div.append(new Element("<dt>Anim Set</dt>"));
-
-			var providers = hrt.animgraph.AnimGraph.customEditorResolverProvider(_);
-
-			var button = new hide.comp.Button(div, null, null, {hasDropdown: true});
-			button.label = providers[customProviderIndex].name;
-
-			var options : Array<hide.comp.ContextMenu.MenuItem> = [];
-			for (i => provider in providers) {
-				options.push({
-					label: provider.name,
-					click: () -> {
-						var old = customProviderIndex;
-						function exec(isUndo: Bool) {
-							if (!isUndo) {
-								customProviderIndex = i;
-							} else {
-								customProviderIndex = old;
-							}
-							button.label = providers[customProviderIndex].name;
-							refreshPreviewAnimation();
-						}
-						exec(false);
-						undo.change(Custom(exec));
-					}
-				});
-			}
-
-			button.onClick = () -> {
-				hide.comp.ContextMenu.createDropdown(button.element.get(0), options, {search: Visible, autoWidth: true});
-			}
-		}
+		AnimGraphEditor.addAnimSetSelector(preview.find("dl"), undo, () -> customProviderIndex, (i: Int) -> {
+			customProviderIndex = i;
+			refreshPreviewAnimation();
+		});
 	}
 
 	override function save() {