Mercurial > hg > orthanc-stone

comparison Applications/StoneWebViewer/WebApplication/index.html @ 1709:2931f5e15320

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
download study from Stone Web viewer
author Sebastien Jodogne <s.jodogne@gmail.com>
date Mon, 30 Nov 2020 15:36:40 +0100
parents 3d62634d442f
children 673c163e1b3e
comparison
equal deleted inserted replaced
1708:eb59fbee071e 1709:2931f5e15320
140 <ul class="dropdown-menu checkbox-menu allow-focus"> 140 <ul class="dropdown-menu checkbox-menu allow-focus">
141 <li v-for="study in studies" 141 <li v-for="study in studies"
142 v-bind:class="{ active: study.selected }" 142 v-bind:class="{ active: study.selected }"
143 @click="study.selected = !study.selected"> 143 @click="study.selected = !study.selected">
144 <a> 144 <a>
145 {{ study.tags['0008,1030'] }} 145 {{ study.tags[STUDY_DESCRIPTION] }}
146 <small v-if="study.tags['0008,0020'].length > 0"> 146 <small v-if="study.tags[STUDY_DATE].length > 0">
147 [{{ FormatDate(study.tags['0008,0020']) }}] 147 [{{ FormatDate(study.tags[STUDY_DATE]) }}]
148 </small> 148 </small>
149 <span v-if="study.selected">&nbsp;<i class="fa fa-check"></i></span> 149 <span v-if="study.selected">&nbsp;<i class="fa fa-check"></i></span>
150 </a> 150 </a>
151 </li> 151 </li>
152 </ul> 152 </ul>
171 <div v-bind:class="'wvStudyIsland--' + study.color"> 171 <div v-bind:class="'wvStudyIsland--' + study.color">
172 <div v-bind:class="'wvStudyIsland__header--' + study.color"> 172 <div v-bind:class="'wvStudyIsland__header--' + study.color">
173 <!-- Actions --> 173 <!-- Actions -->
174 <div class="wvStudyIsland__actions" 174 <div class="wvStudyIsland__actions"
175 v-bind:class="{ 'wvStudyIsland__actions--oneCol': leftMode == 'small' }"> 175 v-bind:class="{ 'wvStudyIsland__actions--oneCol': leftMode == 'small' }">
176 <a class="wvButton"> 176 <a class="wvButton"
177 v-show="globalConfiguration.DownloadStudyEnabled && 'OrthancApiRoot' in globalConfiguration">
177 <!-- download --> 178 <!-- download -->
178 <i class="fa fa-download"></i> 179 <i class="fa fa-download" v-show="!creatingArchive"
180 data-toggle="tooltip" data-title="Download the study"
181 @click="DownloadStudy(study.tags[STUDY_INSTANCE_UID])"></i>
182 <i class="fas fa-sync fa-spin" v-show="creatingArchive"
183 data-toggle="tooltip" data-title="A ZIP archive is being created by Orthanc..."></i>
179 </a> 184 </a>
180 </div> 185 </div>
181 186
182 <!-- Title --> 187 <!-- Title -->
183 {{ study.tags['0008,1030'] }} 188 {{ study.tags[STUDY_DESCRIPTION] }}
184 <br/> 189 <br/>
185 <small>{{ FormatDate(study.tags['0008,0020']) }}</small> 190 <small>{{ FormatDate(study.tags[STUDY_DATE]) }}</small>
186 </div> 191 </div>
187 192
188 <div class="wvStudyIsland__main"> 193 <div class="wvStudyIsland__main">
189 <ul class="wvSerieslist"> 194 <ul class="wvSerieslist">
190 195
191 <!-- Series without multiple multiframe instances --> 196 <!-- Series without multiple multiframe instances -->
192 <span v-for="seriesIndex in study.series"> 197 <span v-for="seriesIndex in study.series">
193 <li class="wvSerieslist__seriesItem" 198 <li class="wvSerieslist__seriesItem"
194 v-bind:class="{ highlighted : GetActiveSeries().includes(series[seriesIndex].tags['0020,000e']), 'wvSerieslist__seriesItem--list' : leftMode != 'grid', 'wvSerieslist__seriesItem--grid' : leftMode == 'grid' }" 199 v-bind:class="{ highlighted : GetActiveSeries().includes(series[seriesIndex].tags[SERIES_INSTANCE_UID]), 'wvSerieslist__seriesItem--list' : leftMode != 'grid', 'wvSerieslist__seriesItem--grid' : leftMode == 'grid' }"
195 v-on:dragstart="SeriesDragStart($event, seriesIndex)" 200 v-on:dragstart="SeriesDragStart($event, seriesIndex)"
196 v-on:click="ClickSeries(seriesIndex)" 201 v-on:click="ClickSeries(seriesIndex)"
197 v-if="series[seriesIndex].multiframeInstances === null"> 202 v-if="series[seriesIndex].multiframeInstances === null">
198 <div class="wvSerieslist__picture" style="z-index:0" 203 <div class="wvSerieslist__picture" style="z-index:0"
199 draggable="true" 204 draggable="true"
212 <i v-if="series[seriesIndex].type == stone.ThumbnailType.VIDEO" 217 <i v-if="series[seriesIndex].type == stone.ThumbnailType.VIDEO"
213 class="wvSerieslist__placeholderIcon fa fa-video-video"></i> 218 class="wvSerieslist__placeholderIcon fa fa-video-video"></i>
214 219
215 <div v-if="[stone.ThumbnailType.IMAGE, stone.ThumbnailType.NO_PREVIEW].includes(series[seriesIndex].type)" 220 <div v-if="[stone.ThumbnailType.IMAGE, stone.ThumbnailType.NO_PREVIEW].includes(series[seriesIndex].type)"
216 class="wvSerieslist__placeholderIcon" 221 class="wvSerieslist__placeholderIcon"
217 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags['0008,0060'] + '] ' + series[seriesIndex].tags['0008,103e']"> 222 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags[MODALITY] + '] ' + series[seriesIndex].tags[SERIES_DESCRIPTION]">
218 <i v-if="series[seriesIndex].type == stone.ThumbnailType.NO_PREVIEW" 223 <i v-if="series[seriesIndex].type == stone.ThumbnailType.NO_PREVIEW"
219 class="fa fa-eye-slash"></i> 224 class="fa fa-eye-slash"></i>
220 225
221 <img v-if="series[seriesIndex].type == stone.ThumbnailType.IMAGE" 226 <img v-if="series[seriesIndex].type == stone.ThumbnailType.IMAGE"
222 v-bind:src="series[seriesIndex].thumbnail" 227 v-bind:src="series[seriesIndex].thumbnail"
223 style="vertical-align:baseline" 228 style="vertical-align:baseline"
224 width="65px" height="65px" 229 width="65px" height="65px"
225 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags['0008,0060'] + '] ' + series[seriesIndex].tags['0008,103e']" 230 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags[MODALITY] + '] ' + series[seriesIndex].tags[SERIES_DESCRIPTION]"
226 /> 231 />
227 232
228 <div v-bind:class="'wvSerieslist__badge--' + study.color" 233 <div v-bind:class="'wvSerieslist__badge--' + study.color"
229 v-if="series[seriesIndex].numberOfFrames != 0">{{ series[seriesIndex].numberOfFrames }}</div> 234 v-if="series[seriesIndex].numberOfFrames != 0">{{ series[seriesIndex].numberOfFrames }}</div>
230 </div> 235 </div>
233 <div v-if="leftMode == 'full'" class="wvSerieslist__information" 238 <div v-if="leftMode == 'full'" class="wvSerieslist__information"
234 draggable="true" 239 draggable="true"
235 v-on:dragstart="SeriesDragStart($event, seriesIndex)" 240 v-on:dragstart="SeriesDragStart($event, seriesIndex)"
236 v-on:click="ClickSeries(seriesIndex)"> 241 v-on:click="ClickSeries(seriesIndex)">
237 <p class="wvSerieslist__label"> 242 <p class="wvSerieslist__label">
238 [{{ series[seriesIndex].tags['0008,0060'] }}] 243 [{{ series[seriesIndex].tags[MODALITY] }}]
239 {{ series[seriesIndex].tags['0008,103e'] }} 244 {{ series[seriesIndex].tags[SERIES_DESCRIPTION] }}
240 </p> 245 </p>
241 </div> 246 </div>
242 </li> 247 </li>
243 248
244 249
252 draggable="true"> 257 draggable="true">
253 <img v-if="series[seriesIndex].type == stone.ThumbnailType.IMAGE" 258 <img v-if="series[seriesIndex].type == stone.ThumbnailType.IMAGE"
254 v-bind:src="sopInstanceUid in multiframeInstanceThumbnails ? multiframeInstanceThumbnails[sopInstanceUid] : series[seriesIndex].thumbnail" 259 v-bind:src="sopInstanceUid in multiframeInstanceThumbnails ? multiframeInstanceThumbnails[sopInstanceUid] : series[seriesIndex].thumbnail"
255 style="vertical-align:baseline" 260 style="vertical-align:baseline"
256 width="65px" height="65px" 261 width="65px" height="65px"
257 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags['0008,0060'] + '] ' + series[seriesIndex].tags['0008,103e']" 262 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags[MODALITY] + '] ' + series[seriesIndex].tags[SERIES_DESCRIPTION]"
258 /> 263 />
259 264
260 <div v-bind:class="'wvSerieslist__badge--' + study.color"> 265 <div v-bind:class="'wvSerieslist__badge--' + study.color">
261 {{ numberOfFrames }} 266 {{ numberOfFrames }}
262 </div> 267 </div>
265 <div v-if="leftMode == 'full'" class="wvSerieslist__information" 270 <div v-if="leftMode == 'full'" class="wvSerieslist__information"
266 draggable="true" 271 draggable="true"
267 v-on:dragstart="MultiframeInstanceDragStart($event, seriesIndex, sopInstanceUid)" 272 v-on:dragstart="MultiframeInstanceDragStart($event, seriesIndex, sopInstanceUid)"
268 v-on:click="MultiframeInstanceDragStart($event, seriesIndex, sopInstanceUid)"> 273 v-on:click="MultiframeInstanceDragStart($event, seriesIndex, sopInstanceUid)">
269 <p class="wvSerieslist__label"> 274 <p class="wvSerieslist__label">
270 [{{ series[seriesIndex].tags['0008,0060'] }}] 275 [{{ series[seriesIndex].tags[MODALITY] }}]
271 {{ series[seriesIndex].tags['0008,103e'] }} 276 {{ series[seriesIndex].tags[SERIES_DESCRIPTION] }}
272 </p> 277 </p>
273 </div> 278 </div>
274 </li> 279 </li>
275 280
276 </span> 281 </span>
599 oncontextmenu="return false"></canvas> 604 oncontextmenu="return false"></canvas>
600 605
601 <div v-show="showInfo"> 606 <div v-show="showInfo">
602 <div class="wv-overlay"> 607 <div class="wv-overlay">
603 <div v-if="'tags' in content.series" class="wv-overlay-topleft"> 608 <div v-if="'tags' in content.series" class="wv-overlay-topleft">
604 {{ content.series.tags['0010,0010'] }}<br/> 609 {{ content.series.tags[PATIENT_NAME] }}<br/>
605 {{ content.series.tags['0010,0020'] }} 610 {{ content.series.tags[PATIENT_ID] }}
606 </div> 611 </div>
607 <div v-if="'tags' in content.series" class="wv-overlay-topright"> 612 <div v-if="'tags' in content.series" class="wv-overlay-topright">
608 {{ content.series.tags['0008,1030'] }}<br/> 613 {{ content.series.tags[STUDY_DESCRIPTION] }}<br/>
609 {{ app.FormatDate(content.series.tags['0008,0020']) }}<br/> 614 {{ app.FormatDate(content.series.tags[STUDY_DATE]) }}<br/>
610 {{ content.series.tags['0020,0011'] }} | {{ content.series.tags['0008,103e'] }} 615 {{ content.series.tags[SERIES_NUMBER] }} | {{ content.series.tags[SERIES_DESCRIPTION] }}
611 </div> 616 </div>
612 <div class="wv-overlay-timeline-wrapper wvPrintExclude"> 617 <div class="wv-overlay-timeline-wrapper wvPrintExclude">
613 <div style="text-align:left; padding:5px" v-show="numberOfFrames != 0"> 618 <div style="text-align:left; padding:5px" v-show="numberOfFrames != 0">
614 <div style="width: 12em; padding: 1em;" v-show="cineControls"> 619 <div style="width: 12em; padding: 1em;" v-show="cineControls">
615 <label> 620 <label>