|
1 <% if (options.show_top_bar) { %> |
|
2 <div class="Rk-TopBar"> |
|
3 <div class="loader"></div> |
|
4 <% if (!options.editor_mode) { %> |
|
5 <h2 class="Rk-PadTitle"> |
|
6 <%- project.get("title") || translate("Untitled project")%> |
|
7 </h2> |
|
8 <% } else { %> |
|
9 <input type="text" class="Rk-PadTitle" value="<%- project.get('title') || '' %>" placeholder="<%-translate('Untitled project')%>" /> |
|
10 <% } %> |
|
11 <% if (options.show_user_list) { %> |
|
12 <div class="Rk-Users"> |
|
13 <div class="Rk-CurrentUser"> |
|
14 <% if (options.show_user_color) { %> |
|
15 <div class="Rk-Edit-ColorPicker-Wrapper"> |
|
16 <span class="Rk-CurrentUser-Color"> |
|
17 <% if (options.user_color_editable) { %> |
|
18 <span class="Rk-Edit-ColorTip"></span> |
|
19 <% } %> |
|
20 </span> |
|
21 <% if (options.user_color_editable) { print(colorPicker) } %> |
|
22 </div> |
|
23 <% } %> |
|
24 <span class="Rk-CurrentUser-Name"><unknown user></span> |
|
25 </div> |
|
26 <ul class="Rk-UserList"></ul> |
|
27 </div> |
|
28 <% } %> |
|
29 <% if (options.home_button_url) {%> |
|
30 <div class="Rk-TopBar-Separator"></div> |
|
31 <a class="Rk-TopBar-Button Rk-Home-Button" href="<%- options.home_button_url %>"> |
|
32 <div class="Rk-TopBar-Tooltip"> |
|
33 <div class="Rk-TopBar-Tooltip-Contents"> |
|
34 <%- translate(options.home_button_title) %> |
|
35 </div> |
|
36 </div> |
|
37 </a> |
|
38 <% } %> |
|
39 <% if (options.show_fullscreen_button) { %> |
|
40 <div class="Rk-TopBar-Separator"></div> |
|
41 <div class="Rk-TopBar-Button Rk-FullScreen-Button"> |
|
42 <div class="Rk-TopBar-Tooltip"> |
|
43 <div class="Rk-TopBar-Tooltip-Contents"> |
|
44 <%-translate("Full Screen")%> |
|
45 </div> |
|
46 </div> |
|
47 </div> |
|
48 <% } %> |
|
49 <% if (options.editor_mode) { %> |
|
50 <% if (options.show_addnode_button) { %> |
|
51 <div class="Rk-TopBar-Separator"></div> |
|
52 <div class="Rk-TopBar-Button Rk-AddNode-Button"> |
|
53 <div class="Rk-TopBar-Tooltip"> |
|
54 <div class="Rk-TopBar-Tooltip-Contents"> |
|
55 <%-translate("Add Node")%> |
|
56 </div> |
|
57 </div> |
|
58 </div> |
|
59 <% } %> |
|
60 <% if (options.show_addedge_button) { %> |
|
61 <div class="Rk-TopBar-Separator"></div> |
|
62 <div class="Rk-TopBar-Button Rk-AddEdge-Button"> |
|
63 <div class="Rk-TopBar-Tooltip"> |
|
64 <div class="Rk-TopBar-Tooltip-Contents"> |
|
65 <%-translate("Add Edge")%> |
|
66 </div> |
|
67 </div> |
|
68 </div> |
|
69 <% } %> |
|
70 <% if (options.show_export_button) { %> |
|
71 <div class="Rk-TopBar-Separator"></div> |
|
72 <div class="Rk-TopBar-Button Rk-Export-Button"> |
|
73 <div class="Rk-TopBar-Tooltip"> |
|
74 <div class="Rk-TopBar-Tooltip-Contents"> |
|
75 <%-translate("Download Project")%> |
|
76 </div> |
|
77 </div> |
|
78 </div> |
|
79 <% } %> |
|
80 <% if (options.show_save_button) { %> |
|
81 <div class="Rk-TopBar-Separator"></div> |
|
82 <div class="Rk-TopBar-Button Rk-Save-Button"> |
|
83 <div class="Rk-TopBar-Tooltip"> |
|
84 <div class="Rk-TopBar-Tooltip-Contents"></div> |
|
85 </div> |
|
86 </div> |
|
87 <% } %> |
|
88 <% if (options.show_open_button) { %> |
|
89 <div class="Rk-TopBar-Separator"></div> |
|
90 <div class="Rk-TopBar-Button Rk-Open-Button"> |
|
91 <div class="Rk-TopBar-Tooltip"> |
|
92 <div class="Rk-TopBar-Tooltip-Contents"> |
|
93 <%-translate("Open Project")%> |
|
94 </div> |
|
95 </div> |
|
96 </div> |
|
97 <% } %> |
|
98 <% if (options.show_bookmarklet) { %> |
|
99 <div class="Rk-TopBar-Separator"></div> |
|
100 <a class="Rk-TopBar-Button Rk-Bookmarklet-Button" href="#"> |
|
101 <div class="Rk-TopBar-Tooltip"> |
|
102 <div class="Rk-TopBar-Tooltip-Contents"> |
|
103 <%-translate("Renkan \'Drag-to-Add\' bookmarklet")%> |
|
104 </div> |
|
105 </div> |
|
106 </a> |
|
107 <div class="Rk-TopBar-Separator"></div> |
|
108 <% } %> |
|
109 <% } else { %> |
|
110 <% if (options.show_export_button) { %> |
|
111 <div class="Rk-TopBar-Separator"></div> |
|
112 <div class="Rk-TopBar-Button Rk-Export-Button"> |
|
113 <div class="Rk-TopBar-Tooltip"> |
|
114 <div class="Rk-TopBar-Tooltip-Contents"> |
|
115 <%-translate("Download Project")%> |
|
116 </div> |
|
117 </div> |
|
118 </div> |
|
119 <div class="Rk-TopBar-Separator"></div> |
|
120 <% } %> |
|
121 <% }; %> |
|
122 <% if (options.show_search_field) { %> |
|
123 <form action="#" class="Rk-GraphSearch-Form"> |
|
124 <input type="search" class="Rk-GraphSearch-Field" placeholder="<%- translate('Search in graph') %>" /> |
|
125 </form> |
|
126 <div class="Rk-TopBar-Separator"></div> |
|
127 <% } %> |
|
128 </div> |
|
129 <% } %> |
|
130 <div class="Rk-Editing-Space<% if (!options.show_top_bar) { %> Rk-Editing-Space-Full<% } %>"> |
|
131 <div class="Rk-Labels"></div> |
|
132 <canvas class="Rk-Canvas" <% if (options.resize) { %> resize="" <% } %>></canvas> |
|
133 <div class="Rk-Notifications"></div> |
|
134 <div class="Rk-Editor"> |
|
135 <% if (options.show_bins) { %> |
|
136 <div class="Rk-Fold-Bins">«</div> |
|
137 <% } %> |
|
138 <% if (options.show_zoom) { %> |
|
139 <div class="Rk-ZoomButtons"> |
|
140 <div class="Rk-ZoomIn" title="<%-translate('Zoom In')%>"></div> |
|
141 <div class="Rk-ZoomFit" title="<%-translate('Zoom Fit')%>"></div> |
|
142 <div class="Rk-ZoomOut" title="<%-translate('Zoom Out')%>"></div> |
|
143 <% if (options.editor_mode && options.save_view) { %> |
|
144 <div class="Rk-ZoomSave" title="<%-translate('Zoom Save')%>"></div> |
|
145 <% } %> |
|
146 <% if (options.save_view) { %> |
|
147 <div class="Rk-ZoomSetSaved" title="<%-translate('View saved zoom')%>"></div> |
|
148 <% } %> |
|
149 </div> |
|
150 <% } %> |
|
151 </div> |
|
152 </div> |