| |
@@ -2,9 +2,7 @@
|
| |
|
| |
{% block title %}{{ hub.name }}{% endblock %}
|
| |
|
| |
-
|
| |
{% block header %}
|
| |
-
|
| |
<div class="row">
|
| |
|
| |
<!-- Left side of header -->
|
| |
@@ -19,7 +17,7 @@
|
| |
<h5 class="m-t-1 m-b-1">{{ hub.config.summary }}</h5>
|
| |
{% endif %}
|
| |
</div>
|
| |
-
|
| |
+
|
| |
<!-- right side of header -->
|
| |
<div class="col-md-{{ hub.config.right_width }} text-center align-self-end">
|
| |
{% if hub.allows(g.user, "config") %}
|
| |
@@ -33,22 +31,18 @@
|
| |
edit page layout
|
| |
</a>
|
| |
{% else %}
|
| |
- <button class="btn btn-sm btn-primary" href="#" id="save_edits_btn">
|
| |
+ <button id="save-edits-btn" class="btn btn-sm btn-primary" data-request-url="{{ url_for('hub_edit', name=hub.name) }}" data-redirect-url="{{ url_for('hub', name=hub.name) }}">
|
| |
<i class="fa fa-download" aria-hidden="true"></i>
|
| |
Save changes
|
| |
</button>
|
| |
{% endif %}
|
| |
{% endif %}
|
| |
</div>
|
| |
-
|
| |
</div>
|
| |
-
|
| |
{% endblock header %}
|
| |
|
| |
|
| |
-
|
| |
{% block content %}
|
| |
-
|
| |
<div class="row">
|
| |
<div class="col-md-{{ hub.config.left_width }}">
|
| |
<!--
|
| |
@@ -60,11 +54,9 @@
|
| |
<li class="media">
|
| |
<div class="media-left">
|
| |
{% if hub.archived %}
|
| |
- <img class="media-object square-32"
|
| |
- src="{{ url_for('static', filename='img/archived.png') }}"/>
|
| |
+ <img class="media-object square-32" src="{{ url_for('static', filename='img/archived.png') }}"/>
|
| |
{% else %}
|
| |
- <img class="media-object square-32"
|
| |
- src="{{ url_for('static', filename='img/cobweb.png') }}"/>
|
| |
+ <img class="media-object square-32" src="{{ url_for('static', filename='img/cobweb.png') }}"/>
|
| |
{% endif %}
|
| |
</div>
|
| |
<div class="media-body">
|
| |
@@ -84,16 +76,16 @@
|
| |
<div class="card">
|
| |
<div class="card-block">
|
| |
<h4>
|
| |
- <a href="{{ url_for("hub_add_widget", name=hub.name) }}?position=left" class="add_widget">
|
| |
- <span><i class="fa fa-plus" aria-hidden="true"></i></span> Add a widget
|
| |
- </a>
|
| |
+ <a href="{{ url_for("hub_add_widget", name=hub.name) }}?position=left" class="add-widget op-modal-widget">
|
| |
+ <span><i class="fa fa-plus" aria-hidden="true"></i></span> Add a widget
|
| |
+ </a>
|
| |
</h4>
|
| |
</div>
|
| |
</div>
|
| |
</div>
|
| |
{% endif %}
|
| |
|
| |
- <div id="left_widgets">
|
| |
+ <div id="left-widgets">
|
| |
{% for widget in widgets["left"] %}
|
| |
<div id="widget-{{ widget.idx }}" class="widget row"
|
| |
data-url="{{ url_for('%s_root' % widget.plugin, hub=hub.name, idx=widget.idx) }}{% if edit %}?editmode=1{% endif %}"
|
| |
@@ -108,16 +100,16 @@
|
| |
<div class="card">
|
| |
<div class="card-block">
|
| |
<h4>
|
| |
- <a href="{{ url_for("hub_add_widget", name=hub.name) }}?position=right" class="add_widget">
|
| |
- <span><i class="fa fa-plus" aria-hidden="true"></i></span> Add a widget
|
| |
- </a>
|
| |
+ <a href="{{ url_for("hub_add_widget", name=hub.name) }}?position=right" class="add-widget op-modal-widget">
|
| |
+ <span><i class="fa fa-plus" aria-hidden="true"></i></span> Add a widget
|
| |
+ </a>
|
| |
</h4>
|
| |
</div>
|
| |
</div>
|
| |
</div>
|
| |
{% endif %}
|
| |
|
| |
- <div id="right_widgets">
|
| |
+ <div id="right-widgets">
|
| |
{% for widget in widgets["right"] %}
|
| |
<div id="widget-{{ widget.idx }}" class="widget row"
|
| |
data-url="{{ url_for('%s_root' % widget.plugin, hub=hub.name, idx=widget.idx) }}{% if edit %}?editmode=1{% endif %}"
|
| |
@@ -128,213 +120,46 @@
|
| |
|
| |
</div> <!-- /row -->
|
| |
|
| |
- <div id="settings-modal" class="modal fade" tabindex="-1" role="dialog">
|
| |
- </div>
|
| |
-
|
| |
+ <div id="settings-modal" class="modal fade" tabindex="-1" role="dialog"></div>
|
| |
+ <div id="hubs-modal" class="modal fade" tabindex="-1" role="dialog"></div>
|
| |
|
| |
- <div id="edit_modal" class="modal fade" role="dialog">
|
| |
- <div class="modal-dialog" id="edit_modal_content">
|
| |
+ <div id="edit-modal" class="modal fade" role="dialog">
|
| |
+ <div class="modal-dialog">
|
| |
+ <div id="edit-modal-content" class="modal-content">
|
| |
+ <div class="modal-body"></div>
|
| |
+ </div>
|
| |
</div>
|
| |
</div>
|
| |
|
| |
{% endblock content %}
|
| |
|
| |
-
|
| |
-
|
| |
{% block jscripts %}
|
| |
{{ super() }}
|
| |
-
|
| |
- {% if edit %}
|
| |
- <script src="{{ url_for('static', filename='js/Sortable.min.js') }}"></script>
|
| |
- <script>
|
| |
-
|
| |
- function make_widget_sortable() {
|
| |
- var byId = function (id) { return document.getElementById(id); }
|
| |
-
|
| |
- Sortable.create(byId('left_widgets'), {
|
| |
- animation: 150,
|
| |
- draggable: '.widget',
|
| |
- handle: '.card',
|
| |
- });
|
| |
-
|
| |
- Sortable.create(byId('right_widgets'), {
|
| |
- animation: 150,
|
| |
- draggable: '.widget',
|
| |
- handle: '.card',
|
| |
- });
|
| |
-
|
| |
- };
|
| |
-
|
| |
- function setup_add_btns() {
|
| |
- // Setup events for the "add widget" button.
|
| |
- $(".add_widget").click(function(e) {
|
| |
- e.preventDefault();
|
| |
- $.ajax({
|
| |
- url: $(this).attr('href'),
|
| |
- dataType: 'html',
|
| |
- success: function(html) {
|
| |
- $('#edit_modal_content').html(html);
|
| |
- },
|
| |
- error: function(html) {
|
| |
- $('#edit_modal_content').html(
|
| |
- '<div class="modal-dialog"><div class="modal-content"> \
|
| |
- <div class="modal-body"> \
|
| |
- An error occured when trying to add a new widget\
|
| |
- </div></div></div>'
|
| |
- );
|
| |
- console.log('error');
|
| |
- console.trace();
|
| |
- console.log(html);
|
| |
- },
|
| |
- complete: function() {
|
| |
- $('#edit_modal').modal();
|
| |
- }
|
| |
- });
|
| |
- return false;
|
| |
- });
|
| |
- // Setup events for the "add widget" form using delegated events because it's
|
| |
- // not in the DOM yet.
|
| |
- $("body").on("submit", "#adding_form form", function(e) {
|
| |
- var form = $(this);
|
| |
- e.preventDefault();
|
| |
- $.ajax({
|
| |
- type: "POST",
|
| |
- url: form.attr("action"),
|
| |
- dataType: "json",
|
| |
- data: form.serialize(),
|
| |
- success: function(data) {
|
| |
- if (data.status === "CONFIGURE") {
|
| |
- $("#adding_form").load(data.url);
|
| |
- } else if (data.status === "ADDED") {
|
| |
- // no config necessary, reload the page
|
| |
- window.location = window.location;
|
| |
- } else {
|
| |
- $('#adding_form .modal-body').html(
|
| |
- "An error occured when trying to add a new widget."
|
| |
- );
|
| |
- $('#adding_form .modal-footer button[type="submit"]').remove();
|
| |
- console.log('error');
|
| |
- console.trace();
|
| |
- console.log(data);
|
| |
- }
|
| |
- },
|
| |
- error: function(html) {
|
| |
- $('#adding_form .modal-body').html(
|
| |
- "An error occured when trying to add a new widget."
|
| |
- );
|
| |
- $('#adding_form .modal-footer button[type="submit"]').remove();
|
| |
- console.log('error');
|
| |
- console.trace();
|
| |
- console.log(html);
|
| |
- }
|
| |
- });
|
| |
- });
|
| |
- }
|
| |
-
|
| |
- $('#save_edits_btn').click(function(e) {
|
| |
- e.preventDefault();
|
| |
- var _r_indexes = [];
|
| |
- var _r_widgets = [];
|
| |
- $.each($('#right_widgets .widget'), function(i, el) {
|
| |
- _r_indexes.push(i);
|
| |
- _r_widgets.push($(el).attr('id').split('widget-')[1])
|
| |
- });
|
| |
-
|
| |
- var _l_indexes = [];
|
| |
- var _l_widgets = [];
|
| |
- $.each($('#left_widgets .widget'), function(i, el) {
|
| |
- _l_indexes.push(i);
|
| |
- _l_widgets.push($(el).attr('id').split('widget-')[1])
|
| |
- });
|
| |
-
|
| |
- $.post(
|
| |
- '{{ url_for("hub_edit", name=hub.name) }}',
|
| |
- {'right_indexes': _r_indexes, 'right_widgets': _r_widgets,
|
| |
- 'left_indexes': _l_indexes, 'left_widgets': _l_widgets,
|
| |
- 'js': true},
|
| |
- function(){ window.location = '{{ url_for("hub", name=hub.name) }}' }
|
| |
- );
|
| |
- });
|
| |
- </script>
|
| |
- {% endif %}
|
| |
-
|
| |
<script type="text/javascript">
|
| |
- function setup_edit_btns() {
|
| |
- $("body").on("click", ".edit_widget", function(e) {
|
| |
- e.preventDefault();
|
| |
- var url = $(this).attr('data-url');
|
| |
-
|
| |
- $.ajax({
|
| |
- url: url,
|
| |
- dataType: 'html',
|
| |
- success: function(html) {
|
| |
- $('#edit_modal_content').html(html);
|
| |
- $('#edit_modal').modal();
|
| |
- },
|
| |
- error: function() {
|
| |
- $('#edit_modal_content').html(
|
| |
- '<div class="modal-dialog"><div class="modal-content"> \
|
| |
- <div class="modal-body"> \
|
| |
- Nothing to configure for this widget\
|
| |
- </div></div></div>'
|
| |
- );
|
| |
- console.log('error');
|
| |
- console.trace();
|
| |
- $('#edit_modal').modal();
|
| |
- },
|
| |
- });
|
| |
- return false;
|
| |
- });
|
| |
- }
|
| |
-
|
| |
- function visit_counter() {
|
| |
- if (window.performance.navigation.type == 0) {
|
| |
- var username = '{{ g.auth.nickname }}'
|
| |
- var visited_hub = '{{ hub.name }}'
|
| |
- if(username != null && username != '' && username != visited_hub) {
|
| |
- url_str = '/visit/' + visited_hub;
|
| |
-
|
| |
- $.ajax({
|
| |
- method: "POST",
|
| |
- url: url_str,
|
| |
- dataType: 'html',
|
| |
- success: function(html) {
|
| |
- console.log('Success: incrementing counter')
|
| |
- },
|
| |
- error: function() {
|
| |
- console.log('Error: incrementing counter');
|
| |
- },
|
| |
- });
|
| |
- }
|
| |
- }
|
| |
- }
|
| |
+ var userName = '{{ g.auth.nickname }}';
|
| |
+ var urlPrefix = '/visit/';
|
| |
+ var visitedHub = '{{ hub.name }}';
|
| |
+ var hubConfigURL = {{ url_for("hub_config", name=hub.name)|tojson }};
|
| |
+ var hubConfigSuggestUsers = {{ url_for("hub_config_suggest_users", name=hub.name)|tojson }};
|
| |
+ var sseURL = {{ sse_url | tojson }};
|
| |
|
| |
- function setup_settings() {
|
| |
- var settingsPanel = React.createElement(Hubs.HubConfig, {
|
| |
- urls: {
|
| |
- config: {{ url_for("hub_config", name=hub.name)|tojson }},
|
| |
- suggestUsers: {{ url_for("hub_config_suggest_users", name=hub.name)|tojson }},
|
| |
- }
|
| |
- });
|
| |
- ReactDOM.render(settingsPanel, document.getElementById("settings-modal"));
|
| |
- }
|
| |
-
|
| |
- $(function() {
|
| |
- visit_counter()
|
| |
-
|
| |
- setup_widgets();
|
| |
- setup_sse({{ sse_url | tojson }});
|
| |
- setup_edit_btns();
|
| |
{% if hub.allows(g.user, "config") %}
|
| |
- setup_settings();
|
| |
+ var canSetupSettings = true;
|
| |
+ {% else %}
|
| |
+ var canSetupSettings = false;
|
| |
{% endif %}
|
| |
|
| |
- {% if edit -%}
|
| |
- make_widget_sortable();
|
| |
- setup_add_btns();
|
| |
- {%- endif %}
|
| |
- });
|
| |
-
|
| |
+ {% if edit %}
|
| |
+ var editMode = true;
|
| |
+ {% else %}
|
| |
+ var editMode = false;
|
| |
+ {% endif %}
|
| |
</script>
|
| |
- {% endblock %}
|
| |
+ <script src="{{ url_for('static', filename='js/hubs.main.js') }}"></script>
|
| |
+
|
| |
+ {% if edit %}
|
| |
+ <script src="{{ url_for('static', filename='js/Sortable.min.js') }}"></script>
|
| |
+ <script src="{{ url_for('static', filename='js/widgets/hubs.edit.js') }}"></script>
|
| |
+ {% endif %}
|
| |
+ {% endblock jscripts%}
|
| |
{# vim: set ts=2 sw=2 et: #}
|
| |
Signed-off-by: Sayan Chowdhury sayan.chowdhury2012@gmail.com