forked from extern/egroupware
Et2ImageExpose, used in Resources app
This commit is contained in:
parent
a8bcdd88b0
commit
632c40fbb7
@ -8,6 +8,7 @@ import {et2_IDetachedDOM} from "../et2_core_interfaces";
|
||||
* Set src property for the thumbnail / small image
|
||||
* Set href property to the URL of the full / large image
|
||||
*/
|
||||
//@ts-ignore Something not right with types & inheritance according to TypeScript
|
||||
export class Et2ImageExpose extends ExposeMixin(Et2Image) implements et2_IDetachedDOM
|
||||
{
|
||||
constructor()
|
||||
@ -41,6 +42,7 @@ export class Et2ImageExpose extends ExposeMixin(Et2Image) implements et2_IDetach
|
||||
getMedia(_value) : MediaValue[]
|
||||
{
|
||||
let media = super.getMedia(_value);
|
||||
media[0].title = this.label;
|
||||
media[0].thumbnail = this.src;
|
||||
|
||||
return media;
|
||||
|
@ -28,10 +28,10 @@ const IMAGE_DEFAULT = {
|
||||
// For filtering to only show things we can handle
|
||||
const MIME_REGEX = (navigator.userAgent.match(/(MSIE|Trident)/)) ?
|
||||
// IE only supports video/mp4 mime type
|
||||
new RegExp(/(video\/mp4)|(image\/:*(?!tif|x-xcf|pdf))|(audio\/:*)/) :
|
||||
new RegExp(/(video\/(mp4|ogg|webm))|(image\/:*(?!tif|x-xcf|pdf))|(audio\/:*)/);
|
||||
new RegExp(/(video\/mp4)|(image\/:*(?!tif|x-xcf|pdf))|(audio\/:*)/, 'ig') :
|
||||
new RegExp(/(video\/(mp4|ogg|webm))|(image\/:*(?!tif|x-xcf|pdf))|(audio\/:*)/, 'ig');
|
||||
|
||||
const MIME_AUDIO_REGEX = new RegExp(/(audio\/:*)/);
|
||||
const MIME_AUDIO_REGEX = new RegExp(/(audio\/:*)/, 'ig');
|
||||
// open office document mime type currently supported by webodf editor
|
||||
const MIME_ODF_REGEX = new RegExp(/application\/vnd\.oasis\.opendocument\.text/);
|
||||
|
||||
@ -48,14 +48,24 @@ export interface ExposeValue
|
||||
}
|
||||
|
||||
/**
|
||||
* Data to show the slide
|
||||
* Data to show a single slide
|
||||
*/
|
||||
export interface MediaValue
|
||||
{
|
||||
title : string,
|
||||
// Label for the image, shown in top left
|
||||
title? : string,
|
||||
|
||||
// URL to the large version of the image, or full version of file
|
||||
href : string,
|
||||
|
||||
// Mime type
|
||||
type : string,
|
||||
thumbnail? : string
|
||||
|
||||
// Smaller image (api/thumbnail.php) to show in indicator
|
||||
thumbnail? : string,
|
||||
|
||||
// Url to download the file
|
||||
download_href? : string
|
||||
}
|
||||
|
||||
export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
@ -167,7 +177,7 @@ export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
let fe = egw_get_file_editor_prefered_mimes();
|
||||
|
||||
// If the media type is not supported do not bind the click handler
|
||||
if(!this.exposeValue || typeof this.exposeValue.mime != 'string' || (!this.exposeValue.mime.match(MIME_REGEX, 'ig')
|
||||
if(!this.exposeValue || typeof this.exposeValue.mime != 'string' || (!this.exposeValue.mime.match(MIME_REGEX)
|
||||
&& (!fe || fe.mime && !fe.mime[this.exposeValue.mime])) || typeof this.exposeValue.download_url == 'undefined')
|
||||
{
|
||||
this.classList.remove("et2_clickable");
|
||||
@ -579,7 +589,6 @@ export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
{"button_id": 1, "text": egw.lang('close'), id: '1', image: 'cancel', default: true}
|
||||
];
|
||||
|
||||
// @ts-ignore
|
||||
let mediaContent = this.getMedia(_value)[0];
|
||||
let dialog = new Et2Dialog();
|
||||
dialog.transformAttributes({
|
||||
@ -609,6 +618,7 @@ export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
template: egw.webserverUrl + '/api/templates/default/audio_player.xet',
|
||||
dialogClass: "audio_player"
|
||||
});
|
||||
// @ts-ignore
|
||||
document.body.appendChild(dialog);
|
||||
}
|
||||
|
||||
@ -652,11 +662,11 @@ export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
// @ts-ignore Wants an argument, but does not require it
|
||||
let fe = egw_get_file_editor_prefered_mimes();
|
||||
|
||||
if(this.exposeValue.mime.match(MIME_REGEX, 'ig') && !this.exposeValue.mime.match(MIME_AUDIO_REGEX, 'ig'))
|
||||
if(this.exposeValue.mime.match(MIME_REGEX) && !this.exposeValue.mime.match(MIME_AUDIO_REGEX))
|
||||
{
|
||||
this._init_blueimp_gallery(event, this.exposeValue);
|
||||
}
|
||||
else if(this.exposeValue.mime.match(MIME_AUDIO_REGEX, 'ig'))
|
||||
else if(this.exposeValue.mime.match(MIME_AUDIO_REGEX))
|
||||
{
|
||||
this._audio_player(this.exposeValue);
|
||||
}
|
||||
@ -827,7 +837,6 @@ export function ExposeMixin<B extends Constructor<LitElement>>(superclass : B)
|
||||
// Remove applied mime filter
|
||||
nm.applyFilters({col_filter: {mime: ''}});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
protected expose_onclosed() {}
|
||||
|
@ -39,17 +39,19 @@
|
||||
<nextmatch-customfields id="customfields"/>
|
||||
</row>
|
||||
<row class="$row_cont[class]">
|
||||
<image id="${row}[picture_thumb]" width="100%" expose_view="true" height="auto" href="$row_cont[picture_original]" src="${row}[picture_thumb]" />
|
||||
<vbox>
|
||||
<description id="${row}[name]" no_lang="1"/>
|
||||
<description id="${row}[short_description]" no_lang="1"/>
|
||||
</vbox>
|
||||
<vbox align="left">
|
||||
<description align="left" id="${row}[useable]" no_lang="1"/>
|
||||
<description align="left" id="${row}[quantity]" no_lang="1"/>
|
||||
<description align="left" id="${row}[bookable]" no_lang="1"/>
|
||||
</vbox>
|
||||
<vbox>
|
||||
<et2-image-expose id="${row}[picture_thumb]" label="$row_cont[name]"
|
||||
href="$row_cont[picture_original]"
|
||||
src="$row_cont[picture_thumb]"/>
|
||||
<vbox>
|
||||
<description id="${row}[name]" no_lang="1"/>
|
||||
<description id="${row}[short_description]" no_lang="1"/>
|
||||
</vbox>
|
||||
<vbox align="left">
|
||||
<description align="left" id="${row}[useable]" no_lang="1"/>
|
||||
<description align="left" id="${row}[quantity]" no_lang="1"/>
|
||||
<description align="left" id="${row}[bookable]" no_lang="1"/>
|
||||
</vbox>
|
||||
<vbox>
|
||||
<menulist>
|
||||
<menupopup type="select-cat" id="{$row}[cat_id]" no_lang="1" readonly="true"/>
|
||||
</menulist>
|
||||
@ -108,20 +110,20 @@
|
||||
</vbox>
|
||||
</box>
|
||||
<styles>
|
||||
.image16 img {
|
||||
max-width: 16px;
|
||||
max-height: 16px;
|
||||
}
|
||||
div.action_popup[id] {
|
||||
position: fixed;
|
||||
top: 200px;
|
||||
left: 450px;
|
||||
width: 76ex;
|
||||
z-index: 20000;
|
||||
display: none;
|
||||
border-collapse:collapse;
|
||||
border-spacing:0px
|
||||
}
|
||||
</styles>
|
||||
.image16 img {
|
||||
max-width: 16px;
|
||||
max-height: 16px;
|
||||
}
|
||||
.action_popup[id] {
|
||||
position: fixed;
|
||||
top: 200px;
|
||||
left: 450px;
|
||||
width: 76ex;
|
||||
z-index: 20000;
|
||||
display: none;
|
||||
border-collapse:collapse;
|
||||
border-spacing:0px
|
||||
}
|
||||
</styles>
|
||||
</template>
|
||||
</overlay>
|
||||
|
Loading…
Reference in New Issue
Block a user