Skip to content

Commit 3bd230f

Browse files
committed
Add guided tours
1 parent f453bb9 commit 3bd230f

11 files changed

Lines changed: 1150 additions & 49 deletions

File tree

OpenFlow/src/public/Controllers.ts

Lines changed: 738 additions & 9 deletions
Large diffs are not rendered by default.

OpenFlow/src/public/Customer.html

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,20 @@ <h1 class="pagetitle" translate lib="web">customer</h1>
44
</div>
55
</div>
66

7+
<div class="row"
8+
ng-show="ctrl.WebSocketClientService.customer == null && menuctrl.WebSocketClientService.stripe_api_key && menuctrl.WebSocketClientService.stripe_api_key != ''">
9+
<div class="col-sm-7">
10+
To enable multitenancy and purchase options, you need to fill out the form below.<br><br>
11+
</div>
12+
</div>
13+
714
<pre ng-show="ErrorMessage!=null">{{ ErrorMessage }}</pre>
815
<div ng-show="ctrl.errormessage != ''"" class=" alert alert-danger" role="alert">{{ctrl.errormessage}}</div>
916
<form ng-submit="ctrl.submit()" class="form-horizontal" role="form" autocomplete="off">
1017

1118
<div class="form-row row-eq-spacing-sm">
1219
<div class="col-sm">
13-
<label for="name" class="required">name</label>
20+
<label for="name" class="required">company name</label>
1421
<input type="text" class="form-control" id="name" placeholder="Company name" required="required"
1522
ng-model="ctrl.model.name" ng-disabled="ctrl.loading==true">
1623
</div>
@@ -336,7 +343,8 @@ <h1 class="pagetitle" translate lib="web">customer</h1>
336343

337344
<div ng-show="!ctrl.model.stripeid || ctrl.model.stripeid == ''">
338345
Current database usage:
339-
<format-bytes ng-model="ctrl.model.dbusage" />
346+
<format-bytes ng-model="ctrl.model.dbusage" ng-show="ctrl.model.dbusage" />
347+
<format-bytes ng-model="WebSocketClientService.user.dbusage" ng-show="!ctrl.model.dbusage" />
340348
</div>
341349
<div ng-repeat="Resource in ctrl.Resources" ng-show="ctrl.model.stripeid">
342350
<div class="row" ng-repeat="Product in Resource.products" ng-show="Resource.customerassign == 'multiplevariants'">

OpenFlow/src/public/Entities.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,14 @@
66
<div class="col-md-6">
77
<div className="btn-group-justified">
88
<div class="btn-group" role="group">
9-
<select ng-model="ctrl.collection" ng-options="item.name as item.name for item in ctrl.collections"
10-
ng-change="ctrl.SelectCollection()">
9+
<select id="menucollections" ng-model="ctrl.collection"
10+
ng-options="item.name as item.name for item in ctrl.collections" ng-change="ctrl.SelectCollection()">
1111
</select>
1212
</div>
1313

1414
</div>
1515
</div>
16-
<div class=" col-md-6 text-right">
16+
<div class=" col-md-6 text-right" id="entitiestools">
1717
<a ng-href="#/Deleted/{{ctrl.collection}}" class="btn btn-info"><em class="fas fa-undo"></em></a>
1818
<a ng-href="#/Duplicates/{{ctrl.collection}}" class="btn btn-info"><em class="fas fa-clone"></em></a>
1919
<a ng-href="#/Entity/{{ctrl.collection}}" class="btn btn-info"><em class="fas fa-plus"></em></a>

OpenFlow/src/public/Entity.html

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ <h1 class="pagetitle"><span translate lib="web">detailsfor</span> {{ctrl.model.n
3333

3434
<div class="form-inline">
3535
<label for="add" class="col-sm-1 control-label" translate lib="web">add</label>
36-
<div class="col-sm-6 input-group">
36+
<div class="col-sm-6 input-group" id="addusergroup">
3737
<input type="text" name="user" id="user" ng-model="ctrl.searchtext" ng-keyup="ctrl.setkey($event)"
3838
class="form-control" ng-model-options="{ debounce: 500 }" ng-change="ctrl.handlefilter()"
3939
ng-keypress="ctrl.restrictInput($event)" autocomplete="off" />
@@ -56,7 +56,7 @@ <h1 class="pagetitle"><span translate lib="web">detailsfor</span> {{ctrl.model.n
5656
</div>
5757

5858

59-
<section ng-repeat="ace in ctrl.model._acl" ng-show="ctrl.collection!='files'">
59+
<section ng-repeat="ace in ctrl.model._acl" ng-show="ctrl.collection!='files'" id="entitypermissions">
6060
<div class="form-inline">
6161
<label class="col-sm-4 control-label">{{ace.name}}: </label>
6262
<input ng-disabled="ctrl.loading==true" type="checkbox" ng-checked="ctrl.isBitSet(ace.rights, 1)"
@@ -97,7 +97,8 @@ <h1 class="pagetitle"><span translate lib="web">detailsfor</span> {{ctrl.model.n
9797
<pre ng-show="ErrorMessage!=null" class=" alert alert-danger" role="alert">{{ ErrorMessage }}</pre>
9898
<div ng-show="ctrl.errormessage != ''"" class=" alert alert-danger" role="alert">{{ctrl.errormessage}}</div>
9999
<pre>{{ctrl.message}}</pre>
100-
<a href="" ng-hide="ctrl.showjson==true" ng-click="ctrl.togglejson()" translate lib="web">showjson</a>
100+
<a href="" ng-hide="ctrl.showjson==true" ng-click="ctrl.togglejson()" translate lib="web"
101+
id="enableshowjson">showjson</a>
101102
<a href="" ng-hide="ctrl.showjson==false" ng-click="ctrl.togglejson()" translate lib="web">showproperties</a>
102103
<form ng-submit="ctrl.submit()" class="form-horizontal" role="form" autocomplete="off" ng-hide="ctrl.showjson==true">
103104
<div class="form-group">

OpenFlow/src/public/PassiveLogin.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -222,7 +222,7 @@ <h5 class="card-title text-center"><span translate lib="web">signin</span> {{ctr
222222
</div>
223223
<a tabindex="-1" ng-href="/Signout" class="btn btn-lg btn-block text-uppercase">
224224
<em class="fas fa-sign-out-alt"></em>
225-
Singout
225+
Signout
226226
</a>
227227

228228

OpenFlow/src/public/app.css

Lines changed: 214 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1+
@charset "UTF-8";
12
@import url(../../../node_modules/@fortawesome/fontawesome-free/css/all.css);
23
@import url(./formio.full.min.css);
34
@import url(../../../node_modules/halfmoon/css/halfmoon-variables.css);
5+
@import url(../../../node_modules/shepherd.js/dist/css/shepherd.css);
46
.jsondiffpatch-annotated-delta {
57
font-family: 'Bitstream Vera Sans Mono', 'DejaVu Sans Mono', Monaco, Courier, monospace;
68
font-size: 12px;
@@ -230,6 +232,14 @@ textarea{
230232
.ignore-css {
231233
all: unset; }
232234

235+
.shepherd-title {
236+
font-size: 20px;
237+
padding: 1rem; }
238+
239+
.shepherd-text {
240+
font-size: 18px;
241+
padding: 2rem; }
242+
233243
/* @import "site.css";
234244
@import "node_modules/@fortawesome/fontawesome-free/css/all.css";
235245
@import "node_modules/halfmoon/css/halfmoon-variables.min.css";
@@ -238,3 +248,207 @@ textarea{
238248
.ignore-css {
239249
all:unset;
240250
} */
251+
.dark-mode #shepherdModalOverlayContainer {
252+
-ms-filter: "progid:dximagetransform.microsoft.gradient.alpha(Opacity=50)";
253+
filter: alpha(opacity=50);
254+
height: 100vh;
255+
left: 0;
256+
opacity: .5;
257+
position: fixed;
258+
top: 0;
259+
transition: all .3s ease-out;
260+
width: 100vw;
261+
z-index: 9997; }
262+
263+
#shepherdModalOverlayContainer
264+
#shepherdModalMask, #shepherdModalOverlayContainer #shepherdModalMaskRect {
265+
height: 100vh;
266+
width: 100vw; }
267+
268+
.dark-mode .shepherd-modal.shepherd-enabled {
269+
position: relative;
270+
z-index: 9998; }
271+
272+
.dark-mode .shepherd-active.shepherd-modal-is-visible :not(.shepherd-target) {
273+
pointer-events: none; }
274+
275+
.dark-mode .shepherd-active.shepherd-modal-is-visible .shepherd-button, .shepherd-active.shepherd-modal-is-visible .shepherd-button *, .shepherd-active.shepherd-modal-is-visible .shepherd-cancel-link, .shepherd-active.shepherd-modal-is-visible .shepherd-cancel-link *, .shepherd-active.shepherd-modal-is-visible .shepherd-element, .shepherd-active.shepherd-modal-is-visible .shepherd-element *, .shepherd-active.shepherd-modal-is-visible .shepherd-target, .shepherd-active.shepherd-modal-is-visible .shepherd-target * {
276+
pointer-events: auto; }
277+
278+
.dark-mode .shepherd-popper .tippy-arrow {
279+
transform: scale(1.5); }
280+
281+
.dark-mode .tippy-popper.shepherd-popper {
282+
z-index: 9999; }
283+
284+
.dark-mode .tippy-popper.shepherd-popper .tippy-arrow {
285+
border: 16px solid transparent;
286+
content: "";
287+
display: block;
288+
height: 0;
289+
pointer-events: none;
290+
position: absolute;
291+
width: 0; }
292+
293+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=top] {
294+
margin-bottom: 16px; }
295+
296+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=top] .tippy-arrow {
297+
border-bottom: 0;
298+
border-top-color: #232323;
299+
left: calc(50% - 16px); }
300+
301+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=bottom] {
302+
margin-top: 16px; }
303+
304+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=bottom] .tippy-arrow {
305+
border-bottom-color: #303030;
306+
border-top: 0;
307+
left: calc(50% - 16px); }
308+
309+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=left] {
310+
margin-right: 16px; }
311+
312+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=left] .tippy-arrow {
313+
border-left-color: #232323;
314+
border-right: 0;
315+
margin-top: -16px;
316+
top: calc(50% - 16px); }
317+
318+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=right] {
319+
margin-left: 16px; }
320+
321+
.dark-mode .tippy-popper.shepherd-popper[x-placement^=right] .tippy-arrow {
322+
border-left: 0;
323+
border-right-color: #232323;
324+
top: calc(50% - 16px); }
325+
326+
.dark-mode .tippy-popper.shepherd-popper .tippy-tooltip {
327+
background-color: transparent;
328+
max-height: 100%;
329+
max-width: 100%;
330+
padding: 0;
331+
width: 400px; }
332+
333+
.dark-mode .shepherd-element, .shepherd-element *, .shepherd-element:after, .shepherd-element :after, .shepherd-element:before, .shepherd-element :before {
334+
box-sizing: border-box; }
335+
336+
.dark-mode .shepherd-element {
337+
filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2)); }
338+
339+
.dark-mode .shepherd-element.shepherd-has-title .shepherd-content header {
340+
background: #303030;
341+
padding: 1em; }
342+
343+
.dark-mode .shepherd-element .shepherd-content {
344+
background: #232323;
345+
font-size: inherit;
346+
padding: 0; }
347+
348+
.dark-mode .shepherd-element .shepherd-content header {
349+
*zoom: 1;
350+
align-items: center;
351+
border-top-left-radius: 5px;
352+
border-top-right-radius: 5px;
353+
display: flex;
354+
justify-content: center;
355+
line-height: 2em;
356+
padding: .75em .75em 0; }
357+
358+
.dark-mode .shepherd-element .shepherd-content header:after {
359+
clear: both;
360+
content: "";
361+
display: table; }
362+
363+
.dark-mode .shepherd-element .shepherd-content header .shepherd-cancel-link, .shepherd-element .shepherd-content header .shepherd-title {
364+
font-weight: 400;
365+
margin: 0;
366+
padding: 0;
367+
position: relative;
368+
vertical-align: middle; }
369+
370+
.dark-mode .shepherd-element .shepherd-content header .shepherd-title {
371+
color: rgba(255, 255, 255, 0.75);
372+
display: flex;
373+
flex: 1 0 auto;
374+
font-size: 1.1em; }
375+
376+
.dark-mode .shepherd-element .shepherd-content header .shepherd-cancel-link {
377+
color: rgba(255, 255, 255, 0.75);
378+
font-size: 2em;
379+
margin-left: auto;
380+
text-decoration: none;
381+
transition: color .5s ease; }
382+
383+
.dark-mode .shepherd-element .shepherd-content header .shepherd-cancel-link:before {
384+
content: "×"; }
385+
386+
.dark-mode .shepherd-element .shepherd-content header .shepherd-cancel-link:hover {
387+
color: rgba(255, 255, 255, 0.75); }
388+
389+
.dark-mode .shepherd-element .shepherd-content .shepherd-text {
390+
color: rgba(255, 255, 255, 0.75);
391+
line-height: 1.3em;
392+
padding: .75em; }
393+
394+
.dark-mode .shepherd-element .shepherd-content .shepherd-text a, .shepherd-element .shepherd-content .shepherd-text a:active, .shepherd-element .shepherd-content .shepherd-text a:visited {
395+
border-bottom: 1px dotted rgba(255, 255, 255, 0.75);
396+
color: rgba(255, 255, 255, 0.75);
397+
text-decoration: none; }
398+
399+
.dark-mode .shepherd-element .shepherd-content .shepherd-text a:active:hover, .shepherd-element .shepherd-content .shepherd-text a:hover, .shepherd-element .shepherd-content .shepherd-text a:visited:hover {
400+
border-bottom-style: solid; }
401+
402+
.dark-mode .shepherd-element .shepherd-content .shepherd-text p {
403+
margin-top: 0; }
404+
405+
.dark-mode .shepherd-element .shepherd-content .shepherd-text p:last-child {
406+
margin-bottom: 0; }
407+
408+
.dark-mode .shepherd-element .shepherd-content footer {
409+
border-bottom-left-radius: 5px;
410+
border-bottom-right-radius: 5px;
411+
padding: 0 .75em .75em; }
412+
413+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons {
414+
list-style: none;
415+
margin: 0;
416+
padding: 0;
417+
text-align: right; }
418+
419+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li {
420+
display: inline;
421+
margin: 0 .5em 0 0; }
422+
423+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li:last-child {
424+
margin-right: 0; }
425+
426+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button {
427+
display: inline-block;
428+
*display: inline;
429+
vertical-align: middle;
430+
*vertical-align: auto;
431+
*zoom: 1;
432+
background: #3288e6;
433+
border: 0;
434+
border-radius: 3px;
435+
color: rgba(255, 255, 255, 0.75);
436+
cursor: pointer;
437+
font-family: inherit;
438+
font-size: .8em;
439+
letter-spacing: .1em;
440+
line-height: 1em;
441+
padding: .75em 2em;
442+
text-transform: uppercase;
443+
transition: all .5s ease; }
444+
445+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button:hover {
446+
background: #196fcc; }
447+
448+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary {
449+
background: #f1f2f3;
450+
color: rgba(0, 0, 0, 0.75); }
451+
452+
.dark-mode .shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button.shepherd-button-secondary:hover {
453+
background: #d5d8dc;
454+
color: rgba(0, 0, 0, 0.75); }

0 commit comments

Comments
 (0)