add endpoint and ui example.

.gitignore

@@ -17,6 +17,7 @@ vendor
 # Ignore log files, but track the log README
 *.log
 
+!customs/endpoints/_example.php
 customs/extensions/*
 !customs/extensions/.gitignore
 !customs/extensions/_example/

app/core/BaseUIView.js

@@ -0,0 +1,5 @@
+define(['core/UIView'], function(UIView) {
+  return UIView.extend({
+    prefix: 'customs/uis/'
+  });
+});

customs/endpoints/_example.php

@@ -0,0 +1,15 @@
+<?php
+
+use Directus\Bootstrap;
+use Directus\View\JsonView;
+
+// Slim App
+$app = Bootstrap::get('app');
+
+// Simple GET endpoint example
+$app->get('/example', function() {
+    return JsonView::render([
+        'item 1',
+        'item 2'
+    ]);
+});

customs/uis/.gitignore

@@ -1,2 +1,3 @@
 *
-!.gitignore
+!.gitignore
+!_example

customs/uis/_example/index.js

@@ -0,0 +1,29 @@
+define(['core/UIComponent', 'core/BaseUIView'], function(UIComponent, UIView) {
+  var charactersLimit = 100;
+  var Input = UIView.extend({
+    template: '_example/templates/input',
+    events: {
+      'keyup textarea': 'updateCount'
+    },
+    updateCount: function(event) {
+      var textLength = event.currentTarget.value.length;
+      var textRemaining = charactersLimit - textLength;
+      this.$el.find('#count').text(textRemaining);
+    },
+    serialize: function() {
+      return {
+        maxLength: charactersLimit,
+        charactersRemaining: charactersLimit
+      }
+    }
+  });
+
+  var Component = UIComponent.extend({
+    id: 'textlimit',
+    dataTypes: ['TEXT'],
+    Input: Input
+  });
+
+
+  return Component;
+});

customs/uis/_example/templates/input.html

@@ -0,0 +1,2 @@
+<textarea maxLength="{{maxLength}}"></textarea>
+<span id="count">{{charactersRemaining}}</span>