Merge pull request #6577 from rabuzarus/20190129_-_jot_atachment_preview
Attachement live preview
This commit is contained in:
GitHub
commit
38ac615ba0
9 changed files with 1117 additions and 56 deletions
|
|
@ -1326,6 +1326,29 @@ section #jotOpen {
|
|||
.jothidden {
|
||||
/*display: none;*/
|
||||
}
|
||||
.modal #jot-sections {
|
||||
max-height: calc(100vh - 22px);
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.modal #jot-sections {
|
||||
max-height: calc(100vh - 62px);
|
||||
}
|
||||
}
|
||||
#jot-modal #jot-sections,
|
||||
#jot-modal #jot-modal-body,
|
||||
#jot-modal #profile-jot-form,
|
||||
#jot-modal #profile-jot-wrapper,
|
||||
#jot-modal #jot-text-wrap,
|
||||
#jot-modal #jot-preview-content,
|
||||
#jot-modal #tread-wrapper--1,
|
||||
#jot-modal #item-Q0,
|
||||
#jot-modal #profile-jot-acl-wrapper,
|
||||
#jot-modal #acl-wrapper {
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex: auto;
|
||||
flex-direction: column;
|
||||
}
|
||||
#jot-modal .modal-header a, #jot-modal .modal-header .btn-link,
|
||||
#profile-jot-submit-wrapper a, #profile-jot-submit-wrapper .btn-link {
|
||||
color: #555;
|
||||
|
|
@ -1342,6 +1365,69 @@ section #jotOpen {
|
|||
}
|
||||
#jot-text-wrap textarea {
|
||||
min-height: 100px;
|
||||
overflow-y: auto !important;
|
||||
overflow-y: overlay !important;
|
||||
}
|
||||
/*#jot-attachment-preview {
|
||||
display: none;
|
||||
}*/
|
||||
#jot-text-wrap .preview textarea {
|
||||
width: 100%;
|
||||
}
|
||||
#preview_profile-jot-text {
|
||||
position: relative;
|
||||
padding: 0px 10px;
|
||||
margin-top: -2px;
|
||||
border: 2px solid #ededed;
|
||||
border-top: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0 0 4px 4px;
|
||||
background: #fff;
|
||||
color: #555;
|
||||
}
|
||||
textarea#profile-jot-text:focus + #preview_profile-jot-text {
|
||||
border: 2px solid #6fdbe8;
|
||||
border-top: none;
|
||||
}
|
||||
.preview hr.previewseparator {
|
||||
margin-top: 0px;
|
||||
border-color: #D2D2D2;
|
||||
}
|
||||
#previewImgBtn_profile-jot-text,
|
||||
.closePreview {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
}
|
||||
.closePreview {
|
||||
right: 15px;
|
||||
z-index: 1;
|
||||
}
|
||||
.previewImgBtn {
|
||||
left: 15px;
|
||||
}
|
||||
.preview button.previewActionBtn {
|
||||
display:block;
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
border: 2px solid #fff;
|
||||
box-shadow: 0 0 3px gray;
|
||||
background: #777;
|
||||
text-align: center;
|
||||
line-height: 2px;
|
||||
text-decoration: none;
|
||||
padding: 0 0 1px 1px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.preview button.previewActionBtn:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
.preview .closePreview button.previewActionBtn {
|
||||
font-size: 25px;
|
||||
}
|
||||
#previewInputTitle_profile-jot-text {
|
||||
width: 100%;
|
||||
}
|
||||
#profile-jot-wrapper button#profile-jot-submit {
|
||||
margin-top: 5px;
|
||||
|
|
@ -1349,7 +1435,10 @@ section #jotOpen {
|
|||
#profile-jot-wrapper #character-counter {
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.modal .wall-item-container.preview {
|
||||
overflow-y: auto;
|
||||
overflow-y: overlay;
|
||||
}
|
||||
/* ACL */
|
||||
/*#jot-modal-body {
|
||||
height: auto;
|
||||
|
|
@ -1357,7 +1446,7 @@ section #jotOpen {
|
|||
overflow-y: hidden;
|
||||
}*/
|
||||
#acl-search {
|
||||
margin-top: 20px;
|
||||
/*margin-top: 20px;*/
|
||||
/*padding: 8px;*/
|
||||
/*border: 1px solid #ccc;*/
|
||||
width: 100%;
|
||||
|
|
@ -1365,7 +1454,6 @@ section #jotOpen {
|
|||
#acl-list {
|
||||
display: block;
|
||||
border: 1px solid #ccc;
|
||||
overflow: auto;
|
||||
clear: both;
|
||||
min-height: 62px;
|
||||
margin-top: 20px;
|
||||
|
|
@ -1373,10 +1461,10 @@ section #jotOpen {
|
|||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#acl-list-content {
|
||||
overflow-y: auto;
|
||||
max-height: calc(100vh - 330px);
|
||||
overflow-y: hidden;
|
||||
height: auto !important;
|
||||
}
|
||||
.acl-list-item {
|
||||
|
|
|
|||
39
view/theme/frio/js/jot.js
Normal file
39
view/theme/frio/js/jot.js
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
// We append the linkPreview to a global Variable to make linkPreview
|
||||
// accessable on other places. Note: search on other places before you
|
||||
// delete or move the variable.
|
||||
var linkPreview;
|
||||
|
||||
/**
|
||||
* Insert a link into friendica jot.
|
||||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
function jotGetLink() {
|
||||
var currentText = $("#profile-jot-text").val();
|
||||
var noAttachment = '';
|
||||
reply = prompt(aStr.linkurl);
|
||||
if(reply && reply.length) {
|
||||
// There should be only one attachment per post.
|
||||
// So we need to remove the old one.
|
||||
$('#jot-attachment-preview').empty();
|
||||
$('#profile-rotator').show();
|
||||
if (currentText.includes("[attachment") && currentText.includes("[/attachment]")) {
|
||||
noAttachment = '&noAttachment=1';
|
||||
}
|
||||
|
||||
// We use the linkPreview library to have a preview
|
||||
// of the attachments.
|
||||
if (typeof linkPreview === 'object') {
|
||||
linkPreview.crawlText(reply + noAttachment);
|
||||
|
||||
// Fallback: insert the attachment bbcode directly into the textarea
|
||||
// if the attachment live preview isn't available
|
||||
} else {
|
||||
$.get('parse_url?binurl=' + bin2hex(reply) + noAttachment, function(data) {
|
||||
addeditortext(data);
|
||||
$('#profile-rotator').hide();
|
||||
});
|
||||
}
|
||||
autosize.update($("#profile-jot-text"));
|
||||
}
|
||||
}
|
||||
|
|
@ -22,6 +22,10 @@ $(document).ready(function(){
|
|||
$("#jot-content").append(jotcache);
|
||||
// Clear the jotcache.
|
||||
jotcache = '';
|
||||
// Destroy the attachment linkPreviw for Jot.
|
||||
if (typeof linkPreview === 'object') {
|
||||
linkPreview.destroy();
|
||||
}
|
||||
});
|
||||
|
||||
// Add Colorbox for viewing Network page images.
|
||||
|
|
@ -292,6 +296,7 @@ function editpost(url) {
|
|||
|
||||
modal.show();
|
||||
$("#jot-popup").show();
|
||||
linkPreview = $('#profile-jot-text').linkPreview();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,34 +46,34 @@ function commentGetLink(id, prompttext) {
|
|||
}
|
||||
|
||||
function addCommentText(data, id) {
|
||||
// get the textfield
|
||||
var textfield = document.getElementById("comment-edit-text-" + id);
|
||||
// check if the textfield does have the default-value
|
||||
commentOpenUI(textfield, id);
|
||||
// save already existent content
|
||||
var currentText = $("#comment-edit-text-" + id).val();
|
||||
//insert the data as new value
|
||||
textfield.value = currentText + data;
|
||||
autosize.update($("#comment-edit-text-" + id));
|
||||
// get the textfield
|
||||
var textfield = document.getElementById("comment-edit-text-" + id);
|
||||
// check if the textfield does have the default-value
|
||||
commentOpenUI(textfield, id);
|
||||
// save already existent content
|
||||
var currentText = $("#comment-edit-text-" + id).val();
|
||||
//insert the data as new value
|
||||
textfield.value = currentText + data;
|
||||
autosize.update($("#comment-edit-text-" + id));
|
||||
}
|
||||
|
||||
function commentLinkDrop(event, id) {
|
||||
var reply = event.dataTransfer.getData("text/uri-list");
|
||||
event.target.textContent = reply;
|
||||
event.preventDefault();
|
||||
if (reply && reply.length) {
|
||||
reply = bin2hex(reply);
|
||||
$.get('parse_url?noAttachment=1&binurl=' + reply, function(data) {
|
||||
var reply = event.dataTransfer.getData("text/uri-list");
|
||||
event.target.textContent = reply;
|
||||
event.preventDefault();
|
||||
if (reply && reply.length) {
|
||||
reply = bin2hex(reply);
|
||||
$.get('parse_url?noAttachment=1&binurl=' + reply, function(data) {
|
||||
addCommentText(data, id);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function commentLinkDropper(event) {
|
||||
var linkFound = event.dataTransfer.types.contains("text/uri-list");
|
||||
if (linkFound) {
|
||||
event.preventDefault();
|
||||
}
|
||||
var linkFound = event.dataTransfer.types.contains("text/uri-list");
|
||||
if (linkFound) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
|
||||
<div id="acl-wrapper">
|
||||
<button id="acl-showall" class="btn btn-block btn-default"><i class="fa fa-globe"></i> {{$showall}}</button>
|
||||
<div class="form-group form-group-search">
|
||||
<button id="acl-showall" class="btn btn-block btn-default"><i class="fa fa-globe"></i> {{$showall}}</button>
|
||||
</div>
|
||||
<div class="form-group form-group-search">
|
||||
<input type="text" id="acl-search" class="form-control form-search">
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
|
||||
<script type="text/javascript" src="{{$baseurl}}/view/js/ajaxupload.js" ></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/view/js/ajaxupload.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/view/js/linkPreview.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/view/theme/frio/js/jot.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var editor = false;
|
||||
|
|
@ -39,6 +41,7 @@
|
|||
|
||||
<script type="text/javascript">
|
||||
var ispublic = '{{$ispublic}}';
|
||||
aStr.linkurl = '{{$linkurl}}';
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
|
|
@ -126,24 +129,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
function jotGetLink() {
|
||||
var currentText = $("#profile-jot-text").val();
|
||||
var noAttachment = '';
|
||||
reply = prompt("{{$linkurl}}");
|
||||
if(reply && reply.length) {
|
||||
reply = bin2hex(reply);
|
||||
$('#profile-rotator').show();
|
||||
if (currentText.includes("[attachment") && currentText.includes("[/attachment]")) {
|
||||
noAttachment = '&noAttachment=1';
|
||||
}
|
||||
$.get('parse_url?binurl=' + reply + noAttachment, function(data) {
|
||||
addeditortext(data);
|
||||
$('#profile-rotator').hide();
|
||||
});
|
||||
autosize.update($("#profile-jot-text"));
|
||||
}
|
||||
}
|
||||
|
||||
function jotVideoURL() {
|
||||
reply = prompt("{{$vidurl}}");
|
||||
if(reply && reply.length) {
|
||||
|
|
@ -158,7 +143,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
function jotGetLocation() {
|
||||
reply = prompt("{{$whereareu}}", $('#jot-location').val());
|
||||
if(reply && reply.length) {
|
||||
|
|
@ -226,7 +210,6 @@
|
|||
}
|
||||
|
||||
function itemFiler(id) {
|
||||
|
||||
var bordercolor = $("input").css("border-color");
|
||||
|
||||
$.get('filer/', function(data){
|
||||
|
|
@ -290,6 +273,9 @@
|
|||
.find('#jot-modal-content')
|
||||
.append(jotcache)
|
||||
.modal.show;
|
||||
|
||||
// Jot attachment live preview.
|
||||
linkPreview = $('#profile-jot-text').linkPreview();
|
||||
}
|
||||
|
||||
// Activate the jot text section in the jot modal
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue