aboutsummaryrefslogtreecommitdiff
path: root/gn2/wqflask/templates/gn_editor.html
blob: 60a73b1ff4cada91288c9f3324dbd3fa690cff4a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
{% extends "base.html" %}
{% block title %}Genenetwork Files Editor {% endblock %}

{% block css %}
<style>

</style>
{% endblock %}
{% block search %}{% endblock %}
{% block content %}
<section class="container-fluid">
    <header class="row">
<nav class="navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#"><strong>GN Editor<strong></a>
    </div>
    <div >
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Commit</a></li>
	<li><a href="#">Refresh</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Settings <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>           
          </ul>
        </li>
      </ul>
    </div>
  </div>
</nav>
    
    </header>

    <div>
      <div class="row">
	<section class="col-sm-6" id="editor" style="height:100vh">

	</section>
	<section class="col-sm-6">
	  <div class="row">
	    <section class="col-sm-10 col-sm-offset-1">
	      	  Tristique nulla aliquet enim tortor, at auctor urna nunc id cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam ultrices sagittis orci, a scelerisque! Laoreet suspendisse interdum consectetur libero.
	    </section>
	  </div>

	</section>
      </div>      
    </div>    
</section>

{% endblock %}

{% block js %}
<script src="{{ url_for('js', filename='jquery/jquery.min.js') }}" type="text/javascript"></script>

<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='jquery-ui/jquery-ui.min.js') }}"></script>

<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='htmx.min.js') }}"></script>

 
<script src="//ajaxorg.github.io/ace-builds/src-min-noconflict/ace.js"></script>

<script type="text/javascript">

 document.addEventListener('DOMContentLoaded', function() {
     $('footer').hide()
  var editor_configurations = {
  selectionStyle: 'line',// "line"|"text"
  highlightActiveLine: true, // boolean
  highlightSelectedWord: true, // boolean
  readOnly: false, // boolean: true if read only
  cursorStyle: 'ace', // "ace"|"slim"|"smooth"|"wide"
  mergeUndoDeltas: true, // false|true|"always"
  behavioursEnabled: true, // boolean: true if enable custom behaviours
  wrapBehavioursEnabled: true, // boolean
  autoScrollEditorIntoView: undefined, // boolean: this is needed if editor is inside scrollable 
  keyboardHandler: null, // function: handle custom keyboard events
  
  // renderer options
  animatedScroll: false, // boolean: true if scroll should be animated
  displayIndentGuides: false, // boolean: true if the indent should be shown. See 'showInvisibles'
  showInvisibles: false, // boolean -> displayIndentGuides: true if show the invisible tabs/spaces in indents
  showPrintMargin: true, // boolean: true if show the vertical print margin
  printMarginColumn: 80, // number: number of columns for vertical print margin
  printMargin: undefined, // boolean | number: showPrintMargin | printMarginColumn
  showGutter: true, // boolean: true if show line gutter
  fadeFoldWidgets: false, // boolean: true if the fold lines should be faded
  showFoldWidgets: true, // boolean: true if the fold lines should be shown ?
  showLineNumbers: true,
  highlightGutterLine: false, // boolean: true if the gutter line should be highlighted
  hScrollBarAlwaysVisible: false, // boolean: true if the horizontal scroll bar should be shown regardless
  vScrollBarAlwaysVisible: false, // boolean: true if the vertical scroll bar should be shown regardless
  fontSize: 16, // number | string: set the font size to this many pixels
  fontFamily: undefined, // string: set the font-family css value
  maxLines: undefined, // number: set the maximum lines possible. This will make the editor height changes
  minLines: undefined, // number: set the minimum lines possible. This will make the editor height changes
  maxPixelHeight: 0, // number -> maxLines: set the maximum height in pixel, when 'maxLines' is defined. 
  scrollPastEnd: 0, // number -> !maxLines: if positive, user can scroll pass the last line and go n * editorHeight more distance 
  fixedWidthGutter: false, // boolean: true if the gutter should be fixed width
  theme: "ace/theme/dracula", // theme string from ace/theme or custom?

  // mouseHandler options
  scrollSpeed: 2, // number: the scroll speed index
  dragDelay: 0, // number: the drag delay before drag starts. it's 150ms for mac by default 
  dragEnabled: true, // boolean: enable dragging
  focusTimout: 0, // number: the focus delay before focus starts.
  tooltipFollowsMouse: true, // boolean: true if the gutter tooltip should follow mouse

  // session options
  firstLineNumber: 1, // number: the line number in first line
  overwrite: false, // boolean
  newLineMode: 'auto', // "auto" | "unix" | "windows"
  useWorker: true, // boolean: true if use web worker for loading scripts
  useSoftTabs: true, // boolean: true if we want to use spaces than tabs
  tabSize: 4, // number
  wrap: true, // boolean | string | number: true/'free' means wrap instead of horizontal scroll, false/'off' means horizontal scroll instead of wrap, and number means number of column before wrap. -1 means wrap at print margin
  indentedSoftWrap: true, // boolean
  foldStyle: 'markbegin', // enum: 'manual'/'markbegin'/'markbeginend'.
  mode: 'ace/mode/markdown'  	 
}

var editor = ace.edit("editor");
editor.setOptions(editor_configurations);
editor.container.style.resize = "horizontal"; 
 });


 
  
</script>
{% endblock %}