amins1369
یک شنبه 25 بهمن 1394, 09:54 صبح
با سلام و درود
چند مدتی هست دنبال شبه کد php می گردم همراه جاوا یا jquery
که موقعه در سایت فیلم اپلود می کنیم همراه با اپلود فیلم یه عکس از ابتدای فیلم هم درپوشه دیگر اپلود شود
من یه نمونه سورس پیدا کردن که در html5 می تونیم ریز عکس از فایل ویدیوی بگریم که خودم نتونستم تریسش کنم
لطفا در این ضمینه حداقل کمک کنید
نمونه کد
https://gist.github.com/adamjimenez/5917897/revisions
و نمونه کد دیگر که با زدن دکمه یه canvas از فیلم رو نمایش می دهد
<script>
var videoId = 'video';
var scaleFactor = 0.25;
var snapshots = [];
/**
* Captures a image frame from the provided video element.
*
* @param {Video} video HTML5 video element from where the image frame will be captured.
* @param {Number} scaleFactor Factor to scale the canvas element that will be return. This is an optional parameter.
*
* @return {Canvas}
*/
function capture(video, scaleFactor) {
var w = video.videoWidth * scaleFactor;
var h = video.videoHeight * scaleFactor;
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;
var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, w, h);
return canvas;
}
/**
* Invokes the <code>capture</code> function and attaches the canvas element to the DOM.
*/
function shoot(){
var video = document.getElementById(videoId);
var output = document.getElementById('output');
var canvas = capture(video, scaleFactor);
canvas.onclick = function(){
window.open(this.toDataURL());
};
snapshots.unshift(canvas);
output.innerHTML = '';
for(var i=0; i<10; i++){
output.appendChild(snapshots[i]);
}
}
</script>
</head>
<body>
<div style="border: solid 1px #ccc; padding: 10px; text-align: center;">
<video id="video" width="320" controls="true" style="display: none">
<source src="1%20(2).mp4">
<source src="2.mp4"><!-- WebKit -->
Your browser does not support HTML5 video tag. Please download FireFox 3.5 or higher.
</video>
<</video>
<br/>
<button onclick="shoot()" style="width: 64px;border: solid 2px #ccc;">Capture</button><br/>
<div id="output" style="display: inline-block; top: 4px; position: relative ;border: dotted 1px #ccc; padding: 2px;"></div>
</div>
لطفا دوستان برنامه نویس کمک کنید
با تشکر
چند مدتی هست دنبال شبه کد php می گردم همراه جاوا یا jquery
که موقعه در سایت فیلم اپلود می کنیم همراه با اپلود فیلم یه عکس از ابتدای فیلم هم درپوشه دیگر اپلود شود
من یه نمونه سورس پیدا کردن که در html5 می تونیم ریز عکس از فایل ویدیوی بگریم که خودم نتونستم تریسش کنم
لطفا در این ضمینه حداقل کمک کنید
نمونه کد
https://gist.github.com/adamjimenez/5917897/revisions
و نمونه کد دیگر که با زدن دکمه یه canvas از فیلم رو نمایش می دهد
<script>
var videoId = 'video';
var scaleFactor = 0.25;
var snapshots = [];
/**
* Captures a image frame from the provided video element.
*
* @param {Video} video HTML5 video element from where the image frame will be captured.
* @param {Number} scaleFactor Factor to scale the canvas element that will be return. This is an optional parameter.
*
* @return {Canvas}
*/
function capture(video, scaleFactor) {
var w = video.videoWidth * scaleFactor;
var h = video.videoHeight * scaleFactor;
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;
var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, w, h);
return canvas;
}
/**
* Invokes the <code>capture</code> function and attaches the canvas element to the DOM.
*/
function shoot(){
var video = document.getElementById(videoId);
var output = document.getElementById('output');
var canvas = capture(video, scaleFactor);
canvas.onclick = function(){
window.open(this.toDataURL());
};
snapshots.unshift(canvas);
output.innerHTML = '';
for(var i=0; i<10; i++){
output.appendChild(snapshots[i]);
}
}
</script>
</head>
<body>
<div style="border: solid 1px #ccc; padding: 10px; text-align: center;">
<video id="video" width="320" controls="true" style="display: none">
<source src="1%20(2).mp4">
<source src="2.mp4"><!-- WebKit -->
Your browser does not support HTML5 video tag. Please download FireFox 3.5 or higher.
</video>
<</video>
<br/>
<button onclick="shoot()" style="width: 64px;border: solid 2px #ccc;">Capture</button><br/>
<div id="output" style="display: inline-block; top: 4px; position: relative ;border: dotted 1px #ccc; padding: 2px;"></div>
</div>
لطفا دوستان برنامه نویس کمک کنید
با تشکر