Improve title adding in 'Application Catalog' page

* App description (huge amout of text) is not shown as tooltip anymore;
* App title is shown in case overflow happened.
* Readme is fixed
* 'Application' is removed from form title, since it makes form description huge

Change-Id: I1923eb9eeeb5e2876c5f94fb8be86af859eb968f

README.rst

@@ -14,10 +14,9 @@ Murano. With murano-dashboard user is able to easily manage and control
 application catalog, running applications and created environments alongside
 with all other OpenStack resources.
 
-For developer purpose, please run *./prepare_murano.sh* and provide
+For developer purpose, please place OpenStack Dashboard extension file, located
-openstack_dashboard directory location. It will configure horizon to enable
+at *local/_50_murano.py* under horizon/openstack_dashboard/local/enabled
-Murano. Also it will copy opensatck_dashboard settings file to be able to run developer server,
+directory and run horizon as usually.
-to debug muranodashboard.
 
 Project Resources
 -----------------

muranodashboard/templates/catalog/app_tile.html

@@ -15,7 +15,7 @@
             <div class="col-xs-10 col-sm-8 col-md-8 col-lg-8 description">
                 <h4>{{ app.name }}</h4>
 
-                <p title="{{ app.description }}">{{ app.description|striptags|truncatechars:130 }}</p>
+                <p>{{ app.description|striptags|truncatechars:130 }}</p>
 
                 <div class="app-details-link"><a
                         href="{% url 'horizon:murano:catalog:application_details' app.id %}"

muranodashboard/templates/catalog/index.html

@@ -6,8 +6,10 @@
 {% block title %}{% trans "Applications" %}{% endblock %}
 
 {% block page_header %}
-    <link rel="stylesheet" href="{% static 'muranodashboard/css/catalog.css' %}">
+    <link rel="stylesheet"
-    <link rel="stylesheet" href="{% static 'horizon/lib/font-awesome/css/font-awesome.min.css' %}">
+          href="{% static 'muranodashboard/css/catalog.css' %}">
+    <link rel="stylesheet"
+          href="{% static 'horizon/lib/font-awesome/css/font-awesome.min.css' %}">
     {% include "horizon/common/_page_header.html" with title=_("Applications") %}
 {% endblock page_header %}
 
@@ -17,7 +19,7 @@
 
 {% block main %}
     <div class="table_wrapper">
-        <h3 class="quota-heading">{%  trans 'Recent Activity' %}</h3>
+        <h3 class="quota-heading">{% trans 'Recent Activity' %}</h3>
         {% if latest_list|length > 0 %}
             <div class="app-row app-list">
                 {% for app in latest_list %}
@@ -33,12 +35,16 @@
                 <div class="col-xs-12 col-sm-3 col-md-4 col-lg-4 col-row">
                     <h3 class="heading_switcher">{% trans 'App Category:' %}
                         <div class="header dropdown">
-                            <a href="#" class="btn btn-sm btn-default dropdown-toggle">
+                            <a href="#"
-                            {{ current_category }}  <b class="caret"></b></a>
+                               class="btn btn-sm btn-default dropdown-toggle">
+                                {{ current_category }} <b
+                                    class="caret"></b></a>
                             <ul class="dropdown-menu row_actions clearfix">
                                 {% for category in categories %}
-                                    <li class="clearfix"><a tabindex="-1" href="
+                                    <li class="clearfix"><a tabindex="-1"
-                                    {% url 'horizon:murano:catalog:index' %}?category={{ category|urlencode }}" class="btn btn-small">
+                                                            href="
+                                    {% url 'horizon:murano:catalog:index' %}?category={{ category|urlencode }}"
+                                                            class="btn btn-small">
                                         {{ category }}</a></li>
                                 {% endfor %}
                             </ul>
@@ -53,13 +59,19 @@
 
                 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-row">
                     <div class="table_search client pull-right">
-                        <form class="search" method="GET" action="{% url 'horizon:murano:catalog:index' %}">
+                        <form class="search" method="GET"
+                              action="{% url 'horizon:murano:catalog:index' %}">
                             <div class="form-group has-feedback">
-                                <input class="form-control" value="{{ search }}" type="text" name="search" placeholder="Filter">
+                                <input class="form-control"
+                                       value="{{ search }}" type="text"
+                                       name="search" placeholder="Filter">
                                 <span class="glyphicon glyphicon-search form-control-feedback search-icon"></span>
                             </div>
                             <div class="form-group">
-                                <button type="submit" class="btn btn-default btn-sm" id="apps__action_filter">Filter</button>
+                                <button type="submit"
+                                        class="btn btn-default btn-sm"
+                                        id="apps__action_filter">Filter
+                                </button>
                             </div>
                         </form>
                     </div>
@@ -76,18 +88,31 @@
             </div>
             <div class="col-row col-xs-12">
                 <div class="btn-toolbar centering">
-                  <div class="btn-group">
+                    <div class="btn-group">
-                      {% if view.has_prev_page %}
+                        {% if view.has_prev_page %}
-                          <a class="btn btn-default" href="{{ view.prev_page_url }}">{% trans "Previous Page" %}</a>
+                            <a class="btn btn-default"
-                      {% endif %}
+                               href="{{ view.prev_page_url }}">{% trans "Previous Page" %}</a>
-                      {% if view.has_next_page %}
+                        {% endif %}
-                          <a class="btn btn-default" href="{{ view.next_page_url }}">{% trans "Next Page" %}</a>
+                        {% if view.has_next_page %}
-                      {% endif %}
+                            <a class="btn btn-default"
-                  </div>
+                               href="{{ view.next_page_url }}">{% trans "Next Page" %}</a>
+                        {% endif %}
+                    </div>
                 </div>
             </div>
         {% else %}
             <p class="col-xs-12 alert alert-info">{% trans "There are no applications in the catalog." %}</p>
         {% endif %}
     </div>
+    <script>
+        $('.description h4').each(function () {
+            $(this).bind('mouseenter', function () {
+                var $this = $(this);
+
+                if (this.offsetWidth < this.scrollWidth && !$this.attr('title')) {
+                    $this.attr('title', $this.text());
+                }
+            });
+        });
+    </script>
 {% endblock %}

muranodashboard/templates/services/_wizard_create.html

@@ -46,7 +46,7 @@
 <p>{% blocktrans %} {{ extended_description }} {% endblocktrans %}</p>
 </div>
 <div class="right">
-    <h3> {% blocktrans %} {{ service_name }} Application{% endblocktrans %} </h3>
+    <h3> {% blocktrans %} {{ service_name }} {% endblocktrans %} </h3>
     {% for name, title, description in field_descriptions %}
         <p>
         {% if title %}