projet list view and resource list view.
authorcavaliet
Thu, 16 May 2013 12:48:09 +0200
changeset 5 d0447a83ca2b
parent 4 08d053be2440
child 7 2ffcd52445f5
projet list view and resource list view.
src/metadatacomposer/static/metadatacomposer/js/resource_pagination.js
src/metadatacomposer/templates/metadatacomposer_home.html
src/metadatacomposer/templates/metadatacomposer_project_list.html
src/metadatacomposer/templates/metadatacomposer_resource_list.html
src/metadatacomposer/templates/partial/resource_content_list.html
src/metadatacomposer/urls.py
src/metadatacomposer/views.py
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/metadatacomposer/static/metadatacomposer/js/resource_pagination.js	Thu May 16 12:48:09 2013 +0200
@@ -0,0 +1,21 @@
+function init_content_pagination_events(){
+	// Load pagination for contents
+    $(document).on('click', 'a.content_pagination', function(e){
+    	e.preventDefault();e.stopPropagation();
+    	var url = $(this).attr('href');
+    	console.log("coucou url = " + url);
+        $.ajax({
+            url: url,
+            cache: false,
+            type: 'GET',
+            success: function(data, status, request) {
+            	$("#content_list_container").html(data);
+            	init_content_pagination_events();
+            },
+    		error: function(jqXHR, textStatus, errorThrown) {
+    			resp = $.parseJSON(jqXHR.responseText);
+    			alert(resp.message);
+    		}
+        });
+    });
+}
\ No newline at end of file
--- a/src/metadatacomposer/templates/metadatacomposer_home.html	Wed May 15 17:21:21 2013 +0200
+++ b/src/metadatacomposer/templates/metadatacomposer_home.html	Thu May 16 12:48:09 2013 +0200
@@ -29,19 +29,21 @@
         <header>
             <div class="container">
                 <div class="row">
-                    <div class="span3"><h1><a class="clearfix" href="">
+                    <div class="span3"><h1><a class="clearfix" href="{% url composer_home branding=branding %}">
                         {% include top_header_partial %}
                     </a></h1></div>
                     <div class="span9">
                         <ul class="breadcrumb nav-bar">
-                        <li><a href="#"><i class="icon-file"></i> Projets</a> <span class="divider">/</span></li>
-                        <li><a href="#"><i class="icon-folder-close-alt"></i>Ressources</a></li>
+                        <li><a href="{% url composer_project_list branding=branding %}"><i class="icon-file"></i> Projets</a> <span class="divider">/</span></li>
+                        <li><a href="{% url composer_resource_list branding=branding %}"><i class="icon-folder-close-alt"></i>Ressources</a></li>
                         </ul>
                     </div>
                 </div>
             </div>
         </header>
         <section>
+          {% block containers %}
+            <!-- block containers -->
             <article class="container">
                 <div class="row article-title">
                     <h3 class="span8"><i class="icon-file"></i>Derniers projets</h3>
@@ -102,14 +104,18 @@
                   {% endfor %}
                 </div>
             </article>
+            <!-- endblock containers -->
+          {% endblock %}
         </section>
         <footer></footer>
     </div><!-- wrap -->
 {% endblock %}
+    {% block modal_divs %}
+    {% endblock %}
     {% block js_import %}
     <script src="{% static 'metadatacomposer/js/jquery-1.9.1.min.js' %}"></script>
-    <script src="{% static 'js/bootstrap.js' %}"></script>
-    <script src="{% static 'js/main.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/bootstrap.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/main.js' %}"></script>
     {% endblock %}
 {% endblock %}
 </body>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/metadatacomposer/templates/metadatacomposer_project_list.html	Thu May 16 12:48:09 2013 +0200
@@ -0,0 +1,86 @@
+{% extends "metadatacomposer_home.html" %}
+{% load static %}
+{% load i18n %}
+{% load analytics %}
+{% load thumbnail %}
+{% load front_tags %}
+
+{% block title %}{% trans "Project list" %}{% endblock %}
+
+{% block containers %}
+            <article class="container">
+                <div class="row article-title">
+                    <h3 class="span8"><i class="icon-file"></i> Liste des projets</h3>
+                    <div class="span4 wrap-btn-add"><a data-type-media="video" data-title="Bibliothèque" class="btn btn-success open-modal" href="modal-bibliotheque.html">Ajouter un projet <i class="icon-plus-sign"></i></a></div>
+                </div>
+                <table class="row table table-striped">
+                    <thead>
+                        <tr>
+                            <th>Aperçu</th>
+                            <th>Titre</th>
+                            <th>Média associé</th>
+                            <th>Modification</th>
+                            <th>URL</th>
+                            <th>Embed</th>
+                            <th>Actions</th>
+                        </tr>
+                    </thead>
+                    <tbody class="liste">
+                      {% for p in results.object_list %}
+                        <tr>
+                            <td>{% thumbnail p.image "60x60" crop="center" format="PNG" as im %}<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />{% empty %}<img src="{% static 'metadatacomposer/img/60x60.gif' %}" width="60px" height="60px" />{% endthumbnail %}</td>
+                            <td>{{ p.title }}</td>
+                            <td>{% with c=p.contents.all|first %}<a href="#">{{ c.title }}</a>{% endwith %}</td>
+                            <td>{{ p.modification_date|date:"Y/m/d" }}</td>
+                            <td>
+                                <form action="#">
+                                    <input class="input-small in-table" id="url-azerty" type="text" value="http://google.com" readonly="readonly">
+                                    <a href="#" class="btn clipboard" data-clipboard-target="url-azerty"><i class="icon-link"></i></a>
+                                </form>
+                            </td>
+                            <td>
+                                <form action="#">
+                                    <input class="input-small in-table" id="url-qwerty" type="text" value="http://youtu.be" readonly="readonly">
+                                    <a href="#" class="btn clipboard" data-clipboard-target="url-qwerty"><i class="icon-link"></i></a>
+                                </form>
+                            </td>
+                            <td class="actions">
+                                <table>
+                                    <tr>
+                                        <td><a class="btn" href="#"><i class="icon-pencil"></i></a></td>
+                                        <td><a class="btn btn-delete" data-title="Titre du média" href="#"><i class="icon-remove"></i></a></td>
+                                    </tr>
+                                    <tr>
+                                        <td><a class="btn" href="#"><i class="icon-eye-open"></i></a></td>
+                                        <td><a class="btn" href="#"><i class="icon-copy"></i></a></td>
+                                    </tr>
+                                </table>        
+                            </td>
+                        </tr>
+                      {% endfor %}
+                    </tbody>
+                </table>
+                <div class="pagination">
+                    <ul>
+		            {% if results.has_previous %}
+		                <li><a href="?page={{ results.previous_page_number }}" >{% trans "Previous" %}</a></li>
+		            {% else %}
+		               <li class="disabled"><a>{% trans "Previous" %}</a></li>
+		            {% endif %}
+		            {% if results.paginator.num_pages > 1 %}
+		              {% for i in results.paginator.num_pages|get_range %}
+		                 <li {% if i|add:'1' == results.number %}class="active"{% endif %}><a href="?page={{i|add:'1'}}">{{i|add:'1'}}</a></li>
+		              {% endfor %}
+		            {% endif %}
+		            {% if results.has_next %}
+		                <li><a href="?page={{ results.next_page_number }}">{% trans "Next" %}</a></li>
+                    {% else %}
+                       <li class="disabled"><a>{% trans "Next" %}</a></li>
+                    {% endif %}
+		            {% if results.paginator.num_pages > 1 %}
+		                <li><a href="?page=x">({% trans "All" %})</a></li>
+		            {% endif %}
+                    </ul>
+                </div>
+            </article>
+{% endblock %}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/metadatacomposer/templates/metadatacomposer_resource_list.html	Thu May 16 12:48:09 2013 +0200
@@ -0,0 +1,145 @@
+{% extends "metadatacomposer_home.html" %}
+{% load static %}
+{% load i18n %}
+{% load analytics %}
+{% load thumbnail %}
+{% load front_tags %}
+
+{% block title %}{% trans "Project list" %}{% endblock %}
+
+{% block containers %}
+            <div class="container">
+                <ul class="nav nav-tabs tab-behavior">
+                    <li class="active"><a href="#image-section"><i class="icon-picture"></i> Image</a></li>
+                    <li><a href="#video-section"><i class="icon-film"></i> Video</a></li>
+                </ul>
+                 
+                <div class="tab-content">
+                    <article class="tab-pane active" id="image-section">
+                        <div class="row article-title">
+                            <h3 class="span8"><i class="icon-picture"></i> Liste des images</h3>
+                            <div class="span4 wrap-btn-add">
+                                <a data-type-media="image" data-title="Ajouter une image" class="btn btn-success open-modal" href="modal-image.html">
+                                    Ajouter une image <i class="icon-plus-sign"></i>
+                                </a>
+                            </div>
+                        </div>
+
+                        <table class="table table-striped">
+                            <thead>
+                                <tr>
+                                    <th>Aperçu</th>
+                                    <th>Titre</th>
+                                    <th>Projets associés</th>
+                                    <th>Date de modification</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody class="liste">
+                                <tr id="row-list-ressources-image-id1">
+                                    <td><img src="img/60x60.gif" alt=""></td>
+                                    <td>Titre de l'image qwerty</td>
+                                    <td>
+                                        <ul>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                        </ul>
+                                    </td>
+                                    <td>14/03/2014</td>
+                                    <td>
+                                        <a data-type-media="image" data-title="Modifier une image" class="btn open-modal" href="modal-image.html"><i class="icon-pencil"></i></a>
+                                        <a class="btn btn-delete" data-title="Titre du média" href="#row-list-ressources-image-id1">
+                                            <i class="icon-remove"></i>
+                                        </a>
+                                    </td>
+                                </tr>
+                                <tr id="row-list-ressources-image-id2">
+                                    <td><img src="img/60x60.gif" alt=""></td>
+                                    <td>Titre de l'image azerty</td>
+                                    <td>
+                                        <ul>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                            <li><a href="">Titre du projet azerty</a></li>
+                                        </ul>
+                                    </td>
+                                    <td>14/03/2014</td>
+                                    <td>
+                                        <a data-type-media="image" data-title="Modifier une image" class="btn open-modal" href="modal-image.html"><i class="icon-pencil"></i></a>
+                                        <a class="btn btn-delete" data-title="Titre du média" href="#row-list-ressources-image-id2">
+                                            <i class="icon-remove"></i>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                        <div class="pagination">
+                            <ul>
+                                <li class="disabled"><a href="#">Prev</a></li>
+                                <li class="active"><a href="#">1</a></li>
+                                <li><a href="#">2</a></li>
+                                <li><a href="#">3</a></li>
+                                <li><a href="#">4</a></li>
+                                <li><a href="#">5</a></li>
+                                <li><a href="#">Next</a></li>
+                            </ul>
+                        </div>
+                    </article>
+
+                    <div class="tab-pane" id="video-section">
+                        <article class="tab-pane active" id="video-section">
+                            <div class="row article-title">
+                                <h3 class="span8"><i class="icon-film"></i> Liste des vidéos</h3>
+                                <div class="span4 wrap-btn-add">
+                                    <a data-type-media="video" data-title="Ajouter une vidéo" class="btn btn-success open-modal" href="modal-video.html">
+                                        Ajouter une vidéo <i class="icon-plus-sign"></i>
+                                    </a>
+                                </div>
+                            </div>
+                            <div id="content_list_container">
+                            {% include 'partial/resource_content_list.html' %}
+                            </div>
+                        </article>
+                    </div>
+                </div><!-- /.tab-content -->
+            </div>
+{% endblock %}
+{% block modal_divs %}
+    <div id="modal-template" class="modal hide fade popup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+        <div class="modal-header">
+            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+            <h3></h3>
+        </div>
+        <div class="modal-body">
+
+        </div>
+    </div>
+
+    <div id="modal-confirm" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+        <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+            <h3><i class="icon-warning-sign"></i> Confirmation de la suppression</h3>
+        </div>
+        <div class="modal-body"></div>
+        <div class="modal-footer">
+            <button class="btn" data-dismiss="modal" aria-hidden="true">Annuler</button>
+            <button id="btn-delete-modal" class="btn btn-primary">Supprimer</button>
+        </div>
+    </div>
+{% endblock %}
+{% block js_import %}
+    <script src="{% static 'metadatacomposer/js/jquery-1.9.1.min.js' %}"></script>
+    <script src="{% static 'metadatacomposer/lib/jquery-ui/ui/minified/jquery-ui.min.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/bootstrap.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/ZeroClipboard.min.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/jquery.spin-1.0.2.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/main.js' %}"></script>
+    <script src="{% static 'metadatacomposer/js/resource_pagination.js' %}"></script>
+    <script type="text/javascript">
+    $(document).ready(function(){
+    	console.log("coucou ready");
+    	init_content_pagination_events();
+    });
+    </script>
+{% endblock %}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/metadatacomposer/templates/partial/resource_content_list.html	Thu May 16 12:48:09 2013 +0200
@@ -0,0 +1,61 @@
+{% load i18n %}
+{% load front_tags %}
+                            <table class="table table-striped">
+                                <thead>
+                                    <tr>
+                                        <th>Aperçu</th>
+                                        <th>Titre</th>
+                                        <th>Projets associés</th>
+                                        <th>Date de modification</th>
+                                        <th>Actions</th>
+                                    </tr>
+                                </thead>
+                                <tbody class="liste">
+                                  {% for res in content_results %}
+                                    <tr id="row-list-ressources-video-id1">
+                                        <td><img src="img/60x60.gif" alt=""></td>
+                                        <td>{{ res.content.title }}</td>
+                                        <td>
+                                            <ul>
+                                              {% for p in res.projects %}
+                                                <li><a href="">{{ p.title }}</a></li>
+                                              {% endfor %}
+                                            </ul>
+                                        </td>
+                                        <td>{{ res.content.update_date|date:"Y/m/d" }}</td>
+                                        <td>
+                                            <a data-type-media="video" data-title="Modifier une vidéo" class="btn open-modal" href="modal-video.html"><i class="icon-pencil"></i></a>
+                                            <a class="btn btn-delete" data-title="Titre du média" href="#row-list-ressources-video-id1">
+                                            <i class="icon-remove"></i>
+                                        </a>
+                                        </td>
+                                    </tr>
+                                  {% endfor %}
+                                </tbody>
+                            </table>
+                            <div class="pagination">
+                                <ul>
+			                    {% if content_results.has_previous %}
+			                        <li><a href="{% url composer_content_page branding=branding %}?page={{ content_results.previous_page_number }}" class="content_pagination">{% trans "Previous" %}</a></li>
+			                    {% else %}
+			                       <li class="disabled"><a>{% trans "Previous" %}</a></li>
+			                    {% endif %}
+			                    {% if content_results.paginator.num_pages > 1 %}
+			                     {% for i in content_results.paginator.num_pages|get_range %}
+			                      {% if i|add:'1' == content_results.number %}
+			                        <li class="active"><a href="#">{{i|add:'1'}}</a></li>
+			                      {% else %}
+			                        <li><a href="{% url composer_content_page branding=branding %}?page={{i|add:'1'}}" class="content_pagination">{{i|add:'1'}}</a></li>
+			                      {% endif %}
+			                     {% endfor %}
+			                    {% endif %}
+			                    {% if content_results.has_next %}
+			                        <li><a href="{% url composer_content_page branding=branding %}?page={{ content_results.next_page_number }}" class="content_pagination">{% trans "Next" %}</a></li>
+			                    {% else %}
+			                       <li class="disabled"><a>{% trans "Next" %}</a></li>
+			                    {% endif %}
+			                    {% if content_results.paginator.num_pages > 1 %}
+			                        <li><a href="{% url composer_content_page branding=branding %}?page=x" class="content_pagination">({% trans "All" %})</a></li>
+			                    {% endif %}
+                                </ul>
+                            </div>
\ No newline at end of file
--- a/src/metadatacomposer/urls.py	Wed May 15 17:21:21 2013 +0200
+++ b/src/metadatacomposer/urls.py	Thu May 16 12:48:09 2013 +0200
@@ -1,8 +1,12 @@
 from django.conf.urls.defaults import patterns, url
-from metadatacomposer.views import MetadataComposerHome
+from metadatacomposer.views import MetadataComposerHome, MetadataComposerProjectList,\
+    MetadataComposerResourceList, MetadataComposerContentPagination
 
 urlpatterns = patterns('',
     url(r'^jsi18n/(?P<packages>\S+?)/$', 'django.views.i18n.javascript_catalog', name='jsi18n'),
+    url(r'^(?P<branding>.*)/projectlist/$', MetadataComposerProjectList.as_view(), name="composer_project_list"),
+    url(r'^(?P<branding>.*)/resourcelist/$', MetadataComposerResourceList.as_view(), name="composer_resource_list"),
+    url(r'^(?P<branding>.*)/contentpage/$', MetadataComposerContentPagination.as_view(), name="composer_content_page"),
     url(r'^(?P<branding>.*)/$', MetadataComposerHome.as_view(), name="composer_home"),
     url(r'^$', MetadataComposerHome.as_view(), name="composer_home"),
 )
--- a/src/metadatacomposer/views.py	Wed May 15 17:21:21 2013 +0200
+++ b/src/metadatacomposer/views.py	Thu May 16 12:48:09 2013 +0200
@@ -11,7 +11,7 @@
 #import logging
 #import re
 
-class MashupContextView(View):
+class MetadataComposerContextView(View):
     
     branding = "iri"
     
@@ -20,9 +20,10 @@
         context["branding"] = self.branding
         context["top_header_partial"] = "partial/%s_composer_header.html" % self.branding
         return context
-            
+
 
-class MetadataComposerHome(TemplateResponseMixin, MashupContextView):
+
+class MetadataComposerHome(TemplateResponseMixin, MetadataComposerContextView):
     
     def get_template_names(self):
         return "metadatacomposer_home.html"
@@ -40,5 +41,103 @@
         context = self.get_context_dict(request)
         context.update({"projects":projects, "contents": contents})
         return self.render_to_response(context)
+
+
+
+class MetadataComposerProjectList(TemplateResponseMixin, MetadataComposerContextView):
     
+    def get_template_names(self):
+        return "metadatacomposer_project_list.html"
+    
+    @method_decorator(login_required)
+    def dispatch(self, *args, **kwargs):
+        return super(MetadataComposerProjectList, self).dispatch(*args, **kwargs)
+    
+    def get(self, request, branding="iri", **kwargs):
+        self.branding = branding
+        page = request.GET.get("page") or 1
+        
+        projects = Project.safe_objects.prefetch_related("contents").order_by('-modification_date').filter(owner=request.user)
+        nb = getattr(settings, 'METADATACOMPOSER_ELEMENTS_PER_PAGE', 9)
+        if page=="x":
+            nb = projects.count()
+        
+        paginator = Paginator(projects, nb)
+        try:
+            results = paginator.page(page)
+        except (EmptyPage, InvalidPage):
+            results = paginator.page(paginator.num_pages)
+        
+        context = self.get_context_dict(request)
+        context.update({"results":results})
+        return self.render_to_response(context)
+
+
+
+class MetadataComposerResourceList(TemplateResponseMixin, MetadataComposerContextView):
+    
+    def get_template_names(self):
+        return "metadatacomposer_resource_list.html"
+    
+    @method_decorator(login_required)
+    def dispatch(self, *args, **kwargs):
+        return super(MetadataComposerResourceList, self).dispatch(*args, **kwargs)
+    
+    def get(self, request, branding="iri", **kwargs):
+        self.branding = branding
+        
+        # We get the first page of contents
+        content_results = get_contents_and_projects(1, request.user)
+        # We get the first page of images
+        
+        context = self.get_context_dict(request)
+        context.update({"content_results":content_results})
+        return self.render_to_response(context)
+
+
+
+class MetadataComposerContentPagination(TemplateResponseMixin, MetadataComposerContextView):
+    
+    def get_template_names(self):
+        return "partial/resource_content_list.html"
+    
+    @method_decorator(login_required)
+    def dispatch(self, *args, **kwargs):
+        return super(MetadataComposerContentPagination, self).dispatch(*args, **kwargs)
+    
+    def get(self, request, branding="iri", **kwargs):
+        self.branding = branding
+        page = request.GET.get("page") or 1
+        
+        content_results = get_contents_and_projects(page, request.user)
+        
+        context = self.get_context_dict(request)
+        context.update({"content_results":content_results})
+        return self.render_to_response(context)
+
+
+
+def get_contents_and_projects(page, user):
+    
+    # We get the current's page contents
+    contents = Content.safe_objects.order_by('-update_date')
+    
+    nb = getattr(settings, 'METADATACOMPOSER_ELEMENTS_PER_PAGE', 9)
+    if page=="x":
+        nb = contents.count()
+    
+    paginator = Paginator(contents, nb)
+    try:
+        results = paginator.page(page)
+    except (EmptyPage, InvalidPage):
+        results = paginator.page(paginator.num_pages)
+    
+    # We add the user's projects for each content
+    results_object_list = []
+    for content in results.object_list:
+        projects = content.project_set.all().filter(owner=user)
+        results_object_list.append({"content":content, "projects":projects})
+    results.object_list = results_object_list
+    
+    return results
     
\ No newline at end of file