projecthandler/template/project/osm/descriptor/descriptor_new.html

   1 {% extends "descriptor/descriptor_view_base.html" %}
   2
   3 {% load staticfiles %}
   4
   5
   6 {% block title_header_big %}
   7 {{ block.super }}
   8 Onboard new {{ descriptor_type }} package
   9 {% endblock %}
  10
  11 {% block left_sidebar %}
  12 {% include 'osm/osm_project_left_sidebar.html' %}
  13 {% endblock %}
  14
  15 {% block breadcrumb_body %}
  16 {{ block.super }}
  17 <li><a href="{% url 'projects:open_project' project_id=project_id %}">{{project_overview_data.name}}</a></li>
  18 <li><a href="{% url 'projects:open_project' project_id=project_id %}descriptors/{{descriptor_type}}">{{ descriptor_type }}  Descriptors</a></li>
  19 <li>Create Descriptor</li>
  20 {% endblock %}
  21
  22 {% block tab_pane_button_list %}
  23 {{ block.super }}
  24 <li id="file_li" class="active"><a href="#upload" data-toggle="tab"><i class="fa fa-upload"></i> Onboard Package</a></li>
  25 {% endblock %}
  26
  27 {% block nav_buttons_list %}
  28 {{ block.super }}
  29 <li class="pull-right">
  30     <button id="cancel" type="button" class="btn btn-block btn-primary btn-sm" onclick="cancel(this.id)"><i
  31             class="fa fa-times"></i> Cancel
  32     </button>
  33 </li>
  34 {% endblock %}
  35
  36 {% block tab_pane_list %}
  37 {{ block.super }}
  38
  39 <div class="tab-pane active" id="upload">
  40
  41     <h4>Drag and drop file below</h4>
  42     <div class="upload-drop-zone" id="drop-zone">
  43             Just drag and drop files here
  44     </div>
  45 </div>
  46 {% endblock %}
  47
  48
  49 {% block resource_block %}
  50 {{ block.super }}
  51
  52 <script>
  53     var descr_list_url = '{% url "projects:list_descriptors"  project_id=project_id descriptor_type=descriptor_type%}'
  54
  55     var dropZone = document.getElementById('drop-zone');
  56     dropZone.ondrop = function(e) {
  57         e.preventDefault();
  58         this.className = 'upload-drop-zone';
  59         create(e.dataTransfer.files, true);
  60     }
  61
  62     dropZone.ondragover = function() {
  63         this.className = 'upload-drop-zone drop';
  64         return false;
  65     }
  66
  67     dropZone.ondragleave = function() {
  68         this.className = 'upload-drop-zone';
  69         return false;
  70     }
  71
  72
  73
  74
  75         function create(fs, dropzone){
  76             var id = $('.nav-tabs .active').attr('id');
  77             if (dropzone) id = 'file_li'
  78             var type, text ;
  79             var data = new FormData();
  80             switch(id) {
  81
  82                 case 'file_li':
  83                     type = 'file'
  84
  85                     var files = dropzone ? fs : document.getElementById('js-upload-files').files;
  86                     if (!files || !files.length) {
  87                       files = document.getElementById('drop-zone').files
  88                       if(!files || !files.length){
  89                         alert("Seletc a file")
  90                         return
  91                       }
  92                     }
  93                     console.log(files[0])
  94                     var patt1 = /\.([0-9a-z]+)(?:[\?#]|$)/i;
  95                     console.log(files[0].name.match(patt1));
  96                     var extension = files[0].name.substr(files[0].name.lastIndexOf('.') + 1)
  97                     console.log(extension)
  98                     if(!(extension == 'gz' )){
  99                         alert("The file must be .tar.gz");
 100                         return
 101                     }
 102
 103                      data.append('file', files[0]);
 104                     break;
 105             }
 106             data.append('csrfmiddlewaretoken','{{csrf_token}}');
 107             data.append('type', type);
 108             data.append('text', text);
 109             data.append('id', '{{descriptor_id}}');
 110             console.log(text);
 111             $.ajax({
 112                     url: "new",
 113                     type: 'POST',
 114                     data: data,
 115                     cache: false,
 116                     contentType: false,
 117                     processData: false,
 118                     success: function(result) {
 119                         console.log(result)
 120
 121                         window.location.href=descr_list_url
 122
 123                     },
 124                     error: function(result) {
 125                         showAlert(result);
 126                     }
 127                 });
 128         }
 129
 130     function cancel(id){
 131         window.location.href= descr_list_url
 132     }
 133
 134
 135
 136 </script>
 137 {% endblock %}
 138
 139 {% block footer %}
 140     {% include "footer.html" %}
 141 {% endblock %}