Chrisj

I'm trying to determine why when I select Upload, on the html page I see a message "My extension is:" only, instead of My extension is: webM" for example.Here's the code, I look forward to any assistance: <?php foreach (array('video', 'audio') as $type) { if (isset($_FILES["${type}-blob"])) { $fileName = $_POST["${type}-filename"]; $uploadDirectory = 'uploads/' . $fileName; // make sure that one can upload only allowed audio/video files $allowed = array( 'webm', 'wav', 'mp4', 'mov' ); $extension = pathinfo($filePath, PATHINFO_EXTENSION); die("My extension is: " . $extension); if (!$extension || empty($extension) || !in_array($extension, $allowed)) { echo 'Invalid file extension: '.$extension; return; } if (!move_uploaded_file($_FILES["${type}-blob"]["tmp_name"], $uploadDirectory)) { echo (" problem moving uploaded file"); } } } ?>

Than ks for your reply. Can you give me an example of logging a relevant variable or value pertaining to the code I've provided?

Thanks you for your example. I tried this, ran the script, but nothing appeared in the console log: if(isMyOwnDomain()) { console.log("upload-to-server"); recordingDIV.querySelector('#upload-to-server').disabled = true; recordingDIV.querySelector('#upload-to-server').style.display = 'none'; } any additional guidance is welcomed

Can you show me an example of "console.log at relevant location"?

Thanks for your reply. Regarding executing, I'm not sure, any guidance is appreciated.

Thanks for all of your previous help. <button id="btn-start-recording">Start <br/>Recording</button> <button id="btn-stop-recording" disabled>Stop <br/>Recording</button> <button id="reset" onclick="resetCamera()">Reset <br/>Camera</button> <button id="upload-to-server">Upload Recording</button> <button id="save-to-disk">Save To Disk</button> <button id="open-new-tab">Open New Tab</button> I am testing this code, where a video is recorded, started, stopped & replayed successfully. However, I don’t have the upload part correct. Nothing happens upon selecting the upload button, and no issues in Console. var video = document.querySelector('video'); var recordingDIV = document.querySelector('.recordrtc'); function captureCamera(callback) { navigator.mediaDevices.getUserMedia({ audio: true, video: true }).then(function(camera) { callback(camera); }).catch(function(error) { alert('Unable to capture your camera. Please check console logs.'); console.error(error); }); } function stopRecordingCallback() { video.src = video.srcObject = null; video.muted = false; video.volume = 1; video.src = URL.createObjectURL(recorder.getBlob()); recorder.camera.stop(); recorder.destroy(); recorder = null; } var recorder; // globally accessible document.getElementById('btn-start-recording').onclick = function() { this.disabled = true; captureCamera(function(camera) { video.muted = true; video.volume = 0; video.srcObject = camera; recorder = RecordRTC(camera, { type: 'video' }); recorder.startRecording(); // release camera on stopRecording recorder.camera = camera; document.getElementById('btn-stop-recording').disabled = false; }); }; document.getElementById('btn-stop-recording').onclick = function() { this.disabled = true; recorder.stopRecording(stopRecordingCallback); }; /////////////////////////////////////////////////// //Reset the Camera function resetCamera(){ location.reload(); } ///////////////////////////////////////////////////////// var MY_DOMAIN = 'a.domain-name.com'; function isMyOwnDomain() { // replace "webrtc-experiment.com" with your own domain name return document.domain.indexOf(MY_DOMAIN) !== -1; } function saveToDiskOrOpenNewTab(recordRTC) { recordingDIV.querySelector('#save-to-disk').parentNode.style.display = 'block'; recordingDIV.querySelector('#save-to-disk').onclick = function() { if(!recordRTC) return alert('No recording found.'); recordRTC.save(); }; recordingDIV.querySelector('#open-new-tab').onclick = function() { if(!recordRTC) return alert('No recording found.'); window.open(recordRTC.toURL()); }; if(isMyOwnDomain()) { recordingDIV.querySelector('#upload-to-server').disabled = true; recordingDIV.querySelector('#upload-to-server').style.display = 'none'; } else { recordingDIV.querySelector('#upload-to-server').disabled = false; } recordingDIV.querySelector('#upload-to-server').onclick = function() { if(isMyOwnDomain()) { alert('PHP Upload is not available on this domain.'); return; } if(!recordRTC) return alert('No recording found.'); this.disabled = true; var button = this; uploadToServer(recordRTC, function(progress, fileURL) { if(progress === 'ended') { button.disabled = false; button.innerHTML = 'Click to download from server'; button.onclick = function() { window.open(fileURL); }; return; } button.innerHTML = progress; }); }; } var listOfFilesUploaded = []; function uploadToServer(recordRTC, callback) { var blob = recordRTC instanceof Blob ? recordRTC : recordRTC.blob; var fileType = blob.type.split('/')[0] || 'audio'; var fileName = (Math.random() * 1000).toString().replace('.', ''); if (fileType === 'audio') { fileName += '.' + (!!navigator.mozGetUserMedia ? 'ogg' : 'wav'); } else { fileName += '.webm'; } // create FormData var formData = new FormData(); formData.append(fileType + '-filename', fileName); formData.append(fileType + '-blob', blob); callback('Uploading ' + fileType + ' recording to server.'); // var upload_url = 'https://your-domain.com/files-uploader/'; var upload_url = 'save.php'; // var upload_directory = upload_url; var upload_directory = 'uploads/'; makeXMLHttpRequest(upload_url, formData, function(progress) { if (progress !== 'upload-ended') { callback(progress); return; } callback('ended', upload_directory + fileName); // to make sure we can delete as soon as visitor leaves listOfFilesUploaded.push(upload_directory + fileName); }); } function makeXMLHttpRequest(url, data, callback) { var request = new XMLHttpRequest(); request.onreadystatechange = function() { if (request.readyState == 4 && request.status == 200) { callback('upload-ended'); } }; request.upload.onloadstart = function() { callback('Upload started...'); }; request.upload.onprogress = function(event) { callback('Upload Progress ' + Math.round(event.loaded / event.total * 100) + "%"); }; request.upload.onload = function() { callback('progress-about-to-end'); }; request.upload.onload = function() { callback('progress-ended'); }; request.upload.onerror = function(error) { callback('Failed to upload to server'); console.error('XMLHttpRequest failed', error); }; request.upload.onabort = function(error) { callback('Upload aborted.'); console.error('XMLHttpRequest aborted', error); }; request.open('POST', url); request.send(data); } window.onbeforeunload = function() { recordingDIV.querySelector('button').disabled = false; recordingMedia.disabled = false; mediaContainerFormat.disabled = false; if(!listOfFilesUploaded.length) return; var delete_url = 'https://webrtcweb.com/f/delete.php'; // var delete_url = 'RecordRTC-to-PHP/delete.php'; listOfFilesUploaded.forEach(function(fileURL) { var request = new XMLHttpRequest(); request.onreadystatechange = function() { if (request.readyState == 4 && request.status == 200) { if(this.responseText === ' problem deleting files.') { alert('Failed to delete ' + fileURL + ' from the server.'); return; } listOfFilesUploaded = []; alert('You can leave now. Your files are removed from the server.'); } }; request.open('POST', delete_url); var formData = new FormData(); formData.append('delete-file', fileURL.split('/').pop()); request.send(formData); }); return 'Please wait few seconds before your recordings are deleted from the server.'; }; Any assistance is appreciated.

When this code, on an html page, is viewed, via mobile device, you can tap the screen and the mobile device recording full screen successfully appears: <form> ---- <input type="file" name="Upload" id="fileToUpload" accept="video/*" capture="user" onchange="submitForm();"> <input type="submit" value="Upload" name="submit" id="go" style="display: none;"/> ---- </form> how/what can I add so that the less than the full screen appears?

Thanks for your reply/advice. Much appreciated. Isn't this open source: https://gist.github.com/daemonsy/61a7f05bf6dbe23444076af93c582815 If so, how can I use it without making API calls to cameratag.com?

When I access this link: https://www.cameratag.com/demo#camera I see this: "This camera was created with the single line of code below:" <camera id='DemoCamera' data-app-id='63f9c870-72c4-0130-04c5-123139045d73'></camera> I understand that the js that is being used there is open source from here: https://gist.github.com/daemonsy/61a7f05bf6dbe23444076af93c582815 So, I've downloaded that js and added a script link to that javascript on my html page. But, I'm not sure where the camera id (DemoCamera) is referenced and don't know much about the data-app-id. If I use this, am I using that company's code, or is that open source too: <camera id='DemoCamera' data-app-id='63f9c870-72c4-0130-04c5-123139045d73'></camera> I don't see DemoCamera or the data-app-id anywhere in the js or css. I look forward to being enlightened/help. Thanx

On an html page, it uses this code: accept="video/*" in this context: <input type="file" name="fileToUpload" id="fileToUpload" accept="video/*" capture="user" onchange="submitForm();"> and when you view the page via mobile, and tap the page, your video camera screen appears. I'm looking to see if it's possible to add scrolling text across the page/video-camera-screen ? I look forward to any comments/suggestions.

Viewing a php/html web page, that I have, from a mobile phone, a visitor can tap the page and their video screen appears and they can then proceed to record and submit a video recording, successfully. But, I'm wondering if the accept="video/*" code is outdated and should be somehow replaced with 'getUserMedia' code. If so, is it a direct replacement or do I need other tweaks on this existing line: <input type="file" name="fileToUpload" id="fileToUpload" accept="video/*" capture="user" onchange="submitForm();"> I look forward to all comments/suggestions, thanks

Thank you for your reply. Regarding " What precisely is it that you do and don't do when the page works and does not work", when the page is loaded and the screen doesn't appear, so I refresh the page and the jitsi Start meeting box appears at this location on the web page: <div id="meeting"></div> and I proceed. that is the only way it appears. Without a refresh the "meeting" just appears with this style: #meeting{ background-color: #000; width: 500px; height: 400px; margin: 0 auto; } just a black box. Is there a solution to have the jitsi Start meeting to appear without refreshing the page? The jitsi handbook states: "The API object constructor uses the following options: height: ...... width: ........ etc. onload: The IFrame onload event handler. etc.... I was trying (unsuccessfully) to use the onload: option to have the Start meeting appear without refreshing the page (by trying to add a 'click'). Any ideas/suggestions.guidance with getting the jitsi meeting Start to appear without refreshing the page, is welcomed

I have placed this jitsi script on a web page: <script src='https://meet.jit.si/external_api.js'></script> <div id="meeting"></div> <script> const options = { parentNode: document.querySelector('#meeting'), width: "100%", height: "100%", }; meetAPI = new JitsiMeetExternalAPI("meet.jit.si", options); </script> but the jitsi screen only appears after I refresh the page. I see in the jitsi handbook, it has an onload: option: https://jitsi.github.io/handbook/docs/dev-guide/dev-guide-iframe So I have tried (unsucessfully) to modify the code to allow the web page visitor to 'click' to get the jitsi screen to appear, using this code: <button id="meeting" onclick="button()"></button> <script> const options = { parentNode: document.querySelector('#meeting'), width: "100%", height: "100%", onload: function button() { document.getElementById('#meeting').click(); } }; meetAPI = new JitsiMeetExternalAPI("meet.jit.si", options); </script> any help/guidance with either getting the screen to appear without refresh or successfully having the screen appear upon 'click' is appreciated.

Use it how/where, please

Thanks for your reply. I mean "a properly formatted email address (user@domain.com)"

I am using this a modal window(jBox) - with a web Form in it, that requires the Form (just Name & Email) to be completed and Submitted in order to close the modal window - allowing access to the main page. The Form uses this corresponding ../submit.php which this: if (empty($_POST['name'])|| empty($_POST['email'])){ $response['success'] = false; } else { $response['success'] = true; } echo json_encode($response); where, upon Form > submit, successfully shows 'error' if the Form fields are not populated, and 'success' when the Form fields are populated/submitted. I'd like the Form to require a proper/valid email address and avoid spam and header injection (maybe honeypot protection and implement a form of rate limiting (a single ip may not send more than x messages per day)). Any assistance/guidance is appreciated

The goal it to close the jBox upon success and not close it upon Error. Which I believe needs validation from the submit.php to successfully close the Form/jBox. I attempted adding this call back validation code ( everything above if($_POST) ) in the submit.php file, without success: <?php header('Content-type: application/json'); $errors = array(); $data = array(); if (empty($_POST['name'])) $errors['name'] = 'Name is required.'; if (empty($_POST['email'])) $errors['email'] = 'Email is required.'; if ( ! empty($errors)) { $data['success'] = false; $data['errors'] = $errors; } echo json_encode($data); if($_POST){ $to = 'chrisj....@hotmail.com'; $subject = 'Thank You'; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; $message1 = $_POST['message']; $headers = $name; $headers = 'from: support@web-site-name.com'; $message1 .= "\r\n\r\nName: ".$_POST['name']." \r\n Email: ".$_POST['email']." "; $message = "Hello {$_POST['name']}, ~ Thank you\r\n\r\n"; mail( $to, $subject, $message1, $headers ); mail( $email, $subject, $message, $headers ); //header('Location: https://web-site-name.com'); exit; } ?> And I have the .js: var myConfirm; $(document).ready(function() { myConfirm = new jBox('Confirm', { content: $('.my-jbox-form'), width: 830, height: 205, cancelButton: 'Return Home', confirmButton: 'Continue', closeOnConfirm: false, closeOnEsc: false, confirm: function() { $.ajax({ url: 'https://...../submit.php', method: 'post', data: { name: $('#name').val(), email: $('#email').val() }, success: function (response) { console.log(response); if (response.success) { alert('Success'); } else { alert('Error'); } } }); And I’ve tried to add: myConfirm.close(); into the .js code, but not sure where is the best place to put it. After excuting the Form, still get a dialog box, on the Form page, that shows “web-site-name.com says Error”, yet the Form’s field info gets sent successfully. And after Form submit, in the dev tools > Console it only shows one line, [ ] upload.html:78 And, of course, the Form (jBox) doesn’t close. Any additional guidance/suggestions with call back and validation, and close() is appreciated.

Ok, I have removed his code and am back to this: <?php if($_POST){ $to = 'chrisj...@.....com'; $subject = 'Thank you for your info'; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; $message1 = $_POST['message']; $headers = $name; $headers = 'from: info@.....com'; $message1 .= "\r\n\r\nName: ".$_POST['name']." \r\n Email: ".$_POST['email']." "; $message = "Hello {$_POST['name']}, ~ Thank you for your input\r\n\r\n"; mail( $to, $subject, $message1, $headers ); mail( $email, $subject, $message, $headers ); header('Location: https://....'); exit; } ?> and this: var myConfirm; $(document).ready(function() { myConfirm = new jBox('Confirm', { content: $('.my-jbox-form'), width: 830, height: 205, cancelButton: 'Return Home', confirmButton: 'Continue', closeOnConfirm: false, closeOnEsc: false, confirm: function() { $.ajax({ url: 'https://...../submit.php', method: 'post', data: { name: $('#name').val(), email: $('#email').val() }, success: function (response) { console.log(response); if (response.success) { alert('Success'); } else { alert('Error'); } } }); I look forward to any guidance with adding "validate the input and then send some response back".

Thanks for your reply. I don't know the answer to your question, it was provided to me, in this thread, by Strider64. Any clarification/resolution will be welcomed.

Thanks for your reply, yes I have considered that - this section: function errorOutput($output, $code = 500) { http_response_code($code); echo json_encode($output); } but I'm not sure what with that or what to do next - any suggestion/solution is appreciated

Thank you for your reply. I now have this: <?php /* Makes it so we don't have to decode the json coming from javascript */ header('Content-type: application/json'); /* Grab decoded incomming data from Ajax */ $incomming = $_POST['data']; $data['outgoing'] = 'stop'; if ( $incomming === 'proceed') { $data['outgoing'] = "send"; } if ( $data['outgoing'] === 'send') { output($data); } else { errorOutput('error'); } /* Something went wrong, send error back to Ajax / Javascript */ function errorOutput($output, $code = 500) { http_response_code($code); echo json_encode($output); } /* * If everything validates OK then send success message to Ajax / Javascript */ function output($output) { http_response_code(200); echo json_encode($output); } if($_POST){ $to = 'chrisj...@.....com'; $subject = 'Thank you for your info'; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; $message1 = $_POST['message']; $headers = $name; $headers = 'from: info@.....com'; $message1 .= "\r\n\r\nName: ".$_POST['name']." \r\n Email: ".$_POST['email']." "; $message = "Hello {$_POST['name']}, ~ Thank you for your input\r\n\r\n"; mail( $to, $subject, $message1, $headers ); mail( $email, $subject, $message, $headers ); header('Location: https://....'); exit; } ?> But I am now seeing this Error Code in the Console: jquery.min.js:6 POST https://web-site-name/submit.php 500 Any additional assistance with resolving this error is appreciated

I have this php file that processes Form field entries. Apparently I need to modify it, I'm told, to "validate the input and then send some response back": <?php if($_POST){ $to = 'chrisj...@.....com'; $subject = 'Thank you for your info'; $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; $message1 = $_POST['message']; $headers = $name; $headers = 'from: info@.....com'; $message1 .= "\r\n\r\nName: ".$_POST['name']." \r\n Email: ".$_POST['email']." "; $message = "Hello {$_POST['name']}, ~ Thank you for your input\r\n\r\n"; mail( $to, $subject, $message1, $headers ); mail( $email, $subject, $message, $headers ); header('Location: https://....'); exit; } ?> The corresponding js looks like this: $.ajax({ url: 'https://...../submit.php', method: 'post', data: { name: $('#name').val(), email: $('#email').val() }, success: function (response) { console.log(response); if (response.success) { alert('Success'); } else { alert('Error'); } } }); I look forward to any guidance with adding "validate the input and then send some response back".

There are several db tables ( phpmyadmin ) working with the web php script that I’m using (but did not write). The ‘user’ table has many fields, but pertaining to purchases it has these fields: ‘ip_address’ ‘username’ ‘wallet’ and ‘balance’. The ‘paid_videos’ table has these fields: id_user, video_play_price, id_video, user_id_uploaded, video_title, earned_amount, time_date, short_id, session_key video_id, time. The ‘transact’ table has these fields: username, id_user, amount, balance, wallet, wal_bal, user_id_uploaded, earned_amount, time_date. When a purchase is made a single row is populated in the ‘paid videos’ table and a single row is populated in the ‘transact’ table. Additional info: when a purchase is made, an amount of 50% of the price (‘earned_amount’) appears in uploader’s (user_id_uploaded) ‘earned_amount’ field, and gets added to the uploader’s ‘balance’ field. And that amount is also reflected in ‘amount’ by a negative number, and reduces the purchaser’s ‘wallet’ or ‘balance’ by that same amount. Also, wal_bal is total of wallet and balance. I am looking for comments/suggestions for improvement. And/or besides improvement, what am I missing?

Thanks for your reply. However, I have looked and wouldn't have posted if I could see the problem. I'm hoping another set of eyes might see what I don't. Any additional assistance is welcomed.

the php web video script that I'm trying to modify allows Users to purchase videos successfully, however, the video price that is reflected in the db ('u_paid_videos') table (where transaction info is stored) appears to show the default video price (video_play_price from the 'config' db table) every time, instead of the accurate video price. I'm not sure if this code needs to be tweaked so that the actual price will show in the 'video_play_price' column (in 'u_paid_videos' table): // get cost video // get the default video price, to use if there is no per video play price $db->where('name', 'video_play_price'); $db_cost = $db->getOne('config'); $video_cost = (float)$db_cost->value; // the number of submitted videos - used to determine if all records were inserted $count_video = count($id_array); $user_id = $user->id; $wallet = (float)str_replace(',', '', $user->wallet); $balance = (float)str_replace(',', '', $user->balance); // add up the video prices $amount = 0; foreach ($id_array as $id) { $video_id = (int)PT_Secure($id); // get video data $video = $db->where('id', $id)->getOne(T_VIDEOS); // add the video play price if any, or the default price $amount += $video->video_play_price?$video->video_play_price:$video_cost; } // determine if the user has enough credits if( ($wallet >= $amount) OR ($balance + $wallet >= $amount) ) { $db->startTransaction(); $inserted_records = 0; foreach ($id_array as $id){ $video_id = (int)PT_Secure($id); // get video data $video = $db->where('id', $id)->getOne(T_VIDEOS); // use the video play price if any, or the default price $video_cost_new = $video->video_play_price?$video->video_play_price:$video_cost; $uploader_amount = $video_cost_new *0.50; // add data to paid table $insert_buy = $db->insert('u_paid_videos', [ 'id_user' => $user_id, 'id_video' => $video_id, 'session_key' => $_SESSION['session_key'], 'video_play_price' => (string)$video_cost, 'video_title' => $video->title, 'user_id_uploaded' => $video->user_id, 'earned_amount' => $uploader_amount ]);