Skip to content

P
Profile Manager
Commit ae8de68c authored by Ehsan Fakhraie's avatar Ehsan Fakhraie
Browse files
Options

Two Methods for Video Upload Generated 

1:tus
2:normal
parent 1d0662f2
Expand all Show whitespace changes
Inline Side-by-side
Showing with 18586 additions and 151 deletions
.gitignore 0 → 100644
View file @ ae8de68c
/node_modules/
.idea/workspace.xml
View file @ ae8de68c
This diff is collapsed.
demos/browser/demo.css 0 → 100644
View file @ ae8de68c
body {
padding-top: 40px;
}
.progress {
height: 32px;
}
a.btn {
margin-bottom: 2px;
}
demos/browser/demo.js 0 → 100644
View file @ ae8de68c
/* global tus */
/* eslint no-console: 0 */
"use strict";
var upload = null;
var uploadIsRunning = false;
var toggleBtn = document.querySelector("#toggle-btn");
var resumeCheckbox = document.querySelector("#resume");
var input = document.querySelector("input[type=file]");
var progress = document.querySelector(".progress");
var progressBar = progress.querySelector(".bar");
var alertBox = document.querySelector("#support-alert");
var uploadList = document.querySelector("#upload-list");
var chunkInput = document.querySelector("#chunksize");
var endpointInput = document.querySelector("#endpoint");
var channelId = "9708bdf6-a4a1-4807-a212-f6c994d7d975";
var authorization = "Apikey a8c3c9f1-4313-43ef-a4b0-fbd343b21302";
if (!tus.isSupported) {
alertBox.classList.remove("hidden");
}
if (!toggleBtn) {
throw new Error("Toggle button not found on this page. Aborting upload-demo. ");
}
toggleBtn.addEventListener("click", function (e) {
e.preventDefault();
if (upload) {
if (uploadIsRunning) {
upload.abort();
toggleBtn.textContent = "resume upload";
uploadIsRunning = false;
} else {
upload.start();
toggleBtn.textContent = "pause upload";
uploadIsRunning = true;
}
} else {
if (input.files.length > 0) {
startUpload();
} else {
input.click();
}
}
});
input.addEventListener("change", startUpload);
function startUpload() {
var file = input.files[0];
// Only continue if a file has actually been selected.
// IE will trigger a change event even if we reset the input element
// using reset() and we do not want to blow up later.
if (!file) {
return;
}
var endpoint = endpointInput.value;
var chunkSize = parseInt(chunkInput.value, 10);
if (isNaN(chunkSize)) {
chunkSize = Infinity;
}
toggleBtn.textContent = "pause upload";
let optionss = {
"url": `https://napi.arvancloud.com/vod/2.0/channels/${channelId}/files`,
"authorization": `${authorization}`,
"acceptLanguage": "en",
"uuid": file.name + file.size + file.lastModified
};
var options = {
resume: true,
chunkSize: chunkSize,
endpoint: optionss.url,
retryDelays: [0, 500, 1000, 1500, 2000, 2500],
headers: {
'Authorization': optionss.authorization,
'Accept-Language': optionss.acceptLanguage
},
uploadDataDuringCreation: true,
metadata: {
filename: file.name,
filetype: file.type
},
onError : function (error) {
if (error.originalRequest) {
if (window.confirm("Failed because: " + error + "\nDo you want to retry?")) {
upload.start();
uploadIsRunning = true;
return;
}
} else {
window.alert("Failed because: " + error);
}
reset();
},
onProgress: function (bytesUploaded, bytesTotal) {
var percentage = (bytesUploaded / bytesTotal * 100).toFixed(2);
progressBar.style.width = percentage + "%";
console.log(bytesUploaded, bytesTotal, percentage + "%");
},
onSuccess: function () {
var anchor = document.createElement("a");
anchor.textContent = "Download " + upload.file.name + " (" + upload.file.size + " bytes)";
anchor.href = upload.url;
anchor.className = "btn btn-success";
uploadList.appendChild(anchor);
reset();
}
};
upload = new tus.Upload(file, options);
upload.start();
uploadIsRunning = true;
}
function reset() {
input.value = "";
toggleBtn.textContent = "start upload";
upload = null;
uploadIsRunning = false;
}
demos/browser/index.html 0 → 100644
View file @ ae8de68c
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>tus-js-client demo - File Upload</title>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet" />
<link href="./demo.css" rel="stylesheet" media="screen" />
</head>
<body>
<div class="container">
<h1>tus-js-client demo - File Upload</h1>
<p>
This demo shows the basic functionality of the tus protocol. You can select a file using the controls below and start/pause the upload as you wish.
</p>
<p>
For a prettier demo please go to the
<a href="http://tus.io/demo.html">tus.io</a> website.
This demo is just here to aid developers.
</p>
<p>
A demo where a video is recorded from your webcam while being simultaneously uploaded, can be found <a href="./video.html">here</a>.
</p>
<div class="alert alert-warining hidden" id="support-alert">
<b>Warning!</b> Your browser does not seem to support the features necessary to run tus-js-client. The buttons below may work but probably will fail silently.
</div>
<br />
<table>
<tr>
<td>
<label for="endpoint">
Upload endpoint:
</label>
</td>
<td>
<input type="text" id="endpoint" name="endpoint" value="https://master.tus.io/files/">
</td>
</tr>
<tr>
<td>
<label for="chunksize">
Chunk size (bytes):
</label>
</td>
<td>
<input type="number" id="chunksize" name="chunksize">
</td>
</tr>
<tr>
<td>
<label for="resume">
Perform full upload:
<br />
<small>(even if we could resume)</small>
</label>
</td>
<td>
<input type="checkbox" id="resume">
</td>
</tr>
</table>
<br />
<input type="file">
<br />
<br />
<div class="row">
<div class="span8">
<div class="progress progress-striped progress-success">
<div class="bar" style="width: 0%;"></div>
</div>
</div>
<div class="span4">
<button class="btn stop" id="toggle-btn">start upload</button>
</div>
</div>
<hr />
<h3>Uploads</h3>
<p id="upload-list">
Succesful uploads will be listed here. Try one!
</p>
</div>
</body>
<script src="../../dist/tus.js"></script>
<script src="./demo.js"></script>
</html>
dist/tus.js 0 → 100644
View file @ ae8de68c
This diff is collapsed.
dist/tus.js.map 0 → 100644
View file @ ae8de68c
This diff is collapsed.
dist/tus.min.js 0 → 100644
View file @ ae8de68c
This diff is collapsed.
dist/tus.min.js.map 0 → 100644
View file @ ae8de68c
This source diff could not be displayed because it is too large. You can view the blob instead.
package-lock.json 0 → 100644
View file @ ae8de68c
{
"name": "profile-manager",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"blueimp-canvas-to-blob": {
"version": "3.17.0",
"resolved": "https://registry.npmjs.org/blueimp-canvas-to-blob/-/blueimp-canvas-to-blob-3.17.0.tgz",
"integrity": "sha512-LcuVZZtKtE4yUrLb0IQA7ndMm19gooDTrzvjjkvmQ1MhkFlSzTw+8Ftp+/ckfGeP2UDQvDsPyy8mIT69itAqbg==",
"optional": true
},
"blueimp-file-upload": {
"version": "10.7.0",
"resolved": "https://registry.npmjs.org/blueimp-file-upload/-/blueimp-file-upload-10.7.0.tgz",
"integrity": "sha512-mzJdtePtnKasTOwrgBB3lRsN33UnVg/N5VV2An0b6acF80+ooiH6IvbR8oQJMl7niyKuYyUUZSk7bTJ1TKUiCQ==",
"requires": {
"blueimp-canvas-to-blob": "3",
"blueimp-load-image": "2",
"blueimp-tmpl": "3"
}
},
"blueimp-load-image": {
"version": "2.26.0",
"resolved": "https://registry.npmjs.org/blueimp-load-image/-/blueimp-load-image-2.26.0.tgz",
"integrity": "sha512-pL7SYdK9ZxBFmFiEoh91PIYccU9IzytQ8goIUgc+5RW6vYVyvpGRUltefceeoNyLARbF8QXiYimHp6kgjZ/IBg==",
"optional": true
},
"blueimp-tmpl": {
"version": "3.13.0",
"resolved": "https://registry.npmjs.org/blueimp-tmpl/-/blueimp-tmpl-3.13.0.tgz",
"integrity": "sha512-TC5eLXhPGGgBJG1gGxKRORB5DMxSVSTS/GsqsQuJ+shv0Ez5wc9bjoXVhPqtdbzVZAzFvveasAMrjqEYY/18Og==",
"optional": true
},
"buffer-from": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-0.1.2.tgz",
"integrity": "sha512-RiWIenusJsmI2KcvqQABB83tLxCByE3upSP8QU3rJDMVFGPWLvPQJt/O1Su9moRWeH7d+Q2HYb68f6+v+tw2vg=="
},
"combine-errors": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/combine-errors/-/combine-errors-3.0.3.tgz",
"integrity": "sha1-9N9nQAg+VwOjGBEQwrEFUfAD2oY=",
"requires": {
"custom-error-instance": "2.1.1",
"lodash.uniqby": "4.5.0"
}
},
"custom-error-instance": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/custom-error-instance/-/custom-error-instance-2.1.1.tgz",
"integrity": "sha1-PPY5FIemYppiR+sMoM4ACBt+Nho="
},
"extend": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
"integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
},
"fine-uploader": {
"version": "5.16.2",
"resolved": "https://registry.npmjs.org/fine-uploader/-/fine-uploader-5.16.2.tgz",
"integrity": "sha1-DYeNoc0nU/gGg6wJHfXa/5/7jEQ="
},
"graceful-fs": {
"version": "4.2.3",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.3.tgz",
"integrity": "sha512-a30VEBm4PEdx1dRB7MFK7BejejvCvBronbLjht+sHuGYj8PHs7M/5Z+rt5lw551vZ7yfTCj4Vuyy3mSJytDWRQ=="
},
"js-base64": {
"version": "2.5.1",
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.5.1.tgz",
"integrity": "sha512-M7kLczedRMYX4L8Mdh4MzyAMM9O5osx+4FcOQuTvr3A9F2D9S5JXheN0ewNbrvK2UatkTRhL5ejGmGSjNMiZuw=="
},
"lodash._baseiteratee": {
"version": "4.7.0",
"resolved": "https://registry.npmjs.org/lodash._baseiteratee/-/lodash._baseiteratee-4.7.0.tgz",
"integrity": "sha1-NKm1VDVycnw9sueO2uPA6eZr0QI=",
"requires": {
"lodash._stringtopath": "~4.8.0"
}
},
"lodash._basetostring": {
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-4.12.0.tgz",
"integrity": "sha1-kyfJ3FFYhmt/pLnUL0Y45XZt2d8="
},
"lodash._baseuniq": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash._baseuniq/-/lodash._baseuniq-4.6.0.tgz",
"integrity": "sha1-DrtE5FaBSveQXGIS+iybLVG4Qeg=",
"requires": {
"lodash._createset": "~4.0.0",
"lodash._root": "~3.0.0"
}
},
"lodash._createset": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/lodash._createset/-/lodash._createset-4.0.3.tgz",
"integrity": "sha1-D0ZZ+7CddRlPqeK4imZE02PJ/iY="
},
"lodash._root": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
"integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI="
},
"lodash._stringtopath": {
"version": "4.8.0",
"resolved": "https://registry.npmjs.org/lodash._stringtopath/-/lodash._stringtopath-4.8.0.tgz",
"integrity": "sha1-lBvPDmQmbl/B1m/tCmlZVExXaCQ=",
"requires": {
"lodash._basetostring": "~4.12.0"
}
},
"lodash.throttle": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
"integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
},
"lodash.uniqby": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniqby/-/lodash.uniqby-4.5.0.tgz",
"integrity": "sha1-o6F7v2LutiQPSRhG6XwcTipeHiE=",
"requires": {
"lodash._baseiteratee": "~4.7.0",
"lodash._baseuniq": "~4.6.0"
}
},
"proper-lockfile": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/proper-lockfile/-/proper-lockfile-2.0.1.tgz",
"integrity": "sha1-FZ+wYZPTIAP0s2kd0uwaY0qoDR0=",
"requires": {
"graceful-fs": "^4.1.2",
"retry": "^0.10.0"
}
},
"querystringify": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
"integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA=="
},
"requires-port": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
"integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
},
"retry": {
"version": "0.10.1",
"resolved": "https://registry.npmjs.org/retry/-/retry-0.10.1.tgz",
"integrity": "sha1-52OI0heZLCUnUCQdPTlW/tmNj/Q="
},
"tus-js-client": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/tus-js-client/-/tus-js-client-1.8.0.tgz",
"integrity": "sha512-qPX3TywqzxocTxUZtcS8X7Aik72SVMa0jKi4hWyfvRV+s9raVzzYGaP4MoJGaF0yOgm2+b6jXaVEHogxcJ8LGw==",
"requires": {
"buffer-from": "^0.1.1",
"combine-errors": "^3.0.3",
"extend": "^3.0.2",
"js-base64": "^2.4.9",
"lodash.throttle": "^4.1.1",
"proper-lockfile": "^2.0.1",
"url-parse": "^1.4.3"
}
},
"url-parse": {
"version": "1.4.7",
"resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz",
"integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==",
"requires": {
"querystringify": "^2.1.1",
"requires-port": "^1.0.0"
}
}
}
}
package.json 0 → 100644
View file @ ae8de68c
{
"name": "profile-manager",
"version": "1.0.0",
"dependencies": {
"blueimp-file-upload": "^10.7.0",
"fine-uploader": "^5.16.2",
"tus-js-client": "^1.8.0"
}
}
s.html 0 → 100644
View file @ ae8de68c
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Tus File Upload Sample</title>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="dist/tus.js"></script>
</head>
<body>
<div>
<form>
<div>
<h3>Upload process will be started immediately after you choose a file.</h4>
<h5>You can see the progress on browser's console</h6>
<input type="file">
</div>
</form>
</div>
<script>
$(document).ready(function () {
$('input[type="file"]').change(function (e) {
let file = e.target.files[0]
let channelId = "9708bdf6-a4a1-4807-a212-f6c994d7d975";
let authorization = "Apikey a8c3c9f1-4313-43ef-a4b0-fbd343b21302";
let options = {
"url": `https://napi.arvancloud.com/vod/2.0/channels/${channelId}/files`,
"authorization": `${authorization}`,
"acceptLanguage": "en",
"uuid": file.name + file.size + file.lastModified
}
let upload = new tus.Upload(file, {
fingerprint: () => {
return options.uuid
},
resume: true,
chunkSize: 1048576, // 1MB
endpoint: options.url,
retryDelays: [0, 500, 1000, 1500, 2000, 2500],
headers: {
'Authorization': options.authorization,
'Accept-Language': options.acceptLanguage
},
metadata: {
filename: file.name,
filetype: file.type
},
onError: function (error) {
console.log("Failed because: " + error)
},
onProgress: function (bytesUploaded, bytesTotal) {
var percentage = (bytesUploaded / bytesTotal * 100).toFixed(2)
console.log(bytesUploaded, bytesTotal, percentage + "%")
},
onSuccess: function () {
console.log("Download %s from %s", upload.file.name, upload.url)
}
});
upload.start()
});
});
</script>
</body>
</html>
\ No newline at end of file
videoTest/dropzone.js 0 → 100644
View file @ ae8de68c
This diff is collapsed.
videoTest/index.html 0 → 100644
View file @ ae8de68c
<!DOCTYPE>
<html lang="fa">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
</head>
<body>
<form id="myForm" action="upload.php" method="post">
<input type="file" name="myfile">
<input type="submit" value="Submit"/>
</form>
<div class="progress">
<div class="bar"></div>
<div class="percent">0%</div>
</div>
<h2>HTML5 File Upload Progress Bar Tutorial</h2>
<form id="upload_form" enctype="multipart/form-data" method="post">
<input type="file" name="myfile" id="file1" onchange="uploadFile()"><br>
<progress id="progressBar" value="0" max="100" style="width:300px;"></progress>
<h3 id="status"></h3>
<h3 id="type"></h3>
<p id="loaded_n_total"></p>
</form>
<script>
function _(el) {
return document.getElementById(el);
}
function getExtension(filename) {
var parts = filename.split('.');
return parts[parts.length - 1];
}
function isVideo(filename) {
var ext = getExtension(filename);
switch (ext.toLowerCase()) {
case 'm4v':
case 'avi':
case 'mpg':
case 'mp4':
return true;
}
return false;
}
function uploadFile() {
var file = _("file1").files[0];
// alert(file.name+" | "+file.size+" | "+file.type);
var error="";
if(file.size>=100000000){
error+="حجم فایل نامناسب است"
}
if(!isVideo(file.name)){
error+="نوع فایل باید ویدیو باشد."
}
if(error!==""){
_("status").innerHTML=error;
}else{
var formdata = new FormData();
formdata.append("myfile", file);
var ajax = new XMLHttpRequest();
ajax.upload.addEventListener("progress", progressHandler, false);
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("error", errorHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "upload.php"); // http://www.developphp.com/video/JavaScript/File-Upload-Progress-Bar-Meter-Tutorial-Ajax-PHP
//use file_upload_parser.php from above url
ajax.send(formdata);
}
}
function progressHandler(event) {
_("loaded_n_total").innerHTML = "Uploaded " + event.loaded + " bytes of " + event.total;
var percent = (event.loaded / event.total) * 100;
_("progressBar").value = Math.round(percent);
_("status").innerHTML = Math.round(percent) + "% uploaded... please wait";
}
function completeHandler(event) {
_("status").innerHTML = event.target.responseText;
_("progressBar").value = 0; //wil clear progress bar after successful upload
_("progressBar").style.display="none";
}
function errorHandler(event) {
_("status").innerHTML = "Upload Failed";
}
function abortHandler(event) {
_("status").innerHTML = "Upload Aborted";
}
</script>
</body>
</html>
\ No newline at end of file
videoTest/jquery-3.4.1.js 0 → 100644
View file @ ae8de68c
This diff is collapsed.
videoTest/jquery.form.js 0 → 100644
View file @ ae8de68c
This diff is collapsed.
videoTest/upload.php 0 → 100644
View file @ ae8de68c
<?php
///*
//Server-side PHP file upload code for HTML5 File Drag & Drop demonstration
//Featured on SitePoint.com
//Developed by Craig Buckler (@craigbuckler) of OptimalWorks.net
//*/
$fn = (isset($_SERVER['HTTP_X_FILENAME']) ? $_SERVER['HTTP_X_FILENAME'] : false);
if ($fn) {
// AJAX call
file_put_contents(
'uploads/' . $fn,
file_get_contents('php://input')
);
echo "$fn uploaded";
exit();
}
else {
// form submit
$files = $_FILES['myfile'];
$fn = $files['name'];
move_uploaded_file(
$files['tmp_name'],
'uploads/' . $fn
);
echo "<p>File $fn uploaded.</p>";
}
//
//$xhr = $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
//if (!$xhr)
// echo '<textarea>';
//?>
<!---->
<!--// main content of response here-->
<!---->
<?php
//if (!$xhr)
// echo '</textarea>';
//?>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment