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

   1 {% extends "descriptor/descriptor_view_base.html" %}
   2
   3 {% load staticfiles %}
   4
   5
   6 {% block title_header_big %}
   7 {{ block.super }}
   8 Edit {{ descriptor_type|upper }} Descriptor
   9 {% endblock %}
  10
  11
  12 {% block left_sidebar %}
  13 {% include 'osm/osm_project_left_sidebar.html' %}
  14 {% endblock %}
  15
  16 {% block breadcrumb_body %}
  17 {{ block.super }}
  18 <li><a href="{% url 'projects:open_project' %}">{{project_id}}</a></li>
  19 <li><a href="{% url 'projects:list_descriptors' descriptor_type=descriptor_type %}">{{ descriptor_type }} Descriptors</a></li>
  20 <li><a>{{descriptor_id}}</a></li>
  21 {% endblock %}
  22
  23 {% block tab_pane_button_list %}
  24 {{ block.super }}
  25 <li class="active" id="yaml_li"><a href="#yaml" data-toggle="tab"><i class="fa fa-file-code-o"></i> YAML</a></li>
  26 <li id="json_li"><a href="#json" data-toggle="tab"><i class="fa fa-file-code-o"></i> JSON</a></li>
  27 {% endblock %}
  28
  29 {% block nav_buttons_list %}
  30     {{ block.super }}
  31     <li class="pull-right"><button id="save" type="button" class="btn btn-block btn-primary btn-sm"  onclick="update(this.id)" ><i class="fa fa-save"></i> Update</button></li>
  32     <li class="pull-right"><button id="save_show_graph" type="button" class="btn btn-block btn-primary btn-sm"  onclick="update(this.id)" disabled><i class="fa fa-save"></i> Update and Show Graph</button></li>
  33     <li class="pull-right"><button type="button" class="btn btn-block btn-primary btn-sm"  onclick="goToGraph()" disabled><i class="fa fa-sitemap"></i> Show Graph</button></li>
  34 {% endblock %}
  35
  36 {% block tab_pane_list %}
  37 {{ block.super }}
  38
  39 <!-- /.tab-pane -->
  40 <div class="active tab-pane" id="yaml">
  41     <textarea id="code_editor_yaml">
  42     </textarea>
  43 </div>
  44 <!-- /.tab-pane-->
  45
  46 <div class="tab-pane" id="json">
  47     <textarea id="code_editor_json">
  48     </textarea>
  49 </div>
  50
  51 {% endblock %}
  52
  53 {% block resource_block %}
  54 {{ block.super }}
  55
  56
  57 <script>
  58     var editorJSON;
  59     var editorYaml;
  60
  61     $(document).ready(function () {
  62         //var cmjsoneditor = CodeMirror.fromTextArea(document.getElementById("code_editor"), json_editor_settings);
  63         var myJsonTextArea = document.getElementById("code_editor_json");
  64         editorJSON = CodeMirror(function (elt) {
  65             myJsonTextArea.parentNode.replaceChild(elt, myJsonTextArea);
  66         }, json_editor_settings);
  67
  68
  69         editorJSON.setValue(JSON.stringify({{descriptor_strings.descriptor_string_json | safe}}, null, "\t"));
  70         editorJSON.setOption("autoRefresh", true);
  71         var myYamlTextArea = document.getElementById("code_editor_yaml");
  72         editorYaml = CodeMirror(function (elt) {
  73             myYamlTextArea.parentNode.replaceChild(elt, myYamlTextArea);
  74         }, yaml_editor_settings);
  75         var des_strings = {{descriptor_strings | safe}};
  76         editorYaml.setValue(des_strings.descriptor_string_yaml);
  77
  78     });
  79
  80
  81     function update(e) {
  82         var dialog = bootbox.dialog({
  83             message: '<div class="text-center"><i class="fa fa-spin fa-spinner"></i> Loading...</div>',
  84             closeButton: false
  85         });
  86
  87         var id = $('.nav-tabs .active').attr('id');
  88         var type, text;
  89         switch (id) {
  90             case 'yaml_li':
  91                 type = 'yaml';
  92                 text = editorYaml.getValue();
  93                 break;
  94             case 'json_li':
  95                 type = 'json';
  96                 text = editorJSON.getValue();
  97                 break;
  98         }
  99         $.ajax({
 100             url: "/projects/descriptors/{{descriptor_type}}/{{descriptor_id}}/",
 101             type: 'POST',
 102             dataType: 'json',
 103             data: {
 104                 'csrfmiddlewaretoken': '{{csrf_token}}',
 105                 'type': type,
 106                 'text': text
 107             },
 108             success: function (result) {
 109                 dialog.modal('hide');
 110
 111             },
 112             error: function (result) {
 113                 console.log(result);
 114                 dialog.modal('hide');
 115                 bootbox.alert(result);
 116             }
 117         });
 118     }
 119
 120 </script>
 121 {% endblock %}
 122
 123
 124 {% block footer %}
 125     {% include "footer.html"  %}
 126 {% endblock %}