Initial implementation of Bundled Plugins

AppBuilder/ABFactory.js

@@ -29,6 +29,8 @@ import Multilingual from "../resources/Multilingual.js";
 import Network from "../resources/Network.js";
 // Network: our interface for communicating to our server
 
+import LocalPlugins from "./platform/plugins/included/index.js";
+
 import Storage from "../resources/Storage.js";
 // Storage: manages our interface for local storage
 
@@ -875,6 +877,13 @@ class ABFactory extends ABFactoryCore {
       this._plugins.push(p);
    }
 
+   pluginLocalLoad() {
+      // This is a placeholder for a local plugin load.
+      // The platform version of this method will load the plugins from
+      // /platform/plugins/local/
+      return LocalPlugins.load(this);
+   }
+
    //
    // Utilities
    //

AppBuilder/platform/ABClassManager.js

@@ -3,10 +3,14 @@ import ABPropertiesObjectPlugin from "./plugins/ABPropertiesObjectPlugin";
 import ABObjectPlugin from "./plugins/ABObjectPlugin.js";
 import ABModelPlugin from "./plugins/ABModelPlugin.js";
 import ABViewPlugin from "./plugins/ABViewPlugin.js";
+import ABViewWidgetPlugin from "./plugins/ABViewWidgetPlugin.js";
 import ABViewComponentPlugin from "./plugins/ABViewComponentPlugin.js";
 import ABViewPropertiesPlugin from "./plugins/ABViewPropertiesPlugin.js";
 import ABViewEditorPlugin from "./plugins/ABViewEditorPlugin.js";
 
+// some views need to reference ABViewContainer,
+import ABViewContainer from "./views/ABViewContainer.js";
+
 const classRegistry = {
    ObjectTypes: new Map(),
    ObjectPropertiesTypes: new Map(),
@@ -50,9 +54,11 @@ export function getPluginAPI() {
       ABObjectPlugin,
       ABModelPlugin,
       ABViewPlugin,
+      ABViewWidgetPlugin,
       ABViewComponentPlugin,
       ABViewPropertiesPlugin,
       ABViewEditorPlugin,
+      ABViewContainer,
       //  ABFieldPlugin,
       //  ABViewPlugin,
    };

AppBuilder/platform/ABViewManager.js

@@ -10,17 +10,16 @@ module.exports = class ABViewManager extends ABViewManagerCore {
    static newView(values, application, parent) {
       parent = parent || null;
 
-      // check to see if this is a plugin view
-      if (values.plugin_key) {
-         // If this is from a plugin, create it from ClassManager
-         return ClassManager.viewCreate(
-            values.plugin_key,
-            values,
-            application,
-            parent
-         );
-      }
+      // Moving to ClassManager for our default views:
+      let key = values.plugin_key || values.key;
+      let view = null;
 
-      return super.newView(values, application, parent);
+      try {
+         view = ClassManager.viewCreate(key, values, application, parent);
+      } catch (error) {
+         // console.error(`Error creating view ${key}:`, error);
+         view = super.newView(values, application, parent);
+      }
+      return view;
    }
 };

AppBuilder/platform/plugins/ABViewWidgetPlugin.js

@@ -0,0 +1,31 @@
+import ABViewWidget from "../views/ABViewWidget.js";
+
+export default class ABViewWidgetPlugin extends ABViewWidget {
+   constructor(...params) {
+      super(...params);
+   }
+
+   static getPluginKey() {
+      return "ab-view-plugin";
+   }
+
+   static getPluginType() {
+      return "view";
+   }
+
+   toObj() {
+      const result = super.toObj();
+      result.plugin_key = this.constructor.getPluginKey();
+      // plugin_key : is what tells our ABFactory.objectNew() to create this object from the plugin class.
+      return result;
+   }
+
+   static newInstance(application, parent) {
+      // return a new instance from ABViewManager:
+      return application.viewNew(
+         { key: this.common().key, plugin_key: this.getPluginKey() },
+         application,
+         parent
+      );
+   }
+}

AppBuilder/platform/plugins/included/index.js

@@ -0,0 +1,12 @@
+import viewList from "./view_list/FNAbviewlist.js";
+import viewTab from "./view_tab/FNAbviewtab.js";
+
+const AllPlugins = [viewTab, viewList];
+
+export default {
+   load: (AB) => {
+      AllPlugins.forEach((plugin) => {
+         AB.pluginRegister(plugin);
+      });
+   },
+};

AppBuilder/platform/plugins/included/view_list/FNAbviewlist.js

@@ -0,0 +1,93 @@
+import FNAbviewlistComponent from "./FNAbviewlistComponent.js";
+
+// FNAbviewlist Web
+// A web side import for an ABView.
+//
+export default function FNAbviewlist({
+   /*AB,*/
+   ABViewWidgetPlugin,
+   ABViewComponentPlugin,
+   ABViewContainer,
+}) {
+   const ABAbviewlistComponent = FNAbviewlistComponent({
+      ABViewComponentPlugin,
+   });
+
+   const ABViewListPropertyComponentDefaults = {
+      dataviewID: null,
+      field: null,
+      height: 0,
+   };
+
+   const ABViewDefaults = {
+      key: "list", // {string} unique key for this view
+      icon: "list-ul", // {string} fa-[icon] reference for this view
+      labelKey: "List(plugin)", // {string} the multilingual label key for the class label
+   };
+
+   class ABViewListCore extends ABViewWidgetPlugin {
+      constructor(values, application, parent, defaultValues) {
+         super(values, application, parent, defaultValues || ABViewDefaults);
+      }
+
+      static common() {
+         return ABViewDefaults;
+      }
+
+      static defaultValues() {
+         return ABViewListPropertyComponentDefaults;
+      }
+
+      /**
+       * @method componentList
+       * return the list of components available on this view to display in the editor.
+       */
+      componentList() {
+         return [];
+      }
+
+      field() {
+         var dv = this.datacollection;
+         if (!dv) return null;
+
+         var object = dv.datasource;
+         if (!object) return null;
+
+         return object.fieldByID(this.settings.field);
+      }
+   }
+
+   return class ABViewList extends ABViewListCore {
+      /**
+       * @method getPluginKey
+       * return the plugin key for this view.
+       * @return {string} plugin key
+       */
+      static getPluginKey() {
+         return this.common().key;
+      }
+
+      /**
+       * @method component()
+       * return a UI component based upon this view.
+       * @return {obj} UI component
+       */
+      component(parentId) {
+         return new ABAbviewlistComponent(this, parentId);
+      }
+
+      // constructor(values, application, parent, defaultValues) {
+      //    super(values, application, parent, defaultValues);
+      // }
+
+      warningsEval() {
+         super.warningsEval();
+         let DC = this.datacollection;
+         if (!DC) {
+            this.warningsMessage(
+               `can't resolve it's datacollection[${this.settings.dataviewID}]`
+            );
+         }
+      }
+   };
+}

AppBuilder/platform/plugins/included/view_list/FNAbviewlistComponent.js

@@ -0,0 +1,55 @@
+export default function FNAbviewlistComponent({
+   /*AB,*/
+   ABViewComponentPlugin,
+}) {
+   return class ABAbviewlistComponent extends ABViewComponentPlugin {
+      constructor(baseView, idBase, ids) {
+         super(
+            baseView,
+            idBase || `ABViewList_${baseView.id}`,
+            Object.assign({ list: "" }, ids)
+         );
+      }
+
+      ui() {
+         const settings = this.settings;
+         const _uiList = {
+            id: this.ids.list,
+            view: "dataview",
+            type: {
+               width: 1000,
+               height: 30,
+            },
+            template: (item) => {
+               const field = this.view.field();
+
+               if (!field) return "";
+
+               return field.format(item);
+            },
+         };
+
+         // set height or autoHeight
+         if (settings.height !== 0) _uiList.height = settings.height;
+         else _uiList.autoHeight = true;
+
+         const _ui = super.ui([_uiList]);
+
+         delete _ui.type;
+
+         return _ui;
+      }
+
+      async init(AB) {
+         await super.init(AB);
+
+         const dc = this.datacollection;
+
+         if (!dc) return;
+
+         // bind dc to component
+         dc.bind($$(this.ids.list));
+         // $$(ids.list).sync(dv);
+      }
+   };
+}