1
{% extends "base.html" %}
2
3
{% block head %}
4
  <link rel="stylesheet" href="{{url_for('static', filename='css/editor.css')}}">
5
  <title> Editing.. | {{ title }} </title>
6
{% endblock %}
7
8
{% block body %}
9
  <div class="container" id="container">
10
    <div id="header">
11
      <div id="hud">
12
        <span class="pull-right">Howdy! | <a href="{{ url_for('logout') }}">Logout</a></span>
13
      </div>
14
      <div id="notifications"></div>
15
    </div>
16
    <div id="content-container"></div>
17
    <div id="footer"></div>
18
  </div>
19
  <div id="editor-overlay"></div>
20
21
  <script>
22
    // initialize editor
23
    window.M = window.M || {};
24
    M.MenuURL = function() { return "{{ url_for('insertMenu') }}"};
25
    M.PageURL = function() { return "{{ url_for('insertPage') }}"};
26
    M.site_content = {{ content|tojson|safe }};
27
    window.onload = function() {
28
      M.editor.init();
29
    };
30
  </script>
31
{% endblock %}
32
33
{% block scripts %}
34
  <script src="{{url_for('static', filename='js/lib/tinymce/tinymce.min.js')}}"></script>
35
  <script src="{{url_for('static', filename='js/lib/tinymce/jquery.tinymce.min.js')}}"></script>
36
  <script src="{{url_for('static', filename='js/lib/ace/ace.js')}}"></script>
37
  <script src="{{url_for('static', filename='js/mouchak.js')}}"></script>
38
  <script src="{{url_for('static', filename='js/models.js')}}"></script>
39
  <script src="{{url_for('static', filename='js/views.js')}}"></script>
40
  <script src="{{url_for('static', filename='js/editor.js')}}"></script>
41
{% endblock %}
42
43
{% block templates %}
44
45
  <!-- Underscore templates -->
46
  <script type="text/template" id="menu-config-template">
47
    <div class="page">
48
      <div class="menu-config">
49
        <h4> Menu Config </h4>
50
51
        <div class="row">
52
          <div class="form-group col-lg-12" id="menu-order-wrap">
53
            <div class="input-group">
54
              <span class="input-group-addon"> <strong> Menu Order</strong></span>
55
              <input class="form-control" id="menu-order" type="text"
56
              placeholder="list,page,slugs,for,menu,order" value="<%= menu_order %>">
57
            </div>
58
            <span class="help-block">
59
              <small>csv list of page slugs to come up in the navigation menu
60
                in that order
61
              </small>
62
            </span>
63
          </div>
64
        </div>
65
66
        <div class="row">
67
          <div class="form-group col-lg-6">
68
            <div class="input-group">
69
              <span class="input-group-addon">
70
                <input id="custom-menu" type="checkbox">
71
              </span>
72
              <span class="input-group-addon"><strong>Custom Menu
73
              </strong></span>
74
            </div>
75
            <span class="help-block">
76
              <small>
77
                activate to write your own custom menu
78
              </small>
79
            </span>
80
          </div>
81
        </div>
82
83
        <div class="menu-options" style="display: none;">
84
          <div class="row">
85
            <div class="form-group col-lg-6">
86
              <div class="input-group">
87
                <span class="input-group-addon"> <strong> Position </strong></span>
88
                <input class="form-control"  id="pos" type="text" placeholder="[left, top]"
89
                value="<%= pos %>">
90
              </div>
91
            </div>
92
          </div>
93
          <div class="row">
94
            <label><strong> HTML for menu: </strong></label>
95
            <textarea class="form-control" cols="25" rows="8" id="menu"><%= menu %></textarea>
96
          </div>
97
        </div>
98
99
      </div>
100
      <div class="clearfix"></div>
101
      <div class="row">
102
        <button id="updateMenu" class="btn btn-primary pull-right"> Update </button>
103
      </div>
104
      <div class="clearfix"></div>
105
    </div>
106
  </script>
107
108
  <script type="text/template" id="page-list-template">
109
    <div id="pagelistview">
110
      <h4> List of Pages </h4>
111
      <div id="pagelist"></div>
112
      <button class="btn btn-primary" id="addPage">Add Page</button>
113
      <hr>
114
      <p> <a href="javascript:void(0);" id="menu-config"> Site Menu </a> </p>
115
      <p><a href="{{ url_for('index') }}"> Go to site </a></p>
116
    </div>
117
  </script>
118
119
  <script type="text/template" id="page-list-item-template">
120
    <div class="pagename">
121
      <a class="disp" id="<%= id %>" href="javascript:void(0);"><%= name %></a>
122
      <span class="pull-right">
123
        <a href="javascript:void(0);" class="remove" for="<%= id %>">
124
          <span class="glyphicon glyphicon-trash"></span>
125
        </a>
126
      </span>
127
      <span class="clearfix"></span>
128
    </div>
129
  </script>
130
131
  <script type="text/template" id="page-template">
132
    <div class="page">
133
      <div class="row">
134
        <h4> <%= name %> : Page Details </h4>
135
      </div>
136
      <hr/>
137
      <form class="form-horizontal">
138
        <div class="form-group">
139
          <div class="input-group">
140
            <span class="input-group-addon"> <strong> Slug </strong></span>
141
            <input class="form-control"  id="name" type="text"
142
            placeholder="slug of the page" value="<%= name %>">
143
          </div>
144
          <span class="help-block">
145
            <small>The URL part of the page, as it will appear in the URL</small>
146
          </span>
147
        </div>
148
        <div class="form-group">
149
          <strong> Content </strong>
150
          <div id="content" class="content well">
151
            <%= content %>
152
            <p></p>
153
            <button class="addContent btn btn-sm btn-primary">Add Content</button>
154
          </div>
155
        </div>
156
        <div class="form-group">
157
          <div class="input-group">
158
            <span class="input-group-addon"> <strong>Title</strong> </span>
159
            <input class="form-control"  id="title" type="text" placeholder="title of the page"
160
             value="<%= title %>">
161
          </div>
162
          <span class="help-block">
163
            <small>title of the page</small>
164
          </span>
165
        </div>
166
        <div class="form-group">
167
          <div class="input-group">
168
            <span class="input-group-addon"> <strong>Children</strong> </span>
169
            <input class="form-control"  id="children" type="text" placeholder="csv of child pages"
170
            value="<%= children %>">
171
          </div>
172
          <span class="help-block">
173
            <small> leave this blank for now</small>
174
          </span>
175
        </div>
176
        <div class="form-group">
177
          <div class="input-group">
178
              <span class="input-group-addon">
179
                <input id="showNav" type="checkbox" <%= checked %> >
180
              </span>
181
              <input class="form-control" type="text" value="Show Navigation" disabled>
182
          </div>
183
          <span class="help-block">
184
            <small>Show navigation menu in this page? </small>
185
          </span>
186
        </div>
187
        <button id="updatePage" type="submit" class="btn btn-primary pull-right"> Update </button>
188
        <div class="clearfix"></div>
189
      </form>
190
    </div>
191
  </script>
192
193
  <script type="text/template" id="content-list-template">
194
    <div class="content-item-wrapper">
195
      <span class="content-item" id="content-<%= no %>">
196
        <span class="label label-default"> <%= type %> </span>
197
        <span class="content-snippet">
198
          [ <small> <%= title %>  <%= more %> </small> ]
199
        </span>
200
      </span>
201
      <span class="pull-right">
202
        <a href="javascript:void(0);" class="remove" for="<%=no%>">
203
          <span class="glyphicon glyphicon-trash"></span>
204
        </a>
205
      </span>
206
      <span class="clearfix"></span>
207
    </div>
208
  </script>
209
210
  <script type="text/template" id="content-template">
211
    <div class="contentview">
212
      <form class="form-horizontal">
213
        <div class="row">
214
          <div class="form-group col-lg-6">
215
            <label><b>Type</b></label>
216
            <select class="form-control">
217
              <% _.each(M.contentTypes, function(type) { %>
218
                <option><%= type %></option>
219
                <%  }); %>
220
            </select>
221
          </div>
222
        </div>
223
        <div class="row">
224
          <div class="form-group col-lg-6">
225
            <div class="input-group">
226
              <span class="input-group-addon"> <b>Title</b> </span>
227
              <input class="form-control"  type="text" placeholder="title of the content" value="<%=
228
              title %>" m-data-target="title">
229
            </div>
230
          </div>
231
        </div>
232
        <div class="row">
233
          <div class="form-group col-lg-6">
234
            <div class="input-group">
235
              <span class="input-group-addon"> <strong>Tags</strong> </span>
236
              <input class="form-control"  type="text" placeholder="csv of tags for this content"
237
              value="<%= tags %>" m-data-target="tags">
238
            </div>
239
          </div>
240
        </div>
241
      </form>
242
      <div class="row">
243
        <div id="specific-content"></div>
244
      </div>
245
      <div class="row">
246
        <button class="btn btn-primary" id="done">Done</button>
247
        <button class="btn btn-default" id="back">Back</button>
248
        <!--button class="btn btn-primary" id="updateContent">Update</button-->
249
      </div>
250
    </div>
251
  </script>
252
253
  <script type="text/template" id="map-template">
254
    <div class="data">
255
      <div class="row">
256
        <div class="form-group col-lg-6">
257
          <div class="input-group">
258
            <span class="input-group-addon"><strong>Tile Provider URL</strong></span>
259
            <input class="form-control" type="text" placeholder="http://{s}.tile.cloudmade.com/<API_KEY>/997/256/{z}/{x}/{y}.png" value="<%= tileLayer %>"
260
            m-data-target="tileLayer">
261
          </div>
262
        </div>
263
      </div>
264
      <div class="row">
265
        <div class="form-group col-lg-6">
266
          <div class="input-group">
267
            <span class="input-group-addon"><strong>Shapefile</strong></span>
268
            <input class="form-control" type="text" placeholder="" value="<%= shp %>"
269
            m-data-target="shp">
270
          </div>
271
        </div>
272
      </div>
273
      <div class="preview"></div>
274
    </div>
275
  </script>
276
277
278
  <script type="text/template" id="media-template">
279
    <div class="data">
280
      <div class="form-group col-lg-6">
281
        <div class="input-group">
282
          <span class="input-group-addon"><strong>path to file</strong></span>
283
          <input class="form-control" type="text" placeholder="src" value="<%= src %>"
284
          m-data-target="src">
285
        </div>
286
      </div>
287
      <div class="preview"></div>
288
    </div>
289
  </script>
290
291
  <script type="text/template" id="text-template">
292
    <div class="data">
293
      <div class="edit-type-wrap">
294
        <div class="row">
295
          <b> Content </b>
296
        </div>
297
        <div class="row">
298
          <div class="col-lg-4">
299
            <!-- code vs wysiwyg switch -->
300
            <div class="btn-group" id="edit-type">
301
              <button type="button" class="btn btn-default" value="wysiwyg">WYSIWYG</button>
302
              <button type="button" class="btn btn-default" value="code">Code</button>
303
            </div>
304
            <p class="help-block">
305
              <span class="label label-info">Heads Up!</span> 
306
              <span><small><b> Switch editing mode </b></small></span>
307
            </p>
308
          </div>
309
        </div>
310
      </div>
311
      <div class="row">
312
        <% if(wysiwyg === true) { %>
313
        <textarea id="edit" m-data-target="data">
314
          <%= data %>
315
        </textarea>
316
        <% } else { %>
317
        <div id="code-edit" m-data-target="data">
318
          <%= M.escapeHtml(data) %>
319
        </div>
320
        <% } %>
321
      </div>
322
    </div>
323
  </script>
324
325
  <!-- notification templates -->
326
  <script type="text/template" id="success-notif">
327
    <div class="alert alert-success">
328
      <button type="button" class="close" data-dismiss="alert">&times;</button>
329
      <h4> <%= title %> </h4>
330
      <%= msg %>
331
    </div>
332
  </script>
333
334
  <script type="text/template" id="fail-notif">
335
    <div class="alert alert-danger">
336
      <button type="button" class="close" data-dismiss="alert">&times;</button>
337
      <h4> <%= title %> </h4>
338
      <%= msg %>
339
    </div>
340
  </script>
341
{% endblock %}