Public share
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv)
parent
e951ad5034
commit
c71d3dc9bf
|
|
@ -33,9 +33,6 @@
|
|||
padding: 14px;
|
||||
}
|
||||
.popovermenu {
|
||||
&.socialSharingMenu {
|
||||
right: -7px;
|
||||
}
|
||||
.clipboardButton {
|
||||
position: relative;
|
||||
top: initial;
|
||||
|
|
@ -80,10 +77,22 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
// fix for popover link share
|
||||
&.share-note-link {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
label {
|
||||
white-space: nowrap;
|
||||
.linkPass .icon-loading-small {
|
||||
margin-right: 0px;
|
||||
}
|
||||
.icon {
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
.shareWithList .icon-loading-small:not(.hidden) + span,
|
||||
.linkShareView .icon-loading-small:not(.hidden) + input + label:before {
|
||||
/* Hide if loader is visible */
|
||||
display: none !important;
|
||||
}
|
||||
input {
|
||||
&[type='checkbox'] {
|
||||
|
|
@ -92,19 +101,16 @@
|
|||
}
|
||||
&[type='text'] {
|
||||
&.shareWithField,
|
||||
&.emailField,
|
||||
&.linkText {
|
||||
&.emailField {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-right: 32px;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
&[type='password'] {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-right: 32px;
|
||||
text-overflow: ellipsis;
|
||||
&[type='text'].linkText
|
||||
&[type='password'].linkPassText {
|
||||
width: 180px !important;
|
||||
}
|
||||
}
|
||||
form {
|
||||
|
|
@ -114,71 +120,58 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* fix the popup menu because the button is shifted and then the menu is not aligned */
|
||||
|
||||
// Sharing tab users list
|
||||
#shareWithList {
|
||||
list-style-type: none;
|
||||
padding: 0 0 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> li {
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
height: 44px;
|
||||
white-space: normal;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
.avatar {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
background-color: var(--color-background-darker);
|
||||
}
|
||||
}
|
||||
.unshare img {
|
||||
vertical-align: text-bottom;
|
||||
/* properly align icons */
|
||||
}
|
||||
.sharingOptionsGroup {
|
||||
> a .icon {
|
||||
padding: 7px;
|
||||
vertical-align: middle;
|
||||
opacity: 0.5;
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// can edit label
|
||||
> .shareOption > label {
|
||||
padding: 13px;
|
||||
padding-right: 0;
|
||||
}
|
||||
.popovermenu:after {
|
||||
right: 3px;
|
||||
// more menu
|
||||
> .share-menu {
|
||||
position: relative;
|
||||
display: block;
|
||||
.icon-more {
|
||||
padding: 14px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
opacity: .5;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
}
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
.icon-more {
|
||||
opacity: .7;;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
label input[type='checkbox'] {
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
}
|
||||
.username {
|
||||
padding-right: 8px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
}
|
||||
li .sharingOptionsGroup > .shareOption > label {
|
||||
padding: 6px;
|
||||
margin-right: 8px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
}
|
||||
|
||||
.linkShareView {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.shareTabView {
|
||||
.linkPass .icon-loading-small {
|
||||
margin-right: 0px;
|
||||
}
|
||||
.icon {
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
.icon-loading-small {
|
||||
display: inline-block;
|
||||
z-index: 1;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
.shareWithList .icon-loading-small:not(.hidden) + span,
|
||||
.linkShareView .icon-loading-small:not(.hidden) + input + label:before {
|
||||
/* Hide if loader is visible */
|
||||
display: none !important;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -963,6 +963,7 @@ $popovericon-size: 16px;
|
|||
> input.checkbox + label {
|
||||
padding: 0 !important;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
> input.checkbox + label::before {
|
||||
margin: -2px 13px 0;
|
||||
|
|
|
|||
|
|
@ -1,204 +0,0 @@
|
|||
/**
|
||||
* @copyright Copyright (c) 2016, John Molakvoæ <skjnldsv@protonmail.com>
|
||||
* @copyright Copyright (c) 2016, Morris Jobke <hey@morrisjobke.de>
|
||||
* @copyright Copyright (c) 2016, Julia Bode <julia.bode@lulisaur.us>
|
||||
* @copyright Copyright (c) 2016, Christoph Wurst <christoph@winzerhof-wurst.at>
|
||||
* @copyright Copyright (c) 2015, Hendrik Leppelsack <hendrik@leppelsack.de>
|
||||
* @copyright Copyright (c) 2015, Jan-Christoph Borchardt <hey@jancborchardt.net>
|
||||
* @copyright Copyright (c) 2015, Vincent Petry <pvince81@owncloud.com>
|
||||
* @copyright Copyright (c) 2015, Arthur Schiwon <blizzz@owncloud.com>
|
||||
* @copyright Copyright (c) 2015, Roeland Jago Douma <roeland@famdouma.nl>
|
||||
* @copyright Copyright (c) 2015, Morris Jobke <hey@morrisjobke.de>
|
||||
*
|
||||
* @license GNU AGPL version 3 or any later version
|
||||
*
|
||||
*/
|
||||
|
||||
/* SHARE TAB STYLING -------------------------------------------------------- */
|
||||
.shareTabView {
|
||||
.unshare.icon-loading-small {
|
||||
margin-top: 1px;
|
||||
}
|
||||
.shareWithLoading, .linkShare .icon-loading-small {
|
||||
display: inline-block !important;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.shareWithLoading {
|
||||
position: relative;
|
||||
right: 70px;
|
||||
top: 2px;
|
||||
}
|
||||
.icon-loading-small.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
.avatar {
|
||||
margin-right: 8px;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
label {
|
||||
font-weight: 400;
|
||||
white-space: nowrap;
|
||||
}
|
||||
input[type='radio'].radio + label {
|
||||
margin-left: -1px;
|
||||
}
|
||||
input[type='checkbox'] {
|
||||
margin: 0 3px 0 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
input[type='submit'] {
|
||||
margin-left: 7px;
|
||||
}
|
||||
form {
|
||||
font-size: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
.error {
|
||||
color: var(--color-error);
|
||||
border-color: var(--color-error);
|
||||
}
|
||||
.mailView .icon-mail {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.share-autocomplete-item {
|
||||
display: flex;
|
||||
.autocomplete-item-text {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
line-height: 32px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.ui-autocomplete .autocomplete-note {
|
||||
padding: 5px 10px;
|
||||
color: rgba(0, 0, 0, .3);
|
||||
}
|
||||
|
||||
#shareWithList {
|
||||
list-style-type: none;
|
||||
padding: 8px;
|
||||
> li {
|
||||
position: relative;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
font-weight: bold;
|
||||
line-height: 21px;
|
||||
white-space: normal;
|
||||
width: 100%;
|
||||
}
|
||||
.sharingOptionsGroup {
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
.popovermenu {
|
||||
right: -11px;
|
||||
top: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.shareOption {
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
}
|
||||
.unshare img {
|
||||
vertical-align: text-bottom;
|
||||
/* properly align icons */
|
||||
}
|
||||
label input[type=checkbox] {
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
}
|
||||
.username {
|
||||
padding-right: 8px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
flex-grow: 5;
|
||||
}
|
||||
}
|
||||
|
||||
#link {
|
||||
border-top: 1px solid var(--color-border);
|
||||
padding-top: 8px;
|
||||
#showPassword img {
|
||||
padding-left: 5px;
|
||||
width: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.reshare,
|
||||
#link label,
|
||||
#expiration label {
|
||||
display: inline-block;
|
||||
padding: 6px 4px;
|
||||
}
|
||||
|
||||
.resharerInfoView.subView {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#defaultExpireMessage, .reshare {
|
||||
/* fix shared by text going out of box */
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
#defaultExpireMessage {
|
||||
/* show message on new line */
|
||||
display: block;
|
||||
padding-left: 4px;
|
||||
/* TODO: style the dropdown in a proper way - border-box, etc. */
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.ui-autocomplete {
|
||||
/* limit dropdown height to 4 1/2 entries */
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.notCreatable {
|
||||
padding-left: 12px;
|
||||
padding-top: 12px;
|
||||
color: var(--color-text-lighter);
|
||||
}
|
||||
|
||||
.contactsmenu-popover {
|
||||
left: -6px;
|
||||
right: auto;
|
||||
padding: 3px 6px;
|
||||
top: 100%;
|
||||
margin-top: 0;
|
||||
li.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
&:after {
|
||||
left: 8px;
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.popovermenu .datepicker {
|
||||
margin-left: 35px;
|
||||
}
|
||||
|
||||
.popovermenu .passwordField {
|
||||
margin-left: 35px;
|
||||
width: inherit !important;
|
||||
}
|
||||
|
||||
.ui-datepicker {
|
||||
z-index: 1111 !important;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 16 16" height="16" width="16"><path fill="#fff" d="m9.2363 2.166-3.1816 3.1836c-0.7071 0.7072-1.0378 1.6182-0.9883 2.457 0.05 0.8389 0.4333 1.5841 0.9883 2.1387l1.4121-1.416c-0.5672-0.5672-0.5444-1.2192 0.002-1.7656l3.1812-3.1817c0.52536-0.52536 1.2507-0.52318 1.772-0.002 0.48245 0.5556 0.52732 1.2382-0.004 1.7695l-0.82 0.8203c0.555 0.785 0.645 1.3663 0.593 2.2344l1.641-1.6406c1.2374-1.2374 1.2371-3.3645 0-4.6016-1.236-1.2361-3.342-1.2113-4.5957 0.004zm0.7071 3.8848-1.4141 1.418c0 0 0.003-00 0.004 0 0.55 0.55 0.50736 1.2582-0.004 1.7695l-3.1816 3.1817c-0.696 0.59192-1.2985 0.47105-1.7696 0-0.62636-0.62636-0.5-1.2681 0-1.768l0.85-0.8473c-0.556-0.7835-0.6484-1.365-0.5976-2.2324l-1.666 1.666c-1.2393 1.2393-1.2357 3.36 0 4.5957 1.2353 1.2353 3.362 1.2356 4.5976 0l3.1817-3.182c0.7086-0.7083 1.0396-1.6184 0.9906-2.4586-0.048-0.8401-0.432-1.5864-0.9887-2.1407z"/></svg>
|
||||
|
After Width: | Height: | Size: 942 B |
|
|
@ -21,76 +21,106 @@
|
|||
|
||||
var TEMPLATE =
|
||||
'{{#if shareAllowed}}' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="checkbox" name="linkCheckbox" id="linkCheckbox-{{cid}}" class="checkbox linkCheckbox" value="1" {{#if isLinkShare}}checked="checked"{{/if}} />' +
|
||||
'<label for="linkCheckbox-{{cid}}">{{linkShareLabel}}</label>' +
|
||||
'<br />' +
|
||||
'<div class="oneline">' +
|
||||
'<label for="linkText-{{cid}}" class="hidden-visually">{{urlLabel}}</label>' +
|
||||
'<input id="linkText-{{cid}}" class="linkText {{#unless isLinkShare}}hidden{{/unless}}" type="text" readonly="readonly" value="{{shareLinkURL}}" />' +
|
||||
'{{#if singleAction}}' +
|
||||
'<a class="{{#unless isLinkShare}}hidden-visually{{/unless}} clipboardButton icon icon-clippy" data-clipboard-target="#linkText-{{cid}}"></a>' +
|
||||
'{{else}}' +
|
||||
'<a class="{{#unless isLinkShare}}hidden-visually{{/unless}}" href="#"><span class="linkMore icon icon-more"></span></a>' +
|
||||
'{{{popoverMenu}}}' +
|
||||
'{{/if}}' +
|
||||
'</div>' +
|
||||
'{{#if publicUpload}}' +
|
||||
'<div>' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadRValue}}" id="sharingDialogAllowPublicUpload-r-{{cid}}" class="radio publicUploadRadio" {{{publicUploadRChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-r-{{cid}}">{{publicUploadRLabel}}</label>' +
|
||||
'</div>' +
|
||||
'<div>' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadRWValue}}" id="sharingDialogAllowPublicUpload-rw-{{cid}}" class="radio publicUploadRadio" {{{publicUploadRWChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-rw-{{cid}}">{{publicUploadRWLabel}}</label>' +
|
||||
'</div>' +
|
||||
'<div>' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadWValue}}" id="sharingDialogAllowPublicUpload-w-{{cid}}" class="radio publicUploadRadio" {{{publicUploadWChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-w-{{cid}}">{{publicUploadWLabel}}</label>' +
|
||||
'</div>' +
|
||||
'{{/if}}' +
|
||||
' {{#if publicEditing}}' +
|
||||
'<div id="allowPublicEditingWrapper">' +
|
||||
' <span class="icon-loading-small hidden"></span>' +
|
||||
' <input type="checkbox" value="1" name="allowPublicEditing" id="sharingDialogAllowPublicEditing-{{cid}}" class="checkbox publicEditingCheckbox" {{{publicEditingChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicEditing-{{cid}}">{{publicEditingLabel}}</label>' +
|
||||
'</div>' +
|
||||
' {{/if}}' +
|
||||
' {{#if showPasswordCheckBox}}' +
|
||||
'<input type="checkbox" name="showPassword" id="showPassword-{{cid}}" class="checkbox showPasswordCheckbox" {{#if isPasswordSet}}checked="checked"{{/if}} value="1" />' +
|
||||
'<label for="showPassword-{{cid}}">{{enablePasswordLabel}}</label>' +
|
||||
' {{/if}}' +
|
||||
'<div id="linkPass" class="oneline linkPass {{#unless isPasswordSet}}hidden{{/unless}}">' +
|
||||
' <label for="linkPassText-{{cid}}" class="hidden-visually">{{passwordLabel}}</label>' +
|
||||
' {{#if showPasswordCheckBox}}' +
|
||||
' <input id="linkPassText-{{cid}}" class="linkPassText" type="password" placeholder="{{passwordPlaceholder}}" autocomplete="new-password" />' +
|
||||
' {{else}}' +
|
||||
' <input id="linkPassText-{{cid}}" class="linkPassText" type="password" placeholder="{{passwordPlaceholderInitial}}" autocomplete="new-password" />' +
|
||||
' {{/if}}' +
|
||||
' <span class="icon icon-loading-small hidden"></span>' +
|
||||
'</div>' +
|
||||
'<ul id="shareWithList" class="shareWithList">' +
|
||||
' <li data-share-id="{{cid}}">' +
|
||||
' <div class="avatar icon-public-white"></div><span class="username" title="{{linkShareLabel}}">{{linkShareLabel}}</span>' +
|
||||
' <span class="sharingOptionsGroup">' +
|
||||
' <span class="shareOption"> ' +
|
||||
' <span class="icon-loading-small hidden"></span>' +
|
||||
' <input id="linkCheckbox-{{cid}}" {{#if isLinkShare}}checked="checked"{{/if}} type="checkbox" name="linkCheckbox" class="linkCheckbox permissions checkbox">' +
|
||||
' <label for="linkCheckbox-{{cid}}">{{linkShareEnableLabel}}</label>' +
|
||||
' </span>' +
|
||||
' {{#if isLinkShare}}' +
|
||||
' <div class="share-menu" tabindex="0"><span class="icon icon-more"></span>' +
|
||||
' {{{popoverMenu}}}' +
|
||||
' </div>' +
|
||||
' {{/if}}' +
|
||||
' </span>' +
|
||||
' </li>' +
|
||||
'</ul>' +
|
||||
'{{else}}' +
|
||||
// FIXME: this doesn't belong in this view
|
||||
'{{#if noSharingPlaceholder}}<input id="shareWith-{{cid}}" class="shareWithField" type="text" placeholder="{{noSharingPlaceholder}}" disabled="disabled"/>{{/if}}' +
|
||||
'{{/if}}'
|
||||
;
|
||||
var TEMPLATE_POPOVER_MENU =
|
||||
'<div class="popovermenu bubble hidden menu socialSharingMenu">' +
|
||||
'<div class="popovermenu menu">' +
|
||||
'<ul>' +
|
||||
'<li>' +
|
||||
'<a href="#" class="shareOption menuitem clipboardButton" data-clipboard-target="#linkText-{{cid}}">' +
|
||||
'<a href="#" class="menuitem clipboardButton" data-clipboard-text="{{shareLinkURL}}">' +
|
||||
'<span class="icon icon-clippy" ></span>' +
|
||||
'<span>{{copyLabel}}</span>' +
|
||||
'</a>' +
|
||||
'</li>' +
|
||||
'<li class="hidden linkTextMenu">' +
|
||||
'<span class="menuitem icon-link-text">' +
|
||||
'<input id="linkText-{{cid}}" class="linkText" type="text" readonly="readonly" value="{{shareLinkURL}}" />' +
|
||||
'</span>' +
|
||||
'</li>' +
|
||||
'{{#if publicUpload}}' +
|
||||
'<li><span class="shareOption menuitem">' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadRValue}}" id="sharingDialogAllowPublicUpload-r-{{cid}}" class="radio publicUploadRadio" {{{publicUploadRChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-r-{{cid}}">{{publicUploadRLabel}}</label>' +
|
||||
'</span></li>' +
|
||||
'<li><span class="shareOption menuitem">' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadRWValue}}" id="sharingDialogAllowPublicUpload-rw-{{cid}}" class="radio publicUploadRadio" {{{publicUploadRWChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-rw-{{cid}}">{{publicUploadRWLabel}}</label>' +
|
||||
'</span></li>' +
|
||||
'<li><span class="shareOption menuitem">' +
|
||||
'<span class="icon-loading-small hidden"></span>' +
|
||||
'<input type="radio" name="publicUpload" value="{{publicUploadWValue}}" id="sharingDialogAllowPublicUpload-w-{{cid}}" class="radio publicUploadRadio" {{{publicUploadWChecked}}} />' +
|
||||
'<label for="sharingDialogAllowPublicUpload-w-{{cid}}">{{publicUploadWLabel}}</label>' +
|
||||
'</span></li>' +
|
||||
'{{/if}}' +
|
||||
'{{#if publicEditing}}' +
|
||||
' <li id="allowPublicEditingWrapper"><span class="shareOption menuitem">' +
|
||||
' <span class="icon-loading-small hidden"></span>' +
|
||||
' <input type="checkbox" name="allowPublicEditing" id="sharingDialogAllowPublicEditing-{{cid}}" class="checkbox publicEditingCheckbox" {{{publicEditingChecked}}} />' +
|
||||
' <label for="sharingDialogAllowPublicEditing-{{cid}}">{{publicEditingLabel}}</label>' +
|
||||
' </span></li>' +
|
||||
'{{/if}}' +
|
||||
'{{#if showPasswordCheckBox}}' +
|
||||
' <li><span class="shareOption menuitem">' +
|
||||
' <input type="checkbox" name="showPassword" id="showPassword-{{cid}}" class="checkbox showPasswordCheckbox" {{#if isPasswordSet}}checked="checked"{{/if}} value="1" />' +
|
||||
' <label for="showPassword-{{cid}}">{{enablePasswordLabel}}</label>' +
|
||||
' </span></li>' +
|
||||
' <li class="{{#unless isPasswordSet}}hidden{{/unless}} linkPassMenu"><span class="shareOption menuitem icon-share-pass">' +
|
||||
' <input id="linkPassText-{{cid}}" class="linkPassText" type="password" placeholder="{{passwordPlaceholder}}" autocomplete="new-password" />' +
|
||||
' <span class="icon icon-loading-small hidden"></span>' +
|
||||
' </span></li>' +
|
||||
'{{/if}}' +
|
||||
'<li>' +
|
||||
'<span class="shareOption menuitem">' +
|
||||
'<input id="expireDate-{{cid}}" type="checkbox" name="expirationDate" class="expireDate checkbox" {{#if hasExpireDate}}checked="checked"{{/if}}" />' +
|
||||
'<label for="expireDate-{{cid}}">{{expireDateLabel}}</label>' +
|
||||
'</li>' +
|
||||
'<li class="{{#unless hasExpireDate}}hidden{{/unless}}">' +
|
||||
'<span class="menuitem icon-expiredate expirationDateContainer-{{cid}}">' +
|
||||
' <label for="expirationDatePicker-{{cid}}" class="hidden-visually" value="{{expirationDate}}">{{expirationLabel}}</label>' +
|
||||
' <input id="expirationDatePicker-{{cid}}" class="datepicker" type="text" placeholder="{{expirationDatePlaceholder}}" value="{{#if hasExpireDate}}{{expireDate}}{{else}}{{defaultExpireDate}}{{/if}}" />' +
|
||||
'</span>' +
|
||||
'</span>' +
|
||||
'</li>' +
|
||||
'<li>' +
|
||||
'<a href="#" class="share-add"><span class="icon-loading-small hidden"></span>' +
|
||||
' <span class="icon icon-edit"></span>' +
|
||||
' <span>{{addNoteLabel}}</span>' +
|
||||
' <input type="button" class="share-note-delete icon-delete">' +
|
||||
'</a>' +
|
||||
'</li>' +
|
||||
'<li class="share-note-form share-note-link hidden">' +
|
||||
'<span class="menuitem icon-note">' +
|
||||
' <textarea class="share-note">{{shareNote}}</textarea>' +
|
||||
' <input type="submit" class="icon-confirm share-note-submit" value="" id="add-note-{{shareId}}" />' +
|
||||
'</span>' +
|
||||
'</li>' +
|
||||
'{{#each social}}' +
|
||||
'<li>' +
|
||||
'<a href="#" class="shareOption menuitem pop-up" data-url="{{url}}" data-window="{{newWindow}}">' +
|
||||
'<span class="icon {{iconClass}}"' +
|
||||
'></span><span>{{label}}' +
|
||||
'></inpu><span>{{label}}' +
|
||||
'</span>' +
|
||||
'</a>' +
|
||||
'</li>' +
|
||||
|
|
@ -131,9 +161,15 @@
|
|||
'click .linkText': 'onLinkTextClick',
|
||||
'change .publicEditingCheckbox': 'onAllowPublicEditingChange',
|
||||
'click .showPasswordCheckbox': 'onShowPasswordClick',
|
||||
'click .icon-more': 'onToggleMenu',
|
||||
'click .share-menu .icon-more': 'onToggleMenu',
|
||||
'click .pop-up': 'onPopUpClick',
|
||||
'change .publicUploadRadio': 'onPublicUploadChange'
|
||||
'change .publicUploadRadio': 'onPublicUploadChange',
|
||||
'click .expireDate' : 'onExpireDateChange',
|
||||
'change .datepicker': 'onChangeExpirationDate',
|
||||
'click .datepicker' : 'showDatePicker',
|
||||
'click .share-add': 'showNoteForm',
|
||||
'click .share-note-delete': 'deleteNote',
|
||||
'click .share-note-submit': 'updateNote'
|
||||
},
|
||||
|
||||
initialize: function(options) {
|
||||
|
|
@ -165,37 +201,26 @@
|
|||
throw 'missing OC.Share.ShareConfigModel';
|
||||
}
|
||||
|
||||
_.bindAll(
|
||||
this,
|
||||
'onLinkCheckBoxChange',
|
||||
'onPasswordEntered',
|
||||
'onPasswordKeyUp',
|
||||
'onLinkTextClick',
|
||||
'onShowPasswordClick',
|
||||
'onAllowPublicEditingChange',
|
||||
'onPublicUploadChange'
|
||||
);
|
||||
|
||||
var clipboard = new Clipboard('.clipboardButton');
|
||||
clipboard.on('success', function(e) {
|
||||
var $input = $(e.trigger);
|
||||
$input.tooltip('hide')
|
||||
var $menu = $(e.trigger);
|
||||
var $linkTextMenu = $menu.parent().next('li.linkTextMenu')
|
||||
|
||||
$menu.tooltip('hide')
|
||||
.attr('data-original-title', t('core', 'Copied!'))
|
||||
.tooltip('fixTitle')
|
||||
.tooltip({placement: 'bottom', trigger: 'manual'})
|
||||
.tooltip('show');
|
||||
_.delay(function() {
|
||||
$input.tooltip('hide');
|
||||
if (OC.Share.Social.Collection.size() == 0) {
|
||||
$input.attr('data-original-title', t('core', 'Copy'))
|
||||
.tooltip('fixTitle');
|
||||
} else {
|
||||
$input.tooltip("destroy");
|
||||
}
|
||||
$menu.tooltip('hide');
|
||||
$menu.tooltip('destroy');
|
||||
}, 3000);
|
||||
});
|
||||
clipboard.on('error', function (e) {
|
||||
var $input = $(e.trigger);
|
||||
var $menu = $(e.trigger);
|
||||
var $linkTextMenu = $menu.parent().next('li.linkTextMenu')
|
||||
var $input = $linkTextMenu.find('.linkText');
|
||||
|
||||
var actionMsg = '';
|
||||
if (/iPhone|iPad/i.test(navigator.userAgent)) {
|
||||
actionMsg = t('core', 'Not supported!');
|
||||
|
|
@ -205,6 +230,8 @@
|
|||
actionMsg = t('core', 'Press Ctrl-C to copy.');
|
||||
}
|
||||
|
||||
$linkTextMenu.removeClass('hidden');
|
||||
$input.select();
|
||||
$input.tooltip('hide')
|
||||
.attr('data-original-title', actionMsg)
|
||||
.tooltip('fixTitle')
|
||||
|
|
@ -212,15 +239,10 @@
|
|||
.tooltip('show');
|
||||
_.delay(function () {
|
||||
$input.tooltip('hide');
|
||||
if (OC.Share.Social.Collection.size() == 0) {
|
||||
$input.attr('data-original-title', t('core', 'Copy'))
|
||||
.tooltip('fixTitle');
|
||||
} else {
|
||||
$input.tooltip("destroy");
|
||||
}
|
||||
$input.attr('data-original-title', t('core', 'Copy'))
|
||||
.tooltip('fixTitle');
|
||||
}, 3000);
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
onLinkCheckBoxChange: function() {
|
||||
|
|
@ -257,6 +279,7 @@
|
|||
|
||||
onShowPasswordClick: function() {
|
||||
this.$el.find('.linkPass').slideToggle(OC.menuSpeed);
|
||||
this.$el.find('.linkPassMenu').toggleClass('hidden');
|
||||
if(!this.$el.find('.showPasswordCheckbox').is(':checked')) {
|
||||
this.model.saveLinkShare({
|
||||
password: ''
|
||||
|
|
@ -275,7 +298,7 @@
|
|||
},
|
||||
|
||||
onPasswordEntered: function() {
|
||||
var $loading = this.$el.find('.linkPass .icon-loading-small');
|
||||
var $loading = this.$el.find('.linkPassMenu .icon-loading-small');
|
||||
if (!$loading.hasClass('hidden')) {
|
||||
// still in process
|
||||
return;
|
||||
|
|
@ -334,12 +357,94 @@
|
|||
},
|
||||
|
||||
|
||||
onPublicUploadChange: function(e) {
|
||||
onPublicUploadChange: function(e) {
|
||||
var permissions = e.currentTarget.value;
|
||||
this.model.saveLinkShare({
|
||||
permissions: permissions
|
||||
});
|
||||
},
|
||||
|
||||
showNoteForm(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var self = this;
|
||||
var $element = $(event.target);
|
||||
var $li = $element.closest('li[data-share-id]');
|
||||
var $menu = $element.closest('li');
|
||||
var $form = $menu.next('li.share-note-form');
|
||||
|
||||
// show elements
|
||||
$menu.find('.share-note-delete').toggle();
|
||||
$form.toggleClass('hidden');
|
||||
},
|
||||
|
||||
deleteNote(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var self = this;
|
||||
var $element = $(event.target);
|
||||
var $li = $element.closest('li[data-share-id]');
|
||||
var shareId = $li.data('share-id');
|
||||
var $menu = $element.closest('li');
|
||||
var $form = $menu.next('li.share-note-form');
|
||||
|
||||
console.log($form.find('.share-note'));
|
||||
$form.find('.share-note').val('');
|
||||
|
||||
$form.addClass('hidden');
|
||||
$menu.find('.share-note-delete').hide();
|
||||
|
||||
self.sendNote('', shareId, $menu);
|
||||
},
|
||||
|
||||
updateNote(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var self = this;
|
||||
var $element = $(event.target);
|
||||
var $li = $element.closest('li[data-share-id]');
|
||||
var shareId = $li.data('share-id');
|
||||
var $form = $element.closest('li.share-note-form');
|
||||
var $menu = $form.prev('li');
|
||||
var message = $form.find('.share-note').val().trim();
|
||||
|
||||
if (message.length < 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.sendNote(message, shareId, $menu);
|
||||
},
|
||||
|
||||
sendNote(note, shareId, $menu) {
|
||||
var $form = $menu.next('li.share-note-form');
|
||||
var $submit = $form.find('input.share-note-submit');
|
||||
var $error = $form.find('input.share-note-error');
|
||||
|
||||
$submit.prop('disabled', true);
|
||||
$menu.find('.icon-loading-small').removeClass('hidden');
|
||||
$menu.find('.icon-edit').hide();
|
||||
|
||||
var complete = function() {
|
||||
$submit.prop('disabled', false);
|
||||
$menu.find('.icon-loading-small').addClass('hidden');
|
||||
$menu.find('.icon-edit').show();
|
||||
};
|
||||
var error = function() {
|
||||
$error.show();
|
||||
setTimeout(function() {
|
||||
$error.hide();
|
||||
}, 3000);
|
||||
};
|
||||
|
||||
// send data
|
||||
$.ajax({
|
||||
method: 'PUT',
|
||||
url: OC.linkToOCS('apps/files_sharing/api/v1/shares',2) + shareId + '?' + OC.buildQueryString({format: 'json'}),
|
||||
data: { note: note },
|
||||
complete : complete,
|
||||
error: error
|
||||
});
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var linkShareTemplate = this.template();
|
||||
|
|
@ -412,18 +517,20 @@
|
|||
});
|
||||
});
|
||||
|
||||
var popover = this.popoverMenuTemplate({
|
||||
cid: this.cid,
|
||||
copyLabel: t('core', 'Copy'),
|
||||
social: social
|
||||
});
|
||||
var isExpirationEnforced = this.configModel.get('isDefaultExpireDateEnforced');
|
||||
var hasExpireDate = !!this.model.get('linkShare').expiration || isExpirationEnforced;
|
||||
|
||||
var expireDate;
|
||||
if (hasExpireDate) {
|
||||
expireDate = moment(this.model.get('linkShare').expiration, 'YYYY-MM-DD').format('DD-MM-YYYY');
|
||||
}
|
||||
|
||||
var popover = this.popoverMenuTemplate({
|
||||
cid: this.model.get('linkShare').id,
|
||||
copyLabel: t('core', 'Copy URL'),
|
||||
social: social,
|
||||
|
||||
this.$el.html(linkShareTemplate({
|
||||
cid: this.cid,
|
||||
shareAllowed: true,
|
||||
isLinkShare: isLinkShare,
|
||||
shareLinkURL: this.model.get('linkShare').link,
|
||||
linkShareLabel: t('core', 'Share link'),
|
||||
urlLabel: t('core', 'Link'),
|
||||
enablePasswordLabel: t('core', 'Password protect'),
|
||||
passwordLabel: t('core', 'Password'),
|
||||
|
|
@ -437,8 +544,6 @@
|
|||
publicEditingLabel: t('core', 'Allow editing'),
|
||||
mailPrivatePlaceholder: t('core', 'Email link to person'),
|
||||
mailButtonText: t('core', 'Send'),
|
||||
singleAction: OC.Share.Social.Collection.size() == 0,
|
||||
popoverMenu: popover,
|
||||
publicUploadRWLabel: t('core', 'Allow upload and editing'),
|
||||
publicUploadRLabel: t('core', 'Read only'),
|
||||
publicUploadWLabel: t('core', 'File drop (upload only)'),
|
||||
|
|
@ -447,16 +552,26 @@
|
|||
publicUploadWValue: OC.PERMISSION_CREATE,
|
||||
publicUploadRWChecked: publicUploadRWChecked,
|
||||
publicUploadRChecked: publicUploadRChecked,
|
||||
publicUploadWChecked: publicUploadWChecked
|
||||
}));
|
||||
publicUploadWChecked: publicUploadWChecked,
|
||||
expireDateLabel: t('core', 'Set expiration date'),
|
||||
expirationLabel: t('core', 'Expiration'),
|
||||
expirationDatePlaceholder: t('core', 'Expiration date'),
|
||||
hasExpireDate: hasExpireDate,
|
||||
isExpirationEnforced: isExpirationEnforced,
|
||||
expireDate: expireDate,
|
||||
defaultExpireDate: moment().add(1, 'day').format('DD-MM-YYYY'), // Can't expire today
|
||||
shareNote: this.model.get('linkShare').note,
|
||||
addNoteLabel: t('core', 'Set share note'),
|
||||
});
|
||||
|
||||
if (OC.Share.Social.Collection.size() == 0) {
|
||||
this.$el.find('.clipboardButton').tooltip({
|
||||
placement: 'bottom',
|
||||
title: t('core', 'Copy'),
|
||||
trigger: 'hover'
|
||||
});
|
||||
}
|
||||
this.$el.html(linkShareTemplate({
|
||||
cid: this.model.get('linkShare').id,
|
||||
shareAllowed: true,
|
||||
isLinkShare: isLinkShare,
|
||||
linkShareLabel: t('core', 'Share link'),
|
||||
linkShareEnableLabel: t('core', 'Enable'),
|
||||
popoverMenu: popover,
|
||||
}));
|
||||
|
||||
this.delegateEvents();
|
||||
|
||||
|
|
@ -467,8 +582,8 @@
|
|||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var $element = $(event.target);
|
||||
var $li = $element.closest('.oneline');
|
||||
var $menu = $li.find('.popovermenu');
|
||||
var $li = $element.closest('li[data-share-id]');
|
||||
var $menu = $li.find('.sharingOptionsGroup .popovermenu');
|
||||
|
||||
OC.showMenu(null, $menu);
|
||||
this._menuOpen = $li.data('share-id');
|
||||
|
|
@ -517,7 +632,45 @@
|
|||
window.location.href = url;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
onExpireDateChange: function(event) {
|
||||
var $element = $(event.target);
|
||||
var datePickerClass = '.expirationDateContainer-' + this.cid;
|
||||
var datePicker = $(datePickerClass);
|
||||
var state = $element.prop('checked');
|
||||
datePicker.toggleClass('hidden', !state);
|
||||
|
||||
if (!state) {
|
||||
// disabled, let's hide the input and
|
||||
// set the expireDate to nothing
|
||||
$element.closest('li').next('li').addClass('hidden');
|
||||
this.setExpirationDate('');
|
||||
} else {
|
||||
// enabled, show the input and the datepicker
|
||||
$element.closest('li').next('li').removeClass('hidden');
|
||||
this.showDatePicker(event);
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
showDatePicker: function(event) {
|
||||
var expirationDatePicker = '#expirationDatePicker-' + this.cid;
|
||||
var self = this;
|
||||
|
||||
$(expirationDatePicker).datepicker({
|
||||
dateFormat : 'dd-mm-yy',
|
||||
onSelect: function (expireDate) {
|
||||
self.setExpirationDate(expireDate);
|
||||
}
|
||||
});
|
||||
$(expirationDatePicker).focus();
|
||||
|
||||
},
|
||||
|
||||
setExpirationDate: function(expireDate) {
|
||||
this.model.saveLinkShare({expireDate: expireDate});
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -34,8 +34,9 @@
|
|||
'<label for="canEdit-{{cid}}-{{shareId}}">{{canEditLabel}}</label>' +
|
||||
'</span>' +
|
||||
'{{/if}}' +
|
||||
'<a href="#"><span class="icon icon-more"></span></a>' +
|
||||
'{{{popoverMenu}}}' +
|
||||
'<div tabindex="0" class="share-menu"><span class="icon icon-more"></span>' +
|
||||
'{{{popoverMenu}}}' +
|
||||
'</div>' +
|
||||
'</span>' +
|
||||
'</li>' +
|
||||
'{{/each}}' +
|
||||
|
|
@ -167,14 +168,12 @@
|
|||
/** @type {boolean|number} **/
|
||||
_renderPermissionChange: false,
|
||||
|
||||
_noteView: undefined,
|
||||
|
||||
events: {
|
||||
'click .unshare': 'onUnshare',
|
||||
'click .share-add': 'showNoteForm',
|
||||
'click .share-note-delete': 'deleteNote',
|
||||
'click .share-note-submit': 'updateNote',
|
||||
'click .icon-more': 'onToggleMenu',
|
||||
'click .share-menu .icon-more': 'onToggleMenu',
|
||||
'click .permissions': 'onPermissionChange',
|
||||
'click .expireDate' : 'onExpireDateChange',
|
||||
'click .password' : 'onMailSharePasswordProtectChange',
|
||||
|
|
@ -196,8 +195,6 @@
|
|||
this.model.on('change:shares', function() {
|
||||
view.render();
|
||||
});
|
||||
|
||||
this._noteView = options.parent.noteView;
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -498,10 +495,8 @@
|
|||
showNoteForm(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var self = this;
|
||||
var $element = $(event.target);
|
||||
var $li = $element.closest('li[data-share-id]');
|
||||
var shareId = $li.data('share-id');
|
||||
var $menu = $element.closest('li');
|
||||
var $form = $menu.next('li.share-note-form');
|
||||
|
||||
|
|
@ -522,6 +517,9 @@
|
|||
|
||||
console.log($form.find('.share-note'));
|
||||
$form.find('.share-note').val('');
|
||||
|
||||
$form.addClass('hidden');
|
||||
$menu.find('.share-note-delete').hide();
|
||||
|
||||
self.sendNote('', shareId, $menu);
|
||||
},
|
||||
|
|
@ -599,8 +597,6 @@
|
|||
self.model.removeShare(shareId)
|
||||
.done(function() {
|
||||
$li.remove();
|
||||
// remove note field on sucess
|
||||
self._noteView.hide();
|
||||
})
|
||||
.fail(function() {
|
||||
$loading.addClass('hidden');
|
||||
|
|
|
|||
|
|
@ -27,7 +27,6 @@
|
|||
'{{/if}}' +
|
||||
'<div class="shareeListView subView"></div>' +
|
||||
'<div class="linkShareView subView"></div>' +
|
||||
'<div class="expirationView subView"></div>' +
|
||||
'<div class="loading hidden" style="height: 50px"></div>';
|
||||
|
||||
/**
|
||||
|
|
|
|||
Loading…
Reference in New Issue