Sindbad~EG File Manager

Current Path : /home/numerotech/test-abs.numerotech.com/common_abs_v2/core/templates/users/TNOA24/Q/
Upload File :
Current File : //home/numerotech/test-abs.numerotech.com/common_abs_v2/core/templates/users/TNOA24/Q/step1.html

<div class="row">
    <div class="col">
        <h4 class="alert alert-info text-center">Your team mate should be a TNOA member and a PG from the same institution</h4>
    </div>
</div>
<ul class="nav nav-tabs" id="myTab" role="tablist">
        <li class="nav-item p-2">
            <button type="button" class="nav-link active " value="1">Step 1</button>
        </li>
        <li class="nav-item p-2">
            <button type="button" class="nav-link nav_btn_gray" value="2" onclick="{% if data.cur_step >= 1 %}jump_step(2){% endif %}">Step 2</button>
        </li>
    </ul>
<div class="tab-content " id="myTabContent">
    <div class="tab-pane fade show active p-2 rounded"  role="tabpanel" >
    <form method="POST" action="{{url_for('main.Step1post',abs_id=abs_id,abs_type=abs_type,conf_id=conf_id,conf_key=conf_key)}}" id="form_s1">
        <div class="container" id="step1">
            <!-- <div class="row">
                <div class="col">
                    <h4 class="alert alert-info text-center">Your team mate should be a TNOA member and a PG from the same institution</h4>
                </div> -->
            </div>
            <div class="row">
                <div class="col form-group">
                    <label class="font-weight-bold">Membership Number</label>
                    <br />
                    <span>{{user_info.membership_no or 'Non Member'}}<input type="hidden" name="member_id" id="member_id" value="{{user_info.membership_no}}" /></span>
                </div>
                <div class="col form-group">
                    <label class="font-weight-bold"> Name</label>
                    <br />
                    <span>{{user_info.full_name or ''}}<input type="hidden" name="name" id="name" value="{{user_info.full_name}}" /></span>
                </div>
            </div>
            
           
            
            <div class="row">
                <div class="col form-group">
                    <label class="font-weight-bold">Team mate:</label>
                </div>
            </div>
            <div class="row">
                <div class="col text-center form-group" id="save_table">
                    <button type="button" class="btn btn-danger" id="Selectteammate">Click Here To Select Your Team mate</button>
                    <br />
                </div>
            </div>
            <div class="row">
                <div class="col form-group">
                    <label class="font-weight-bold">Institution Name (Not Exceeding 150 characters)<span class="text-danger">*</span></label>
                    <span id="chars" style="color: red;"></span><span id="chars_text" style="color: blue;"></span>
                </div>
            </div>
            <div class="row">
                <div class="col py-2 form-group">
                    <textarea type="text" name="title" id="title" class="form-control" value="" placeholder="Institution Name">{{ data.title or '' }}</textarea>
                </div>
            </div>
            <div class="row">
                <div class="col form-group">
                    <label class="font-weight-bold">City</b><span class="text-danger">*</span></label><br>
                    <input type="text" name="city" id="city" class="form-control" value="{{ data.misc1  or '' }}">
                </div>
                <div class="col form-group">
                    <label class="font-weight-bold">State</b><span class="text-danger">*</span></label>
                    <select name="state" id="state" class="form-control">
                        <option value="">--Select--</option>
                        <option value="Tamil Nadu">Tamil Nadu</option>
                        <option value="Pondicherry">Pondicherry</option>
                    </select>
                </div>
            </div>
            <div class="row ">
                <div class="col form-group">
                    <label class="font-weight-bold">An authorisation letter from the HOD to be uploaded:</label>
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 offset-md-4 mb-4">
                    <div class="card text-center user_attach_card mb-3">
                        <div class="card-header text-white">
                            Upload your Authorisation Letter<br />
                            [JPG , JPEG , PNG ]
                        </div>
                        <div class="card-body">
                            {% if img %}
                           {% set img = img[0] %}
                           {% endif %}
                            {% if img.file_name %} 
                                {% set image_display = "block" %} 
                            {% else %} 
                                {% set image_display = "none" %} 
                            {% endif %} 
                            <input type="hidden" name="upload_id" id="upload_id" value="{{img.upload_id}}">
                            <div id="show_img" style="display:{{ image_display }}">
                                {% if img.file_name : %} 
                                    {% set src= img.path|string +""+img.file_name|string +"?"+Helper.getcurrenttimestamp()|string %} 
                                    {% set iframe_hide = "none" %} 
                                    {% set iframe_ppt_hide = "none" %} 
                                    {% set img_hide = "none" %} 
                                    {% if ".pdf" in img.file_name :%} 
                                        {% set iframe_hide = "block" %} 
                                        <iframe src="{{ src }}" id="iframe" alt="Proof" width="100%" height="auto" allow="encrypted-media" allowfullscreenstyle="max-height: 150px;" style="max-height: 150px;display: {{ iframe_hide }}" frameborder="0" border="0" allowtransparency="true"> </iframe>
                                    
                                    {% else %} 
                                        {% set img_hide = "block" %}
                                        <img src="{{ src }}" id="img" alt="Proof" width="100%" height="auto" style="max-height: 150px;display: {{ img_hide}} " />
                                    {% endif %} 
                                {% else %} 
                                    {% set src= "" %} 
                                    
                                {% endif %}
                                <img src="" id="img" alt="Proof" width="100%" height="auto" style="max-height: 150px;display:none" />
                                <iframe src="" id="iframe" alt="Proof" width="100%" height="auto" allow="encrypted-media" allowfullscreenstyle="max-height: 150px;" style="max-height: 150px;display:none" frameborder="0" border="0" allowtransparency="true"> </iframe>
                            </div>
                            <div class="btn btn-primary btn-block file-field my-2" id="file-field">
                                <span>
                                    {% if src=="" %} Upload {% else %} Change {% endif %}
                                </span>

                                <input type="file" id="file" name="file"  onchange="uploaduser()" />
                            </div>
                            <input type="button" value="Delete" name="delete" style="display: {{ image_display }}" id="delete" class="btn btn-danger btn-block photo_delete form-input" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col float-right py-2">
                    <input type="button" name="next" id="next" class="btn btn-primary float-right" value="Next" onclick="move(1,1)" />
                </div>
            </div>
        </div>
        <div id="step2"></div>
        <input type="hidden" name="user_id" id="user_id" value="{{user_id}}" />
        <input type="hidden" name="abs_id" id="abs_id" value="{{abs_id}}" />
        <input type="hidden" name="step" id="step" value="1" />
        <input type="hidden" name="step" id="is_next" value="1" />
        <input type="hidden" name="cur_step" id="cur_step" value="{{ data.cur_step or 0 }}">
    </form>
</div>
<!-- The Modal -->
<form id="upload_form_model">
    <div class="modal" id="upload_model">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Upload your authorisation letter from the HOD</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <!-- Modal body -->
                <div class="modal-body container">
                    <div class="row">
                        <div class="col">
                            <label><b class="text-red"> Note : </b>Please upload image only in ( JPEG , JPG , PNG , TIFF ) Format and Image size Under 5MB only </label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <input type="file" name="upload_file" id="upload_file" accept="image/*" class="form-control" required />
                        </div>
                    </div>
                    <div class="row">
                        <div class="col p-4">
                            <input type="button" name="upload_img" id="upload_img" class="btn btn-success" value="Click here to Submit file" />
                        </div>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>
                <div id="searchmodel"></div>
            </div>
        </div>
    </div>
</form>
<form id="search_model">
    <div class="modal" id="searchcoinst">
        <div class="modal-dialog modal-lg">
            <div class="modal-content" style="display: table;">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Search Team mate</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <!-- Modal body -->
                <div class="modal-body container">
                    <div class="row">
                        <div class="col">
                            <label class="font-weight-bold">Type Membership No or Name or Email to search</label><br />
                            <div class="input-group">
                              <input type="text" name="searchtext" id="searchtext" class="form-control" required placeholder="Enter to search" />
                              <div class="input-group-append">
                                  <button type="button" class="btn btn-outline-secondary" name="searchbtnpa" id="searchbtnpa" type="button">
                                      Search
                                  </button>
                                  </div>
                            </div><br>
                                  <label id="searchtext-error" class="error" for="searchtext"></label>
                        </div>
                    </div>
                    <div id="searchtable"></div>
                    
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>
                <div id="searchmodel"></div>
            </div>
        </div>
    </div>
</form>

{% block script %}

<script type="text/javascript">
    var BaseUrl = document.location.origin;
    
    var conf_id = $("#conf_id").val();
    var conf_key = $("#conf_key").val();
    var abs_type = $("#abs_type").val();
    get_presenting_author();
    $(document).ready(function () {

        $( ".file-field" ).on( "click", function() 
        {

            $(this).find('input[type="file"]')[0].click()
        });
        $("#state").val("{{ data.misc2 or '' }}")
       
        $("#search_model").keypress(function(e)
        {
          if(e.which == 13)
          {
          validate_search();
            return false
          }
          return true
        });
        });


    $("#Selectteammate").click(function () {
            $("#searchcoinst").modal("show");
        });
    $("#search_model").keypress(function(e)
        {
          if(e.which == 13)
          {
            validate_search();
            return false
          }
          return true
        });
        $("#searchbtnpa").click(validate_search);
        function validate_search() {
            $("#search_model").validate({
                    rules: {
                        searchtext:{
                            normalizer: function (value) {
                    return $.trim(value);
                             },
                            required:true,
                            minlength:3,
                        }
                    },
                    messages: {
                        searchtext: {
                            required:"Please enter membership number,name,email",
                            minlength:"Please enter more than three"
                    },
                },
                });
                if($("#search_model").valid()){
                    var searchtext = $("#searchtext").val();
                      $.ajax({
                type: "GET",
                url: BaseUrl + "/searchauthor/"+abs_type+"/"+conf_id+"/"+conf_key,
                data: {
                    'searchtext': searchtext,'btn_val':"1"
                },
                dataType: "html",
                success: function (data) {
                    // alert("success")
                    // alert(data)
                    $("#searchtable").html(data);
                    return true;
                },
            });
                }
        };
        function select_Author(user_id) {
            var abs_id = $("#abs_id").val()
                $.ajax({
                    type: 'GET', 
                    url: BaseUrl + "/co_author/"+abs_type+"/"+conf_id+"/"+conf_key,
                    data: {
                        'searchvalue':user_id,
                        'abs_id':abs_id,
                        'role_id':36
                    },
                    dataType: 'html',
                    success: function(data) {
                    $("#searchcoinst").modal('hide');
                    $("#searchtable").html("");
                    getauthordata();
                    $("#searchdiv").hide();

                    }
              })
                return false;
              }
         function get_presenting_author() {
        var abs_id = $("#abs_id").val();
        $.ajax({
            type: "GET",
            url: BaseUrl + "/ppstep1getauthor/"+abs_type+"/"+conf_id+"/"+conf_key,
            data: { abs_id: abs_id },
            dataType: "html",
            success: function (data) {
                if (data == 0) {
                } else {
                    $("#save_table").html(data);
                    $("#searchdiv").hide();
                }
            },
        });
        return false;
    }
    
    var $title = $('#title');
    var $chars = $("#chars");
    // var $chars1 = $("#chars1");
    var x100 = 150;
    var chars_text  = $("#chars_text")
    chars_text.html(" characters remaining");
    $chars.css("color","red");
    $chars.html(x100);
    $title.on('keyup', countChar);
    function countChar() {
        var textLength = $title.val().length;
        var textRemaining = x100 - textLength;
        if (textRemaining < 0) {
            $chars.attr("class", "text-danger ml-2");
            var textRemaining1 = textRemaining;
            $chars.html(textRemaining1);
            chars_text.html(" characters exceeded");
            // $chars.html(textRemaining1 + " characters exceeded");
        } else {
            $chars.attr("class", "text-danger ml-2");
            chars_text.html(" characters remaining");
            $chars.html(textRemaining);
        }
    }
    
    var oneMB     = 1048576 
    var file_size = 2
            
    function uploaduser() {
        var ext = $('#file').val().split('.').pop().toLowerCase();
        var abs_id = $("#abs_id").val();
         

        if($.inArray(ext,['jpg','jpeg','png']) == -1) 
        {
            clear()
            alert('Invalid file type');
           
        }
        else if($('#file')[0].files[0].size > (oneMB*file_size))
        {
            alert('File Must less than '+file_size+' MB');
        } 
        else
        {
            
           var fd = new FormData();
           var user_profile    = $('#file')[0].files[0];
           var file_name       = $('#file').val().split('\\').pop();
           
           $("#show_img").show();
           $("#delete").show();
           fd.append('file', user_profile);
           
           ShowProgress();
           $.ajax({
             type: 'POST',
             url: BaseUrl +"/img_upload/"+abs_id+"/"+abs_type+"/"+conf_id+"/"+conf_key,
             data: fd,
             contentType: false,
             processData: false,
             cache: false,
             dataType: 'json',
           }).done(function(data, jqXHR) {
            StopProgress();
            file_extension = data.file_extension;
            // alert(data.upload_id)
            $('#upload_id').val(data.upload_id);
            if((file_extension !=".pdf")&&(file_extension != ".pptx")&&(file_extension != ".ppt")){
            $("#img").attr('src',data["path"]+data["file_name"]);
            $("#img").show();
            $("#iframe").hide();
            }
            if (file_extension ==".pdf"){
            $("#iframe").attr('src',data["path"]+data["file_name"]);
            $("#iframe").show();
            $("#img").hide();
            }
            $('#success_msg_cd').show();
            $("#success_msg_cd").html("Successfully uploaded");
            $("#file-field span").text("Change");
            setTimeout(function(){ 
               $("#success_msg_cd").hide()
              $("#success_msg_cd").css("background" ,"#ffffff" );
               $("#success_msg_cd").html('');
            }, 20000);
           }).fail(function(data) {
            StopProgress();
           });
         }
     }
    $(".photo_delete").click(function() 
    {
        var upload_id = $('#upload_id').val();
        var r         = confirm("confirm to delete!");
        var abs_id = $("#abs_id").val();
        if (r == true) 
        {
            
            $.ajax({
                type: "GET",
                url: BaseUrl +"/remove_img/"+conf_id+"/"+conf_key,
                data: {
                    'upload_id' : upload_id,
                    'abs_id'    : abs_id,
                    },
                dataType: "json",
                success: function (data) {
                StopProgress();
                // $("#Upload_btn_div").show();
                $("#show_img").hide();
                $("#delete").hide();
                $('#upload_id').val('');
                $("#file-field span").text("Upload"); 
                clear()
                return true;
              },
            });
        }
        else {}
    })

    function clear() 
    {
        $('input[type=file]').each(function() 
        {
            $(this).val('');
        });
        $('input[name=upload_id]').each(function() 
        {
            $(this).val('');
        });     
    } 

</script>
{% endblock %}

Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists