Config Editor Plugin

This unofficial TaleSpire dependency plugin for automatically creating a runtime config editor which allows the editing or simple and complex object JSON files through a GUI interface.

Change Log

1.2.2: Disable core TS processing of keyboard when editor is open
1.2.1: Exposed default layout settings to config
1.2.0: Added multiple subscription functionality
1.2.0: Added functionality for a token based subscribe and unsubscribe
1.1.1: Removed unused dependencies
1.1.0: Simplified usage
1.1.0: Added Color Picker support
1.0.2: Updated package to include default background colors. No plugin change.
1.0.1: Added mandatory header to Render method
1.0.0: Initial release

Install

Install using R2ModMan usually as a dependency of some other plugin.

Usage: Quick Start Quide

When you want to add a Config Editor for some JSON do the following:

1. In the Awake() or similar add the Subcribe(callback) function. The callback will do something with the updated JSON when the user presses the Save button.
2. In your code call the Open(header, json, buttons) method to open the Config Editor.
3. In the OnGUI() method, add Render(). You don't need to make this conditional. The Config Editor will only render if it is opne even if you call Render when it is close
4. Call Close() in your callback

Usage: I Need More Customization

This is a dependency plugin so it does not provide any user features directly. Instead other plugins can make use of it to render config editor GUIs for editing most JSON configurations. The following methods are expoded:

Subscribe(Action<string,string> saveCallback)

When the Config Editor is showing, any changes are not automatically saved. Instead you can add buttons (defined in the Open method) and those buttons generate a callback when pressed. The callback takes two strings. The first string is the name of the button that was pressed. The second string is the update json of the Config Editor. The callback can be used to implement any function from Cancel to Apply to Save.

Using a callback like this gives the benefit that the user can do whatever with the updated JSON and it also avoids constant disk writing by waiting until all the changes are made before writing the updated config to disk.

Subscription(Action<string,string> saveCallback)

Same as Subscribe but returns a subscription id which can be used in the below method to remove a subscription.

**RemoveSubscription(System.Guid subscriptionGuid)

Removes a previously made subscription using the subscription id that was provdied in the Subscription method call. Subscriptions made with the Subscribe method cannot be unsubscribed.

SetLayout(int startX = 60, int startY = 90, int menuVerticalSpacing = 20, int menuHorizontalSpacing = 300, int menuEntryWidth = 280, int menuHorizontalOffsetToEntry = 200, int menuEntryIndent = 5, float menuEntrydebunchngFactor = 0.8f)

The Config Editor has a default layout as indicated by the default numbers for each parameter. However, if desired, this method can be used to change the default layout parameters to customize the spacing of the Config Editor.

startX indicates the horizontal offset from the left side of the screen in pixels where the Config Editor dialog appears.

startY indicates the vertical offset from the top of screen in pixels where the Config Editor dialog appears.

menuVerticalSpacing indicates the height, in pixels, of the menu entries. This is the space from one entry to another. The actual background and text area will be a fraction of this value based on the menuEntrydebunchngFactor. Font size is automatically determined from this value.

menuHorizontalSpacing indicates the width, in pixels, of the menu columns. This is the space between one column of entries and the next.

menuEntryWidth indicates the width, in pixels, of the menu entries. This is the width of the column. If menuEntryWidth equals menuHorizontalSpacing there will be no gap between columns. Typically menuHorizontalSpacing is slightly larger than the value of menuEntryWidth so that there is a gap between columns.

menuHorizontalOffsetToEntry indicates the number of pixels that the text entry is from the beginning of the menu entry. The space between the menu entry start and this value is used for the label and the space after until the entryWidth value is used for the text entry.

menuEntryIndent indicates the number of pixels that sub-headers and property labels are indented. Each level of the hierarchy indents this amount of pixels.

menuEntrydebunchngFactor indicates what fraction of the menu entry height is used for the text and background. A value of 1.0 means the full height is used meaning there will be no gap between rows in the Config Editor if the entries use a background color. Values less than 1.0 use the specified fraction of the height thus leaving gaps between the menu entries.

SetColorization(string headerFontColor, FontStyle headerFontStyle, Texture2D headerBackground, string labelFontColor, FontStyle labelFontStyle, Texture2D labelBackground, string entryFontColor, FontStyle entryFontStyle, Texture2D entryBackground, string buttonFontColor, FontStyle buttonFontStyle, Texture2D buttonBackground, Texture2D editorBackground)

The default colors used match the Talespire color scheme but this method can be used to change the color of the front and background colors of the GUI elements.

headerFontColor is a word representation of a color, such as 'red', that is used as the font (foreground) color of all Config Editor headers. Colors codes are not yet supported.

headerFontStyle is a enumeration (Normal=0, Bold=1, Italic=2, BoldAndItalic=3) indicating font (foreground) style of all Config Editor headers.

headerBackground is a Texture2D (stretched to fit) used as the background for all GUI header entries.

labelFontColor is a word representation of a color, such as 'red', that is used as the font (foreground) color of all Config Editor labels. Colors codes are not yet supported.

labelFontStyle is a enumeration (Normal=0, Bold=1, Italic=2, BoldAndItalic=3) indicating font (foreground) style of all Config Editor labels.

labelBackground is a Texture2D (stretched to fit) used as the background for all GUI label entries.

entryFontColor is a word representation of a color, such as 'red', that is used as the font (foreground) color of all Config Editor text entry fields. Colors codes are not yet supported.

entryFontStyle is a enumeration (Normal=0, Bold=1, Italic=2, BoldAndItalic=3) indicating font (foreground) style of all Config Editor text entry fields.

entryBackground is a Texture2D (stretched to fit) used as the background for all GUI text field entries.

buttonFontColor is a word representation of a color, such as 'red', that is used as the font (foreground) color of all Config Editor buttons. Colors codes are not yet supported.

buttonFontStyle is a enumeration (Normal=0, Bold=1, Italic=2, BoldAndItalic=3) indicating font (foreground) style of all Config Editor buttons.

buttonBackground is a Texture2D (stretched to fit) used as the background for all GUI buttons.

editorBackground is a Texture2D (stretched to fit) used as the background for the Config Editor background itself. Note that the background is scaled to fix the number of entries.

Open(string header, string json, string[] buttons)

This method is used to open the Config Editor with specific content.

header is a string which indicates the top level title of the content to be displayed. json is a string representation of the content to be edited. buttons is a string array of buttons to be added at the end of the Config Editor.

Multiple instances of the Editor cannot be open at once. Use the isEditorOpen property to check if the Editor is already open. Calling this method when the editor is open will not do anything except generate a log message.

Render()

This method is used in the OnGUI(). The Config Editor will only render the content if it is open so it is safe to place a Render() call in the OnGUI() method without any condition (i.e. the plugin does not need to track if the Config Ediotr is open or not).

Close()

This method is used to close the Config Editor. All changes in the Editor will be deleted. Normally a call to this method is done in the subscription callback to close the Config Editor once a selection has been made. However, it is not done automatically so that functions like Apply can be implemented which don't close the Config Editor.

Save()

This method takes the current Confog Editor values and regenerate the corresponding updated JSON string and returns it. As such the function does not actually save any changes. Instead it provides the updated JSON so that it can be used and/or saved. This method is typically not needed since the GUI provides a Save button which does the same through the subscribe callback. However, this method can be used by the plugin to, for example, performa a period save or backup.

Sample Code

        void Awake()
        {
            ConfigEditorPlugin.Subscribe(EditorCallback);
        }

        void Update()
        {
            if (Utility.isBoardLoaded())
            {
                if (Utility.StrictKeyCheck(triggerKey.Value))
                {
                    // Open Config Editor
                    ConfigEditorPlugin.offsetXToEntry = 120;
                    ConfigEditorPlugin.Open("Light", JsonConvert.SerializeObject(LightPlugin.lights[lightName]), new string[] {"Cancel", "Apply", "Save"});
                    ConfigEditorPlugin.SetItemDataType("specs.color", typeof(System.Drawing.Color));
                }
            }
        }

        void OnGUI()
        {
			// Render Config Editor if open
            ConfigEditorPlugin.Render();
        }

        private void EditorCallback(string button, string json)
        {
		    switch(button)
			{
			    case "Apply":
				  Apply();
				  break;
				case "Save":
				  //
				  Apply();
				  Save();
				  ConfigEditorPlugin.Close();
				  break;
				case "Cancel":
				  ConfigEditorPlugin.Close();
				  break;
			}
        }
    }
}