Merge pull request #3266 from rabuzarus/20170321_-_frio-fbbrowser
frio: fbrowser styling
This commit is contained in:
Hypolite Petovan
GitHub
commit
cfb99aa323
|
|
@ -1,17 +1,33 @@
|
|||
<?php
|
||||
|
||||
require_once('include/Photo.php');
|
||||
/**
|
||||
* @file mod/wall_upload.php
|
||||
* @brief Module for uploading a picture to the profile wall
|
||||
*
|
||||
* By default the picture will be stored in the photo album with the name Wall Photos.
|
||||
* You can specify a different album by adding an optional query string "album="
|
||||
* to the url
|
||||
*/
|
||||
|
||||
use \Friendica\Core\Config;
|
||||
|
||||
require_once 'include/Photo.php';
|
||||
|
||||
|
||||
function wall_upload_post(App $a, $desktopmode = true) {
|
||||
|
||||
logger("wall upload: starting new upload", LOGGER_DEBUG);
|
||||
|
||||
$r_json = (x($_GET, 'response') && $_GET['response'] == 'json');
|
||||
$album = (x($_GET, 'album') ? notags(trim($_GET['album'])) : '');
|
||||
|
||||
if ($a->argc > 1) {
|
||||
if (! x($_FILES, 'media')) {
|
||||
$nick = $a->argv[1];
|
||||
$r = q("SELECT `user`.*, `contact`.`id` FROM `user` INNER JOIN `contact` on `user`.`uid` = `contact`.`uid` WHERE `user`.`nickname` = '%s' AND `user`.`blocked` = 0 and `contact`.`self` = 1 LIMIT 1",
|
||||
$r = q("SELECT `user`.*, `contact`.`id` FROM `user`
|
||||
INNER JOIN `contact` on `user`.`uid` = `contact`.`uid`
|
||||
WHERE `user`.`nickname` = '%s' AND `user`.`blocked` = 0
|
||||
AND `contact`.`self` = 1 LIMIT 1",
|
||||
dbesc($nick)
|
||||
);
|
||||
|
||||
|
|
@ -24,7 +40,10 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
}
|
||||
} else {
|
||||
$user_info = api_get_user($a);
|
||||
$r = q("SELECT `user`.*, `contact`.`id` FROM `user` INNER JOIN `contact` on `user`.`uid` = `contact`.`uid` WHERE `user`.`nickname` = '%s' AND `user`.`blocked` = 0 and `contact`.`self` = 1 LIMIT 1",
|
||||
$r = q("SELECT `user`.*, `contact`.`id` FROM `user`
|
||||
INNER JOIN `contact` on `user`.`uid` = `contact`.`uid`
|
||||
WHERE `user`.`nickname` = '%s' AND `user`.`blocked` = 0
|
||||
AND `contact`.`self` = 1 LIMIT 1",
|
||||
dbesc($user_info['screen_name'])
|
||||
);
|
||||
}
|
||||
|
|
@ -36,6 +55,9 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
return;
|
||||
}
|
||||
|
||||
/*
|
||||
* Setup permissions structures
|
||||
*/
|
||||
$can_post = false;
|
||||
$visitor = 0;
|
||||
|
||||
|
|
@ -44,9 +66,9 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
$page_owner_nick = $r[0]['nickname'];
|
||||
$community_page = (($r[0]['page-flags'] == PAGE_COMMUNITY) ? true : false);
|
||||
|
||||
if((local_user()) && (local_user() == $page_owner_uid))
|
||||
if ((local_user()) && (local_user() == $page_owner_uid)) {
|
||||
$can_post = true;
|
||||
else {
|
||||
} else {
|
||||
if ($community_page && remote_user()) {
|
||||
$contact_id = 0;
|
||||
if (is_array($_SESSION['remote'])) {
|
||||
|
|
@ -57,9 +79,11 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
}
|
||||
}
|
||||
}
|
||||
if($contact_id) {
|
||||
|
||||
$r = q("SELECT `uid` FROM `contact` WHERE `blocked` = 0 AND `pending` = 0 AND `id` = %d AND `uid` = %d LIMIT 1",
|
||||
if ($contact_id) {
|
||||
$r = q("SELECT `uid` FROM `contact`
|
||||
WHERE `blocked` = 0 AND `pending` = 0
|
||||
AND `id` = %d AND `uid` = %d LIMIT 1",
|
||||
intval($contact_id),
|
||||
intval($page_owner_uid)
|
||||
);
|
||||
|
|
@ -94,28 +118,32 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
$filename = basename($_FILES['userfile']['name']);
|
||||
$filesize = intval($_FILES['userfile']['size']);
|
||||
$filetype = $_FILES['userfile']['type'];
|
||||
}
|
||||
elseif(x($_FILES,'media')) {
|
||||
if (is_array($_FILES['media']['tmp_name']))
|
||||
|
||||
} elseif (x($_FILES, 'media')) {
|
||||
if (is_array($_FILES['media']['tmp_name'])) {
|
||||
$src = $_FILES['media']['tmp_name'][0];
|
||||
else
|
||||
} else {
|
||||
$src = $_FILES['media']['tmp_name'];
|
||||
}
|
||||
|
||||
if (is_array($_FILES['media']['name']))
|
||||
if (is_array($_FILES['media']['name'])) {
|
||||
$filename = basename($_FILES['media']['name'][0]);
|
||||
else
|
||||
} else {
|
||||
$filename = basename($_FILES['media']['name']);
|
||||
}
|
||||
|
||||
if (is_array($_FILES['media']['size']))
|
||||
if (is_array($_FILES['media']['size'])) {
|
||||
$filesize = intval($_FILES['media']['size'][0]);
|
||||
else
|
||||
} else {
|
||||
$filesize = intval($_FILES['media']['size']);
|
||||
}
|
||||
|
||||
if (is_array($_FILES['media']['type']))
|
||||
if (is_array($_FILES['media']['type'])) {
|
||||
$filetype = $_FILES['media']['type'][0];
|
||||
else
|
||||
} else {
|
||||
$filetype = $_FILES['media']['type'];
|
||||
}
|
||||
}
|
||||
|
||||
if ($src=="") {
|
||||
if ($r_json) {
|
||||
|
|
@ -127,25 +155,27 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
}
|
||||
|
||||
// This is a special treatment for picture upload from Twidere
|
||||
if (($filename == "octet-stream") AND ($filetype != "")) {
|
||||
if (($filename == "octet-stream") && ($filetype != "")) {
|
||||
$filename = $filetype;
|
||||
$filetype = "";
|
||||
}
|
||||
|
||||
if ($filetype=="")
|
||||
if ($filetype=="") {
|
||||
$filetype=guess_image_type($filename);
|
||||
}
|
||||
|
||||
// If there is a temp name, then do a manual check
|
||||
// This is more reliable than the provided value
|
||||
|
||||
$imagedata = getimagesize($src);
|
||||
if ($imagedata)
|
||||
if ($imagedata) {
|
||||
$filetype = $imagedata['mime'];
|
||||
}
|
||||
|
||||
logger("File upload src: " . $src . " - filename: " . $filename .
|
||||
" - size: " . $filesize . " - type: " . $filetype, LOGGER_DEBUG);
|
||||
|
||||
$maximagesize = get_config('system','maximagesize');
|
||||
$maximagesize = Config::get('system', 'maximagesize');
|
||||
|
||||
if (($maximagesize) && ($filesize > $maximagesize)) {
|
||||
$msg = sprintf(t('Image exceeds size limit of %s'), formatBytes($maximagesize));
|
||||
|
|
@ -162,7 +192,9 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
$limit = service_class_fetch($page_owner_uid, 'photo_upload_limit');
|
||||
|
||||
if ($limit) {
|
||||
$r = q("select sum(octet_length(data)) as total from photo where uid = %d and scale = 0 and album != 'Contact Photos' ",
|
||||
$r = q("SELECT SUM(OCTET_LENGTH(`data`)) AS `total` FROM `photo`
|
||||
WHERE `uid` = %d AND `scale` = 0
|
||||
AND `album` != 'Contact Photos' ",
|
||||
intval($page_owner_uid)
|
||||
);
|
||||
$size = $r[0]['total'];
|
||||
|
|
@ -196,9 +228,10 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
$ph->orient($src);
|
||||
@unlink($src);
|
||||
|
||||
$max_length = get_config('system','max_image_length');
|
||||
if(! $max_length)
|
||||
$max_length = Config::get('system', 'max_image_length');
|
||||
if (! $max_length) {
|
||||
$max_length = MAX_IMAGE_LENGTH;
|
||||
}
|
||||
if ($max_length > 0) {
|
||||
$ph->scaleImage($max_length);
|
||||
logger("File upload: Scaling picture to new size " . $max_length, LOGGER_DEBUG);
|
||||
|
|
@ -211,9 +244,14 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
|
||||
$smallest = 0;
|
||||
|
||||
// If we don't have an album name use the Wall Photos album
|
||||
if (! strlen($album)) {
|
||||
$album = t('Wall Photos');
|
||||
}
|
||||
|
||||
$defperm = '<' . $default_cid . '>';
|
||||
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, t('Wall Photos'), 0, 0, $defperm);
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, $album, 0, 0, $defperm);
|
||||
|
||||
if (! $r) {
|
||||
$msg = t('Image upload failed.');
|
||||
|
|
@ -227,23 +265,28 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
|
||||
if ($width > 640 || $height > 640) {
|
||||
$ph->scaleImage(640);
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, t('Wall Photos'), 1, 0, $defperm);
|
||||
if($r)
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, $album, 1, 0, $defperm);
|
||||
if ($r) {
|
||||
$smallest = 1;
|
||||
}
|
||||
}
|
||||
|
||||
if ($width > 320 || $height > 320) {
|
||||
$ph->scaleImage(320);
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, t('Wall Photos'), 2, 0, $defperm);
|
||||
if($r AND ($smallest == 0))
|
||||
$r = $ph->store($page_owner_uid, $visitor, $hash, $filename, $album, 2, 0, $defperm);
|
||||
if ($r && ($smallest == 0)) {
|
||||
$smallest = 2;
|
||||
}
|
||||
}
|
||||
|
||||
$basename = basename($filename);
|
||||
|
||||
if (!$desktopmode) {
|
||||
|
||||
$r = q("SELECT `id`, `datasize`, `width`, `height`, `type` FROM `photo` WHERE `resource-id` = '%s' ORDER BY `width` DESC LIMIT 1", $hash);
|
||||
$r = q("SELECT `id`, `datasize`, `width`, `height`, `type` FROM `photo`
|
||||
WHERE `resource-id` = '%s'
|
||||
ORDER BY `width` DESC LIMIT 1",
|
||||
$hash
|
||||
);
|
||||
if (!$r) {
|
||||
if ($r_json) {
|
||||
echo json_encode(array('error'=>''));
|
||||
|
|
@ -276,7 +319,6 @@ function wall_upload_post(App $a, $desktopmode = true) {
|
|||
}
|
||||
|
||||
/* mod Waitman Gobble NO WARRANTY */
|
||||
|
||||
// if we get the signal then return the image url info in BBCODE
|
||||
if ($_REQUEST['hush']!='yeah') {
|
||||
echo "\n\n" . '[url=' . App::get_baseurl() . '/photos/' . $page_owner_nick . '/image/' . $hash . '][img]' . App::get_baseurl() . "/photo/{$hash}-{$smallest}.".$ph->getExt()."[/img][/url]\n\n";
|
||||
|
|
|
|||
|
|
@ -22,6 +22,9 @@
|
|||
#fc-header-right {
|
||||
margin-top: -4px;
|
||||
}
|
||||
#fc-header-right button {
|
||||
color: inherit;
|
||||
}
|
||||
#event-calendar-title {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -91,6 +91,10 @@ blockquote {
|
|||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
.minimize {
|
||||
max-height: 0px !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
code {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
|
@ -158,6 +162,7 @@ a#item-delete-selected {
|
|||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
padding: 8px 16px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
|
|
@ -190,12 +195,7 @@ a#item-delete-selected {
|
|||
outline: 0;
|
||||
background: $btn_primary_hover_color !important;
|
||||
}
|
||||
.btn-default:active, .btn-default.active {
|
||||
color: $link_color;
|
||||
}
|
||||
.btn-default:active:hover, .btn-default.active:hover {
|
||||
color: $link_hover_color;
|
||||
}
|
||||
|
||||
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover,
|
||||
.btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover,
|
||||
.open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus,
|
||||
|
|
@ -211,9 +211,6 @@ a#item-delete-selected {
|
|||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
.btn {
|
||||
color: inherit;
|
||||
}
|
||||
.btn-eventnav, btn-eventnav:hover {
|
||||
font-size: 16px;
|
||||
background: none;
|
||||
|
|
@ -1310,6 +1307,69 @@ section #jotOpen {
|
|||
}
|
||||
|
||||
/* Filebrowser */
|
||||
.fbrowser .breadcrumb {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.fbrowser .path a:before {
|
||||
content: "";
|
||||
padding: 0;
|
||||
}
|
||||
.fbrowser .breadcrumb > li:last-of-type a{
|
||||
color: #777;
|
||||
pointer-events: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fbrowser .folders {
|
||||
box-shadow: -1.5px 0 0 0 rgba(0, 0, 0, .1) inset;
|
||||
padding-right: 1px;
|
||||
}
|
||||
.fbrowser .folders ul {
|
||||
padding: 0px;
|
||||
margin-left: -15px;
|
||||
margin-bottom: 0px;
|
||||
overflow-y: auto;
|
||||
min-width: 100px;
|
||||
max-height: calc(100vh - 210px);
|
||||
line-height: 1.3;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.fbrowser .folders ul {
|
||||
max-height: calc(100vh - 255px);
|
||||
}
|
||||
}
|
||||
.fbrowser .folders li {
|
||||
padding-left: 20px;
|
||||
padding-right: 10px;
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
.fbrowser .folders li:hover {
|
||||
z-index: 2;
|
||||
color: #555;
|
||||
background-color: rgba(247, 247, 247, $contentbg_transp);
|
||||
border-left: 3px solid $link_color !important;
|
||||
padding-left: 17px;
|
||||
}
|
||||
.fbrowser .folders li a,
|
||||
.fbrowser .folders li a:hover {
|
||||
color: #555;
|
||||
font-size: 13px;
|
||||
}
|
||||
.fbrowser .folders + .list {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.fbrowser .fbrowser-content-container {
|
||||
overflow-y: auto;
|
||||
max-height: calc(100vh - 175px);
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.fbrowser .fbrowser-content-container {
|
||||
max-height: calc(100vh - 220px);
|
||||
}
|
||||
}
|
||||
.fbrowser.image .photo-album-image-wrapper {
|
||||
box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.fbrowser .profile-rotator-wrapper {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
|
@ -1610,6 +1670,10 @@ code > .hl-main {
|
|||
.wall-item-actions .button-likes {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.wall-item-actions button:hover {
|
||||
color: #555;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.wall-item-actions .separator {
|
||||
margin: 0 .3em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -68,6 +68,7 @@ var FileBrowser = {
|
|||
nickname : "",
|
||||
type : "",
|
||||
event: "",
|
||||
folder: "",
|
||||
id : null,
|
||||
|
||||
init: function(nickname, type, hash) {
|
||||
|
|
@ -80,16 +81,15 @@ var FileBrowser = {
|
|||
var destination = h.split("-")[0];
|
||||
FileBrowser.id = h.split("-")[1];
|
||||
FileBrowser.event = FileBrowser.event + "." + destination;
|
||||
if (destination == "comment") {
|
||||
// get the comment textimput field
|
||||
if (destination === "comment") {
|
||||
// Get the comment textimput field
|
||||
var commentElm = document.getElementById("comment-edit-text-" + FileBrowser.id);
|
||||
}
|
||||
};
|
||||
|
||||
console.log("FileBrowser:", nickname, type,FileBrowser.event, FileBrowser.id );
|
||||
console.log("FileBrowser: " + nickname, type, FileBrowser.event, FileBrowser.id);
|
||||
|
||||
// We need to add the AjaxUpload to the button
|
||||
FileBrowser.uploadButtons();
|
||||
FileBrowser.postLoad();
|
||||
|
||||
$(".error .close").on("click", function(e) {
|
||||
e.preventDefault();
|
||||
|
|
@ -97,32 +97,23 @@ var FileBrowser = {
|
|||
});
|
||||
|
||||
// Click on album link
|
||||
$(".fbrowser").on("click", ".folders a, .path a, .folders button, .path button", function(e) {
|
||||
$(".fbrowser").on("click", ".folders a, .path a", function(e) {
|
||||
e.preventDefault();
|
||||
var url = baseurl + "/fbrowser/" + FileBrowser.type + "/" + this.dataset.folder + "?mode=none";
|
||||
$(".fbrowser-content").hide();
|
||||
$(".fbrowser .profile-rotator-wrapper").show();
|
||||
FileBrowser.folder = this.dataset.folder;
|
||||
|
||||
// load new content to fbrowser window
|
||||
$(".fbrowser").load(url, function(responseText, textStatus){
|
||||
$(".profile-rotator-wrapper").hide();
|
||||
if (textStatus === 'success') {
|
||||
$(".fbrowser_content").show();
|
||||
// We need to add the AjaxUpload to the button
|
||||
FileBrowser.uploadButtons();
|
||||
}
|
||||
});
|
||||
FileBrowser.loadContent(url);
|
||||
});
|
||||
|
||||
//embed on click
|
||||
//Embed on click
|
||||
$(".fbrowser").on('click', ".photo-album-photo-link", function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
var embed = "";
|
||||
if (FileBrowser.type == "image") {
|
||||
if (FileBrowser.type === "image") {
|
||||
embed = "[url=" + this.dataset.link + "][img]" + this.dataset.img + "[/img][/url]";
|
||||
}
|
||||
if (FileBrowser.type=="file") {
|
||||
if (FileBrowser.type === "file") {
|
||||
// attachment links are "baseurl/attach/id"; we need id
|
||||
embed = "[attachment]" + this.dataset.link.split("/").pop() + "[/attachment]";
|
||||
}
|
||||
|
|
@ -132,7 +123,7 @@ var FileBrowser = {
|
|||
// work as expected (we need a way to wait until commentOpenUI would be finished).
|
||||
// As for now we insert pieces of this function here
|
||||
if ((commentElm !== null) && (typeof commentElm !== "undefined")) {
|
||||
if (commentElm.value == "") {
|
||||
if (commentElm.value === "") {
|
||||
$("#comment-edit-text-" + FileBrowser.id).addClass("comment-edit-text-full").removeClass("comment-edit-text-empty");
|
||||
$("#comment-edit-submit-wrapper-" + FileBrowser.id).show();
|
||||
$("#comment-edit-text-" + FileBrowser.id).attr('tabindex','9');
|
||||
|
|
@ -140,26 +131,42 @@ var FileBrowser = {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
console.log(FileBrowser.event, this.dataset.filename, embed, FileBrowser.id);
|
||||
|
||||
parent.$("body").trigger(FileBrowser.event, [
|
||||
this.dataset.filename,
|
||||
embed,
|
||||
FileBrowser.id,
|
||||
this.dataset.img,
|
||||
this.dataset.img
|
||||
]);
|
||||
|
||||
// close model
|
||||
// Close model
|
||||
$('#modal').modal('hide');
|
||||
// update autosize for this textarea
|
||||
// Update autosize for this textarea
|
||||
autosize.update($(".text-autosize"));
|
||||
});
|
||||
|
||||
// EventListener for switching between image and file mode
|
||||
$(".fbrowser").on('click', ".fbswitcher .btn", function(e) {
|
||||
e.preventDefault();
|
||||
FileBrowser.type = this.getAttribute("data-mode");
|
||||
$(".fbrowser").removeClass().addClass("fbrowser " + FileBrowser.type);
|
||||
url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none";
|
||||
|
||||
FileBrowser.loadContent(url);
|
||||
});
|
||||
},
|
||||
|
||||
// Initialize the AjaxUpload for the upload buttons
|
||||
uploadButtons: function() {
|
||||
if ($("#upload-image").length) {
|
||||
// To get the albumname we need to convert it from hex
|
||||
var albumname = hex2bin(FileBrowser.folder);
|
||||
//AjaxUpload for images
|
||||
var image_uploader = new window.AjaxUpload(
|
||||
'upload-image',
|
||||
{ action: 'wall_upload/'+FileBrowser.nickname+'?response=json',
|
||||
{ action: 'wall_upload/' + FileBrowser.nickname + '?response=json&album=' + albumname,
|
||||
name: 'userfile',
|
||||
responseType: 'json',
|
||||
onSubmit: function(file, ext) {
|
||||
|
|
@ -175,21 +182,19 @@ var FileBrowser = {
|
|||
return;
|
||||
}
|
||||
|
||||
$(".profile-rotator-wrapper").hide();
|
||||
$(".fbrowser_content").show();
|
||||
|
||||
// location = baseurl + "/fbrowser/image/?mode=none"+location['hash'];
|
||||
// location.reload(true);
|
||||
|
||||
var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none"
|
||||
var url = baseurl + "/fbrowser/" + FileBrowser.type + "/" + FileBrowser.folder + "?mode=none";
|
||||
// load new content to fbrowser window
|
||||
$(".fbrowser").load(url);
|
||||
FileBrowser.loadContent(url);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
if ($("#upload-file").length) {
|
||||
//AjaxUpload for files
|
||||
var file_uploader = new window.AjaxUpload(
|
||||
'upload-file',
|
||||
{ action: 'wall_attach/' + FileBrowser.nickname + '?response=json',
|
||||
|
|
@ -207,18 +212,49 @@ var FileBrowser = {
|
|||
return;
|
||||
}
|
||||
|
||||
$(".profile-rotator-wrapper").hide();
|
||||
$(".fbrowser_content").show();
|
||||
|
||||
// location = baseurl + "/fbrowser/file/?mode=none"+location['hash'];
|
||||
// location.reload(true);
|
||||
|
||||
var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none"
|
||||
// load new content to fbrowser window
|
||||
$(".fbrowser").load(url);
|
||||
var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none";
|
||||
// Load new content to fbrowser window
|
||||
FileBrowser.loadContent(url);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
// Stuff which should be executed if ne content was loaded
|
||||
postLoad: function() {
|
||||
FileBrowser.initGallery();
|
||||
$(".fbrowser .fbswitcher .btn").removeClass("active");
|
||||
$(".fbrowser .fbswitcher [data-mode=" + FileBrowser.type + "]").addClass("active");
|
||||
// We need to add the AjaxUpload to the button
|
||||
FileBrowser.uploadButtons();
|
||||
|
||||
},
|
||||
|
||||
// Load new content (e.g. change photo album)
|
||||
loadContent: function(url) {
|
||||
$(".fbrowser-content").hide();
|
||||
$(".fbrowser .profile-rotator-wrapper").show();
|
||||
|
||||
// load new content to fbrowser window
|
||||
$(".fbrowser").load(url, function(responseText, textStatus) {
|
||||
$(".profile-rotator-wrapper").hide();
|
||||
if (textStatus === 'success') {
|
||||
$(".fbrowser_content").show();
|
||||
FileBrowser.postLoad();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// Initialize justified Gallery
|
||||
initGallery: function() {
|
||||
$(".fbrowser.image .fbrowser-content-container").justifiedGallery({
|
||||
'rowHeight': 80,
|
||||
'margins': 4,
|
||||
'border': 0
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ $(document).ready(function(){
|
|||
});
|
||||
|
||||
// Jot nav menu.
|
||||
$("body").on("click", "#jot-modal .jot-nav li a", function(e){
|
||||
$("body").on("click", "#jot-modal .jot-nav li .jot-nav-lnk", function(e){
|
||||
e.preventDefault();
|
||||
toggleJotNav(this);
|
||||
});
|
||||
|
|
@ -306,10 +306,37 @@ function jotreset() {
|
|||
|
||||
// Give the active "jot-nav" list element the class "active"
|
||||
function toggleJotNav (elm) {
|
||||
// select all li of jot-nav and remove the active class
|
||||
$(".jot-nav li").removeClass("active");
|
||||
// add the active class to the parent of the link which was selected
|
||||
// Get the ID of the tab panel which should be activated
|
||||
var tabpanel = elm.getAttribute("aria-controls");
|
||||
var cls = hasClass(elm, "jot-nav-lnk-mobile");
|
||||
|
||||
// Select all li of jot-nav and remove the active class
|
||||
$(elm).parent("li").siblings("li").removeClass("active");
|
||||
// Add the active class to the parent of the link which was selected
|
||||
$(elm).parent("li").addClass("active");
|
||||
|
||||
// Minimize all tab content wrapper and activate only the selected
|
||||
// tab panel
|
||||
$('#jot-modal [role=tabpanel]').addClass("minimize").attr("aria-hidden" ,"true");
|
||||
$('#jot-modal #' + tabpanel).removeClass("minimize").attr("aria-hidden" ,"false");
|
||||
|
||||
// Set the aria-selected states
|
||||
$("#jot-modal .nav-tabs .jot-nav-lnk").attr("aria-selected", "false");
|
||||
elm.setAttribute("aria-selected", "true");
|
||||
|
||||
// For some some tab panels we need to execute other js functions
|
||||
if (tabpanel === "jot-preview-content") {
|
||||
preview_post();
|
||||
} else if (tabpanel === "jot-fbrowser-wrapper") {
|
||||
$(function() {
|
||||
Dialog.showJot();
|
||||
});
|
||||
}
|
||||
|
||||
// If element is a mobile dropdown nav menu we need to change the botton text
|
||||
if (cls) {
|
||||
toggleDropdownText(elm);
|
||||
}
|
||||
}
|
||||
|
||||
// Wall Message needs a special handling because in some cases
|
||||
|
|
|
|||
|
|
@ -208,11 +208,8 @@ $(document).ready(function(){
|
|||
|
||||
// Dropdown menus with the class "dropdown-head" will display the active tab
|
||||
// as button text
|
||||
$("body").on('click', '.dropdown-head .dropdown-menu li a', function(){
|
||||
$(this).closest(".dropdown").find('.btn').html($(this).text() + ' <span class="caret"></span>');
|
||||
$(this).closest(".dropdown").find('.btn').val($(this).data('value'));
|
||||
$(this).closest("ul").children("li").show();
|
||||
$(this).parent("li").hide();
|
||||
$("body").on('click', '.dropdown-head .dropdown-menu li a, .dropdown-head .dropdown-menu li button', function(){
|
||||
toggleDropdownText(this);
|
||||
});
|
||||
|
||||
/* setup onoff widgets */
|
||||
|
|
@ -638,3 +635,67 @@ function doLikeAction(ident, verb) {
|
|||
liking = 1;
|
||||
force_update = true;
|
||||
}
|
||||
|
||||
// Decodes a hexadecimally encoded binary string
|
||||
function hex2bin (s) {
|
||||
// discuss at: http://locutus.io/php/hex2bin/
|
||||
// original by: Dumitru Uzun (http://duzun.me)
|
||||
// example 1: hex2bin('44696d61')
|
||||
// returns 1: 'Dima'
|
||||
// example 2: hex2bin('00')
|
||||
// returns 2: '\x00'
|
||||
// example 3: hex2bin('2f1q')
|
||||
// returns 3: false
|
||||
var ret = [];
|
||||
var i = 0;
|
||||
var l;
|
||||
s += '';
|
||||
|
||||
for (l = s.length; i < l; i += 2) {
|
||||
var c = parseInt(s.substr(i, 1), 16);
|
||||
var k = parseInt(s.substr(i + 1, 1), 16);
|
||||
if (isNaN(c) || isNaN(k)) {
|
||||
return false;
|
||||
}
|
||||
ret.push((c << 4) | k);
|
||||
}
|
||||
return String.fromCharCode.apply(String, ret);
|
||||
}
|
||||
|
||||
// Convert binary data into hexadecimal representation
|
||||
function bin2hex (s) {
|
||||
// From: http://phpjs.org/functions
|
||||
// + original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
|
||||
// + bugfixed by: Onno Marsman
|
||||
// + bugfixed by: Linuxworld
|
||||
// + improved by: ntoniazzi (http://phpjs.org/functions/bin2hex:361#comment_177616)
|
||||
// * example 1: bin2hex('Kev');
|
||||
// * returns 1: '4b6576'
|
||||
// * example 2: bin2hex(String.fromCharCode(0x00));
|
||||
// * returns 2: '00'
|
||||
|
||||
var i, l, o = "", n;
|
||||
|
||||
s += "";
|
||||
|
||||
for (i = 0, l = s.length; i < l; i++) {
|
||||
n = s.charCodeAt(i).toString(16);
|
||||
o += n.length < 2 ? "0" + n : n;
|
||||
}
|
||||
|
||||
return o;
|
||||
}
|
||||
|
||||
// Dropdown menus with the class "dropdown-head" will display the active tab
|
||||
// as button text
|
||||
function toggleDropdownText(elm) {
|
||||
$(elm).closest(".dropdown").find('.btn').html($(elm).text() + ' <span class="caret"></span>');
|
||||
$(elm).closest(".dropdown").find('.btn').val($(elm).data('value'));
|
||||
$(elm).closest("ul").children("li").show();
|
||||
$(elm).parent("li").hide();
|
||||
}
|
||||
|
||||
// Check if element does have a specific class
|
||||
function hasClass(elem, cls) {
|
||||
return (" " + elem.className + " " ).indexOf( " "+cls+" " ) > -1;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,37 +13,57 @@
|
|||
<input id="fb-type" type="hidden" name="type" value="{{$type}}" />
|
||||
|
||||
<div class="error hidden">
|
||||
<span></span> <button type="button" class="btn btn-link" class="close">X</a>
|
||||
<span></span> <button type="button" class="btn btn-link" class="close" aria-label="Close">X</a>
|
||||
</div>
|
||||
|
||||
<div class="path">
|
||||
{{foreach $path as $p}}<button type="button" class="btn-link" data-folder="{{$p.0}}">{{$p.1}}</button>{{/foreach}}
|
||||
</div>
|
||||
{{* The breadcrumb navigation *}}
|
||||
<ol class="path breadcrumb" aria-label="Breadcrumb" role="navigation">
|
||||
{{foreach $path as $p}}<li role="presentation"><a href="#" data-folder="{{$p.0}}">{{$p.1}}</a></li>{{/foreach}}
|
||||
|
||||
{{* Switch between image and file mode *}}
|
||||
<div class="fbswitcher btn-group btn-group-xs pull-right" aria-label="Switch between image and file mode">
|
||||
<button type="button" class="btn btn-default" data-mode="image" aria-label="Image Mode"><i class="fa fa-picture-o" aria-hidden="true"></i></button>
|
||||
<button type="button" class="btn btn-default" data-mode="file" aria-label="File Mode"><i class="fa fa-file-o" aria-hidden="true"></i></button>
|
||||
</div>
|
||||
</ol>
|
||||
|
||||
<div class="media">
|
||||
|
||||
{{* List of photo albums *}}
|
||||
{{if $folders }}
|
||||
<div class="folders">
|
||||
<ul>
|
||||
{{foreach $folders as $f}}<li><button type="button" class="btn-link" data-folder="{{$f.0}}">{{$f.1}}</button></li>{{/foreach}}
|
||||
<div class="folders media-left" role="navigation" aria-label="Album Navigation">
|
||||
<ul role="menu">
|
||||
{{foreach $folders as $f}}
|
||||
<li role="presentation">
|
||||
<a href="#" data-folder="{{$f.0}}" role="menuitem">{{$f.1}}</a>
|
||||
</li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
<div class="list">
|
||||
{{* The main content (images or files) *}}
|
||||
<div class="list {{$type}} media-body" role="main" aria-label="Browser Content">
|
||||
<div class="fbrowser-content-container">
|
||||
{{foreach $files as $f}}
|
||||
<div class="photo-album-image-wrapper">
|
||||
<button type="button" class="btn btn-link photo-album-photo-link" data-link="{{$f.0}}" data-filename="{{$f.1}}" data-img="{{$f.2}}">
|
||||
<img src="{{$f.2}}">
|
||||
<a href="#" class="photo-album-photo-link" data-link="{{$f.0}}" data-filename="{{$f.1}}" data-img="{{$f.2}}">
|
||||
<img src="{{$f.2}}" alt="{{$f.1}}">
|
||||
<p>{{$f.1}}</p>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
{{/foreach}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="upload">
|
||||
<button id="upload-{{$type}}"><img id="profile-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait|escape:'html'}}" style="display: none;" /> {{"Upload"|t}}</button>
|
||||
<button id="upload-{{$type}}">{{"Upload"|t}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="profile-rotator-wrapper" style="display: none;">
|
||||
<i class="fa fa-circle-o-notch fa-spin"></i>
|
||||
|
||||
{{* This part contains the conent loader icon which is visible when new conent is loaded *}}
|
||||
<div class="profile-rotator-wrapper" aria-hidden="true" style="display: none;">
|
||||
<i class="fa fa-circle-o-notch fa-spin" aria-hidden="true"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -280,36 +280,14 @@
|
|||
.modal.show;
|
||||
}
|
||||
|
||||
// the following functions show/hide the specific jot content
|
||||
// in dependence of the selected nav
|
||||
function aclActive() {
|
||||
$(".modal-body #profile-jot-wrapper, .modal-body #jot-preview-content, .modal-body #jot-fbrowser-wrapper").hide();
|
||||
$(".modal-body #profile-jot-acl-wrapper").show();
|
||||
}
|
||||
|
||||
|
||||
function previewActive() {
|
||||
$(".modal-body #profile-jot-wrapper, .modal-body #profile-jot-acl-wrapper,.modal-body #jot-fbrowser-wrapper").hide();
|
||||
preview_post();
|
||||
}
|
||||
|
||||
// Activate the jot text section in the jot modal
|
||||
function jotActive() {
|
||||
$(".modal-body #profile-jot-acl-wrapper, .modal-body #jot-preview-content, .modal-body #jot-fbrowser-wrapper").hide();
|
||||
$(".modal-body #profile-jot-wrapper").show();
|
||||
|
||||
//make sure jot text does have really the active class (we do this because there are some
|
||||
// other events which trigger jot text
|
||||
toggleJotNav($("#jot-modal .jot-nav #jot-text-lnk"));
|
||||
// Make sure jot text does have really the active class (we do this because there are some
|
||||
// other events which trigger jot text (we need to do this for the desktop and mobile
|
||||
// jot nav
|
||||
var elem = $("#jot-modal .jot-nav #jot-text-lnk");
|
||||
var elemMobile = $("#jot-modal .jot-nav #jot-text-lnk-mobile")
|
||||
toggleJotNav(elem[0]);
|
||||
toggleJotNav(elemMobile[0]);
|
||||
}
|
||||
|
||||
function fbrowserActive() {
|
||||
$(".modal-body #profile-jot-wrapper, .modal-body #jot-preview-content, .modal-body #profile-jot-acl-wrapper").hide();
|
||||
|
||||
$(".modal-body #jot-fbrowser-wrapper").show();
|
||||
|
||||
$(function() {Dialog.showJot();});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -9,48 +9,52 @@
|
|||
{{* Note: We need 2 modal close buttons here to bypass a bug in bootstrap.
|
||||
The second is for mobile view. The first one doesnt work with dropdowns. To get a working close button
|
||||
in with dropdows the close button needs to be inserted after the dropdown. *}}
|
||||
<button type="button" class="close hidden-xs" data-dismiss="modal" style="float: right;">×</button>
|
||||
<button type="button" class="close hidden-xs" data-dismiss="modal" aria-label="Close" style="float: right;">×</button>
|
||||
|
||||
{{* The Jot navigation menu (text input, permissions, preview, filebrowser) *}}
|
||||
<ul class="nav nav-tabs hidden-xs jot-nav" role="menubar" data-tabs="tabs">
|
||||
{{* The Jot navigation menu for desktop user (text input, permissions, preview, filebrowser) *}}
|
||||
<ul class="nav nav-tabs hidden-xs jot-nav" role="tablist" data-tabs="tabs">
|
||||
{{* Mark the first list entry as active because it is the first which is active after opening
|
||||
the modal. Changing of the activity status is done by js in jot.tpl-header *}}
|
||||
<li class="active" role="menuitem">
|
||||
<a class="jot-text-lnk" id="jot-text-lnk" onclick="jotActive(); return false;">{{$message}}</a>
|
||||
<li class="active" role="presentation">
|
||||
<a href="#profile-jot-wrapper" class="jot-text-lnk jot-nav-lnk" id="jot-text-lnk" role="tab" aria-controls="profile-jot-wrapper" aria-selected="true">{{$message}}</a>
|
||||
</li>
|
||||
{{if $acl}}
|
||||
<li role="menuitem">
|
||||
<a class="jot-perms-lnk" id="jot-perms-lnk" onclick="aclActive(); return false;">{{$shortpermset}}</a>
|
||||
<li role="presentation">
|
||||
<a href="#profile-jot-acl-wrapper" class="jot-perms-lnk jot-nav-lnk" id="jot-perms-lnk" role="tab" aria-controls="profile-jot-acl-wrapper" aria-selected="false">{{$shortpermset}}</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{if $preview}}
|
||||
<li role="menuitem">
|
||||
<a class="jot-preview-lnk" id="jot-preview-lnk" onclick="previewActive(); return false;">{{$preview}}</a>
|
||||
<li role="presentation">
|
||||
<a href="#jot-preview-content" class="jot-preview-lnk jot-nav-lnk" id="jot-preview-lnk" role="tab" aria-controls="jot-preview-content" aria-selected="false">{{$preview}}</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
<li role="menuitem">
|
||||
<a class="jot-browser-lnk" id="jot-browser-link" onclick="fbrowserActive(); return false;">{{$browser}}</a>
|
||||
<li role="presentation">
|
||||
<a href="#jot-fbrowser-wrapper" class="jot-browser-lnk jot-nav-lnk" id="jot-browser-link" role="tab" aria-controls="jot-fbrowser-wrapper" aria-selected="false">{{$browser}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
{{* The Jot navigation menu for small displays (text input, permissions, preview, filebrowser) *}}
|
||||
<div class="dropdown dropdown-head dropdown-mobile-jot jot-nav hidden-lg hidden-md hidden-sm" role="menubar" data-tabs="tabs" style="float: left;">
|
||||
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">{{$message}} <span class="caret"></span></button>
|
||||
<ul class="dropdown-menu nav nav-pills">
|
||||
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true">{{$message}} <span class="caret"></span></button>
|
||||
<ul class="dropdown-menu nav nav-pills" aria-label="submenu">
|
||||
{{* mark the first list entry as active because it is the first which is active after opening
|
||||
the modal. Changing of the activity status is done by js in jot.tpl-header *}}
|
||||
<li role="menuitem" style="display: none;">
|
||||
<a class="jot-text-lnk" id="jot-text-lnk-mobile" onclick="jotActive(); return false;">{{$message}}</a>
|
||||
<li role="presentation" style="display: none;">
|
||||
<button class="jot-text-lnk btn-link jot-nav-lnk jot-nav-lnk-mobile" id="jot-text-lnk-mobile" aria-controls="profile-jot-wrapper" role="menuitem" aria-selected="true">{{$message}}</button>
|
||||
</li>
|
||||
{{if $acl}}
|
||||
<li role="menuitem">
|
||||
<a class="jot-perms-lnk" id="jot-perms-lnk-mobile" onclick="aclActive(); return false;">{{$shortpermset}}</a>
|
||||
<li role="presentation">
|
||||
<button class="jot-perms-lnk btn-link jot-nav-lnk jot-nav-lnk-mobile" id="jot-perms-lnk-mobile" aria-controls="profile-jot-acl-wrapper" role="menuitem" aria-selected="false">{{$shortpermset}}</button>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{if $preview}}
|
||||
<li role="menuitem">
|
||||
<a class="jot-preview-lnk" id="jot-preview-lnk-mobile" onclick="previewActive(); return false;">{{$preview}}</a>
|
||||
<li role="presentation">
|
||||
<button class="jot-preview-lnk btn-link jot-nav-lnk jot-nav-lnk-mobile" id="jot-preview-lnk-mobile" aria-controls="jot-preview-content" role="menuitem" aria-selected="false">{{$preview}}</button>
|
||||
</li>
|
||||
{{/if}}
|
||||
<li role="presentation">
|
||||
<button class="jot-browser-lnk-mobile btn-link jot-nav-lnk jot-nav-lnk-mobile" id="jot-browser-lnk-mobile" aria-controls="jot-fbrowser-wrapper" role="menuitem" aria-selected="false">{{$browser}}</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<button type="button" class="close hidden-lg hidden-md hidden-sm" data-dismiss="modal" style="float: right;">×</button>
|
||||
|
|
@ -58,7 +62,7 @@
|
|||
|
||||
<div id="jot-modal-body" class="modal-body">
|
||||
<form id="profile-jot-form" action="{{$action}}" method="post">
|
||||
<div id="profile-jot-wrapper">
|
||||
<div id="profile-jot-wrapper" aria-labelledby="jot-text-lnk" role="tabpanel" aria-hidden="false">
|
||||
<div>
|
||||
<!--<div id="profile-jot-desc" class="jothidden pull-right"> </div>-->
|
||||
</div>
|
||||
|
|
@ -88,10 +92,6 @@
|
|||
</div>
|
||||
|
||||
<ul id="profile-jot-submit-wrapper" class="jothidden nav nav-pills">
|
||||
{{* uncomment the button for "wall-immage-upload" because we have integrated it directly in the jot modal
|
||||
<li><a href="#" id="wall-image-upload" title="{{$upload}}"><i class="fa fa-picture-o"></i></a></li>
|
||||
*}}
|
||||
<li><button type="button" class="btn-link" id="wall-file-upload" title="{{$attach}}"><i class="fa fa-paperclip"></i></button></li>
|
||||
<li><button type="button" class="btn-link" id="profile-link" ondragenter="return linkdropper(event);" ondragover="return linkdropper(event);" ondrop="linkdrop(event);" onclick="jotGetLink();" title="{{$weblink}}"><i class="fa fa-link"></i></button></li>
|
||||
<li><button type="button" class="btn-link" id="profile-video" onclick="jotVideoURL();" title="{{$video}}"><i class="fa fa-film"></i></button></li>
|
||||
<li><button type="button" class="btn-link" id="profile-audio" onclick="jotAudioURL();" title="{{$audio}}"><i class="fa fa-music"></i></button></li>
|
||||
|
|
@ -112,14 +112,14 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div id="profile-jot-acl-wrapper" style="display: none;">
|
||||
<div id="profile-jot-acl-wrapper" class="minimize" aria-labelledby="jot-perms-lnk" role="tabpanel" aria-hidden="true">
|
||||
{{$acl}}
|
||||
</div>
|
||||
|
||||
<div id="jot-preview-content" style="display:none;"></div>
|
||||
<div id="jot-preview-content" class="minimize" aria-labelledby="jot-preview-lnk" role="tabpanel" aria-hidden="true"></div>
|
||||
</form>
|
||||
|
||||
<div id="jot-fbrowser-wrapper" style="display: none"></div>
|
||||
<div id="jot-fbrowser-wrapper" class="minimize" aria-labelledby="jot-browser-link" role="tabpanel" aria-hidden="true"></div>
|
||||
|
||||
{{if $content}}<script>initEditor();</script>{{/if}}
|
||||
</div>
|
||||
|
|
@ -146,4 +146,3 @@ can load different content into the jot moadl (e.g. the item edit jot)
|
|||
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user