Add editing functionality to "view all metadata"

.gitignore

@@ -350,3 +350,4 @@ healthchecksdb
 src/ViewAllMetadata/ViewAllMetadata.UIX.mfappx
 *.mfappx
 /src/Common/bundles
+/src/UIHelpers/install-application.local.ps1

README.md

@@ -3,3 +3,64 @@
 These are some example UIX applications showing how commonly-requested functionality can be created and maintained by third parties.
 
 **NOTE: This code is produced as an open-source sample.  M-Files can provide no support on its use, nor can be held responsible for issues caused by its use or misuse.**
+
+## Getting started
+
+### Installation
+
+This application is designed to be distributed via the compiled `UIHelpers.mfappx` file.  This can be installed to the vault using [M-Files Admin](https://www.m-files.com/user-guide/latest/eng/Applications.html).  The application must be built from the source code in this repository; M-Files does not distribute compiled versions.
+
+### Configuration
+
+Once installed, navigate to the vault's `Configuration` section, expand `Other Applications` and select `UI Helpers`.  Selecting the `Configuration` tab will allow each module to be configured separately.  Common module configuration includes:
+
+* Whether the module is enabled or not.
+* Which users can access the module (either by role - e.g. "all users with the full control role" - or by specifically allowing access to certain users or groups).
+* Control over any UI components that the module contains (e.g. the default height/width of the popup window, which locations the UI component can be shown in, etc.).
+* The ability to provide translations for common UI elements that are automatically applied based on the desktop language of the user.
+* Logging.
+
+## Available modules
+
+### Show preview
+
+This module allows users to view the preview of an object either in the "bottom pane" (below the listing) or in a popout window.  This allows the user to view both the preview and metadata card at the same time.
+
+By default this module is **not enabled**.  When enabled it defaults to allowing **all users** to see the preview.  These defaults can be changed in the configuration.
+
+To start, ensure that the [module is activated and your user has access](#getting-started) then open M-Files Desktop, right-click on an object and select `Show preview`.  The preview appears below the listing, but can be toggled to other locations using the icons in the Function Ribbon.  The preview can be closed by clicking the `Close` button.
+
+### View all metadata
+
+This module allows users to view the metadata of an object without Metadata Card Configuration rules applied.  This can be useful in some situations (e.g. to debug Metadata Card Configuration rules).  **Note: Metadata Card Configuration rules should never be used instead of proper property-level permissions.**
+
+By default this module is **not enabled**.  When enabled it defaults to allowing **users with the full control of vault role** to see all metadata.  These defaults can be changed in the configuration.
+
+To start, ensure that the [module is activated and your user has access](#getting-started) then open M-Files Desktop, right-click on an object and select `View all metadata`.  The raw metadata appears below the listing, but can be toggled to other locations using the icons in the Function Ribbon.  The metadata card can be closed by clicking the `Close` button.
+
+## Project structure
+
+### UIHelpers.csproj
+
+The core project that declares the various modules that are available.  Each module consists of server-side components, held in this project, and optional client-side components, held in their own project.
+
+### Common.csproj
+
+A project containing common files for use in client-side (UIX) components.  Individual files in the `src` folder can be linked as-is (although note that they may have dependencies), but the recommended approach is to link to the associated files in the `bundle` folder, which are created automatically on build.  The definition for these bundled files can be seen in `bundleconfig.json`.
+
+### ShowPreview.UIX.csproj
+
+A pure-JavaScript UIX application that allows the user to view previews of the selected object.
+
+* `app\shellui.js` contains the application entry point.
+* `app\dashboard\dashboard.js` contains the dashboard entry point.
+* `app\scripts\renderers\objectrenderer.js` contains the `render` method which is called when an object is selected, and which renders the preview itself.
+
+### ViewAllMetadata.UIX.csproj
+
+A pure-JavaScript UIX application that allows the user to view the metadata card of the selected object without any metadata card configuration rules applied.
+
+* `app\shellui.js` contains the application entry point.
+* `app\dashboard\dashboard.js` contains the dashboard entry point.
+* `app\scripts\renderers\objectrenderer.js` contains the `render` method which is called when an object is selected, and which renders the properties to the screen.
+* `app\scripts\renderers\*PropertyValueRenderer.js` contain renderers for different property data types.

src/Common/Common.csproj

@@ -1,4 +1,4 @@
-<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003" InitialTargets="CleanAll">
+<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
   <Import Project="$(MSBuildExtensionsPath)$(MSBuildToolsVersion)\Microsoft.Common.props" Condition="Exists('$(MSBuildExtensionsPath)$(MSBuildToolsVersion)\Microsoft.Common.props')" />
   <PropertyGroup>
     <_BundlerMinifierTaskAssembly Condition="'$(MSBuildRuntimeType)' == 'Core'">..\packages\BuildBundlerMinifier.3.2.449\tools\netstandard1.3\BundlerMinifier.dll</_BundlerMinifierTaskAssembly>
@@ -40,9 +40,22 @@
     </Content>
     <Content Include="src\dashboards\base-dashboard.css" />
     <Content Include="src\ConfigurationManager.js" />
+    <Content Include="src\dashboards\images\arrow_drop_down_s1_grey.png" />
+    <Content Include="src\dashboards\images\create_s1_grey.png" />
+    <Content Include="src\dashboards\images\delete_s1_grey.png" />
+    <Content Include="src\dashboards\images\disable.png" />
+    <Content Include="src\dashboards\images\ellipsis_s1_grey.png" />
+    <Content Include="src\dashboards\images\enable.png" />
+    <Content Include="src\dashboards\images\filter_s1.png" />
+    <Content Include="src\dashboards\images\filter_s1.svg" />
+    <Content Include="src\dashboards\images\filter_s1_grey.png" />
+    <Content Include="src\dashboards\images\filter_s1_grey.svg" />
+    <Content Include="src\dashboards\images\icon-delete.png" />
     <Content Include="src\dashboards\scripts\console-dashboard.js" />
     <Content Include="src\console-shellui.js" />
     <Content Include="src\dashboards\scripts\Dashboard.js" />
+    <Content Include="src\dashboards\scripts\Promise.polyfill.min.js" />
+    <Content Include="src\dashboards\scripts\setImmediate.js" />
     <Content Include="src\Events.js" />
     <Content Include="src\dashboards\images\bottom-pane.png" />
     <Content Include="src\dashboards\images\icon-edit.png" />
@@ -51,6 +64,7 @@
     <Content Include="src\json2.js" />
     <Content Include="src\Orchestrator.js" />
     <Content Include="src\dashboards\scripts\jquery-1.12.4.min.js" />
+    <Content Include="src\Promise.polyfill.shellui.js" />
     <Content Include="src\SingleWindowOrchestrator.js" />
     <Content Include="src\VaultStructureManager.js" />
     <Content Include="src\WindowManager.js" />
@@ -59,16 +73,12 @@
     <None Include="bundleconfig.json" />
     <None Include="packages.config" />
   </ItemGroup>
-  <Target Name="CleanAll">
+  <Target Name="Clean">
     <RemoveDir Directories="out;bin;obj;bundles" />
-    <BundlerMinifier.BundlerBuildTask FileName="$(MSBuildProjectDirectory)\bundleconfig.json" />
   </Target>
   <Target Name="Build">
+    <BundlerMinifier.BundlerBuildTask FileName="$(MSBuildProjectDirectory)\bundleconfig.json" />
   </Target>
-  <Target Name="BundleMinifyClean" AfterTargets="CoreClean">
-    <BundlerMinifier.BundlerCleanTask FileName="$(MSBuildProjectDirectory)\bundleconfig.json" />
-  </Target>
-  <Target Name="Rebuild" DependsOnTargets="CleanAll" />
   <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
        Other similar extension points exist, see Microsoft.Common.targets.
   <Target Name="BeforeBuild">

src/Common/bundleconfig.json

@@ -9,14 +9,17 @@
       "src/SingleWindowOrchestrator.js",
       "src/ConfigurationManager.js",
       "src/VaultStructureManager.js",
-      "src/WindowManager.js"
+      "src/WindowManager.js",
+      "src/Promise.polyfill.shellui.js"
     ]
   },
   {
     "outputFileName": "bundles/common-dashboard.js",
     "inputFiles": [
       "src/dashboards/scripts/console-dashboard.js",
       "src/dashboards/scripts/jquery-1.12.4.min.js",
+      "src/dashboards/scripts/setImmediate.js",
+      "src/dashboards/scripts/Promise.polyfill.min.js",
       "src/Events.js",
       "src/dashboards/scripts/Dashboard.js"
     ]

src/Common/src/Events.js

@@ -19,6 +19,6 @@
 			eventListeners[eventType] = [];
 		for (var i = 0; i < eventListeners[eventType].length; i++)
 			if (typeof (eventListeners[eventType][i]) == "function")
-				eventListeners[eventType][i].apply(e, Array.prototype.slice.call(arguments, 1));
+				eventListeners[eventType][i].apply(this, Array.prototype.slice.call(arguments, 1));
 	}
 }

src/Common/src/Promise.polyfill.shellui.js

@@ -0,0 +1,94 @@
+function Promise(fn)
+{
+    var p = this;
+    var run = false;
+    var success = false;
+    var data = null;
+    var calledBack = false;
+    var thenCallbacks = [];
+    var catchCallbacks = [];
+
+    function resolve(d)
+    {
+        data = d;
+        calledBack = true;
+        success = true;
+        p.then();
+    }
+    function reject()
+    {
+        calledBack = true;
+        success = false;
+        p["catch"]();
+    }
+
+    function action()
+    {
+        try
+        {
+            run = true;
+            fn(resolve, reject);
+        }
+        catch (e)
+        {
+            console.log(e);
+            MFiles.ThrowError(MFiles.GetLongErrorDescription(e));
+        }
+    }
+
+    p.then = function (fn)
+    {
+        if (typeof fn == "function")
+            thenCallbacks.push(fn);
+
+        // Have we already run?
+        if (run)
+        {
+            // Sanity.
+            if (false == calledBack)
+            {
+                console.error("Promise execution did not call resolve or reject.");
+            }
+
+            // Was it successful?
+            if (success)
+            {
+                for (var i = 0; i < thenCallbacks.length; i++)
+                    thenCallbacks[i](data);
+            }
+            return p;
+        }
+
+        return p;
+    }
+
+    p["catch"] = function (fn)
+    {
+        if (typeof fn == "function")
+            catchCallbacks.push(fn);
+
+        // Have we already run?
+        if (run)
+        {
+            // Sanity.
+            if (false == calledBack)
+            {
+                console.error("Promise execution did not call resolve or reject.");
+            }
+
+            // Was it unsuccessful?
+            if (!success)
+            {
+                for (var i = 0; i < catchCallbacks.length; i++)
+                    catchCallbacks[i](data);
+            }
+            return p;
+        }
+
+        return p;
+    }
+
+    MFiles.SetTimer(50, action);
+
+    return p;
+}

src/Common/src/VaultStructureManager.js

@@ -10,8 +10,14 @@
 
 	var propertyDefinitions = {};
 	var classes = {};
+	var valueLists = {};
 
-	t.getPropertyDefinition = function(propertyDefId)
+	t.getValueList = function (valueListId)
+	{
+		return valueLists[valueListId];
+	}
+
+	t.getPropertyDefinition = function (propertyDefId)
 	{
 		return propertyDefinitions[propertyDefId];
 	}
@@ -59,6 +65,25 @@
 					// Error checking permissions.
 					MFiles.ReportException(errorobj);
 				}
+		);
+
+		// Load all the value lists.
+		shellUI.Vault.Async.ValueListOperations.GetValueLists
+			(
+				function (output)
+				{
+					valueLists = {};
+					for (var i = 0; i < output.Count; i++)
+					{
+						var pd = output[i];
+						valueLists[pd.ID] = pd;
+					}
+				},
+				function (shorterror, longerror, errorobj)
+				{
+					// Error checking permissions.
+					MFiles.ReportException(errorobj);
+				}
 			);
     }
 

src/Common/src/WindowManager.js

@@ -5,7 +5,7 @@
 	var tabId = null;
 	var tabTitle = null;
 	var t = this;
-	var registrationCallback = null;
+	var selectionChangedCallback = null;
 	var bottomTab;
 	var sideTab;
 	var shown = false;
@@ -41,7 +41,7 @@
 
 		// Set the new location.
 		currentLocation = newLocation;
-		registrationCallback = null;
+		selectionChangedCallback = null;
 
 		// Update vault.
 		t.saveDefaultWindowSize();
@@ -188,9 +188,9 @@
 
 		// Define the data to send to the dashboard.
 		var customData = {
-			registrationCallback: function (fn)
+			selectionChangedCallback: function (fn)
 			{
-				registrationCallback = fn
+				selectionChangedCallback = fn
 			},
 			tabClosedCallback: t.close,
 			windowManager: orchestrator.getWindowManager(),
@@ -202,15 +202,15 @@
 		};
 
 		// If we have a function then try to call it.
-		if (registrationCallback && typeof (registrationCallback) == "function")
+		if (selectionChangedCallback && typeof (selectionChangedCallback) == "function")
 		{
 			try
 			{
 				// Show the item details.
 				var selectedItems = orchestrator.getSelectedItems()
 				if (null == selectedItems)
 					return false;
-				registrationCallback(selectedItems);
+				selectionChangedCallback(selectedItems);
 
 				switch (currentLocation)
 				{

src/Common/src/dashboards/base-dashboard.css

@@ -8,7 +8,7 @@ head, body {
 
 body {
     padding: 10px;
-    font-family: Lato;
+    font-family: Lato, Segoe UI, Tahoma, Arial, sans-serif;
     color: #767676;
 }
 
@@ -72,15 +72,23 @@ button {
     text-align: center;
 }
 
-    button:hover, button:active, button.save:active, button.save:hover {
-        border-color: #318CCC;
-        background-color: #318CCC;
-        color: white;
-    }
+button:hover, button:active, button.save:active, button.save:hover {
+    border-color: #318CCC;
+    background-color: #318CCC;
+    color: white;
+}
 
-    button.save {
-        border-color: #318CCC;
-        color: #318CCC;
+button.save {
+    border-color: #318CCC;
+    color: #318CCC;
+}
+    button.save:disabled, button.save[disabled],
+    button.save:disabled:active, button.save:disabled:hover,
+    button.save[disabled]:active, button.save[disabled]:hover {
+        color: #CCC;
+        border-color: #CCC;
+        cursor: not-allowed;
+        background-color: white;
     }
 
 .buttonGroup.top {