1 files changed, 129 insertions, 0 deletions
diff --git a/framework/src/onos/web/gui/src/main/webapp/data/sprites/layout.json b/framework/src/onos/web/gui/src/main/webapp/data/sprites/layout.json
new file mode 100644
index 00000000..243681a9
--- /dev/null
+++ b/framework/src/onos/web/gui/src/main/webapp/data/sprites/layout.json
@@ -0,0 +1,129 @@
+{
+  "defn_name": "layout",
+  "defn_desc": "Sample Layout Sprite Data",
+
+  "_comment": [
+    "Sample sprite layout file, demonstrating user-defined paths",
+    "(1) Register on the server with ...",
+    "    onos-upload-sprites localhost layout.json",
+    "(2) Load into topology view with ...",
+    "    http://localhost:8181/onos/ui/index.html#/topo?sprites=layout"
+  ],
+
+  "_comment_paths": [
+    "The 'paths' array contains custom path data.",
+    "Note that viewbox defaults to [0 0 1000 1000], which is the logical",
+    "coordinate space of the topology view."
+  ],
+  "paths": [
+    {
+      "tag": "border",
+      "viewbox": "0 0 1 1",
+      "d": "M0,0h1v1h-1z",
+      "_comment": "path defined in single string"
+    },
+    {
+      "tag": "banner",
+      "viewbox": "0 0 4 8",
+      "d": [
+        "M0,0h4v6l-2,-2l-2,2z",
+        "M1,6h2v2h-2z"
+      ],
+      "_comment": "path defined in multiple strings"
+    },
+    {
+      "tag": "triangle",
+      "viewbox": "0 0 1 1",
+      "d": "M.5,.2l.3,.6,h-.6z",
+      "_comment": "defines its own viewbox"
+    },
+    {
+      "tag": "diamond",
+      "viewbox": "0 0 1 1",
+      "d": "M.2,.5l.3,-.3l.3,.3l-.3,.3z"
+    }
+  ],
+
+  "_comment_defn": [
+    "The 'defn' array contains sprite definitions that combine",
+    "path, dimensions, and label-offset into 'sprites' that can be",
+    "replicated (stamped) in different positions in the view.",
+    "",
+    "The 'glyph' property refers to glyphs registered with the UI.",
+    "Alternatively, the 'path' property refers to a custom path defined in",
+    " the path array above.",
+    "The 'dim' property provides the [width,height] bounds within which the",
+    " glyph/path is drawn. (default is [40,40])",
+    "The 'labelyoff' property defines the Y-offset of the label as a",
+    " percentage from the top of the sprite; for example, 0.4 = 40%. The",
+    " label is centered horizontally.",
+    "The 'scale' property (default is 1) defines the scaling factor, which",
+    " is applied after the sprite has been translated to its position."
+  ],
+  "defn": [
+    {
+      "id": "border",
+      "path": "border",
+      "dim":[1000,1000]
+    },
+    {
+      "id": "multi",
+      "path": "multi"
+    },
+    {
+      "id": "small_tri",
+      "path": "triangle",
+      "scale":4
+    },
+    {
+      "id": "big_tri",
+      "path": "triangle",
+      "scale":12
+    },
+    {
+      "id": "subnet",
+      "glyph": "cloud",
+      "scale":8,
+      "labelyoff": 0.4
+    },
+    {
+      "id": "subnet2",
+      "glyph": "cloud",
+      "dim":[200,200],
+      "labelyoff": 0.4
+    }
+  ],
+
+  "_comment_load": [
+    "The 'load' object contains sprites and labels to load into the view.",
+    "",
+    "Items in the sprite list associate sprites with a position,",
+    "style class, and optional label. Note that the coordinates of",
+    "the position define the top-left corner of the sprite.",
+    "Default 'pos' is [0,0]. Default 'class' is 'gray1'.",
+    "",
+    "Items in the label list associate labels with a position and",
+    "style class. Note that the text is centered on the x-coordinate."
+  ],
+  "load": {
+    "sprites": [
+      { "id": "border", "class": "gold1" },
+      { "id": "subnet", "pos":[-40,20], "label":"apples", "class": "blue1" },
+      { "id": "subnet", "pos":[400,40], "label":"bananas", "class": "blue1" },
+      { "id": "subnet", "pos":[840,60], "label":"cherries", "class": "blue1" },
+      { "id": "subnet2", "pos":[300,400], "class": "gray1" }
+    ],
+    "labels": [
+      { "pos":[500,850], "text":"Sample Layout", "class":"blue1", "size":1.6 },
+      { "pos":[500,900], "text":"Illustrating Sprites", "class":"gray1" }
+    ]
+  },
+  "junk":[
+    { "id": "border" },
+    { "id": "multi", "class": "gray1" },
+    { "id": "small_tri", "pos":[10, 20] },
+    { "id": "small_tri", "pos":[110, 20] },
+    { "id": "small_tri", "pos":[210, 20] },
+    { "id": "small_tri", "pos":[310, 20] }
+  ]
+}