refactoring list manager

templates/web/prod/actions/Feedback/ListsMacros.html.twig

@@ -102,17 +102,17 @@
 
 
 {% macro badgeReadonly(entry, role) %}
-  <div class="badge">
+  <div class="badge listmanager_badge">
     <input type="hidden" value="{{ entry.getUser().getId() }}" name="id">
-    {% if role >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+    {#{% if role >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
       <a class="deleter listmanager-delete-list-user-action" href="#" data-list-id="" data-user-id="{{ entry.getUser().getId() }}">
         <img src="/assets/prod/images/Push/close_badge.png">
       </a>
-    {% endif %}
+    {% endif %}#}
     <table>
       <tr>
-        <td>
+        <td class="listmanager_badge_img">
-          <img src="/assets/common/images/icons/user.png"/>
+          <img src="/assets/common/images/icons/user-white.png"/>
         </td>
         <td class="infos" >
           <span class="name">{{ entry.getUser().getDisplayName() }}</span>

templates/web/prod/actions/Feedback/list.html.twig

@@ -1,53 +1,84 @@
 {% import 'prod/actions/Feedback/ListsMacros.html.twig' as ListsMacros %}
-
+<div class="PNB10" style="height: 46px;bottom:auto;line-height:26px;">
-<div class="PNB10">
+    <div class="pull-left">
-    <div class="PNB theme-bg" style="height:40px; bottom:auto;">
+        <div id="find-user">
-        <table style="height: 40px;">
+            <input class="search" name="users-search" placeholder="{{ list.getName() }}" type="text" style="width:210px;"/>
-            <tr>
+        </div>
-                <td style="white-space:nowrap;">
+        <p id="recommanded-users">
-                    {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+         
-                        <form class="form-inline" method="POST" name="SaveName" action="{{ path('prod_lists_list_update', { 'list_id' : list.getId() }) }}">
+        </p>
-                            <label>{{ 'List Name' | trans }}</label>
-                            <input type="text" name="name" style="margin: 0 5px;" value="{{ list.getName() }}"/>
-                            <button class="btn btn-inverse">{{ 'Save' | trans }}</button>
-                        </form>
-                    {% else %}
-                        <h1>{{ list.getName() }}</h1>
-                    {% endif %}
-                </td>
-                <td style="text-align:right;white-space:nowrap;">
-                    {% if list.getOwner(app.getAuthenticatedUser()).getRole() == constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_ADMIN') %}
-                        <a href="{{ path('prod_lists_list_share', { 'list_id' : list.getId() }) }}" title="{{ 'Share the list' | trans }}"
-                           class="list_sharer push-list-share-action"
-
-                        data-list-id="{{ list.getId() }}">
-                            <img src="/assets/prod/images/Push/list-icon.png" />
-                            {{ "Set sharing permission" | trans }}
-                        </a>
-                    {% endif %}
-                </td>
-                {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_ADMIN') %}
-                    <td style="text-align:right;white-space:nowrap;width:150px;">
-                        <button class="deleter btn btn-inverse listmanager-delete-list-action" data-list-id="{{ list.getId() }}">
-                            {{ 'Delete' | trans }}
-                        </button>
-                    </td>
-                {% endif %}
-            </tr>
-        </table>
     </div>
-    <div class="PNB content readonly grey-bg" style="top:40px;">
+    <div class="pull-left">
+        {% if app.getAclForUser(app.getAuthenticatedUser()).has_right(constant('\\ACL::CANADMIN')) %}
+            <a href="#" class="push-add-user btn btn-push-orange" style="width:120px;margin-left:30px;margin-top:2px;">
+                <img src="/assets/common/images/icons/orange-plus.png" class="image-normal">
+                <img src="/assets/common/images/icons/white-plus.png" class="image-hover">
+                {{ 'Create a user' | trans }}
+            </a>
+        {% endif %}
+    </div>
+     <div class="pull-right">
+        {% if list.getOwner(app.getAuthenticatedUser()).getRole() == constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_ADMIN') %}
+            <a href="{{ path('prod_lists_list_share', { 'list_id' : list.getId() }) }}" 
+                class="btn btn-push-orange list_sharer push-list-share-action" 
+                style="margin-top:2px;height:20px;line-height:22px;" 
+                title="{{ 'Share the list' | trans }}"
+                data-list-id="{{ list.getId() }}">
+                <span>
+                    <img src="/assets/common/images/icons/orange-share.png" class="image-normal" style="margin-right: 15px;">
+                    <img src="/assets/common/images/icons/white-share.png" class="image-hover" style="margin-right: 15px;">
+                </span>
+                {{ 'Share my list' | trans }}
+            </a>
+        {% endif %}
+    </div>
+</div>
+<div class="PNB10" style="top:55px;">
+    <div class="PNB content user_content readonly grey-bg">
         <div class="PNB10">
             <div class="PNB" style="height:25px; bottom:auto;">
-                <p>
+                <div class="pull-left">
+                    <h2 style="font-size:25px;margin:0;line-height:30px;">{{ list.getName() }}</h2>
                     {% set length = list.getEntries().count() %}
-                    <span class="counter current">{% trans with {'%length%' : length} %}%length% peoples{% endtrans %}</span>
+                    <span class="counter current">
-                    {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+                        {% trans with {'%length%' : length} %}%length% peoples{% endtrans %}
-                        <button class="EditToggle btn btn-inverse">{{ 'Edit' | trans }}</button>
+                    </span>
-                    {% endif %}
+                </div>
-                </p>
+                <div class="pull-right">
+                    <div class="pull-left" style="margin-right:45px;">
+                        {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+                            <button class="EditToggle btn btn-push-orange btn-orange-inverse" style="line-height: 22px;">
+                                <span>
+                                    <img src="/assets/common/images/icons/orange-pen.png" class="image-normal" style="margin-right: 10px;">
+                                    <img src="/assets/common/images/icons/white-pen.png" class="image-hover" style="margin-right: 10px;">
+                                </span>
+                                {{ 'Advanced mode' | trans }}
+                            </button>
+                        {% endif %}
+                    </div>
+                    <div class="options pull-left">
+                        <div class="pull-left">
+                            <button class="select-all push-add-user btn btn-push-orange orange-border"
+                            style="margin-right: 8px;">
+                                {{ 'Select all' | trans }}
+                            </button>
+                            <button class="unselect-all push-add-user btn btn-push-orange orange-border">
+                                {{ 'Deselect all' | trans }}
+                            </button>
+                        </div>
+                        <div class="pull-right">
+                            {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_ADMIN') %}
+                                <button class="delete-selection btn btn-inverse listmanager-delete-list-action" 
+                                data-list-id="{{ list.getId() }}"
+                                style="margin-left:45px;">
+                                    {{ 'Delete the selection' | trans }}
+                                </button>
+                            {% endif %}
+                        </div>
+                    </div>
+                </div>
             </div>
-            <div class="PNB" style="top:35px;overflow:auto;">
+            <div class="PNB" style="top:80px;overflow:auto;">
                 {% set role = list.getOwner(app.getAuthenticatedUser()).getRole() %}
                 {% for entry in list.getEntries() %}
                     {{ ListsMacros.badgeReadonly(entry, role) }}
@@ -56,12 +87,47 @@
         </div>
     </div>
     {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
-        <div class="PNB content readwrite grey-bg" style="display:none;top:40px;">
+        <div class="PNB content readwrite user_content" style="display:none;">
+            <div class="PNB10" style="height:40px; bottom:auto;">
+                <table style="height: 40px;">
+                    <tr>
+                        <td style="white-space:nowrap;">
+                            {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+                                <form class="form-inline" method="POST" name="SaveName" action="{{ path('prod_lists_list_update', { 'list_id' : list.getId() }) }}">
+                                    <label style="margin-right: 45px;">{{ 'List Name' | trans }}</label>
+                                    <input type="text" name="name" class="text_input_white orange_text" style="margin: 0 5px;" value="{{ list.getName() }}"/>
+                                    <button class="saveList pull-right orange_text">
+                                        <img src="/assets/common/images/icons/orange-save.png" class="image-normal">
+                                        <img src="/assets/common/images/icons/white-save.png" class="image-hover">
+                                        {{ 'Save' | trans }}
+                                    </button>
+                                </form>
+                            {% else %}
+                                <h1>{{ list.getName() }}</h1>
+                            {% endif %}
+                        </td>
+                        {#<td style="text-align:right;white-space:nowrap;">
+                            {% if list.getOwner(app.getAuthenticatedUser()).getRole() == constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_ADMIN') %}
+                                <a href="{{ path('prod_lists_list_share', { 'list_id' : list.getId() }) }}" title="{{ 'Share the list' | trans }}"
+                                class="list_sharer push-list-share-action"
+                                 data-list-id="{{ list.getId() }}">
+                                    <img src="/assets/prod/images/Push/list-icon.png" />
+                                    {{ "Set sharing permission" | trans }}
+                                </a>
+                            {% endif %}
+                        </td>#}
+                    </tr>
+                </table>
+            </div>
             <form name="list-editor-search" method="POST" action="{{ path('prod_push_list_edit', { 'list_id' : list.getId() }) }}">
-                <div class="PNB10" style="height:160px;">
+                <div class="PNB10 list_editor_search" style="height:160px;">
                     <div class="PNB" style="height:40px;bottom:auto;">
-                        <button class="Refresher btn btn-inverse" type="button">&lt;{{ 'View' | trans }}</button>
+                        <a class="Refresher btn push-back-link btn-inverse">
-                        <select name="like_field">
+                            <img src="/assets/common/images/icons/chevron-left-white.png" class="image-normal">
+                            <img src="/assets/common/images/icons/chevron-left-blue.png" class="image-hover">
+                            <span>{{ 'See the list' | trans }}</span>
+                        </a>
+                        <select name="like_field" style="margin-right:30px;height:25px;">
                             <option value="usr_login">
                                 {{ 'Push::filter on login' | trans }}
                             </option>
@@ -82,31 +148,45 @@
                             </option>
                         </select>
                         {{ 'Push::filter starts' | trans }}
-                        <input type="text" value="" class="search" name="query">
+                        <input type="text" value="" placeholder="Search" name="query" style="height:15px;margin:2px;">
-                        <button type="submit" class="btn btn-inverse">{{ 'boutton::chercher' | trans }}</button>
+                        <button type="submit" class="list_refresh btn" style="margin-top:1px;height:25px;width:25px;line-height: 10px;">
+                            <img src="/assets/common/images/icons/orange-search.png" alt="Search" class="image-normal">
+                            <img src="/assets/common/images/icons/white-search.png" alt="Search" class="image-hover">
+                        </button>
                     </div>
-                    <div class="PNB" style="top:40px;height:120px;bottom:auto;">
+                    <div class="PNB list_editor_selector" style="top:40px;height:120px;bottom:auto;">
                         <table style="table-layout:fixed;width:100%;">
                             <tr>
                                 <td>
-                                    <label>{{ 'Activite' | trans }}</label>
+                                    <label>{{ 'E-mail domain' | trans }}</label>
                                 </td>
                                 <td>
-                                    <label>{{ 'Template' | trans }}</label>
+                                    <label>{{ 'Activity' | trans }}</label>
                                 </td>
                                 <td >
                                     <label>{{ 'Company' | trans }}</label>
                                 </td>
+                                <td >
+                                    <label>{{ 'Position' | trans }}</label>
+                                </td>
                                 <td >
                                     <label>{{ 'Country' | trans }}</label>
                                 </td>
                                 <td >
-                                    <label>{{ 'Position' | trans }}</label>
+                                    <label>{{ 'Template' | trans }}</label>
                                 </td>
                             </tr>
                             <tr>
                                 <td>
-                                    <select size="5" multiple="multiple" name="Activity[]" style="width:80%;">
+                                    <select size="5" multiple="multiple" name="Email[]" style="width:95%;">
+                                        <option value="">{{ 'All' | trans }}</option>
+                                        {% for Email in query.getRelatedActivities() %}
+                                            <option value="{{ Email }}">{{ Email }}</option>
+                                        {% endfor %}
+                                    </select>
+                                </td>
+                                <td>
+                                    <select size="5" multiple="multiple" name="Activity[]" style="width:95%;">
                                         <option value="">{{ 'All' | trans }}</option>
                                         {% for Activity in query.getRelatedActivities() %}
                                             <option value="{{ Activity }}">{{ Activity }}</option>
@@ -114,15 +194,7 @@
                                     </select>
                                 </td>
                                 <td>
-                                    <select size="5" multiple="multiple" name="Template[]" style="width:80%;">
+                                    <select size="5" multiple="multiple" name="Company[]" style="width:95%;">
-                                        <option value="">{{ 'All' | trans }}</option>
-                                        {% for Template in query.getRelatedTemplates() %}
-                                            <option value="{{ Template }}">{{ Template }}</option>
-                                        {% endfor %}
-                                    </select>
-                                </td>
-                                <td>
-                                    <select size="5" multiple="multiple" name="Company[]" style="width:80%;">
                                         <option value="">{{ 'All' | trans }}</option>
                                         {% for Company in query.getRelatedCompanies() %}
                                             <option value="{{ Company }}">{{ Company }}</option>
@@ -130,7 +202,15 @@
                                     </select>
                                 </td>
                                 <td>
-                                    <select size="5" multiple="multiple" name="Country[]" style="width:80%;">
+                                    <select size="5" multiple="multiple" name="Position[]" style="width:95%;">
+                                        <option value="">{{ 'All' | trans }}</option>
+                                        {% for Position in query.getRelatedPositions() %}
+                                            <option value="{{ Position }}">{{ Position }}</option>
+                                        {% endfor %}
+                                    </select>
+                                </td>
+                                <td>
+                                    <select size="5" multiple="multiple" name="Country[]" style="width:95%;">
                                         <option value="">{{ 'All' | trans }}</option>
                                         {% for Code, Country in query.getRelatedCountries() %}
                                             <option value="{{ Code }}">{{ Country }}</option>
@@ -138,10 +218,10 @@
                                     </select>
                                 </td>
                                 <td>
-                                    <select size="5" multiple="multiple" name="Position[]" style="width:80%;">
+                                    <select size="5" multiple="multiple" name="Template[]" style="width:95%;">
                                         <option value="">{{ 'All' | trans }}</option>
-                                        {% for Position in query.getRelatedPositions() %}
+                                        {% for Template in query.getRelatedTemplates() %}
-                                            <option value="{{ Position }}">{{ Position }}</option>
+                                            <option value="{{ Template }}">{{ Template }}</option>
                                         {% endfor %}
                                     </select>
                                 </td>
@@ -154,10 +234,8 @@
                 <input type="hidden" name="ord" value="{{ ord }}" />
                 <input type="hidden" name="type" value="fragment" />
             </form>
-            <div class="PNB content" style="top:180px;">
+            <div class="PNB10 content" style="top:240px;">
-                <div class="PNB10">
+                {{ ListsMacros.ResultTable(query, results, list, sort, ord) }}
-                    {{ ListsMacros.ResultTable(query, results, list, sort, ord) }}
-                </div>
             </div>
         </div>
     {% endif %}

templates/web/prod/actions/Feedback/lists-all.html.twig

@@ -1,27 +1,41 @@
-
+<div class="PNB lists content">
-      <div class="PNB10 lists">
+  <div style="padding:10px 20px 10px;">
-        <h1>{{ 'Lists' | trans }}</h1>
+    <ul class="general_togglers" style="list-style: none;">
-        <span class="action">
+      <li>
-          <a href="{{ path('prod_lists_list') }}" class="list_adder link push-add-list-action">
+        <a href="{{ path('prod_lists_list') }}" class="list_adder link push-add-list-action push-add-user btn btn-block btn-push-orange">
-            {{ "Add" | trans }}
+          <img src="/assets/common/images/icons/orange-plus.png" class="image-normal">
-          </a>
+          <img src="/assets/common/images/icons/white-plus.png" class="image-hover">
-          <a href="{{ path('prod_lists_all') }}" class="list_refresh link push-refresh-list-action">
+          {{ "Add a list" | trans }}
-            {{ "Refresh" | trans }}
+        </a>
-          </a>
+      </li>
-        </span>
+    </ul>
-        <ul class="lists">
+  </div>
-          {% for list in lists %}
+  <div style="padding: 0 10px;">
-            <li class="list" style="padding:2px;">
+    <span class="main-title">
-              <a href="#" class="list_link list-edit-action" data-list-id="{{  list.getId() }}">
+      <img src="/assets/common/images/icons/list-grey.png">{{ 'Lists' | trans }}
-                {% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}
+    </span>
-                  <img src="/assets/prod/images/Push/list-icon.png" />
+    <a href="{{ path('prod_lists_all') }}" class="list_refresh link push-refresh-list-action btn pull-right" style="margin-top: -2px;">
-                {% else %}
+      <img src="/assets/common/images/icons/orange-refresh.png" alt="Refresh list" class="image-normal">
-                  <img src="/assets/common/images/icons/SHARE16.png" />
+      <img src="/assets/common/images/icons/white-refresh.png" alt="Refresh list" class="image-hover">
-                {% endif %}
+    </a>
-                {{ list.getName() }}
+  </div>
-                <span class="counter">({{ list.getEntries().count() }})</span>
+  <ul class="lists">
-              </a>
+    {% for list in lists %}
-            </li>
+      <li class="list lists_manager_list" style="padding:0;position:relative;">
-          {% endfor %}
+        <a href="#" class="list_link list-edit-action" data-list-id="{{  list.getId() }}">
-        </ul>
+          {#{% if list.getOwner(app.getAuthenticatedUser()).getRole() >= constant('Alchemy\\Phrasea\\Model\\Entities\\UsrListOwner::ROLE_EDITOR') %}#}
-      </div>
+            {#<img src="/assets/prod/images/Push/list-icon.png" />#}
+          {#{% else %}#}
+            {#<img src="/assets/common/images/icons/SHARE16.png" />#}
+          {#{% endif %}#}
+          {{ list.getName() }}
+          <span class="counter">({{ list.getEntries().count() }})</span>
+        </a>
+        <button class="list-trash-btn">
+          <img src="/assets/common/images/icons/delete-black.png" class="image-normal"/>
+          <img src="/assets/common/images/icons/delete-white.png" class="image-hover"/>
+        </button>
+      </li>
+    {% endfor %}
+  </ul>
+</div>

templates/web/prod/actions/Push.html.twig

@@ -60,7 +60,7 @@
                     <div class="list-container">
                         <span class="main-title">
                             <img src="/assets/common/images/icons/list-grey.png"/>{{ 'Lists' | trans }}</span>
-                        <ul class="list">
+                        <ul class="lists">
                             {% for list in lists %}
                                 <li class="list" style="padding:6px 2px;position: relative;"
                                     data-list-id= {{ list.getId() }}>
@@ -262,39 +262,41 @@
 </div>
 
 <div id="ListManager" class="PNB PushBox" style="display:none;">
-    <div class="PNB theme-bg" style="left:10px;height:50px;bottom:auto;">
+    <div class="PNB" style="width:220px;">
-        <h1>
+        <div style="padding:10px">
-            <button class="back_link btn btn-inverse" style="margin-right: 5px;">
+            <a class="back_link btn push-back-link" style="margin-right:5px;margin-top:5px;">
-                &lt;
                 {% if context == 'Push' %}
-                    {{ 'Back to Push' | trans }}
+                    <img src="/assets/common/images/icons/chevron-left-white.png" class="image-normal">
+                    <img src="/assets/common/images/icons/chevron-left-blue.png" class="image-hover">
+                    <span>{{ 'Back to Push' | trans }}</span>
                 {% else %}
-                    {{ 'Back to Feedback' | trans }}
+                    <img src="/assets/common/images/icons/chevron-left-white.png" class="image-normal">
+                    <img src="/assets/common/images/icons/chevron-left-green.png" class="image-hover">
+                    <span>{{ 'Back to Feedback' | trans }}</span>
                 {% endif %}
-            </button>
+            </a>
-            <span class="title">
-                {{ 'List Manager' | trans }}
-            </span>
-        </h1>
-    </div>
-    <div class="PNB" style="top:50px;">
-        <div class="PNB" style="width:320px;right:auto;">
-            <div class="PNB10 content all-lists LeftColumn">
-                {% include 'prod/actions/Feedback/lists-all.html.twig' %}
-            </div>
         </div>
-        <div class="editor PNB" style="left:320px;">
+        <div class="PNB10 all-lists LeftColumn" style="top:55px;">
-            <div class="welcome">
+            {% include 'prod/actions/Feedback/lists-all.html.twig' %}
-                <h1>{{ 'Welcome to the ListManager !' | trans }}</h1>
+        </div>
-                {% if lists|length == 0 %}
+    </div>
-                    <p class="welcome">
+    <div class="PNB" style="left:220px;">
-                        {{ 'Start by creating one by using the "add" button on the left !' | trans }}
+        <div class="editor PNB">
-                    </p>
+            <div class="PNB" style="top: 45px;">
-                {% else %}
+                <div class="PNB10 content user_content grey-bg">
-                    <p class="welcome">
+                    <div class="welcome">
-                        {{ 'Select a list on the left and edit it !' | trans }}
+                        <h1>{{ 'Welcome to the ListManager !' | trans }}</h1>
-                    </p>
+                        {% if lists|length == 0 %}
-                {% endif %}
+                            <p class="welcome">
+                                {{ 'Start by creating one by using the "add" button on the left !' | trans }}
+                            </p>
+                        {% else %}
+                            <p class="welcome">
+                                {{ 'Select a list on the left and edit it !' | trans }}
+                            </p>
+                        {% endif %}
+                    </div>
+                </div>
             </div>
         </div>
     </div>