Skip to content

Commit

Permalink
Merge pull request #1355 from Pervanovo/pr-open-field-file
Browse files Browse the repository at this point in the history 
Added open to field-file dropdown menu
  • Loading branch information
@aheinze
aheinze authored Oct 22, 2020
2 parents b7c826a + 93113f5 commit c10ee7d
Show file tree
Hide file tree
Showing 2 changed files with 31 additions and 1 deletion.
16 changes: 15 additions & 1 deletion modules/Cockpit/assets/components.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2263,7 +2263,7 @@ riot.tag2('field-date', '<input ref="input" class="uk-width-1-1" bind="{opts.bin

});

riot.tag2('field-file', '<div class="uk-panel uk-panel-box uk-panel-card "> <div ref="uploadprogress" class="uk-margin uk-hidden"> <div class="uk-progress"> <div ref="progressbar" class="uk-progress-bar" style="width: 0%;">&nbsp;</div> </div> </div> <div class="uk-flex uk-flex-middle"> <input class="uk-form-blank uk-flex-item-1" type="text" ref="input" bind="{opts.bind}" placeholder="{opts.placeholder || App.i18n.get(\'No file selected...\')}"> <span class="uk-margin-small-left" data-uk-dropdown="pos:\'bottom-center\'"> <button type="button" class="uk-button" ref="picker" title="{App.i18n.get(\'Pick file\')}" onclick="{selectAsset}"><i class="uk-icon-paperclip"></i></button> <div class="uk-dropdown" if="{App.$data.acl.finder}"> <ul class="uk-nav uk-nav-dropdown uk-dropdown-close"> <li class="uk-nav-header">{App.i18n.get(\'Source\')}</li> <li><a onclick="{selectAsset}">{App.i18n.get(\'Select Asset\')}</a></li> <li><a onclick="{selectFile}">{App.i18n.get(\'Select File\')}</a></li> </ul> </div> </span> </div> </div>', '', '', function(opts) {
riot.tag2('field-file', '<div class="uk-panel uk-panel-box uk-panel-card "> <div ref="uploadprogress" class="uk-margin uk-hidden"> <div class="uk-progress"> <div ref="progressbar" class="uk-progress-bar" style="width: 0%;">&nbsp;</div> </div> </div> <div class="uk-flex uk-flex-middle"> <input class="uk-form-blank uk-flex-item-1" type="text" ref="input" bind="{opts.bind}" placeholder="{opts.placeholder || App.i18n.get(\'No file selected...\')}"> <span class="uk-margin-small-left" data-uk-dropdown="pos:\'bottom-center\'"> <button type="button" class="uk-button" ref="picker" title="{App.i18n.get(\'Pick file\')}" onclick="{selectAsset}"><i class="uk-icon-paperclip"></i></button> <div class="uk-dropdown" if="{App.$data.acl.finder}"> <ul class="uk-nav uk-nav-dropdown uk-dropdown-close"> <li if="{shouldShowOpen()}" class="uk-nav-header">{App.i18n.get(\'Open\')}</li> <li if="{shouldShowOpen()}"><a onclick="{open}">{App.i18n.get(\'Open in new tab\')}</a></li> <li class="uk-nav-header">{App.i18n.get(\'Source\')}</li> <li><a onclick="{selectAsset}">{App.i18n.get(\'Select Asset\')}</a></li> <li><a onclick="{selectFile}">{App.i18n.get(\'Select File\')}</a></li> </ul> </div> </span> </div> </div>', '', '', function(opts) {

var $this = this, $input;

Expand Down Expand Up @@ -2336,6 +2336,20 @@ riot.tag2('field-file', '<div class="uk-panel uk-panel-box uk-panel-card "> <div
});
}.bind(this)

this.shouldShowOpen = function() {
return $this.refs.input.value.trim().length > 0;
}.bind(this)

this.open = function() {
var url = $this.refs.input.value.trim();
if (url) {
if (!url.match(/^(https?:)?\/\/?/i)) {
url = SITE_URL + "/" + url;
}
var win = window.open(url, '_blank');
win.focus();
}
}.bind(this)
});

riot.tag2('field-gallery', '<div ref="uploadprogress" class="uk-margin uk-hidden"> <div class="uk-progress"> <div ref="progressbar" class="uk-progress-bar" style="width: 0%;">&nbsp;</div> </div> </div> <div ref="panel"> <div ref="imagescontainer" class="uk-sortable uk-grid uk-grid-match uk-grid-small uk-flex-center uk-grid-gutter uk-grid-width-medium-1-4" show="{images && images.length}"> <div data-idx="{idx}" each="{img,idx in images}"> <div class="uk-panel uk-panel-box uk-panel-thumbnail uk-panel-framed uk-visible-hover"> <div class="uk-bg-transparent-pattern uk-position-relative" style="min-height:120px;"> <canvas class="uk-responsive-width" width="200" height="150"></canvas> <div class="uk-position-absolute uk-position-cover uk-flex uk-flex-middle"> <div class="uk-width-1-1 uk-text-center"> <cp-thumbnail riot-src="{img.path.match(/^(http\\:|https\\:|\\/\\/)/) ? img.path : (SITE_URL+\'/\'+img.path.replace(/^\\//, \'\'))}" height="120"></cp-thumbnail> </div> </div> </div> <div class="uk-invisible uk-margin-top"> <ul class="uk-grid uk-grid-small uk-flex-center uk-text-small"> <li data-uk-dropdown="pos:\'bottom-center\'"> <a class="uk-text-muted" onclick="{parent.selectAsset}" title="{App.i18n.get(\'Select image\')}" data-uk-tooltip><i class="uk-icon-image"></i></a> <div class="uk-dropdown"> <ul class="uk-nav uk-nav-dropdown uk-dropdown-close"> <li class="uk-nav-header">{App.i18n.get(\'Source\')}</li> <li><a onclick="{parent.selectAsset}">{App.i18n.get(\'Select Asset\')}</a></li> <li show="{App.$data.acl.finder}"><a onclick="{parent.selectImage}">{App.i18n.get(\'Select Image\')}</a></li> </ul> </div> </li> <li><a class="uk-text-muted" onclick="{parent.showMeta}" title="{App.i18n.get(\'Edit meta data\')}" data-uk-tooltip><i class="uk-icon-cog"></i></a></li> <li><a class="uk-text-muted" href="{img.path.match(/^(http\\:|https\\:|\\/\\/)/) ? img.path : (SITE_URL+\'/\'+img.path.replace(/^\\//, \'\'))}" data-uk-lightbox="type:\'image\'" title="{App.i18n.get(\'Full size\')}" data-uk-tooltip><i class="uk-icon-eye"></i></a></li> <li><a class="uk-text-danger" onclick="{parent.remove}" title="{App.i18n.get(\'Remove image\')}" data-uk-tooltip><i class="uk-icon-trash-o"></i></a></li> </ul> </div> </div> </div> </div> <div class="uk-text-center {images && images.length ? \'uk-margin-top\':\'\'}"> <div class="uk-text-muted" if="{images && !images.length}"> <img class="uk-svg-adjust" riot-src="{App.base(\'/assets/app/media/icons/gallery.svg\')}" width="100" data-uk-svg> <p>{App.i18n.get(\'Gallery is empty\')}</p> </div> <div class="uk-display-inline-block uk-position-relative" data-uk-dropdown="pos:\'bottom-center\'"> <a class="uk-text-large" onclick="{selectAssetsImages}"> <i class="uk-icon-plus-circle" title="{App.i18n.get(\'Add images\')}" data-uk-tooltip></i> </a> <div class="uk-dropdown" if="{App.$data.acl.finder}"> <ul class="uk-nav uk-nav-dropdown uk-text-left uk-dropdown-close"> <li class="uk-nav-header">{App.i18n.get(\'Select\')}</li> <li><a onclick="{selectAssetsImages}">Asset</a></li> <li><a onclick="{selectimages}">{App.i18n.get(\'Finder\')}</a></li> </ul> </div> </div> </div> <div class="uk-modal uk-sortable-nodrag" ref="modalmeta"> <div class="uk-modal-dialog"> <div class="uk-modal-header"><h3>{App.i18n.get(\'Image Meta\')}</h3></div> <div class="uk-grid uk-grid-match uk-grid-gutter" if="{image}"> <div class="uk-grid-margin uk-width-medium-{field.width}" each="{field,name in meta}" no-reorder> <div class="uk-panel"> <label class="uk-text-small uk-text-bold"> <i class="uk-icon-pencil-square uk-margin-small-right"></i> {field.label || name} </label> <div class="uk-margin uk-text-small uk-text-muted"> {field.info || \' \'} </div> <div class="uk-margin"> <cp-field type="{field.type || \'text\'}" bind="image.meta[\'{name}\']" opts="{field.options || {}}"></cp-field> </div> </div> </div> </div> <div class="uk-modal-footer uk-text-right"><button class="uk-button uk-button-large uk-button-link uk-modal-close">{App.i18n.get(\'Close\')}</button></div> </div> </div> </div>', '', '', function(opts) {
Expand Down
16 changes: 16 additions & 0 deletions modules/Cockpit/assets/components/field-file.tag
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,8 @@

<div class="uk-dropdown" if="{App.$data.acl.finder}">
<ul class="uk-nav uk-nav-dropdown uk-dropdown-close">
<li if="{ shouldShowOpen() }" class="uk-nav-header">{ App.i18n.get('Open') }</li>
<li if="{ shouldShowOpen() }"><a onclick="{ open }">{ App.i18n.get('Open in new tab') }</a></li>
<li class="uk-nav-header">{ App.i18n.get('Source') }</li>
<li><a onclick="{ selectAsset }">{ App.i18n.get('Select Asset') }</a></li>
<li><a onclick="{ selectFile }">{ App.i18n.get('Select File') }</a></li>
Expand Down Expand Up @@ -104,6 +106,20 @@
});
}

shouldShowOpen() {
return $this.refs.input.value.trim().length > 0;
}

open() {
var url = $this.refs.input.value.trim();
if (url) {
if (!url.match(/^(https?:)?\/\/?/i)) {
url = SITE_URL + "/" + url;
}
var win = window.open(url, '_blank');
win.focus();
}
}
</script>

</field-file>

0 comments on commit c10ee7d

Please sign in to comment.