[js_upload] Rewrite addon after ACl changes
- Move HTML to template - Remove redundant uninstall method - Enforce coding standards - Add type-hintingpull/914/head
parent
75a7d6f1c7
commit
665c2c3337
|
@ -2,161 +2,56 @@
|
||||||
/**
|
/**
|
||||||
* Name: JS Uploader
|
* Name: JS Uploader
|
||||||
* Description: JavaScript photo/image uploader. Uses Valum 'qq' Uploader.
|
* Description: JavaScript photo/image uploader. Uses Valum 'qq' Uploader.
|
||||||
* Version: 1.0
|
* Version: 1.1
|
||||||
* Author: Chris Case <http://friendika.openmindspace.org/profile/chris_case>
|
* Author: Chris Case <http://friendika.openmindspace.org/profile/chris_case>
|
||||||
|
* Maintainer: Hypolite Petovan <https://friendica.mrpetovan.com/profile/hypolite>
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/**
|
use Friendica\App;
|
||||||
*
|
|
||||||
* JavaScript Photo/Image Uploader
|
|
||||||
*
|
|
||||||
* Uses Valum 'qq' Uploader.
|
|
||||||
* Module Author: Chris Case
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
use Friendica\Core\Config;
|
use Friendica\Core\Config;
|
||||||
use Friendica\Core\Hook;
|
use Friendica\Core\Hook;
|
||||||
use Friendica\Core\L10n;
|
use Friendica\Core\L10n;
|
||||||
use Friendica\Core\Logger;
|
use Friendica\Core\Logger;
|
||||||
|
use Friendica\Core\Renderer;
|
||||||
|
|
||||||
function js_upload_install() {
|
function js_upload_install()
|
||||||
Hook::register('photo_upload_form', 'addon/js_upload/js_upload.php', 'js_upload_form');
|
{
|
||||||
Hook::register('photo_post_init', 'addon/js_upload/js_upload.php', 'js_upload_post_init');
|
Hook::register('photo_upload_form', __FILE__, 'js_upload_form');
|
||||||
Hook::register('photo_post_file', 'addon/js_upload/js_upload.php', 'js_upload_post_file');
|
Hook::register('photo_post_init', __FILE__, 'js_upload_post_init');
|
||||||
Hook::register('photo_post_end', 'addon/js_upload/js_upload.php', 'js_upload_post_end');
|
Hook::register('photo_post_file', __FILE__, 'js_upload_post_file');
|
||||||
|
Hook::register('photo_post_end', __FILE__, 'js_upload_post_end');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function js_upload_form(App $a, array &$b)
|
||||||
function js_upload_uninstall() {
|
{
|
||||||
Hook::unregister('photo_upload_form', 'addon/js_upload/js_upload.php', 'js_upload_form');
|
|
||||||
Hook::unregister('photo_post_init', 'addon/js_upload/js_upload.php', 'js_upload_post_init');
|
|
||||||
Hook::unregister('photo_post_file', 'addon/js_upload/js_upload.php', 'js_upload_post_file');
|
|
||||||
Hook::unregister('photo_post_end', 'addon/js_upload/js_upload.php', 'js_upload_post_end');
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function js_upload_form(&$a,&$b) {
|
|
||||||
|
|
||||||
$b['default_upload'] = false;
|
$b['default_upload'] = false;
|
||||||
|
|
||||||
$b['addon_text'] .= '<link href="' . $a->getBaseURL() . '/addon/js_upload/file-uploader/client/fileuploader.css" rel="stylesheet" type="text/css">';
|
$a->page->registerStylesheet('addon/js_upload/file-uploader/client/fileuploader.css');
|
||||||
$b['addon_text'] .= '<script src="' . $a->getBaseURL() . '/addon/js_upload/file-uploader/client/fileuploader.js" type="text/javascript"></script>';
|
$a->page->registerFooterScript('addon/js_upload/file-uploader/client/fileuploader.js');
|
||||||
|
|
||||||
$upload_msg = L10n::t('Select files for upload');
|
$tpl = Renderer::getMarkupTemplate('js_upload.tpl', 'addon/js_upload');
|
||||||
$drop_msg = L10n::t('Drop files here to upload');
|
$b['addon_text'] .= Renderer::replaceMacros($tpl, [
|
||||||
$cancel = L10n::t('Cancel');
|
'$upload_msg' => L10n::t('Select files for upload'),
|
||||||
$failed = L10n::t('Failed');
|
'$drop_msg' => L10n::t('Drop files here to upload'),
|
||||||
|
'$cancel' => L10n::t('Cancel'),
|
||||||
$maximagesize = intval(Config::get('system','maximagesize'));
|
'$failed' => L10n::t('Failed'),
|
||||||
|
'$post_url' => $b['post_url'],
|
||||||
$b['addon_text'] .= <<< EOT
|
'$maximagesize' => intval(Config::get('system', 'maximagesize')),
|
||||||
|
]);
|
||||||
<div id="file-uploader-demo1">
|
|
||||||
<noscript>
|
|
||||||
<p>Please enable JavaScript to use file uploader.</p>
|
|
||||||
<!-- or put a simple form for upload here -->
|
|
||||||
</noscript>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
var uploader = null;
|
|
||||||
function getSelected(opt) {
|
|
||||||
var selected = new Array();
|
|
||||||
var index = 0;
|
|
||||||
for (var intLoop = 0; intLoop < opt.length; intLoop++) {
|
|
||||||
if ((opt[intLoop].selected) ||
|
|
||||||
(opt[intLoop].checked)) {
|
|
||||||
index = selected.length;
|
|
||||||
//selected[index] = new Object;
|
|
||||||
selected[index] = opt[intLoop].value;
|
|
||||||
//selected[index] = intLoop;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return selected;
|
|
||||||
}
|
|
||||||
function createUploader() {
|
|
||||||
uploader = new qq.FileUploader({
|
|
||||||
element: document.getElementById('file-uploader-demo1'),
|
|
||||||
action: '{$b['post_url']}',
|
|
||||||
|
|
||||||
template: '<div class="qq-uploader">' +
|
|
||||||
'<div class="qq-upload-drop-area"><span>$drop_msg</span></div>' +
|
|
||||||
'<div class="qq-upload-button">$upload_msg</div>' +
|
|
||||||
'<ul class="qq-upload-list"></ul>' +
|
|
||||||
'</div>',
|
|
||||||
|
|
||||||
// template for one item in file list
|
|
||||||
fileTemplate: '<li>' +
|
|
||||||
'<span class="qq-upload-file"></span>' +
|
|
||||||
'<span class="qq-upload-spinner"></span>' +
|
|
||||||
'<span class="qq-upload-size"></span>' +
|
|
||||||
'<a class="qq-upload-cancel" href="#">$cancel</a>' +
|
|
||||||
'<span class="qq-upload-failed-text">$failed</span>' +
|
|
||||||
'</li>',
|
|
||||||
|
|
||||||
debug: true,
|
|
||||||
sizeLimit: $maximagesize,
|
|
||||||
onSubmit: function(id,filename) {
|
|
||||||
var newalbumElm = document.getElementById('photos-upload-newalbum');
|
|
||||||
var albumElm = document.getElementById('photos-upload-album-select');
|
|
||||||
|
|
||||||
var newalbum = newalbumElm ? newalbumElm.value : "";
|
|
||||||
var album = albumElm ? albumElm.value : "";
|
|
||||||
|
|
||||||
if (typeof acl != "undefined"){
|
|
||||||
uploader.setParams( {
|
|
||||||
newalbum : newalbum,
|
|
||||||
album : album,
|
|
||||||
not_visible : document.getElementById('photos-upload-noshare').checked,
|
|
||||||
group_allow : acl.allow_gid.join(','),
|
|
||||||
contact_allow : acl.allow_cid.join(','),
|
|
||||||
group_deny : acl.deny_gid.join(','),
|
|
||||||
contact_deny : acl.deny_cid.join(',')
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
uploader.setParams( {
|
|
||||||
newalbum : newalbum,
|
|
||||||
album : album,
|
|
||||||
not_visible : document.getElementById('photos-upload-noshare').checked,
|
|
||||||
group_allow : getSelected(document.getElementById('group_allow')).join(','),
|
|
||||||
contact_allow : getSelected(document.getElementById('contact_allow')).join(','),
|
|
||||||
group_deny : getSelected(document.getElementById('group_deny')).join(','),
|
|
||||||
contact_deny : getSelected(document.getElementById('contact_deny')).join(',')
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function js_upload_post_init(App $a, &$b)
|
||||||
// in your app create uploader as soon as the DOM is ready
|
{
|
||||||
// don't wait for the window to load
|
// list of valid extensions
|
||||||
window.onload = createUploader;
|
$allowedExtensions = ['jpeg', 'gif', 'png', 'jpg'];
|
||||||
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
EOT;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function js_upload_post_init(&$a,&$b) {
|
|
||||||
|
|
||||||
// list of valid extensions, ex. array("jpeg", "xml", "bmp")
|
|
||||||
|
|
||||||
$allowedExtensions = ["jpeg","gif","png","jpg"];
|
|
||||||
|
|
||||||
// max file size in bytes
|
// max file size in bytes
|
||||||
|
$sizeLimit = Config::get('system', 'maximagesize');
|
||||||
$sizeLimit = Config::get('system','maximagesize'); //6 * 1024 * 1024;
|
|
||||||
|
|
||||||
$uploader = new qqFileUploader($allowedExtensions, $sizeLimit);
|
$uploader = new qqFileUploader($allowedExtensions, $sizeLimit);
|
||||||
|
|
||||||
$result = $uploader->handleUpload();
|
$result = $uploader->handleUpload();
|
||||||
|
|
||||||
|
|
||||||
// to pass data through iframe you will need to encode all html tags
|
// to pass data through iframe you will need to encode all html tags
|
||||||
$a->data['upload_jsonresponse'] = htmlspecialchars(json_encode($result), ENT_NOQUOTES);
|
$a->data['upload_jsonresponse'] = htmlspecialchars(json_encode($result), ENT_NOQUOTES);
|
||||||
|
|
||||||
|
@ -167,11 +62,10 @@ function js_upload_post_init(&$a,&$b) {
|
||||||
}
|
}
|
||||||
|
|
||||||
$a->data['upload_result'] = $result;
|
$a->data['upload_result'] = $result;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function js_upload_post_file(&$a,&$b) {
|
function js_upload_post_file(App $a, &$b)
|
||||||
|
{
|
||||||
$result = $a->data['upload_result'];
|
$result = $a->data['upload_result'];
|
||||||
|
|
||||||
$b['src'] = $result['path'];
|
$b['src'] = $result['path'];
|
||||||
|
@ -180,31 +74,30 @@ function js_upload_post_file(&$a,&$b) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function js_upload_post_end(App $a, &$b)
|
||||||
function js_upload_post_end(&$a,&$b) {
|
{
|
||||||
|
|
||||||
Logger::log('upload_post_end');
|
Logger::log('upload_post_end');
|
||||||
if (!empty($a->data['upload_jsonresponse'])) {
|
if (!empty($a->data['upload_jsonresponse'])) {
|
||||||
echo $a->data['upload_jsonresponse'];
|
echo $a->data['upload_jsonresponse'];
|
||||||
exit();
|
exit();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Handle file uploads via XMLHttpRequest
|
* Handle file uploads via XMLHttpRequest
|
||||||
*/
|
*/
|
||||||
class qqUploadedFileXhr {
|
class qqUploadedFileXhr
|
||||||
|
{
|
||||||
private $pathnm = '';
|
private $pathnm = '';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Save the file in the temp dir.
|
* Save the file in the temp dir.
|
||||||
|
*
|
||||||
* @return boolean TRUE on success
|
* @return boolean TRUE on success
|
||||||
*/
|
*/
|
||||||
function save() {
|
function save()
|
||||||
$input = fopen("php://input", "r");
|
{
|
||||||
|
$input = fopen('php://input', 'r');
|
||||||
|
|
||||||
$upload_dir = Config::get('system', 'tempdir');
|
$upload_dir = Config::get('system', 'tempdir');
|
||||||
if (!$upload_dir)
|
if (!$upload_dir)
|
||||||
|
@ -212,7 +105,7 @@ class qqUploadedFileXhr {
|
||||||
|
|
||||||
$this->pathnm = tempnam($upload_dir, 'frn');
|
$this->pathnm = tempnam($upload_dir, 'frn');
|
||||||
|
|
||||||
$temp = fopen($this->pathnm,"w");
|
$temp = fopen($this->pathnm, 'w');
|
||||||
$realSize = stream_copy_to_stream($input, $temp);
|
$realSize = stream_copy_to_stream($input, $temp);
|
||||||
|
|
||||||
fclose($input);
|
fclose($input);
|
||||||
|
@ -224,17 +117,20 @@ class qqUploadedFileXhr {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPath() {
|
function getPath()
|
||||||
|
{
|
||||||
return $this->pathnm;
|
return $this->pathnm;
|
||||||
}
|
}
|
||||||
|
|
||||||
function getName() {
|
function getName()
|
||||||
|
{
|
||||||
return $_GET['qqfile'];
|
return $_GET['qqfile'];
|
||||||
}
|
}
|
||||||
|
|
||||||
function getSize() {
|
function getSize()
|
||||||
if (isset($_SERVER["CONTENT_LENGTH"])){
|
{
|
||||||
return (int)$_SERVER["CONTENT_LENGTH"];
|
if (isset($_SERVER['CONTENT_LENGTH'])) {
|
||||||
|
return (int)$_SERVER['CONTENT_LENGTH'];
|
||||||
} else {
|
} else {
|
||||||
throw new Exception('Getting content length is not supported.');
|
throw new Exception('Getting content length is not supported.');
|
||||||
}
|
}
|
||||||
|
@ -244,39 +140,43 @@ class qqUploadedFileXhr {
|
||||||
/**
|
/**
|
||||||
* Handle file uploads via regular form post (uses the $_FILES array)
|
* Handle file uploads via regular form post (uses the $_FILES array)
|
||||||
*/
|
*/
|
||||||
|
class qqUploadedFileForm
|
||||||
class qqUploadedFileForm {
|
{
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Save the file to the specified path
|
* Save the file to the specified path
|
||||||
|
*
|
||||||
* @return boolean TRUE on success
|
* @return boolean TRUE on success
|
||||||
*/
|
*/
|
||||||
|
function save()
|
||||||
|
{
|
||||||
function save() {
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPath() {
|
function getPath()
|
||||||
|
{
|
||||||
return $_FILES['qqfile']['tmp_name'];
|
return $_FILES['qqfile']['tmp_name'];
|
||||||
}
|
}
|
||||||
|
|
||||||
function getName() {
|
function getName()
|
||||||
|
{
|
||||||
return $_FILES['qqfile']['name'];
|
return $_FILES['qqfile']['name'];
|
||||||
}
|
}
|
||||||
function getSize() {
|
|
||||||
|
function getSize()
|
||||||
|
{
|
||||||
return $_FILES['qqfile']['size'];
|
return $_FILES['qqfile']['size'];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class qqFileUploader {
|
class qqFileUploader
|
||||||
|
{
|
||||||
private $allowedExtensions = [];
|
private $allowedExtensions = [];
|
||||||
private $sizeLimit = 10485760;
|
private $sizeLimit = 10485760;
|
||||||
private $file;
|
private $file;
|
||||||
|
|
||||||
function __construct(array $allowedExtensions = [], $sizeLimit = 10485760){
|
function __construct(array $allowedExtensions = [], $sizeLimit = 10485760)
|
||||||
$allowedExtensions = array_map("strtolower", $allowedExtensions);
|
{
|
||||||
|
$allowedExtensions = array_map('strtolower', $allowedExtensions);
|
||||||
|
|
||||||
$this->allowedExtensions = $allowedExtensions;
|
$this->allowedExtensions = $allowedExtensions;
|
||||||
$this->sizeLimit = $sizeLimit;
|
$this->sizeLimit = $sizeLimit;
|
||||||
|
@ -291,14 +191,17 @@ class qqFileUploader {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private function toBytes($str)
|
||||||
private function toBytes($str){
|
{
|
||||||
$val = trim($str);
|
$val = trim($str);
|
||||||
$last = strtolower($str[strlen($str) - 1]);
|
$last = strtolower($str[strlen($str) - 1]);
|
||||||
switch ($last) {
|
switch ($last) {
|
||||||
case 'g': $val *= 1024;
|
case 'g':
|
||||||
case 'm': $val *= 1024;
|
$val *= 1024;
|
||||||
case 'k': $val *= 1024;
|
case 'm':
|
||||||
|
$val *= 1024;
|
||||||
|
case 'k':
|
||||||
|
$val *= 1024;
|
||||||
}
|
}
|
||||||
return $val;
|
return $val;
|
||||||
}
|
}
|
||||||
|
@ -306,8 +209,8 @@ class qqFileUploader {
|
||||||
/**
|
/**
|
||||||
* Returns array('success'=>true) or array('error'=>'error message')
|
* Returns array('success'=>true) or array('error'=>'error message')
|
||||||
*/
|
*/
|
||||||
function handleUpload(){
|
function handleUpload()
|
||||||
|
{
|
||||||
if (!$this->file) {
|
if (!$this->file) {
|
||||||
return ['error' => L10n::t('No files were uploaded.')];
|
return ['error' => L10n::t('No files were uploaded.')];
|
||||||
}
|
}
|
||||||
|
@ -357,6 +260,5 @@ class qqFileUploader {
|
||||||
'filename' => $filename . '.' . $ext
|
'filename' => $filename . '.' . $ext
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,51 @@
|
||||||
|
|
||||||
|
<div id="js_upload">
|
||||||
|
<noscript>
|
||||||
|
<p>Please enable JavaScript to use file uploader.</p>
|
||||||
|
<!-- or put a simple form for upload here -->
|
||||||
|
</noscript>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
var uploader = null;
|
||||||
|
function createUploader() {
|
||||||
|
uploader = new qq.FileUploader({
|
||||||
|
element: document.getElementById('js_upload'),
|
||||||
|
action: '{{$post_url}}',
|
||||||
|
|
||||||
|
template: '<div class="qq-uploader">' +
|
||||||
|
'<div class="qq-upload-drop-area"><span>{{$drop_msg}}</span></div>' +
|
||||||
|
'<div class="qq-upload-button">{{$upload_msg}}</div>' +
|
||||||
|
'<ul class="qq-upload-list"></ul>' +
|
||||||
|
'</div>',
|
||||||
|
|
||||||
|
// template for one item in file list
|
||||||
|
fileTemplate: '<li>' +
|
||||||
|
'<span class="qq-upload-file"></span>' +
|
||||||
|
'<span class="qq-upload-spinner"></span>' +
|
||||||
|
'<span class="qq-upload-size"></span>' +
|
||||||
|
'<a class="qq-upload-cancel" href="#">{{$cancel}}</a>' +
|
||||||
|
'<span class="qq-upload-failed-text">{{$failed}}</span>' +
|
||||||
|
'</li>',
|
||||||
|
|
||||||
|
debug: true,
|
||||||
|
sizeLimit: {{$maximagesize}},
|
||||||
|
onSubmit: function(id, filename) {
|
||||||
|
let newalbumElm = document.getElementById('photos-upload-newalbum');
|
||||||
|
let albumElm = document.getElementById('photos-upload-album-select');
|
||||||
|
|
||||||
|
uploader.setParams({
|
||||||
|
newalbum : newalbumElm ? newalbumElm.value : '',
|
||||||
|
album : albumElm ? albumElm.value : '',
|
||||||
|
not_visible : document.getElementById('photos-upload-noshare').checked,
|
||||||
|
contact_allow : document.querySelector('[name="contact_allow"]').value,
|
||||||
|
group_allow : document.querySelector('[name="group_allow"]').value,
|
||||||
|
contact_deny : document.querySelector('[name="contact_deny"]').value,
|
||||||
|
group_deny : document.querySelector('[name="group_deny"]').value,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener('load', createUploader);
|
||||||
|
</script>
|
Loading…
Reference in New Issue