comparison Applications/StoneWebViewer/WebApplication/index.html @ 1689:fad38c4525f9

nicer modal for user preferences
author Sebastien Jodogne <s.jodogne@gmail.com>
date Wed, 25 Nov 2020 17:07:32 +0100
parents 59fc37c10cfa
children eafb10992e73
comparison
equal deleted inserted replaced
1686:59fc37c10cfa 1689:fad38c4525f9
25 <a href="https://www.osimis.io" target="_blank"> 25 <a href="https://www.osimis.io" target="_blank">
26 <img style="width: 340px;" src="img/orthanc.png"/> 26 <img style="width: 340px;" src="img/orthanc.png"/>
27 </a> 27 </a>
28 </div> 28 </div>
29 <div class="wvInfoPopupText"> 29 <div class="wvInfoPopupText">
30 <h3>Usage</h3> 30 <h3>Intended use</h3>
31 <p> 31 <p>
32 The Stone Web Viewer is intended for<br> patients 32 The Stone Web Viewer is intended for<br> patients
33 reviewing their images,<br> for research and for quality 33 reviewing their images,<br> for research and for quality
34 assurance. 34 assurance.
35 </p> 35 </p>
36 <!--
37 <h3>Documentation</h3>
38 <p>
39 <a href="#" target="_blank">User Manual</a>
40 </p>
41 <h3>Versions</h3>
42 <p>
43 Orthanc: aa<br>
44 Osimis WebViewer: bb
45 </p>
46 -->
47 </div> 36 </div>
48 <div class="wvInfoPopupForm"> 37 <div class="wvInfoPopupForm">
49 <br> 38 <br>
50 <label>Show this info panel at startup 39 <label>Show this information at startup
51 <input type="checkbox" style="margin-left: 20px" v-model="settingNotDiagnostic"> 40 <input type="checkbox" style="margin-left: 20px" v-model="settingNotDiagnostic">
52 </label> 41 </label>
53 <br><br> 42 <br><br>
54 <div style="text-align: center;"> 43 <div style="text-align: center;">
55 <button class="wvInfoPopupCloseButton" @click="modalNotDiagnostic = false"> 44 <button class="wvInfoPopupCloseButton" @click="modalNotDiagnostic = false">
58 </div> 47 </div>
59 </div> 48 </div>
60 </div> 49 </div>
61 </div> 50 </div>
62 51
63 <div class="wvLoadingScreen" v-show="!ready && !modalNotDiagnostic" style="display: none"> 52 <div class="wvInfoScreen" v-show="modalPreferences" style="display: none">
53 <div class="wvInfoPopup">
54 <div class="wvInfoPopupLogo">
55 <a href="https://www.osimis.io" target="_blank">
56 <img style="width: 340px;" src="img/orthanc.png"/>
57 </a>
58 </div>
59 <div class="wvInfoPopupText">
60 <h3>Intended use</h3>
61 <p>
62 The Stone Web Viewer is intended for<br> patients
63 reviewing their images,<br> for research and for quality
64 assurance.
65 </p>
66 <h3>User preferences</h3>
67 </div>
68 <div class="wvInfoPopupForm">
69 <label>Warn about the intended use at startup
70 <input type="checkbox" style="margin-left: 20px" v-model="settingNotDiagnostic">
71 </label>
72 <br>
73 <label>Use software rendering (will reload the viewer)
74 <input type="checkbox" style="margin-left: 20px" v-model="settingSoftwareRendering">
75 </label>
76 <br><br>
77 <div style="text-align: center;">
78 <button class="wvInfoPopupCloseButton" @click="ApplyPreferences()">
79 Apply
80 </button>
81 </div>
82 </div>
83 </div>
84 </div>
85
86 <div class="wvLoadingScreen" v-show="!ready && !modalNotDiagnostic && !modalPreferences" style="display: none">
64 <span class="wvLoadingSpinner"> 87 <span class="wvLoadingSpinner">
65 <div class="bounce1"></div> 88 <div class="bounce1"></div>
66 <div class="bounce2"></div> 89 <div class="bounce2"></div>
67 <div class="bounce3"></div> 90 <div class="bounce3"></div>
68 </span> 91 </span>
69 </div> 92 </div>
70 93
71 <div class="fluid-height fluid-width" v-show="ready && !modalNotDiagnostic" 94 <div class="fluid-height fluid-width" v-show="ready && !modalNotDiagnostic && !modalPreferences"
72 style="display: none"> 95 style="display: none">
73 96
74 <div class="wvWarning wvPrintExclude" v-show="modalWarning"> 97 <div class="wvWarning wvPrintExclude" v-show="modalWarning">
75 <div class="wvWarning-content clearfix"> 98 <div class="wvWarning-content clearfix">
76 <span class="wvWarning-text"> 99 <span class="wvWarning-text">
82 </p> 105 </p>
83 </span> 106 </span>
84 </div> 107 </div>
85 <div class="text-right mb10 mr10"> 108 <div class="text-right mb10 mr10">
86 <button class="btn btn-primary" @click="modalWarning=false">OK</button> 109 <button class="btn btn-primary" @click="modalWarning=false">OK</button>
87 </div>
88 </div>
89
90
91 <div class="wvWarning wvPrintExclude" v-show="modalPreferences">
92 <div class="wvWarning-content clearfix">
93 <span class="wvWarning-text">
94 <h2 class="mb10">Preferences</h2>
95
96 <div class="form-check">
97 <input class="form-check-input" type="checkbox" v-model="settingNotDiagnostic" id="checkboxNotDiagnostic2">
98 <label class="form-check-label" for="checkboxNotDiagnostic2" style="color:#000;display:inline">
99 Warn about diagnostic usage at startup
100 </label>
101 </div>
102
103 <div class="form-check">
104 <input class="form-check-input" type="checkbox" v-model="settingSoftwareRendering" id="checkboxSoftwareRendering">
105 <label class="form-check-label" for="checkboxSoftwareRendering" style="color:#000;display:inline">
106 Use software rendering (will reload the viewer)
107 </label>
108 </div>
109 </span>
110 </div>
111 <div class="text-right mb10 mr10">
112 <button class="btn btn-primary" @click="ApplyPreferences()">OK</button>
113 </div> 110 </div>
114 </div> 111 </div>
115 112
116 113
117 <div class="wvLayoutLeft wvLayoutLeft--closed" v-show="!leftVisible"> 114 <div class="wvLayoutLeft wvLayoutLeft--closed" v-show="!leftVisible">