Sindbad~EG File Manager
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item p-2">
<button type="button" class="nav-link nav_btn_gray" value="1" onclick="jump_step(1)" aria-selected="true">Step 1</button>
</li>
<li class="nav-item p-2">
<button type="button" class="nav-link active" value="2">Step 2</button>
</li>
<li class="nav-item p-2">
<button type="button" class="nav-link nav_btn_gray" value="3" onclick="{% if data.cur_step >= 2 %}jump_step(3){% endif %}">Step 3</button>
</li>
<li class="nav-item p-2">
<button type="button" class="nav-link nav_btn_gray" value="4" onclick="{% if data.cur_step >= 3 %}jump_step(4){% endif %}">Step 4</button>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active p-2 rounded" role="tabpanel">
<form action="{{url_for('main.StepPost_2',abs_type=abs_type,conf_id=conf_id,conf_key=conf_key)}}" id="form_s2" method="POST">
<div class="row ">
<div class="col">
<label class=""><b>Title of the Video (not exceeding 150 characters)</b> <span class="text-danger">*</span> <span id="chars" class="text-primary" ></span><span id="chars_text" style="color: blue;"></span></label>
<textarea name="title" id="title" class="form-control" placeholder="Title " value="">{{data.title or ''}}</textarea>
</div>
</div>
<br />
<div class="row ">
<div class="col">
<label class=""><b>Synopsis (not exceeding 1000 characters) </b> <span class="text-danger">*</span> <span id="chars1" class="text-primary" ></span><span id="chars1_text" style="color: blue;"></span><br><br><span class="text-danger mt-2">Do not mention any Institution/Hospital/Organistion names or any authors name in the text otherwise rejected automatically.</span></label>
<textarea name="synopsis" id="synopsis" class="form-control" cols="80" rows="5" placeholder="Synopsis " value="">{{data.synopsis or ''}}</textarea>
</div>
</div> <br>
<!-- <label><b>Upload your Image / Video</b></label> -->
<div class="row " {% if not img %} id="video_div" {% endif %}>
<div class="col-md-6 offset-md-3 mb-4" id="video_upload">
<div class="card text-white text-center user_attach_card mb-3" >
<div class="card-header">Video<br>[Format : MP4 ]<br>Duration: 4
mins only<br>Size of video : 500 MB<br></div>
<div class="card-body">
{% if img : %}
{% set img=img[0] %}
{% endif %}
{% if img.path : %}
{% set image_display = "block" %}
{% else %}
{% set image_display = "none" %}
{% endif %}
<div id="show_img" style="display:{{ image_display }}" >
{% if img.path : %}
{% set src= img.path+img.file_name %}
{% set img_hide = "block" %}
{% else %}
{% set src= "" %}
{% endif %}
<video id="video_file" width="100%" height="auto" controls autoplay controlsList="nodownload">
<source id="video" src="{{ src}}" type="video/mp4">
</video>
</div>
<div class="progress" style="display:none;">
<div class="progress-bar " max="100" value="0"> </div>
</div>
<button type="button" style="display:none;" class="progress_btn btn btn-danger" id="cancel_upload">Cancel Upload</button>
<div class="btn btn-primary btn-block file-field-video my-2 " id="file-field-video">
<span>
{% if src=="" %}
Click here to upload Video
{% else %}
Click here to change Video
{% endif %}
</span>
<input type="file" class="d-none" id="addVideosInput" accept=" video/*" onchange="uploadFile()">
</div>
<button type="button" value="{{img.upload_id}}" name="delete" style="display: {{ image_display }}" id="delete" class="btn btn-danger btn-block photo_delete form-input" />Delete</button>
<div class=" btn btn-primary file-field-vide1 btn-block" style="display:none;"></div>
</div>
</div>
</div>
</div>
<div class="row py-2">
<div class="col">
<input type="button" name="Previous" id="Previous" class="btn btn-primary" value="Previous" onclick="move(2,0)" />
</div>
<div class="col">
<input type="button" name="next" id="next" class="btn btn-primary float-right" value="Next" onclick="move(2,1)" />
</div>
</div>
<input type="hidden" name="user_id" id="user_id" value="{{user_id}}" />
<input type="hidden" name="abs_id" id="abs_id" value="{{Cryptography.decrypt(abs_id)}}" />
<input type="hidden" name="cur_step" id="cur_step" value="{{ data.cur_step or 0 }}">
<input type="hidden" name="abs_type" id="abs_type" value="{{data.abs_type}}" />
<input type="hidden" name="step" id="step" value="2" />
<input type="hidden" name="is_next" id="is_next" value="1" />
<input type="hidden" name="file_name" id="file_name" {% if img.file_name %}value="{{img.file_name}}"{% endif %}>
</form>
</div>
{% block script %}
<script src="https://cdn.jsdelivr.net/npm/aws-sdk/dist/aws-sdk.min.js"></script>
<script type="text/javascript">
var policy = '';
var signature = '';
var AWSAccessKeyId = '';
var AWSSecretKey = '';
$(document).ready(function () {
var $title = $("#title");
var $synopsis = $("#synopsis");
var $chars = $("#chars");
var $chars1 = $("#chars1");
var x150 = 150;
var x1000 = 1000;
$chars.html (x150 + " characters remaining");
$chars1.html (x1000 + " characters remaining");
$title.on("keyup", countChar);
$synopsis.on("keyup", countChar2);
countChar();
function countChar() {
var textLength = $title.val().length;
var textRemaining = x150 - textLength;
if (textRemaining < 0) {
$chars.attr("class", "text-danger ml-2");
var textRemaining1 = -textRemaining;
$chars.html(textRemaining + " characters exceeded");
} else {
$chars.attr("class", "text-primary ml-2");
$chars.html(textRemaining + " characters remaining");
}
}
function countChar2() {
var textLength = $synopsis.val().length;
var textRemaining = x1000 - textLength;
if (textRemaining < 0) {
$chars1.attr("class", "text-danger ml-2");
var textRemaining1 = -textRemaining;
$chars1.html(textRemaining + " characters exceeded");
} else {
$chars1.attr("class", "text-primary ml-2");
$chars1.html(textRemaining + " characters remaining");
}
}
});
$( ".file-field-video" ).on( "click", function()
{
$(this).find('input[type="file"]')[0].click()
});
var conf_id=$("#conf_id").val();
var conf_key=$("#conf_key").val();
var oneMB = 1048576
var abs_id = $("#abs_id").val();
// var user_id=$("#user_id").val();
// alert(abs_id)
// function uploaduservideo() {
// // alert($('#addVideosInput').val())
// var ext = $('#addVideosInput').val().split('.').pop().toLowerCase();
// // alert(ext)
// if($.inArray(ext, ['mp4']) == -1)
// {
// alert('Invalid file type');
// }
// else if($('#addVideosInput')[0].files[0].size > (oneMB*200))
// {
// alert('File Must less than 200MB');
// }
// else
// {
// // alert("koooo")
// var fd = new FormData();
// var user_profile = $('#addVideosInput')[0].files[0];
// var file_name = $('#addVideosInput').val().split('\\').pop();
// fd.append('file',user_profile);
// fd.append('key','abs_uploads'+ conf_key + abs_type + abs_id)
// fd.append('AWSAccessKeyId',AWSAccessKeyId);
// fd.append('acl','public-read');
// fd.append('policy',policy);
// fd.append('signature',signature);
// console.log(fd)
// var description=$("#description").val();
// var title=$("#title").val();
// $("#show_img").show();
// $("#delete").show();
// $(".progress").show();
// $(".progress_btn").show();
// $('.file-field-vide1').show()
// $('.file-field-video').hide()
// $('.file-field-vide1').html('Uploading ....');
// // ShowProgress();
// ajaxcall = $.ajax({
// xhr: function() {
// var xhr = new window.XMLHttpRequest();
// xhr.upload.addEventListener("progress", function(evt) {
// if (evt.lengthComputable) {
// var percentComplete = evt.loaded / evt.total;
// percentComplete = parseInt(percentComplete * 100);
// // console.log(percentComplete);
// $('.progress-bar').css({'width':percentComplete+'%'});
// $('.progress-bar').html(percentComplete+'%');
// if (percentComplete === 100) {
// // $('.progress-bar').html('');
// $("#cancel_upload").hide();
// $('.file-field-vide1').html('Please Wait <i class="fa-solid fa-ellipsis fa-beat-fade"></i>');
// }
// }
// }, false);
// return xhr;
// },
// type: 'POST',
// // url: BaseUrl +"/img_upload/"+abs_id+"/"+abs_type+"/"+conf_id+"/"+conf_key,
// url:'https://aios-app.s3-ap-southeast-1.amazonaws.com/',
// data: fd,
// contentType: false,
// processData: false,
// cache: false,
// dataType: 'json',
// }).done(function(data, jqXHR) {
// console.log("respose")
// console.log(data)
// $("#video_file").attr("src",data["path"]+data["file_name"])
// $('.file-field-vide1').html('Successfully Uploaded');
// $(".progress").hide();
// $(".progress_btn").hide();
// setTimeout(function() {
// $('.file-field-vide1').hide()
// $('.file-field-video').show()
// },3000)
// }).fail(function(data) {
// // StopProgress();
// $(".progress_btn").hide();
// $(".progress").hide();
// });
// }
// }
$("#video_submit").click(function(){
var conf_id=$("#conf_id").val();
var conf_key=$("#conf_key").val();
var title=$("#title").val();
var synopsis=$("#synopsis").val();
var user_id=$("#user_id").val();
var abs_id=$("#abs_id").val();
$.ajax({
type:'POST',
url:BaseUrl+"/"+conf_id+"/"+conf_key+"/abstract_ajax_insert",
data:{'user_id':user_id,'abs_id':abs_id,'title':title,'synopsis':synopsis},
success:function(reposnse){
var data_1=JSON.parse(reposnse);
var msg = data_1.msg;
if (msg=='success'){
$("#video_submit_div").hide();
$("#video_div").show();
$("#next_btn").show();
}
}
});
});
function uploadFile() {
// alert("calling aws sdk js ")
var abs_id = $("#abs_id").val();
var conf_key = $("#conf_key").val();
const file = $('#addVideosInput')[0].files[0];
var ext = $('#addVideosInput').val().split('.').pop().toLowerCase();
if (!file) {
alert('Please select a file to upload.');
}
// alert(ext)
else if($.inArray(ext, ['mp4']) == -1)
{
alert('Invalid file type');
}
else if($('#addVideosInput')[0].files[0].size > (oneMB*500))
{
alert('File Must less than 500MB');
}
else {
$('.file-field-vide1').show()
$('.file-field-video').hide()
$(".photo_delete").hide();
$('.file-field-vide1').html('Uploading ....');
var filename=file.name;
var file_name=filename.replace(/\s/g, '_');
// alert(file_name)
$("#file_name").val(file_name)
// return false
const bucketName = 'common-application';
const key = 'abs_uploads'+'/'+conf_key +'/'+ abs_type +'/'+ abs_id+'/'+file_name; // Set the key (path) for the file in the bucket
// alert(key)
AWS.config.update({
accessKeyId: "AKIAIVJULUNYWYOTNLAQ",
secretAccessKey: "G9kEjx+3MfwYSPxupwRISUNDRecBAaqVhYKfFZp3",
region: 'ap-southeast-1', // e.g., us-east-1
});
const s3 = new AWS.S3();
const params = {
Bucket: bucketName,
Key: key,
Body: file,
ACL: 'public-read', // Adjust the ACL as needed
};
s3.upload(params, (err, data) => {
if (err) {
alert('Error uploading file:', err)
console.error('Error uploading file:', err);
} else {
// console.log('https//'data.)
console.log('File uploaded successfully:', data.Location);
$("#show_img").show()
$("#video_file").attr("src",data.Location)
$('.file-field-vide1').html('Successfully Uploaded');
$(".progress").hide();
$(".progress_btn").hide();
$(".photo_delete").show();
upload_video_file()
setTimeout(function() {
$('.file-field-vide1').hide()
$('.file-field-video').show()
},3000)
// You can perform additional actions after successful upload
}
});
}
}
function upload_video_file() {
var abs_id = $("#abs_id").val();
var conf_id = $("#conf_id").val();
var conf_key = $("#conf_key").val();
var abs_type=$("#abs_type").val();
var file_name=$("#file_name").val();
$.ajax({
type: "POST",
url: BaseUrl +"/save_upload_details/"+abs_id+"/"+abs_type+"/"+ conf_id + "/" + conf_key,
data: { 'file_name': file_name },
dataType: "json",
success: function (data) {
$("#delete").val(data['max'])
},
});
return false;
}
$(".photo_delete").click(function(){
var upload_id=$(this).val();
var path='abs_uploads'+'/'+conf_key +'/'+ abs_type +'/'+ abs_id;
var file_name=$("#file_name").val();
// alert(file_name)
// return false;
$.ajax({
type: "POST",
url: BaseUrl + "/delete_file",
data: {
'upload_id': upload_id,
'path': path,
'file_name':file_name
},
// dataType: "html",
success: function (data) {
$("#video_file").hide()
$('.file-field-vide1').html('Click here to upload Video');
$(".photo_delete").hide();
},
});
});
</script>
{% endblock %}
</div>
Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists