Merge pull request #91 from BasicPrimitives/annotations

Updated annotations

Author: BasicPrimitives

apireference/algorithms.md

@@ -280,7 +280,7 @@ Callback for iterating family nodes level by level
 
  `loopLevels(thisArg, parentAligned, onItem)` 
 
-Function loops through nodes of family structure level by level.
+Loops through nodes of family structure level by level. This function aligns nodes top or bottom.
 
 | Param | Type | Default | Description | 
 | --- | --- | --- | --- | 
@@ -293,7 +293,7 @@ Function loops through nodes of family structure level by level.
 
 Callback for iterating family nodes level by level
 
- Returns: `number` - returns `break` to break the loop and exit, `skip` to skip node's branch traversing.
+ Returns: `number` - returns break to break the loop and exit. returns skip to skip node's branch traversing.
 
 | Param | Type | Default | Description | 
 | --- | --- | --- | --- | 
@@ -303,7 +303,7 @@ Callback for iterating family nodes level by level
 
  `loopNeighbours(thisArg, itemid, onItem)` 
 
-Loops through the node neighbors of the family structure level by level
+Loops through the node neighbours of the family structure level by level
 
 | Param | Type | Default | Description | 
 | --- | --- | --- | --- | 

apireference/configs.md

@@ -453,7 +453,7 @@ Vertical Interval
 
 
 ## <a name="RenderEventArgs" id="RenderEventArgs">RenderEventArgs</a>
-This is object parameter of rendering callback function
+The render event arguments contains parameters of rendering callback function
 
  `RenderEventArgs` 
 

apireference/enums.md

@@ -118,12 +118,6 @@
       {
         label: "Integration",
         items: [
-          {
-            label: "AngularJS Directive Example",
-            frameworks: {
-              javascript: "samples/angularjs.directives/CaseAngularJSFirstOrganizationalChartDirective.html"
-            }
-          },
           {
             label: "jQuery UI Widget Example",
             frameworks: {

apireference/famdiagram.md

@@ -3,50 +3,56 @@ import { AnnotationType, ZOrderType, LineType } from '../enums';
 
 /**
  * @class BackgroundAnnotationConfig
- * @classdesc Background annotation draws rectangular shape around annotated items. Annotations borders are offset around items, so if 
- * two annotations overlap each other they are merged into one continuos shape having single border line.
+ * @classdesc Background annotation draws a rectangular shape around annotated items.
+ * Annotations borders are offset around nodes, so if two annotations overlap, 
+ * they are merged into one continuous shape with a single borderline.
  *
  * @param {object} arg0 Object properties.
  */
 export default function BackgroundAnnotationConfig(arg0) {
   var property;
 
   /**
-   * Annotation type. All types of annotations objects are added to `annotations` collection property of the control.
-   * This property is needed to distinguish them when they are defined as JSON objects.
+   * Annotation type property explicitly defines annotation object type when 
+   * it is defined as a JSON object. The `annotations` collection contains 
+   * a mixture of all kinds of control annotations.
    * 
    * @type {AnnotationType}
    */
   this.annotationType = AnnotationType.Background;
 
   /**
-   * Collection of nodes ids this background annotation is drawn for.
+   * The `items` Collection contains nodes ids the background annotation is drawn for.
    * 
    * @type {string[]}
    */
   this.items = [];
 
   /**
-   * If this property is true then background annotation includes all descendants of every item in `items` collection. It works in {OrgDiagram} only.
+   * If this property is true, background annotation includes all descendants of every 
+   * item in the `items` collection. It works in {OrgDiagram} only.
    * 
    * @type {boolean}
    */
   this.includeChildren = false;
 
   /**
-   * Sets annotation Z order placement relative to the diagram items. Diagram visual elements are drawn in layers on top of each other.
-   * If you place annotations over diagram nodes then you block mouse events of UI elements in their templates.
-   * Browsers don't support mouse events transparency consistently yet. So in order to avoid mouse events blocking of UI elements in item
-   * templates you have to place annotation items under them or explicitly define maximum zindex for controls and make them rendered on top
-   * of other visual elements. The control takes this into account and renders buttons panel on top of everything,
-   * so they are never blocked by annotations drawn in front of diagram nodes.
+   * Sets annotation z-order placement relative to the diagram items.
+   * Diagram visual elements are drawn in layers on top of each other.
+   * If you place annotations over diagram nodes, you block mouse events 
+   * of UI elements in nodes templates. Browsers don't support mouse events 
+   * transparency consistently yet. So to avoid mouse events blocking UI 
+   * elements in node templates, you have to place annotation items under
+   * nodes or manipulate z-index for UI interactive controls and make them
+   * placed on top of other visual elements. The component puts the buttons panel 
+   * on top of everything, so annotations drawn over the diagram nodes are not blocked.
    * 
    * @type {ZOrderType}
    */
   this.zOrderType = ZOrderType.Auto;
 
   /**
-   * Sets background offset around annotated items.
+   * Sets background borderline offset around annotated items.
    * 
    * @type {Thickness}
    */
@@ -67,7 +73,7 @@ export default function BackgroundAnnotationConfig(arg0) {
   this.opacity = 1;
 
   /**
-   * Shape border line color
+   * Border line color
    * 
    * @type {string}
    */
@@ -88,7 +94,8 @@ export default function BackgroundAnnotationConfig(arg0) {
   this.lineType = LineType.Solid;
 
   /**
-   * If true then annotated nodes are shown full size regardless of controls auto fit mode and available screen space.
+   * If true, annotated nodes are shown in their expanded form using item 
+   * templates regardless of controls autofit mode and available screen space.
    * @type {boolean}
    */
   this.selectItems = false;

apireference/orgdiagram.md

@@ -4,82 +4,92 @@ import {AnnotationType, LineType, Colors, ZOrderType, ConnectorShapeType,
   ConnectorPlacementType, ConnectorLabelPlacementType } from '../enums';
 /**
  * @class ConnectorAnnotationConfig
- * @classdesc  Connector annotation configuration object. Connector annotations draws lines between two nodes of the diagram.
- * They are drawn on top of existing diagram layout and they don't affect nodes placement. So it is users responsibility to
- * preserve space between nodes for them. 
+ * @classdesc Connector annotations draw lines between two nodes of the diagram. 
+ * They are drawn on top of the existing diagram layout, and they don't impact 
+ * nodes placement. So it is the user's responsibility to preserve space between nodes for them. 
  *
  * @param {object} arg0 Object properties.
  */
 export default function ConnectorAnnotationConfig(arg0, arg1) {
   var property;
 
   /**
-   * Annotation type. All types of annotations objects are added to `annotations` collection property of the control.
-   * This property is needed to distinguish them when they are defined as JSON objects.
+   * Annotation type property explicitly defines annotation object type when 
+   * it is defined as a JSON object. The `annotations` collection contains 
+   * a mixture of all kinds of control annotations.
    * 
    * @type {AnnotationType}
    */
   this.annotationType = AnnotationType.Connector;
 
   /**
-   * Sets annotation Z order placement relative to the diagram items. Diagram visual elements are drawn in layers on top of each other.
-   * If you place annotations over diagram nodes then you block mouse events of UI elements in their templates.
-   * Browsers don't support mouse events transparency consistently yet. So in order to avoid mouse events blocking of UI elements in item
-   * templates you have to place annotation items under them or explicitly define maximum zindex for controls and make them rendered on top
-   * of other visual elements. The control takes this into account and renders buttons panel on top of everything,
-   * so they are never blocked by annotations drawn in front of diagram nodes.
+   * Sets annotation z-order placement relative to the diagram items.
+   * Diagram visual elements are drawn in layers on top of each other.
+   * If you place annotations over diagram nodes, you block mouse events 
+   * of UI elements in nodes templates. Browsers don't support mouse events 
+   * transparency consistently yet. So to avoid mouse events blocking UI 
+   * elements in node templates, you have to place annotation items under
+   * nodes or manipulate z-index for UI interactive controls and make them
+   * placed on top of other visual elements. The component puts the buttons panel 
+   * on top of everything, so annotations drawn over the diagram nodes are not blocked.
    * 
    * @type {ZOrderType}
    */
   this.zOrderType = ZOrderType.Foreground;
 
   /**
-   * The start node of connection line
+   * The start node of the connection line
    * 
    * @type {string}
    */
   this.fromItem = null;
 
   /**
-   * The end node of connection line
+   * The end node of the connection line
    * 
    * @type {string}
    */
   this.toItem = null;
 
   /**
-   * Connector shape type defines number of lines and arrows at their ends drawn between nodes of the connector annotation.
-   * This feature combined with basic conflict resolution, which places overlapping annotations in parallel when they overlap each other,
-   * gives you full flexibility over variations of possible connector lines between two given nodes of diagram.
+   * Connector shape type defines the number of lines and arrows at their ends
+   * drawn between nodes of the connector annotation. This feature, combined 
+   * with conflict resolution, places overlapping annotations in parallel.
+   * It gives you complete flexibility over variations of possible connector
+   * lines between two given diagram nodes.
    * 
    * @type {ConnectorShapeType}
    */
   this.connectorShapeType = ConnectorShapeType.OneWay;
 
   /**
-   * Connector placement type defines style of connector line drawing over diagram layout. It supports two options: 
-   * the `Straight` is classic direct line connecting two nodes, this is the most expected style of connector annotation
-   * drawing over diagram, the second style is called `Offbeat` and it is designed to dynamically adopt to nodes mutual 
-   * location and gap between them. It uses free hand line style drawing going from start to the end node. Since every diagram 
-   * is packed with various connection lines, this annotation placement style is deliberately made not straight, so it can be 
-   * noticeable on top of other lines of the diagram.
+   * The connector placement type defines how the component traces the connector
+   * line over the diagram nodes. The `Straight` is a direct line connecting two
+   * nodes. The`Offbeat` style is designed to dynamically tune connector line
+   * placement depending on the relative position of nodes and the gap between them.
+   * It uses free-hand line style drawing going from start to the end node.
+   * Since every diagram is packed with various connection lines, this annotation
+   * placement style is deliberately made not straight so that it can be
+   * noticeable on top of other diagram lines.
    * 
    * @type {ConnectorPlacementType}
    */
   this.connectorPlacementType = ConnectorPlacementType.Offbeat;
 
   /**
-   * Label placement relative to connector annotation. Connector annotation is bound and drawn between two nodes
-   * defined by two properties: `fromItem` and `toItem`. Label can be placed close to "start", "end" nodes or in between of them
-   * along the connector line. 
+   * Label placement relative to connector annotation. Connector annotation is
+   * bound and drawn between two nodes defined by the `fromItem` and the `toItem`
+   * properties. The component places the label along the connector line close
+   * to the start, the end nodes, or between them. 
    * 
    * @type {ConnectorLabelPlacementType}
    */
   this.labelPlacementType = ConnectorLabelPlacementType.Between;
 
   /**
-   * Connector line end points offset. By default connection lines start from the margin of the node's rectangle.
-   * If offset is positive then start point goes from outside of the rectangle, if it is negative then it starts from inside of the nodes rectangle.
+   * Connection lines start from the margin of the node's rectangle. If the offset is positive,
+   * the connection line has a gap between its endpoints and the node's rectangles.
+   * If it is negative, the connection line overlaps the node's rectangle and starts from inside them.
    * 
    * @type {Thickness}
    */
@@ -107,19 +117,23 @@ export default function ConnectorAnnotationConfig(arg0, arg1) {
   this.lineType = LineType.Solid;
 
   /**
-   * If true then annotated nodes are shown full size regardless of controls auto fit mode and available screen space.
+   * If true, annotated nodes are shown in their expanded form using item 
+   * templates regardless of controls autofit mode and available screen space.
+   * 
    * @type {boolean}
    */
   this.selectItems = true;
 
   /**
-   * Label. Label styled with css class name "bp-connector-label".
+   * Label. Label styled with "bp-connector-label" css class.
+   * 
    * @type {string}
    */
   this.label = null;
 
   /**
    * Label size
+   * 
    * @type {Size}
    */
   this.labelSize = new Size(60, 30);