diff --git a/example/eventGenerator/bundle.js b/example/eventGenerator/bundle.js index d5712ff8e3..8da602c799 100644 --- a/example/eventGenerator/bundle.js +++ b/example/eventGenerator/bundle.js @@ -50,6 +50,7 @@ define([ "key": "eventGenerator", "name": "Event Message Generator", "glyph": "\u0066", + "cssclass": "icon-folder-new", "description": "For development use. Creates sample event message data that mimics a live data stream.", "priority": 10, "features": "creation", diff --git a/example/generator/bundle.js b/example/generator/bundle.js index 6e89023ea4..1fe11637c1 100644 --- a/example/generator/bundle.js +++ b/example/generator/bundle.js @@ -87,6 +87,7 @@ define([ "key": "generator", "name": "Sine Wave Generator", "glyph": "\u0054", + "cssclass": "icon-telemetry", "description": "For development use. Generates example streaming telemetry data using a simple sine wave algorithm.", "priority": 10, "features": "creation", diff --git a/example/imagery/bundle.js b/example/imagery/bundle.js index 6e5ac136a9..33786d0eb7 100644 --- a/example/imagery/bundle.js +++ b/example/imagery/bundle.js @@ -50,6 +50,7 @@ define([ "key": "imagery", "name": "Example Imagery", "glyph": "\u00e3", + "cssclass": "icon-image", "features": "creation", "description": "For development use. Creates example imagery data that mimics a live imagery stream.", "priority": 10, diff --git a/platform/commonUI/browse/res/templates/items/grid-item.html b/platform/commonUI/browse/res/templates/items/grid-item.html index faad446f14..5b7be909f9 100644 --- a/platform/commonUI/browse/res/templates/items/grid-item.html +++ b/platform/commonUI/browse/res/templates/items/grid-item.html @@ -28,7 +28,7 @@
- {{type.getGlyph()}} +
}
diff --git a/platform/commonUI/edit/res/templates/create/create-menu.html b/platform/commonUI/edit/res/templates/create/create-menu.html index 24314a17c7..28abae8cb5 100644 --- a/platform/commonUI/edit/res/templates/create/create-menu.html +++ b/platform/commonUI/edit/res/templates/create/create-menu.html @@ -22,24 +22,17 @@
-
- {{representation.activeMetadata.glyph}} -
+
{{representation.activeMetadata.name}}
diff --git a/platform/commonUI/edit/src/creation/CreateAction.js b/platform/commonUI/edit/src/creation/CreateAction.js index 6ea0d513a5..e0bd65a938 100644 --- a/platform/commonUI/edit/src/creation/CreateAction.js +++ b/platform/commonUI/edit/src/creation/CreateAction.js @@ -48,6 +48,7 @@ define( this.metadata = { key: 'create', glyph: type.getGlyph(), + cssclass: type.getCssClass(), name: type.getName(), type: type.getKey(), description: type.getDescription(), diff --git a/platform/commonUI/general/res/sass/_glyphs.scss b/platform/commonUI/general/res/sass/_glyphs.scss index bd3ef45e78..d4d3edb388 100644 --- a/platform/commonUI/general/res/sass/_glyphs.scss +++ b/platform/commonUI/general/res/sass/_glyphs.scss @@ -5,17 +5,6 @@ } } -//[class*="icon-"]:before { -// font-family: 'symbolsfont'; -//} - -.ui-symbol, -.icon { - // TO-DO: refactor markup to use "icon-" approach - &.mobile-info { @include glyph('\e920'); } - //&.context-available { @include glyph('\e902'); } -} - .icon-alert-rect { @include glyph('\e900'); } .icon-alert-triangle { @include glyph('\e901'); } .icon-arrow-down { @include glyph('\e902'); } diff --git a/platform/commonUI/inspect/res/templates/info-button.html b/platform/commonUI/inspect/res/templates/info-button.html index 4745a29561..90d5ddd479 100644 --- a/platform/commonUI/inspect/res/templates/info-button.html +++ b/platform/commonUI/inspect/res/templates/info-button.html @@ -21,4 +21,4 @@ --> - + diff --git a/platform/core/bundle.js b/platform/core/bundle.js index 270e4e7b89..40221ca3b7 100644 --- a/platform/core/bundle.js +++ b/platform/core/bundle.js @@ -264,6 +264,7 @@ define([ "key": "folder", "name": "Folder", "glyph": "\u0046", + "cssclass": "icon-folder", "features": "creation", "description": "Create folders to organize other objects or links to objects.", "priority": 1000, diff --git a/platform/core/src/types/TypeImpl.js b/platform/core/src/types/TypeImpl.js index 5e25ecbc93..b761cc0a1c 100644 --- a/platform/core/src/types/TypeImpl.js +++ b/platform/core/src/types/TypeImpl.js @@ -148,6 +148,10 @@ define( return this.typeDef.glyph; }; + TypeImpl.prototype.getCssClass = function () { + return this.typeDef.cssclass; + }; + TypeImpl.prototype.getProperties = function () { return (this.typeDef.properties || []).map(function (propertyDef) { return new TypeProperty(propertyDef); diff --git a/platform/features/clock/bundle.js b/platform/features/clock/bundle.js index dc1f24cea9..dd32eda80c 100644 --- a/platform/features/clock/bundle.js +++ b/platform/features/clock/bundle.js @@ -156,6 +156,7 @@ define([ "key": "clock", "name": "Clock", "glyph": "\u0043", + "cssclass": "icon-clock", "description": "A UTC-based clock that supports a variety of display formats. Clocks can be added to Display Layouts.", "priority": 101, "features": [ @@ -213,6 +214,7 @@ define([ "key": "timer", "name": "Timer", "glyph": "\u00f5", + "cssclass": "icon-timer", "description": "A timer that counts up or down to a datetime. Timers can be started, stopped and reset whenever needed, and support a variety of display formats. Each Timer displays the same value to all users. Timers can be added to Display Layouts.", "priority": 100, "features": [ diff --git a/platform/features/layout/bundle.js b/platform/features/layout/bundle.js index 26689e207a..447bb7833c 100644 --- a/platform/features/layout/bundle.js +++ b/platform/features/layout/bundle.js @@ -57,6 +57,7 @@ define([ "key": "layout", "name": "Display Layout", "glyph": "\u004c", + "cssclass": "icon-layout", "type": "layout", "template": layoutTemplate, "editable": true, @@ -77,7 +78,7 @@ define([ "items": [ { "method": "add", - "glyph": "\u002b", + "cssclass": "icon-plus", "control": "menu-button", "text": "Add", "options": [ @@ -109,8 +110,7 @@ define([ "items": [ { "method": "order", - "glyph": "รก", - "cssclass": "i-layers", + "cssclass": "icon-layers", "control": "menu-button", "options": [ { @@ -260,6 +260,7 @@ define([ "key": "layout", "name": "Display Layout", "glyph": "\u004c", + "cssclass": "icon-layout", "description": "Assemble other objects and components together into a reusable screen layout. Working in a simple canvas workspace, simply drag in the objects you want, position and size them. Save your design and view or edit it at any time.", "priority": 900, "features": "creation", @@ -292,6 +293,7 @@ define([ "key": "telemetry.panel", "name": "Telemetry Panel", "glyph": "t", + "cssclass": "icon-telemetry-panel", "description": "A panel for collecting telemetry elements.", "priority": 899, "delegates": [ diff --git a/platform/features/pages/bundle.js b/platform/features/pages/bundle.js index 00c1e8729f..89114f0284 100644 --- a/platform/features/pages/bundle.js +++ b/platform/features/pages/bundle.js @@ -37,6 +37,7 @@ define([ "key": "example.page", "name": "Web Page", "glyph": "\u00ea", + "cssclass": "icon-page", "description": "Embed a web page or web-based image in a resizeable window component. Can be added to Display Layouts. Note that the URL being embedded must allow iframing.", "priority": 50, "features": [ diff --git a/platform/features/table/bundle.js b/platform/features/table/bundle.js index 6d53711c94..216f15bc9c 100644 --- a/platform/features/table/bundle.js +++ b/platform/features/table/bundle.js @@ -61,6 +61,7 @@ define([ "key": "table", "name": "Historical Telemetry Table", "glyph": "\ue604", + "cssclass": "icon-tabular", "description": "A static table of all values over time for all included telemetry elements. Rows are timestamped data values for each telemetry element; columns are data fields. The number of rows is based on the range of your query. New incoming data must be manually re-queried for.", "priority": 861, "features": "creation", @@ -84,6 +85,7 @@ define([ "key": "rttable", "name": "Real-time Telemetry Table", "glyph": "\ue620", + "cssclass": "icon-tabular-realtime", "description": "A scrolling table of latest values for all included telemetry elements. Rows are timestamped data values for each telemetry element; columns are data fields. New incoming data is automatically added to the view.", "priority": 860, "features": "creation", diff --git a/platform/features/timeline/bundle.js b/platform/features/timeline/bundle.js index d8f8729808..08673594b4 100644 --- a/platform/features/timeline/bundle.js +++ b/platform/features/timeline/bundle.js @@ -152,6 +152,7 @@ define([ "key": "timeline", "name": "Timeline", "glyph": "\u0053", + "cssclass": "icon-timeline", "description": "A time-oriented container that lets you enclose and organize other Timelines and Activities. The Timeline view provides both tabular and Gantt views as well as resource utilization graphing of Activities.", "priority": 502, "features": [ @@ -195,6 +196,7 @@ define([ "key": "activity", "name": "Activity", "glyph": "\u0061", + "cssclass": "icon-activity", "features": [ "creation" ], @@ -241,6 +243,7 @@ define([ "key": "mode", "name": "Activity Mode", "glyph": "\u0041", + "cssclass": "icon-activity-mode", "features": [ "creation" ], @@ -309,11 +312,13 @@ define([ { "name": "Timeline", "glyph": "\u0053", + "cssclass": "icon-timeline", "key": "timeline" }, { "name": "Activity", "glyph": "\u0061", + "cssclass": "icon-activity", "key": "activity" } ]