Need more detail for contributing to v3 web console, started an archi…

…tecture section
fabianofranz · Mar 12, 2015 · acbb6ff · acbb6ff
1 parent d5881df
commit acbb6ff
Showing 1 changed file with 48 additions and 0 deletions.
diff --git a/assets/README.md b/assets/README.md
@@ -38,3 +38,51 @@ If Travis complains that bindata.go is different than the committed version, ens
 2. Run `hack/install-assets.sh`
 3. Run `hack/build-assets.sh`
 4. If bindata.go is changed, add it to your commit and re-push
+
+Architecture
+------------
+
+The OpenShift v3 management console is based on AngularJS and [Hawt.io](https://github.com/hawtio/hawtio-core)
+
+#### Custom directives and filters
+
+The v3 console relies heavily on custom directives and filters, some of which are intended to be utilties and used throughout the console source. The list below is NOT a complete list of all of our directives and filters.
+
+##### Directives
+
+For more details on the expected scope arguments, see the source under [app/scripts/directives](app/scripts/directives)
+
+* toggle (attribute) - intended for Bootstrap's data-toggle=tooltip and data-toggle=popover, will automatically initialize any tooltips and popovers
+* alerts (element) - renders a set of alerts according to the [patternfly style](https://www.patternfly.org/widgets/#alerts)
+* relative-timestamp (element) - renders a relative timestamp (ex: '5 minutes ago') based on the current time, auto-updating every 30 seconds
+* copy-to-clipboard (element) - creates a copy to clipboard button using ZeroClipboard
+* back (attribute) - when the element is clicked a simulated browser back button event occurs (calls history.back)
+* select-on-focus (attribute) - when the element is focused, all text within it will be selected
+* tile-click (attribute or class) - for use with the `.tile` class, when anything on the tile is clicked, a simulated click to the `a.tile-target` link will be fired.  Recommended use is by adding the `.tile-click` class to get the correct styles on hover.
+* click-to-reveal (attribute) - the element will be hidden and a link to show the element will appear instead, link text is customizable
+
+##### Filters
+
+For more details on the expected arguments, see the source under [app/scripts/filters](app/scripts/filters)
+
+* dateRelative - returns the relative date for a timestamp given the current time (ex: '5 minutes ago')
+* ageLessThan - returns whether a timestamp is within a given time amount (ex: 5) and unit (ex: 'minutes').  Refer to the [Moment.js docs](http://momentjs.com/docs/#/manipulating/add/) for the supported units.
+* orderObjectsByDate - given an array or hash of k8s or openshift API objects, return an array of the objects sorted by the creationTimestamp.  By default orders with oldest first, optional reverse param will return ordered by newest first.
+* annotation - for a k8s or openshift api object, lets you get any annotation by key
+* description - shortcut for annotation | 'description'
+* tags - shortcut for annotation | 'tags'
+* label - for a k8s or openshift api object, lets you get any label by key
+* hashSize - returns the number of subobjects on a javascript hash
+* helpLink - returns the relevant link in the OpenShift docs for a particular help topic, new help topics should be added to the filter.  DO NOT put URLs to help directly into the source in any location except for this filter
+
+#### Extension points
+
+There are two main ways to extend the v3 OpenShift console.
+
+##### Add primary / secondary navigation tabs to the project nav
+
+We rely on [hawtio-core-navigation](https://github.com/hawtio/hawtio-core-navigation) to build the primary/secondary nav that appears once you are in a project.  We have customized the rendering of the tabs, so refer to [app/scripts/app.js](app/scripts/app.js) to see how we register our out of the box tabs.
+
+##### Inject additional content into the page
+
+We include the [hawtio-extension-service](https://github.com/hawtio/hawtio-extension-service).  Currently we do not render any extension points, but if there are any locations where you would like to see customizable content, this is how we will add a hook to do that.  As hooks are added we will provide a list of them here.