Allow to create group and its contest on UI

templates/contest/list.html

@@ -1,9 +1,9 @@
-{% extends "three-column-content.html" %}
+{% extends "two-column-content.html" %}
 {% block meta %}
     <meta name="description" content="The {{ SITE_NAME }}'s contest list - past, present, and future.">
 {% endblock %}
 
-{% block three_col_media %}
+{% block two_col_media %}
     <style>
         .time-left {
             text-align: left;
@@ -66,17 +66,10 @@
                 margin-left: 0.5em;
             }
         }
-
-        @media (min-width: 800px) {
-            .middle-content {
-                max-width: none;
-                padding-left: 1em;
-            }
-        }
     </style>
 {% endblock %}
 
-{% block three_col_js %}
+{% block two_col_js %}
     <script src="{{ static('libs/featherlight/featherlight.min.js') }}" type="text/javascript"></script>
     <script type="text/javascript">
         $(document).ready(function () {
@@ -127,19 +120,28 @@
                     <i class="fa fa-eye-slash"></i> {{ _('hidden') }}
                 </span>
             {% endif %}
+            {% if contest.is_editable %}
+                <span style="background-color: green" class="contest-tag">
+                    <a href="{{ url('organization_contest_edit', organization.id, organization.slug, contest.key) }}" style="color: white">
+                        <i class="fa fa-edit"></i> {{ _('Edit') }}
+                    </a>
+                </span>
+            {% endif %}
             {% if contest.is_private %}
                 <span style="background-color: #666666; color: #ffffff" class="contest-tag">
                     <i class="fa fa-lock"></i> {{ _('private') }}
                 </span>
             {% endif %}
-            {% if contest.is_organization_private %}
-                {% for org in contest.organizations.all() %}
-                    <span style="background-color: #cccccc" class="contest-tag">
-                        <a href="{{ org.get_absolute_url() }}" style="color: #000000">
-                            <i class="fa fa-lock"></i> {{ org.name }}
-                        </a>
-                    </span>
-                {% endfor %}
+            {% if not hide_contest_orgs %}
+                {% if contest.is_organization_private %}
+                    {% for org in contest.organizations.all() %}
+                        <span style="background-color: #cccccc" class="contest-tag">
+                            <a href="{{ org.get_absolute_url() }}" style="color: #000000">
+                                <i class="fa fa-lock"></i> {{ org.name }}
+                            </a>
+                        </span>
+                    {% endfor %}
+                {% endif %}
             {% endif %}
             {% if contest.is_rated %}
                 <span style="background-color: #e54c14; color: #ffffff" class="contest-tag">
@@ -219,6 +221,9 @@
                 </select>
             {% endif %}
             <button id="search-btn" class="btn-green small"> {{ _('Search')}} </button>
+            {% if create_url %}
+                <a href="{{create_url}}" class="button small" style="float: right"><i class="fa fa-plus"></i> {{ _('Create')}}</a>
+            {% endif %}
         </form>
         {% if active_participations %}
             <h4 class="toggle open">
@@ -384,11 +389,12 @@
                             {{ user_count(contest, request.user) }}
                         </td>
                         {% if not request.in_contest %}
-                            <td><form action="{{ url('contest_join', contest.key) }}" method="post">
+                        <td><form action="{{ url('contest_join', contest.key) }}" method="post">
                                     {% csrf_token %}
                                     <input type="submit" class="unselectable button full small"
                                            value="{{ _('Virtual join') }}">
-                            </form></td>
+                            </form>
+                        </td>
                         {% endif %}
                     </tr>
                 {% endfor %}

templates/organization/add.html

@@ -0,0 +1,18 @@
+{% extends "two-column-content.html" %}
+
+{% block two_col_js %}
+    {{ form.media.js }}
+{% endblock %}
+
+{% block two_col_media %}
+    {{ form.media.css }}
+{% endblock %}
+
+{% block left_sidebar %}
+    {% include "user/user-left-sidebar.html" %}
+{% endblock %}
+
+{% block middle_content %}
+    <center><h2>{{title}}</h2></center>
+    {% include "organization/form.html" %}
+{% endblock %}

templates/organization/blog/add.html

@@ -7,11 +7,6 @@
 
 {% block three_col_media %}
     {{ form.media.css }}
-    <style>
-        #org-field-wrapper-visible, #org-field-wrapper-sticky {
-            display: contents;
-        }
-    </style>
 {% endblock %}
 
 {% block middle_content %}

templates/organization/contest/add.html

@@ -0,0 +1,87 @@
+{% extends "organization/home-base.html" %}
+
+{% block three_col_js %}
+    {{ form.media.js }}
+{% endblock %}
+
+{% block three_col_media %}
+    {{ form.media.css }}
+    <style>
+        #org-field-wrapper-scoreboard_visibility,
+        #org-field-wrapper-points_precision,
+        #org-field-wrapper-start_time,
+        #org-field-wrapper-end_time,
+        #org-field-wrapper-time_limit,
+        #org-field-wrapper-format_name {
+            display: inline-flex;
+        }
+        .problems-problem {
+            width: 40%;
+        }
+        input[type=number] {
+            width: 5em;
+        }
+        .middle-content {
+            z-index: 1;
+        }
+    </style>
+{% endblock %}
+
+{% block middle_content %}
+    <form action="" method="post">
+        {% csrf_token %}
+        {% if form.errors %}
+            <div class="alert alert-danger alert-dismissable">
+                <a href="#" class="close">x</a>
+                    {{ form.non_field_errors() }}
+                    {{ form.errors }}
+            </div>
+        {% endif %}
+        {% for field in form %}
+            {% if not field.is_hidden %}
+                <div style="margin-bottom: 1em;">
+                    {{ field.errors }}
+                    <label for="{{field.id_for_label }}"><b>{{ field.label }}{% if field.field.required %}<span style="color:red"> * </span>{% endif %}:</b> </label>
+                    <div class="org-field-wrapper" id="org-field-wrapper-{{field.html_name }}">
+                        {{ field }}
+                    </div>
+                    {% if field.help_text %}
+                        <i style="display: block">{{ field.help_text|safe }}</i>
+                    {% endif %}
+                </div>
+            {% endif %}
+        {% endfor %}
+
+        {% if problems_form %}
+        <hr><br>
+        {{ problems_form.management_form }}
+        <i>{{_('If you run out of rows, click Save')}}</i>
+        <table class="table">
+            <thead>
+                <tr>
+                    {% for field in problems_form[0] %}
+                    {% if not field.is_hidden %}
+                        <th>
+                            {{field.label}}
+                        </th>
+                    {% endif %}
+                    {% endfor %}
+                </tr>
+            </thead>
+            <tbody>
+            {% for form in problems_form %}
+                <tr>
+                    {% for field in form %}
+                        <td class="problems-{{field.name}}" title="
+                                {{ field.help_text|safe if field.help_text }}"
+                            style="{{ 'display:none' if field.is_hidden }}"
+                        >{{field}}<div style="color:red">{{field.errors}}</div></td>
+                        {% endfor %}
+                </tr>
+            {% endfor %}
+            </tbody>
+        </table>
+        {% endif %}
+        <button type="submit">{{ _('Save') }}</button>
+    </form>
+{% endblock %}

templates/organization/edit.html

@@ -29,11 +29,6 @@
 
 {% block three_col_media %}
     {{ form.media.css }}
-    <style>
-        #org-field-wrapper-is_open {
-            display: contents;
-        }
-    </style>
 {% endblock %}
 
 {% block middle_content %}

templates/organization/form.html

@@ -4,18 +4,19 @@
         <div class="alert alert-danger alert-dismissable">
             <a href="#" class="close">x</a>
                 {{ form.non_field_errors() }}
+                {{ form.errors }}
         </div>
     {% endif %}
     {% for field in form %}
         {% if not field.is_hidden %}
             <div style="margin-bottom: 1em;">
                 {{ field.errors }}
-                <label for="{{field.id_for_label }}"><b>{{ field.label }}:</b></label>
+                <label for="{{field.id_for_label }}"><b>{{ field.label }}{% if field.field.required %}<span style="color:red"> * </span>{% endif %}:</b> </label>
                 <div class="org-field-wrapper" id="org-field-wrapper-{{field.html_name }}">
                     {{ field }}
                 </div>
                 {% if field.help_text %}
-                    <i>{{ field.help_text|safe }}</i>
+                    <i style="display: block">{{ field.help_text|safe }}</i>
                 {% endif %}
             </div>
         {% endif %}

templates/organization/home-base.html

@@ -14,8 +14,8 @@
 {% endblock %}
 
 {% block middle_title %}
-    {% if title %}
-        <center><h2>{{ title }}</h2></center>
+    {% if title or content_title %}
+        <center><h2>{{ content_title if content_title else title }}</h2></center>
         <br/>
     {% endif %}
 {% endblock %}

templates/organization/list.html

@@ -1,13 +1,6 @@
-{% extends "user/base-users-three-col.html" %}
-{% block users_js_media %}
-    <script type="text/javascript">
-        $(function(){
-            register_all_toggles();
-        });
-    </script>
-{% endblock %}
+{% extends "two-column-content.html" %}
 
-{% block users_media %}
+{% block two_col_media %}
     <style>
         .organization-row {
             display: block;
@@ -62,7 +55,8 @@
     {% endif %}
 {% endmacro %}
 
-{% block users_table %}
+{% block middle_content %}
+    <a style="float: right" class="button small" href="{{url('organization_add')}}">{{_("Create group")}}</a>
     {{ org_list(_('My groups'), my_organizations) }}
     {{ org_list(_('Open groups'), open_organizations) }}
     {{ org_list(_('Private groups'), private_organizations) }}

templates/organization/org-right-sidebar.html

@@ -49,6 +49,13 @@
                         {% endif %}
                     </div>
                 </li>
+                {% if can_edit %}
+                    <li>
+                        <div>
+                            <a href="{{ url('organization_contest_add', organization.id, organization.slug) }}">{{ _('Add contest') }}</a>
+                        </div>
+                    </li>
+                {% endif %}
                 {% if is_member and not can_edit %}
                 <li>
                     <form method="post" action="{{ url('leave_organization', organization.id, organization.slug) }}">

templates/organization/users-table.html

@@ -12,7 +12,7 @@
             <form action="{{ kick_url }}" method="POST" class="kick-form">
                 {% csrf_token %}
                 <input type="hidden" name="user" value="{{ user.id }}">
-                <a href="#" class="button">{{ _('Kick') }}</a>
+                <a href="#" class="button small">{{ _('Kick') }}</a>
             </form>
         </td>
     {% endif %}

templates/two-column-content.html

@@ -0,0 +1,17 @@
+{% extends "three-column-content.html" %}
+
+{% block three_col_js %}
+    {% block two_col_js %}{% endblock %}
+{% endblock %}
+
+{% block three_col_media %}
+    <style>
+        @media (min-width: 800px) {
+            .middle-content {
+                max-width: none;
+                padding-left: 1em;
+            }
+        }
+    </style>
+    {% block two_col_media %}{% endblock %}
+{% endblock %}

templates/user/base-users-three-col.html

@@ -1,20 +1,12 @@
-{% extends "three-column-content.html" %}
+{% extends "two-column-content.html" %}
 
-{% block three_col_js %}
+{% block two_col_js %}
     {% block users_js_media %}{% endblock %}
     {% include "user/base-users-js.html" %}
 {% endblock %}
 
-{% block three_col_media %}
+{% block two_col_media %}
     <link href="http://fonts.cdnfonts.com/css/jersey-m54" rel="stylesheet">
-    <style>
-        @media (min-width: 800px) {
-            .middle-content {
-                max-width: none;
-                padding-left: 1em;
-            }
-        }
-    </style>
     {% block users_media %}{% endblock %}
 {% endblock %}
 

templates/widgets/datetimepicker.html

@@ -0,0 +1,20 @@
+<input
+    type="{{ widget.type }}"
+    name="{{ widget.name }}"
+    {% if widget.value != None %} 
+        value="{{ widget.value }}"
+    {% endif %}
+    {% for name, value in widget.attrs.items() %}
+        {% if value %}
+            {{ name }}{% if not value %}="{{ value }}"{% endif %}
+        {% endif %}
+    {% endfor %}
+/>
+
+<script>
+    $(function () {
+        $("input[name='{{ widget.name }}']").datetimepicker({
+            format: 'Y-m-d H:i:s',
+        });
+    });
+</script>