Add template to show client info

Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>

plinth/client.py

@@ -0,0 +1,30 @@
+#
+# This file is part of Plinth.
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License as
+# published by the Free Software Foundation, either version 3 of the
+# License, or (at your option) any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU Affero General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+
+"""
+Django models for the main application
+"""
+
+from collections import namedtuple
+
+web_client = namedtuple('Web_Client', ['name', 'url'])
+
+desktop_client = namedtuple('Desktop_clients', ['name', 'url'])
+
+mobile_client = namedtuple('Mobile_clients', ['name',
+                                              'fully_qualified_name',
+                                              'fdroid_url', 'play_store_url'])

plinth/templates/clients.html

@@ -0,0 +1,78 @@
+{% comment %}
+#
+# This file is part of Plinth.
+#
+# This program is free software: you can redistribute it and/or modify
+# it under the terms of the GNU Affero General Public License as
+# published by the Free Software Foundation, either version 3 of the
+# License, or (at your option) any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU Affero General Public License for more details.
+#
+# You should have received a copy of the GNU Affero General Public License
+# along with this program.  If not, see <http://www.gnu.org/licenses/>.
+#
+{% endcomment %}
+
+{% load i18n %}
+
+{% if module.web_clients  %}
+<div class="clients-info">
+  <p class="heading">{% trans "Web Clients" %}:
+  <ul>
+    {% for client in module.web_clients %}
+    <li>
+      <span><a href="{{ client.url }}">{{ client.name}}</a></span>
+    </li>
+    {% endfor %}
+  </ul>
+</div>
+{% endif %}
+
+{% if module.desktop_clients %}
+<div class="clients-info">
+  <p class="heading">{% trans "Desktop Clients" %}:
+    <ul>
+      {% for client in module.desktop_clients %}
+      <li>
+        <span>
+            <a href="{{ client.url }}">{{ client.name }}</a>
+        </span>
+      </li>
+      {% endfor %}
+    </ul>
+</div>
+{% endif %}
+
+{% if module.mobile_clients %}
+<div class="clients-info">
+  {% load static %}
+  <p class="heading">{% trans "Mobile Clients" %}:</p>
+    <ul>
+    {% for client in module.mobile_clients %}
+    <li class="col-md-12"><span>{{ client.name }}</span></li>
+      <div class="row">
+      {% if client.fdroid_url %}
+      <div class="col-md-2 col-xs-4">
+        <a href="{{ client.fdroid_url }}">
+          <img src="{% static 'theme/img/f-Droid.png' %}"
+               style="max-width: 100%; height: 100%"/>
+        </a>
+      </div>
+      {% endif %}
+      {% if client.play_store_url %}
+      <div class="col-md-2 col-xs-4">
+          <a href="{{ client.play_store_url }}">
+            <img src="{% static 'theme/img/google-play.png' %}"
+                 style="max-width: 100%; height: 100%"/>
+          </a>
+        </div>
+      {% endif %}
+    </div>
+    {% endfor %}
+    </ul>
+</div>
+{% endif %}

static/themes/default/css/plinth.css

@@ -115,6 +115,24 @@ footer license-info p{
     margin: 20px 0;
 }
 
+.clients-info {
+   padding-top: 15px;
+}
+
+.heading {
+    font-weight: bold;
+    display: inline;
+}
+
+.clients-info li {
+    float: left;
+    padding-left: 15px;
+}
+
+.clients-info li span {
+    position: relative;
+    left: -18px;
+}
 .shortcut-label {
     min-height:50px;
 }