Skip to content

Commit 16e0eef

Browse files
NASA - OPEN MCT NOTEBOOK UI PROTOTYPE CHALLENGE
https://www.topcoder.com/challenge-details/30059614/ Initial submission
1 parent 37be478 commit 16e0eef

30 files changed

+5949
-7
lines changed

README_Notebook.md

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
# NASA - OPEN MCT NOTEBOOK UI PROTOTYPE CHALLENGE
2+
3+
UI Prototype Competition
4+
5+
https://www.topcoder.com/challenge-details/30059614/
6+
7+
Heroku Implementation: http://nasa-mct-notebook.herokuapp.com/
8+
9+
Notebooks are a new domain object that allows users to create and edit timestamped text entries that also include snapshots of timestamped domain objects.
10+
11+
To build locally please follow the steps and requirements for the official openmct project:
12+
13+
## Building and Running Open MCT Locally
14+
15+
Building and running Open MCT in your local dev environment is very easy. Be sure you have [Git](https://git-scm.com/downloads) and [Node.js](https://nodejs.org/) installed, then follow the directions below. Need additional information? Check out the [Getting Started](https://nasa.github.io/openmct/getting-started/) page on our website.
16+
(These instructions assume you are installing as a non-root user; developers have [reported issues](https://github.com/nasa/openmct/issues/1151) running these steps with root privileges.)
17+
18+
1. Install development dependencies
19+
20+
`npm install`
21+
22+
2. Run a local development server
23+
24+
`npm start`
25+
26+
Open MCT is now running, and can be accessed by pointing a web browser at [http://localhost:8080/](http://localhost:8080/)
27+
28+
The current styles were made according with the visuals handled by the project, in fact a lot of classes (styles) were reused.
29+
30+
In order to persist in localstorage some changes made to the notebook is necessary to save the current state of the view, this for compatibility and familiarity with the behaviour of the rest of the mct components.
31+
32+
Since the snapshots are taken from the dom representation of the components it depends of the implementation of the project, where are some components which can take longer to display, or not display at all if they are not selected.
33+
34+
The notebook should work as a standalone plugin, you just need to put the folder 'notebook' at the examples folder and make the require to it in the index.html.
35+
36+
The Old API was used due to the documentation was more thorought.
37+
38+
#How to use it:
39+
Click on the create menu button at the left top corner of the creen and create a notebook object.
40+
After you saved it you can start to create new entries, either clicking inside of the drag area or dragging an especific object to a new entry or an entry already created.
41+
42+
Once you have created the snapshot of the object, you can make annotations over it. Also you can create whichever snapshots per entry as you consider,
43+

example/notebook/bundle.js

Lines changed: 238 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,238 @@
1+
define([
2+
'openmct',
3+
'./src/controllers/notebookController',
4+
'./src/MCTSnapshot',
5+
'./src/entryDnd',
6+
"./src/actions/viewSnapshot",
7+
"./src/actions/annotateSnapshot",
8+
"./src/actions/removeEmbed",
9+
"./src/actions/createSnapshot",
10+
"./src/actions/removeSnapshot",
11+
"./src/actions/newEntryContextual",
12+
"./src/capabilities/notebookCapability",
13+
"./src/indicators/notificationIndicator",
14+
"text!./res/templates/controls/embedControl.html",
15+
"text!./res/templates/entry.html",
16+
"text!./res/templates/annotation.html",
17+
"text!./res/templates/notifications.html"
18+
], function (
19+
openmct,
20+
notebookController,
21+
MCTSnapshot,
22+
MCTEntryDnd,
23+
viewSnapshotAction,
24+
AnnotateSnapshotAction,
25+
removeEmbedAction,
26+
createSnapshotAction,
27+
removeSnapshotAction,
28+
newEntryAction,
29+
NotebookCapability,
30+
NotificationLaunchIndicator,
31+
embedControlTemplate,
32+
frameTemplate,
33+
annotateSnapshot,
34+
notificationTemplate
35+
) {
36+
openmct.legacyRegistry.register("example/notebook", {
37+
"name": "Notebook Plugin",
38+
"description": "Create and save timestamped notes with embedded object snapshots.",
39+
"extensions":
40+
{
41+
"types":[
42+
{
43+
"key": "notebook",
44+
"name": "Notebook",
45+
"cssClass": "icon-notebook",
46+
"description": "Create and save timestamped notes with embedded object snapshots.",
47+
"features": ["creation"],
48+
"model": {
49+
"entries":[
50+
{ "createdOn": 1507512539258,
51+
"text": "Quis qui dolupti atempe non preicias qui dolorro",
52+
"embeds":[]
53+
},
54+
{ "createdOn": 1507570153599,
55+
"text": "Rehek rerspis nis dem re verae remporrunti sintis vendi comnimi ntiusapic teceseque."
56+
},
57+
{ "createdOn": 1507595098278,
58+
"text": "Rehek rerspis nis dem re verae remporrunti sintis vendi comnimi ntiusapic teceseque."
59+
}
60+
],
61+
"composition":[]
62+
}
63+
}
64+
],
65+
"views": [
66+
{
67+
"key": "notebook.view",
68+
"type": "notebook",
69+
"cssClass": "icon-notebook",
70+
"name": "notebook",
71+
"templateUrl": "templates/notebook.html",
72+
"editable": true,
73+
"uses": [
74+
"composition",
75+
"action"
76+
],
77+
"gestures": [
78+
"drop"
79+
]
80+
},
81+
],
82+
"controllers": [
83+
{
84+
"key": "notebookController",
85+
"implementation": notebookController,
86+
"depends": [ "$scope",
87+
"dialogService",
88+
"popupService",
89+
"agentService",
90+
"now",
91+
"actionService",
92+
"$timeout"
93+
]
94+
}
95+
],
96+
"representations": [
97+
{
98+
"key": "draggedEntry",
99+
"template": frameTemplate
100+
}
101+
],
102+
"templates": [
103+
{
104+
"key": "annotate-snapshot",
105+
"template": annotateSnapshot
106+
},
107+
{
108+
"key": "notificationTemplate",
109+
"template": notificationTemplate
110+
}
111+
],
112+
"directives": [
113+
{
114+
"key": "mctSnapshot",
115+
"implementation": MCTSnapshot,
116+
"depends": [
117+
"$document",
118+
"exportImageService",
119+
"dialogService",
120+
"notificationService"
121+
]
122+
},
123+
{
124+
"key": "mctEntryDnd",
125+
"implementation": MCTEntryDnd,
126+
"depends": [
127+
"$document","dndService","typeService"
128+
]
129+
}
130+
],
131+
"actions": [
132+
{
133+
"key": "view-snapshot",
134+
"implementation": viewSnapshotAction,
135+
"name": "View Snapshot",
136+
"description": "View the large image in a modal",
137+
"category": "embed",
138+
"depends":[
139+
"$compile"
140+
]
141+
},
142+
{
143+
"key": "annotate-snapshot",
144+
"implementation": AnnotateSnapshotAction,
145+
"name": "Annotate Snapshot",
146+
"cssClass": "icon-pencil labeled",
147+
"description": "Annotate embed's snapshot",
148+
"category": "embed",
149+
"depends":[
150+
"dialogService",
151+
"dndService"
152+
]
153+
},
154+
{
155+
"key": "remove-snapshot",
156+
"implementation": removeSnapshotAction,
157+
"name": "Remove Snapshot",
158+
"cssClass": "icon-trash labeled",
159+
"description": "Remove Snapshot of the embed",
160+
"category": "embed",
161+
"depends":[
162+
"dialogService"
163+
]
164+
},
165+
{
166+
"key": "create-snapshot",
167+
"implementation": createSnapshotAction,
168+
"name": "Create Snapshot",
169+
"description": "Create a snapshot for the embed",
170+
"category": "embed-no-snap",
171+
"priority": "preferred"
172+
},
173+
{
174+
"key": "remove-embed",
175+
"implementation": removeEmbedAction,
176+
"name": "Remove...",
177+
"cssClass": "icon-trash labeled",
178+
"description": "Remove this embed",
179+
"category": [
180+
"embed",
181+
"embed-no-snap"
182+
],
183+
"depends":[
184+
"dialogService"
185+
]
186+
},
187+
{
188+
"key": "new-entry-contextual",
189+
"implementation": newEntryAction,
190+
"name": "New Notebook Entry",
191+
"cssClass": "icon-notebook labeled",
192+
"description": "Add a new entry",
193+
"category": [
194+
"contextual"
195+
],
196+
"depends":[
197+
"dialogService",
198+
"notificationService",
199+
"linkService"
200+
]
201+
}
202+
],
203+
"indicators": [
204+
{
205+
"implementation": NotificationLaunchIndicator,
206+
"priority": "fallback"
207+
}
208+
],
209+
"capabilities": [
210+
{
211+
"key": "notebook",
212+
"name": "Notebook Capability",
213+
"description": "Provides a capability for looking for a notebook domain object",
214+
"implementation": NotebookCapability,
215+
"depends": [
216+
"typeService",
217+
]
218+
}
219+
],
220+
"controls": [
221+
{
222+
"key": "embed-control",
223+
"template": embedControlTemplate
224+
},
225+
],
226+
"stylesheets": [
227+
{
228+
"stylesheetUrl": "css/style-guide-espresso.css",
229+
"theme": "espresso"
230+
},
231+
{
232+
"stylesheetUrl": "css/style-guide-snow.css",
233+
"theme": "snow"
234+
}
235+
]
236+
}
237+
});
238+
});

0 commit comments

Comments
 (0)