2
0
Эх сурвалжийг харах

Readme fixes.
Add css plugin note
Add language notation for code snippets
Add custom FileView sample

Yanrishatum 6 жил өмнө
parent
commit
4ed141ea92
1 өөрчлөгдсөн 83 нэмэгдсэн , 41 устгасан
  1. 83 41
      README.md

+ 83 - 41
README.md

@@ -21,59 +21,101 @@ In your project's resource folder, you can create a `props.json` configuration f
 ### Custom plugin
 
 In your project, create an hxml configuration for building the plugin. Example:
-
-    # hide-plugin.hxml
-    -cp src
-    -lib hide
-    -lib hxnodejs
-    -lib castle
-    --macro hide.Plugin.init()
-    -js hide-plugin.js
-    -debug
-    HideImports
-
+```hxml
+# hide-plugin.hxml
+-cp src
+-lib hide
+-lib hxnodejs
+-lib castle
+--macro hide.Plugin.init()
+-js hide-plugin.js
+-debug
+HideImports
+```
 `HideImports.hx` here is just a file that lists all the classes you want to embed in your plugin. Example:
-
-    // HideImports.hx
-    import prefabs.MyPrefab1;
-    import prefabs.MyPrefab2;
-
+```haxe
+// HideImports.hx
+import prefabs.MyPrefab1;
+import prefabs.MyPrefab2;
+```
 Running `haxe hide-plugin.hxml` should now generate a `hide-plugin.js` plugin file.
 
 In your project configuration file (`res/props.json`) you can now include this file like so:
-
-    {
-        "plugins": ["../hide-plugin.js"]
-    }
-
+```json
+{
+    "plugins": ["../hide-plugin.js"]
+}
+```
+Aside from javascript plugins, you can add your own stylsheets:
+```json
+{
+    "plugins": ["../hide-plugin-style.css"]
+}
+```
 
 ### Custom prefab
 
 Example of a project-specific custom prefab:
+```haxe
+import hrt.prefab.Context;
+import hrt.prefab.Library;
+
+class MyPrefab extends hrt.prefab.Object3D {
+    
+    public function new(?parent) {
+        super(parent);
+        type = "myprefab";
+    }
 
-    import hrt.prefab.Context;
-    import hrt.prefab.Library;
+    override function make(ctx:Context):Context {
+        var ret = super.make(ctx);
+        // Custom code...
+        return ret;
+    }
 
-    class MyPrefab extends hrt.prefab.Object3D {
-        
-        public function new(?parent) {
-            super(parent);
-            type = "myprefab";
-        }
+    #if editor
 
-        override function make(ctx:Context):Context {
-            var ret = super.make(ctx);
-            // Custom code...
-            return ret;
-        }
+    override function getHideProps() : hide.prefab.HideProps {
+        return { icon : "cog", name : "MyPrefab" };
+    }
 
-        #if editor
+    #end
 
-        override function getHideProps() : hide.prefab.HideProps {
-            return { icon : "cog", name : "MyPrefab" };
-        }
+    static var _ = Library.register("myprefab", MyPrefab);
+}
+```
 
-        #end
+### Custom file views
+You can add your own viewers/editors for files, by extending `hide.view.FileView` class:
 
-        static var _ = Library.register("myprefab", MyPrefab);
-    }
+```haxe
+import hide.view.FileView;
+
+class CustomView extends FileView {
+    
+    // onDisplay should create html layout of your view. It is also called each when file is changed externally.
+    override public function onDisplay()
+    {
+        // Example of initial layout setup.
+        element.html('
+          <div class="flex vertical">
+            <div class="toolbar"></div>
+            <div class="content"></div>
+          </div>
+        ');
+        var tools = new hide.comp.Toolbar(null, element.find(".toolbar"));
+        var content = element.find(".content"));
+        // Importantly, use `getPath()` to obtain file path that you can use for filesystem access.
+        var path = getPath();
+        // ... your code to fill content
+  }
+  
+  // Register the view with specific extensions.
+  // Extensions starting with `json.` refer to `.json` files with `type` at root
+  // object being second part of extension ("type": "customView" in this sample).
+  // Otherwise it is treated as regular file extension.
+  // Providing icon and createNew is optional. If createNew set, HIDE file tree will have a context menu item to create new file that FileView represents.
+  static var _ = hide.view.FileTree.registerExtension(CustomView, ["json.customView", "customview"], { icon: "snowflake-o", createNew: "Dialog Context" });
+  
+}
+```