Jingga/oms-Media
1
0
Fork 0
mirror of https://github.com/Karaka-Management/oms-Media.git synced 2026-02-16 17:28:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Upload and form submit fixes

Browse Source
This commit is contained in:
Dennis Eichhorn 2016-05-03 22:00:53 +02:00
parent 6092745508
commit 5709da9df5
7 changed files with 173 additions and 220 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
Admin/Routes/http.php
View File

@ -3,10 +3,44 @@
use phpOMS\Router\RouteVerb; use phpOMS\Router\RouteVerb;
return [ return [
'^.*/backend/accounting/personal/entries.*$' => [ '^.*/backend/media/list.*$' => [
[ [
'dest' => '\Modules\Accounting\Controller:viewPersonalEntries', 'dest' => '\Modules\Media\Controller:viewMediaList',
'verb' => RouteVerb::GET, 'verb' => RouteVerb::GET,
], ],
], ],
'^.*/backend/media/create.*$' => [
[
'dest' => '\Modules\Media\Controller:setUpFileUploader',
'verb' => RouteVerb::GET,
],
[
'dest' => '\Modules\Media\Controller:viewMediaCreate',
'verb' => RouteVerb::GET,
],
],
'^.*/backend/media/single.*$' => [
[
'dest' => '\Modules\Media\Controller:viewMediaSingle',
'verb' => RouteVerb::GET,
],
],
'^.*/api/media/collection.*$' => [
[
'dest' => '\Modules\Media\Controller:apiCollectionCreate',
'verb' => RouteVerb::SET,
],
],
'^.*/api/media$' => [
[
'dest' => '\Modules\Media\Controller:apiMediaUpload',
'verb' => RouteVerb::SET,
],
],
'^.*/api/media/create.*$' => [
[
'dest' => '\Modules\Media\Controller:apiMediaCreate',
'verb' => RouteVerb::SET,
],
],
]; ];

59
Controller.js
View File

@ -1,45 +1,56 @@
(function (jsOMS, undefined) { (function (jsOMS, undefined)
{
jsOMS.Autoloader.defineNamespace('jsOMS.Modules'); jsOMS.Autoloader.defineNamespace('jsOMS.Modules');
jsOMS.Modules.Media = function (app) { jsOMS.Modules.Media = function (app)
{
this.app = app; this.app = app;
}; };
jsOMS.Modules.Media.prototype.bind = function () { jsOMS.Modules.Media.prototype.bind = function ()
{
let forms = document.getElementsByTagName('form'); let forms = document.getElementsByTagName('form');
/* Handle media forms */ /* Handle media forms */
for (let c = 0; c < forms.length; c++) { for (let i = 0; i < forms.length; i++) {
let self = this; let self = this;
if(typeof forms[i].querySelector('input[type=file]') !== 'undefined') { if (typeof forms[i].querySelector('input[type=file]') !== 'undefined') {
this.app.uiManager.getFormManager().get(forms[c].id).injectSubmit(function (e) { try {
let fileFields = e.querySelectorAll('input[type=file]'), this.app.uiManager.getFormManager().get(forms[i].id).injectSubmit('media-upload', function (e, requestId, requestGroup)
uploader = new jsOMS.Modules.Media.Models.Upload(self.app.responseManager); {
let fileFields = e.querySelectorAll('input[type=file]'),
uploader = new jsOMS.Modules.Models.Media.Upload(self.app.responseManager, self.app.logger);
uploader.setSuccess(e.id, function (type, response) { uploader.setSuccess(e.id, function (type, response)
e.querySelector('input[type=file]+input[type=hidden]').value = JSON.stringify(response.uploads); {
e.querySelector('input[type=file]+input[type=hidden]').value = JSON.stringify(response.uploads);
self.app.requestManager.triggerDone(requestId, requestGroup);
});
let data = self.app.uiManager.getFormManager().getData(e); uploader.setUri(Url + '{/lang}/api/media');
self.app.uiManager.getFormManager().submit(e, data);
});
uploader.setUri(jsOMS.Uri.UriFactory.build(Url + '/{lang}/api/media')); for (let i = 0; i < fileFields.length; i++) {
for (let j = 0; j < fileFields[i].files.length; j++) {
for (let i = 0; i < fileFields.length; i++) { uploader.addFile(fileFields[i].files[j]);
for (let j = 0; j < fileFields[i].files.length; j++) { }
uploader.addFile(fileFields[i].files[j]);
} }
}
uploader.upload(e.id); if (uploader.count() < 1) {
}); return;
}
uploader.upload(e.id);
});
} catch (e) {
this.app.logger.info('Tried to add media upload support for form without an ID.');
}
} }
} }
} };
}(window.jsOMS = window.jsOMS || {})); }(window.jsOMS = window.jsOMS || {}));
jsOMS.ready(function () { jsOMS.ready(function ()
window.omsApp.moduleManager.initModule('Media'); {
window.omsApp.moduleManager.get('Media').bind(); window.omsApp.moduleManager.get('Media').bind();
}); });

28
Controller.php
View File

@ -85,25 +85,6 @@ class Controller extends ModuleAbstract implements WebInterface
protected static $dependencies = [ protected static $dependencies = [
]; ];
/**
* Routing elements.
*
* @var array
* @since 1.0.0
*/
protected static $routes = [
'^.*/backend/media/list.*$' => [['dest' => '\Modules\Media\Controller:viewMediaList', 'method' => 'GET', 'type' => ViewLayout::MAIN],],
'^.*/backend/media/create.*$' => [
['dest' => '\Modules\Media\Controller:setUpFileUploader', 'method' => 'GET', 'type' => ViewLayout::NULL],
['dest' => '\Modules\Media\Controller:viewMediaCreate', 'method' => 'GET', 'type' => ViewLayout::MAIN],
],
'^.*/backend/media/single.*$' => [['dest' => '\Modules\Media\Controller:viewMediaSingle', 'method' => 'GET', 'type' => ViewLayout::MAIN],],
'^.*/api/media/collection.*$' => [['dest' => '\Modules\Media\Controller:apiCollectionCreate', 'method' => 'POST', 'type' => ViewLayout::MAIN],],
'^.*/api/media$' => [['dest' => '\Modules\Media\Controller:apiMediaUpload', 'method' => 'POST', 'type' => ViewLayout::NULL],],
'^.*/api/media/create.*$' => [['dest' => '\Modules\Media\Controller:apiMediaCreate', 'method' => 'POST', 'type' => ViewLayout::NULL],],
];
/** /**
* @param RequestAbstract $request Request * @param RequestAbstract $request Request
* @param ResponseAbstract $response Response * @param ResponseAbstract $response Response
@ -114,10 +95,11 @@ class Controller extends ModuleAbstract implements WebInterface
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setUpFileUploader(RequestAbstract $request, ResponseAbstract $response, $data = null) public static function setUpFileUploader(RequestAbstract $request, ResponseAbstract $response, $data = null)
{ {
$head = $response->getHead(); $head = $response->get('Content')->getData('head');
$head->addAsset(AssetType::JS, $request->getUri()->getBase() . 'Modules/Media/ModuleMedia.js'); $head->addAsset(AssetType::JS, $request->getUri()->getBase() . 'Modules/Media/Models/Upload.js');
$head->addAsset(AssetType::JS, $request->getUri()->getBase() . 'Modules/Media/Controller.js');
} }
/** /**
@ -229,7 +211,7 @@ class Controller extends ModuleAbstract implements WebInterface
{ {
$mediaCreated = []; $mediaCreated = [];
if (isset($files)) { if (!empty($files)) {
$upload = new UploadFile(); $upload = new UploadFile();
$rndPath = str_pad(dechex(rand(0, 65535)), 4, '0', STR_PAD_LEFT); $rndPath = str_pad(dechex(rand(0, 65535)), 4, '0', STR_PAD_LEFT);
$path = '/Modules/Media/Files/' . $rndPath[0] . $rndPath[1] . '/' . $rndPath[2] . $rndPath[3]; $path = '/Modules/Media/Files/' . $rndPath[0] . $rndPath[1] . '/' . $rndPath[2] . $rndPath[3];

109
Models/Upload.js
View File

@ -1,73 +1,98 @@
(function (jsOMS, undefined) { (function (jsOMS, undefined)
jsOMS.Autoloader.defineNamespace('jsOMS.Modules.Media.Models'); {
jsOMS.Autoloader.defineNamespace('jsOMS.Modules.Models.Media');
jsOMS.Modules.Models.Media.Upload = function (responseManager) { jsOMS.Modules.Models.Media.Upload = function (responseManager, logger)
{
this.logger = logger;
this.responseManager = responseManager; this.responseManager = responseManager;
this.success = []; this.success = [];
this.uri = ''; this.uri = '';
this.allowedTypes = []; this.allowedTypes = [];
this.maxFileSize = 0; this.maxFileSize = 0;
this.files = []; this.files = [];
}; };
jsOMS.Modules.Models.Media.Upload.prototype.setSuccess = function (id, callback) { jsOMS.Modules.Models.Media.Upload.prototype.setMaxFileSize = function (size)
this.success[id] = callback; {
};
jsOMS.Modules.Models.Media.Upload.prototype.setUri = function (uri) {
this.uri = uri;
};
jsOMS.Modules.Models.Media.Upload.prototype.setAllowedTypes = function (allowed) {
this.allowedTypes = allowed;
};
jsOMS.Modules.Models.Media.Upload.prototype.addAllowedType = function (allowed) {
this.allowedTypes.push(allowed);
};
jsOMS.Modules.Models.Media.Upload.prototype.setMaxFileSize = function (size) {
this.maxFileSize = size; this.maxFileSize = size;
}; };
jsOMS.Modules.Models.Media.Upload.prototype.addFile = function (file) { jsOMS.Modules.Models.Media.Upload.prototype.getMaxFileSize = function (size)
{
return this.maxFileSize;
};
jsOMS.Modules.Models.Media.Upload.prototype.setSuccess = function (id, callback)
{
this.success[id] = callback;
};
jsOMS.Modules.Models.Media.Upload.prototype.setUri = function (uri)
{
this.uri = uri;
};
jsOMS.Modules.Models.Media.Upload.prototype.setAllowedTypes = function (allowed)
{
this.allowedTypes = allowed;
};
jsOMS.Modules.Models.Media.Upload.prototype.addAllowedType = function (allowed)
{
this.allowedTypes.push(allowed);
};
jsOMS.Modules.Models.Media.Upload.prototype.setMaxFileSize = function (size)
{
this.maxFileSize = size;
};
jsOMS.Modules.Models.Media.Upload.prototype.addFile = function (file)
{
this.files.push(file); this.files.push(file);
}; };
jsOMS.Modules.Models.Media.Upload.prototype.upload = function (formId) { jsOMS.Modules.Models.Media.Upload.prototype.count = function ()
{
return this.files.length;
};
jsOMS.Modules.Models.Media.Upload.prototype.upload = function (formId)
{
// TODO: validate file type + file size // TODO: validate file type + file size
var request = new jsOMS.Message.Request.Request(), let request = new jsOMS.Message.Request.Request(),
formData = new FormData(), formData = new FormData(),
self = this; self = this;
this.files.forEach(function (element, index) { this.files.forEach(function (element, index)
{
formData.append('file' + index, element); formData.append('file' + index, element);
}); });
request.setData(formData); request.setData(formData);
request.setType('raw'); request.setType(jsOMS.Message.Request.RequestType.RAW);
request.setUri(this.uri); request.setUri(this.uri);
request.setMethod('POST'); request.setMethod(jsOMS.Message.Request.RequestMethod.POST);
request.setRequestHeader('HTTP_X_REQUESTED_WITH', 'XMLHttpRequest'); request.setRequestHeader('HTTP_X_REQUESTED_WITH', 'XMLHttpRequest');
request.setSuccess(function (xhr) { request.setSuccess(function (xhr)
console.log(xhr); // TODO: remove this is for error checking {
var o = JSON.parse(xhr.response), try {
response = Object.keys(o).map(function (k) { let response = JSON.parse(xhr.response);
return o[k];
});
console.log(response); for (let k = 0; k < response.length; k++) {
for (var k = 0; k < response.length; k++) {
if (response[k] !== null) {
if (!self.success[formId]) { if (!self.success[formId]) {
self.responseManager.execute(response[k].type, response[k]); self.responseManager.run(response[k].type, response[k]);
} else { } else {
self.success[formId](response[k].type, response[k]); self.success[formId](response[k].type, response[k]);
} }
} }
} catch (exception) {
self.logger.error('Invalid media upload response: ' + xhr.response);
return false;
} }
}); });
request.send(); request.send();

39
Models/UploadFile.php
View File

@ -178,8 +178,13 @@ class UploadFile
\mkdir($path, '0655', true); \mkdir($path, '0655', true);
} }
if (!move_uploaded_file($path = $f['tmp_name'], $path . '/' . $this->fileName) || !is_uploaded_file($path)) { if (!is_uploaded_file($f['tmp_name'])) {
// couldn't move $result[$key]['status'] = UploadStatus::NOT_UPLOADED;
return $result;
}
if (!move_uploaded_file($f['tmp_name'], $path . '/' . $this->fileName)) {
$result[$key]['status'] = UploadStatus::NOT_MOVABLE; $result[$key]['status'] = UploadStatus::NOT_MOVABLE;
return $result; return $result;
@ -198,7 +203,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function getMaxSize() : int public
function getMaxSize() : int
{ {
return $this->maxSize; return $this->maxSize;
} }
@ -211,7 +217,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setMaxSize(int $maxSize) public
function setMaxSize(int $maxSize)
{ {
$this->maxSize = $maxSize; $this->maxSize = $maxSize;
} }
@ -222,7 +229,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function getAllowedTypes() : array public
function getAllowedTypes() : array
{ {
return $this->allowedTypes; return $this->allowedTypes;
} }
@ -235,7 +243,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setAllowedTypes(array $allowedTypes) public
function setAllowedTypes(array $allowedTypes)
{ {
$this->allowedTypes = $allowedTypes; $this->allowedTypes = $allowedTypes;
} }
@ -248,7 +257,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function addAllowedTypes($allowedTypes) public
function addAllowedTypes($allowedTypes)
{ {
$this->allowedTypes[] = $allowedTypes; $this->allowedTypes[] = $allowedTypes;
} }
@ -259,7 +269,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function getOutputDir() : string public
function getOutputDir() : string
{ {
return $this->outputDir; return $this->outputDir;
} }
@ -272,7 +283,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setOutputDir(string $outputDir) public
function setOutputDir(string $outputDir)
{ {
$this->outputDir = $outputDir; $this->outputDir = $outputDir;
} }
@ -283,7 +295,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function getFileName() : string public
function getFileName() : string
{ {
return $this->fileName; return $this->fileName;
} }
@ -296,7 +309,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setFileName(string $fileName) public
function setFileName(string $fileName)
{ {
$this->fileName = $fileName; $this->fileName = $fileName;
} }
@ -309,7 +323,8 @@ class UploadFile
* @since 1.0.0 * @since 1.0.0
* @author Dennis Eichhorn <d.eichhorn@oms.com> * @author Dennis Eichhorn <d.eichhorn@oms.com>
*/ */
public function setPreserveFileName(bool $preserveFileName) public
function setPreserveFileName(bool $preserveFileName)
{ {
$this->preserveFileName = $preserveFileName; $this->preserveFileName = $preserveFileName;
} }

5
Models/UploadStatus.php
View File

@ -37,6 +37,7 @@ abstract class UploadStatus extends Enum
const UNKNOWN_ERROR = -4; const UNKNOWN_ERROR = -4;
const CONFIG_SIZE = -5; const CONFIG_SIZE = -5;
const WRONG_EXTENSION = -6; const WRONG_EXTENSION = -6;
const NOT_MOVABLE = -7; const NOT_UPLOADED = -7;
const FAILED_HASHING = -8; const NOT_MOVABLE = -8;
const FAILED_HASHING = -9;
} }

115
ModuleMedia.js
View File

@ -1,115 +0,0 @@
(function (jsOMS, undefined) {
jsOMS.Modules.Models.Media = typeof jsOMS.Modules.Models.Media == 'undefined' ? {} : jsOMS.Modules.Models.Media;
jsOMS.Modules.Models.Media.Upload = function (responseManager) {
this.responseManager = responseManager;
this.success = [];
this.uri = '';
this.allowedTypes = [];
this.maxFileSize = 0;
this.files = [];
};
jsOMS.Modules.Models.Media.Upload.prototype.setSuccess = function (id, callback) {
this.success[id] = callback;
};
jsOMS.Modules.Models.Media.Upload.prototype.setUri = function (uri) {
this.uri = uri;
};
jsOMS.Modules.Models.Media.Upload.prototype.setAllowedTypes = function (allowed) {
this.allowedTypes = allowed;
};
jsOMS.Modules.Models.Media.Upload.prototype.addAllowedType = function (allowed) {
this.allowedTypes.push(allowed);
};
jsOMS.Modules.Models.Media.Upload.prototype.setMaxFileSize = function (size) {
this.maxFileSize = size;
};
jsOMS.Modules.Models.Media.Upload.prototype.addFile = function (file) {
this.files.push(file);
};
jsOMS.Modules.Models.Media.Upload.prototype.upload = function (formId) {
// TODO: validate file type + file size
var request = new jsOMS.Message.Request.Request(),
formData = new FormData(),
self = this;
this.files.forEach(function (element, index) {
formData.append('file' + index, element);
});
request.setData(formData);
request.setType('raw');
request.setUri(this.uri);
request.setMethod('POST');
request.setRequestHeader('HTTP_X_REQUESTED_WITH', 'XMLHttpRequest');
request.setSuccess(function (xhr) {
console.log(xhr); // TODO: remove this is for error checking
var o = JSON.parse(xhr.response),
response = Object.keys(o).map(function (k) {
return o[k];
});
console.log(response);
for (var k = 0; k < response.length; k++) {
if (response[k] !== null) {
if (!self.success[formId]) {
self.responseManager.execute(response[k].type, response[k]);
} else {
self.success[formId](response[k].type, response[k]);
}
}
}
});
request.send();
};
}(window.jsOMS = window.jsOMS || {}));
(function (jsOMS, undefined) {
jsOMS.Modules.Media = function (app) {
this.app = app;
};
jsOMS.Modules.Media.prototype.bind = function () {
var forms = document.getElementsByTagName('form');
/* Handle media forms */
for (var c = 0; c < forms.length; c++) {
var self = this;
this.app.uiManager.getFormManager().injectSubmit(forms[c].id, function (e) {
var fileFields = e.querySelectorAll('input[type=file]'),
uploader = new jsOMS.Modules.Models.Media.Upload(self.app.responseManager);
uploader.setSuccess(e.id, function (type, response) {
e.querySelector('input[type=file]+input[type=hidden]').value = JSON.stringify(response.uploads);
var data = self.app.uiManager.getFormManager().getData(e);
self.app.uiManager.getFormManager().submit(e, data);
});
uploader.setUri('http://127.0.0.1/en/api/media');
for (var i = 0; i < fileFields.length; i++) {
for (var j = 0; j < fileFields[i].files.length; j++) {
uploader.addFile(fileFields[i].files[j]);
}
}
uploader.upload(e.id);
});
}
}
}(window.jsOMS = window.jsOMS || {}));
jsOMS.ready(function () {
window.omsApp.moduleManager.get('Media').bind();
});