dashboard: more valid html

circle/dashboard/static/dashboard/dashboard.js

@@ -10,10 +10,11 @@ $(function () {
   $(".not-tab-pane").removeClass("not-tab-pane").addClass("tab-pane");
 
   $('.vm-create').click(function(e) {
-    var template = $(this).data("template");
+    var url = $(this).data("href");
+    if(!url) url = $(this).prop("href");
     $.ajax({
       type: 'GET',
-      url: $(this).attr('href'),
+      url: url,
       success: function(data) {
         $('body').append(data);
         vmCreateLoaded();
@@ -140,7 +141,7 @@ $(function () {
         // success
       },
       error: function(xhr, textStatus, error) {
-        console.log("oh babám");
+        addMessage(gettext("An error occurred. (") + xhr.status + ")", 'danger');
       }
     });
     $(star).tooltip('destroy').tooltip({'placement': 'right'});

circle/dashboard/static/template.less

@@ -55,6 +55,9 @@ html {
 .bigbig {
   font-size: 3em;
 }
+.big-tag {
+  font-size: 1.2em;
+}
 /* small buttons for tags, copied from Bootstraps input-sm, bnt-sm */
 .btn-tags, .btn-traits {
   padding: 3px 6px;
@@ -148,3 +151,7 @@ footer a, footer a:hover, footer a:visited {
 .btn-toolbar {
   margin-bottom: 5px;
 }
+
+.vm-details-home-edit-description {
+  font-size: 85%; /* ~ small tag */
+}

circle/dashboard/templates/dashboard/index-groups.html

@@ -20,7 +20,7 @@
         <div class="col-xs-6">
           <form action="{% url "dashboard.views.group-list" %}" method="GET" id="dashboard-group-search-form">
             <div class="input-group input-group-sm">
-              <input id="dashboard-group-search-input" name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
+              <input name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
               <div class="input-group-btn">
                 <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
               </div>

circle/dashboard/templates/dashboard/index-nodes.html

@@ -72,11 +72,15 @@
       value="{% widthratio node_num.running sum_node_num 100 %}">
     </p>
     <p>
+      {% blocktrans with running=node_num.running missing=node_num.missing disabled=node_num.disabled offline=node_num.offline %}
       <span class="big">
-        <big>{{ node_num.running }}</big> running
-      </span>
-      + <big>{{ node_num.missing }}</big>
-      missing + <br><big>{{ node_num.disabled }}</big> disabled + <big>{{ node_num.offline }}</big> offline
+        <span class="big-tag">{{ running }}</span> running
+      </span> +
+      <span class="big-tag">{{ missing }}</span> missing +
+      <br>
+      <span class="big-tag">{{ disabled }}</span> disabled +
+      <span class="big-tag">{{ offline }}</span> offline
+      {% endblocktrans %}
     </p>
     <ul class="list-inline" id="dashboard-node-taglist">
       {% for i in nodes %}

circle/dashboard/templates/dashboard/index-templates.html

@@ -16,7 +16,7 @@
           <i class="fa fa-{{ t.os_type }}"></i> {{ t.name }}
         </span>
         <small class="text-muted index-template-list-system">{{ t.system }}</small>
-        <div href="{% url "dashboard.views.vm-create" %}?template={{ t.pk }}" class="pull-right vm-create">
+        <div data-href="{% url "dashboard.views.vm-create" %}?template={{ t.pk }}" class="pull-right vm-create">
           <i data-container="body" title="{% trans "Start VM instance" %}" 
             class="fa fa-play"></i>
         </div>
@@ -37,7 +37,7 @@
         <div class="col-xs-5 col-sm-6">
           <form action="{% url "dashboard.views.template-list" %}" method="GET" id="dashboard-template-search-form">
             <div class="input-group input-group-sm">
-              <input id="dashboard-group-search-input" name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
+              <input name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
               <div class="input-group-btn">
                 <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
               </div>

circle/dashboard/templates/dashboard/index-users.html

@@ -25,7 +25,7 @@
         <div class="col-xs-5 col-sm-6">
           <form action="{% url "dashboard.views.user-list" %}" method="GET" id="dashboard-user-search-form">
             <div class="input-group input-group-sm">
-              <input id="dashboard-group-search-input" name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
+              <input name="s" type="text" class="form-control" placeholder="{% trans "Search..." %}" />
               <div class="input-group-btn">
                 <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
               </div>

circle/dashboard/templates/dashboard/index-vm.html

@@ -90,7 +90,7 @@
     <p class="pull-right">
     <input class="knob" data-fgColor="chartreuse" data-thickness=".4" data-max="{{ request.user.profile.instance_limit }}" data-width="100" data-height="100" data-readOnly="true" value="{{ instances|length|add:more_instances }}">
     </p>
-    <span class="bigbig">{% blocktrans with count=running_vm_num %}<big>{{ count }}</big> running{% endblocktrans %}</span>
+    <span class="bigbig">{% blocktrans with count=running_vm_num %}<span class="big-tag">{{ count }}</span> running{% endblocktrans %}</span>
       <ul class="list-inline" style="max-height: 95px; overflow: hidden;">
         {% for vm in running_vms %}
         <li style="display: inline-block; padding: 2px;">
@@ -111,7 +111,9 @@
           <strong>{{ counter }}</strong> machines total
         {% endblocktrans %}
       </a>
-      <p class="big text-warning">{% blocktrans with count=stopped_vm_num %}<big>{{ count }}</big> stopped{% endblocktrans %}</p>
+      <p class="big text-warning">
+      {% blocktrans with count=stopped_vm_num %}{{ count }} stopped{% endblocktrans %}
+      </p>
     </div>
   </div>
 </div>

circle/dashboard/templates/dashboard/store/index-files.html

@@ -58,7 +58,7 @@
       <div class="text-right">
         <form class="pull-left" method="POST" action="{% url "dashboard.views.store-refresh-toplist" %}">
           {% csrf_token %}
-          <button class="btn btn-success btn-xs" type="submit" title="{% trans "Refresh" %}"/>
+          <button class="btn btn-success btn-xs" type="submit" title="{% trans "Refresh" %}">
             <i class="fa fa-refresh"></i>
           </button>
         </form>

circle/dashboard/templates/dashboard/vm-detail/_activity-timeline.html

@@ -45,7 +45,7 @@
             {{ s.finished|arrowfilter:LANGUAGE_CODE }}
           </span>
         {% else %}
-          <i class="fa fa-refresh fa-spin" class="sub-activity-loading-icon"></i>
+          <i class="fa fa-refresh fa-spin"></i>
         {% endif %}
         {% if s.has_failed %}
           <div class="label label-danger">{% trans "failed" %}</div>

circle/dashboard/templates/dashboard/vm-detail/console.html

@@ -15,12 +15,12 @@
 <div id="vm-console-screenshot">
   <button class="btn btn-danger btn-sm pull-right">{% trans "Close" %}</button>
   <h3>{% trans "Screenshot" %}</h3>
-  <img />
+  <img alt="{% trans "Screenshot" %}"/>
   <hr />
 </div>
 
 {% if perms.vm.access_console %}
-<canvas id="noVNC_canvas" width="640px" height="20px">Canvas not supported.
+<canvas id="noVNC_canvas" width="640" height="20">Canvas not supported.
 </canvas>
 
 <script>

circle/dashboard/templates/dashboard/vm-detail/home.html

@@ -39,7 +39,7 @@
       <dd>
         {% csrf_token %}
         <div class="vm-details-home-edit-description-click">
-          <small class="vm-details-home-edit-description">{{ instance.description|linebreaks }}</small>
+          <div class="vm-details-home-edit-description">{{ instance.description|linebreaks }}</div>
         </div>
         <div id="vm-details-home-description" class="js-hidden">
           <form method="POST">
@@ -163,9 +163,12 @@
       {% include "dashboard/_graph-time-buttons.html" %}
     </div>
     <div class="graph-images text-center">
-      <img src="{% url "dashboard.views.vm-graph" instance.pk "cpu" graph_time %}"/>
-      <img src="{% url "dashboard.views.vm-graph" instance.pk "memory" graph_time %}"/>
-      <img src="{% url "dashboard.views.vm-graph" instance.pk "network" graph_time %}"/>
+      <img src="{% url "dashboard.views.vm-graph" instance.pk "cpu" graph_time %}"
+       alt="{% trans "CPU usage" %}"/>
+      <img src="{% url "dashboard.views.vm-graph" instance.pk "memory" graph_time %}"
+       alt="{% trans "Memory usage" %}"/>
+      <img src="{% url "dashboard.views.vm-graph" instance.pk "network" graph_time %}"
+       alt="{% trans "Network usage" %}"/>
     </div>
     {% endif %}
   </div>

circle/dashboard/templates/dashboard/vm-detail/network.html

 {% load i18n %}
 {% load network_tags %}
-<h2>
-    <div id="vm-details-add-interface">
+
+<div id="vm-details-add-interface">
   {% with op=op.add_interface %}{% if op %}
   <a href="{{op.get_url}}" class="btn btn-{{op.effect}} operation pull-right"
       {% if op.disabled %}disabled{% endif %}>
   <i class="fa fa-{{op.icon}}"></i> {% trans "add interface" %}</a>
   {% endif %}{% endwith %}
-    </div>
+</div>
+<h2>
   {% trans "Interfaces" %}
 </h2>
 

circle/dashboard/templates/dashboard/vm-detail/resources.html

@@ -22,12 +22,12 @@
 
 <div id="vm-details-resources-disk">
   <h3>
-    {% trans "Disks" %}
     <div class="pull-right">
       <div id="disk-ops">
         {% include "dashboard/vm-detail/_disk-operations.html" %}
       </div>
     </div>
+    {% trans "Disks" %}
   </h3>
   <div class="clearfix"></div>
 
@@ -46,7 +46,7 @@
 {% if user.is_superuser %}
 <hr/>
 
-<div class="row" id="">
+<div class="row">
   <div class="col-sm-12">
     <h3>
       {% trans "Required traits" %}
@@ -58,7 +58,7 @@
 
 <hr/>
 
-<div class="row" id="">
+<div class="row">
   <div class="col-sm-12">
     <h3>
       {% trans "Raw data" %}

circle/templates/registration/base.html

@@ -76,7 +76,7 @@
 
 {% block navbar-brand %}
   <a class="navbar-brand" href="{% url "dashboard.index" %}" style="padding: 10px 15px;">
-    <img src="{% static "dashboard/img/logo.png" %}" style="height: 25px;"/>
+    <img src="{% static "dashboard/img/logo.png" %}" style="height: 25px;" alt="circle logo"/>
   </a>
 {% endblock %}
 

circle/templates/registration/login.html

@@ -6,12 +6,6 @@
 
 {% block title-page %}{% trans "Login" %}{% endblock %}
 
-{% block navbar-brand %}
-  <a class="navbar-brand" href="{% url "dashboard.index" %}" style="padding: 10px 15px;">
-    <img src="{% static "dashboard/img/logo.png" %}" style="height: 25px;"/>
-  </a>
-{% endblock %}
-
 {% block content_box %}
   <div class="row">
     {% if form.password.errors or form.username.errors %}
@@ -21,10 +15,7 @@
     {% endif %}
     <div class="col-xs-{% if saml2 %}6{% else %}12{% endif %}">
       <div class="login-form">
-        <form action="" method="POST">
-          {% csrf_token %}
         {% crispy form %}
-        </form>
       </div>
     </div>
     {% if saml2 %}
@@ -33,11 +24,12 @@
       <a href="{% url "saml2_login" %}">{% trans "Click here!" %}</a>
     </div>
     {% endif %}
-    </div>
     <div class="row">
       <div class="col-sm-12">
-        <a class="pull-right" href="{% url "accounts.password-reset" %}">{% trans "Forgot your password?" %}</a>
+        <a class="pull-right" href="{% url "accounts.password-reset" %}" style="margin-right: 15px;">
+          {% trans "Forgot your password?" %}
+        </a>
+      </div>
     </div>
   </div>
-</div>
 {% endblock %}