Merge branch 'refactoring' into refactoring-alex

TODO.md

@@ -15,3 +15,112 @@ Path for data used by taggers should be defined in `gargantext.constants`.
 
 
 # Database
+
+# Sharing
+
+Here follows a brief description of how sharing could be implemented.
+
+## Database representation
+
+The database representation of sharing can be distributed among 4 tables:
+ - `persons`, of which items represent either a user or a group
+ - `relationships` describes the relationships between persons (affiliation
+     of a user to a group, contact between two users, etc.)
+ - `nodes` contains the projects, corpora, documents, etc. to share (they shall
+     inherit the sharing properties from their parents)
+ - `permissions` stores the relations existing between the three previously
+     described above: it only consists of 2 foreign keys, plus an integer
+     between 1 and 3 representing the level of sharing and the start date
+     (when the sharing has been set) and the end date (when necessary, the time
+     at which sharing has been removed, `NULL` otherwise)
+
+## Python code
+
+The permission levels should be set in `gargantext.constants`, and defined as:
+```python
+PERMISSION_NONE = 0     # 0b0000
+PERMISSION_READ = 1     # 0b0001
+PERMISSION_WRITE = 3    # 0b0011
+PERMISSION_OWNER = 7    # 0b0111
+```
+
+The requests to check for permissions (or add new ones) should not be rewritten
+every time. They should be "hidden" within the models:
+ - `Person.owns(node)` returns a boolean
+ - `Person.can_read(node)` returns a boolean
+ - `Person.can_write(node)` returns a boolean
+ - `Person.give_right(node, permission)` gives a right to a given user
+ - `Person.remove_right(node, permission)` removes a right from a given user
+ - `Person.get_nodes(permission[, type])` returns an iterator on the list of
+    nodes on which the person has at least the given permission (optional
+    argument: type of requested node)
+- `Node.get_persons(permission[, type])` returns an iterator on the list of
+   users who have at least the given permission on the node (optional argument:
+   type of requested persons, such as `USER` or `GROUP`)
+
+## Example
+
+Let's imagine the `persons` table contains the following data:
+
+| id | type  | username  |
+|----|-------|-----------|
+| 1  | USER  | David     |
+| 2  | GROUP | C.N.R.S.  |
+| 3  | USER  | Alexandre |
+| 4  | USER  | Untel     |
+| 5  | GROUP | I.S.C.    |
+| 6  | USER  | Bidule    |
+
+Assume "David" owns the groups "C.N.R.S." and "I.S.C.", "Alexandre" belongs to
+the group "I.S.C.", with "Untel" and "Bidule" belonging to the group "C.N.R.S.".
+"Alexandre" and "David" are in contact.
+The `relationships` table then contains:
+
+| person1_id | person2_id | type    |
+|------------|------------|---------|
+| 1          | 2          | OWNER   |
+| 1          | 5          | OWNER   |
+| 3          | 2          | MEMBER  |
+| 4          | 5          | MEMBER  |
+| 6          | 5          | MEMBER  |
+| 1          | 3          | CONTACT |
+
+The `nodes` table is populated as such:
+
+| id | type     | name                 |
+|----|----------|----------------------|
+| 12 | PROJECT  | My super project     |
+| 13 | CORPUS   | A given corpus       |
+| 13 | CORPUS   | The corpus           |
+| 14 | DOCUMENT | Some document        |
+| 15 | DOCUMENT | Another document     |
+| 16 | DOCUMENT | Yet another document |
+| 17 | DOCUMENT | Last document        |
+| 18 | PROJECT  | Another project      |
+| 19 | PROJECT  | That project         |
+
+If we want to express that "David" created "My super project" (and its children)
+and wants everyone in "C.N.R.S." to be able to view it, but not access it,
+`permissions` should contain:
+
+| person_id | node_id | permission |
+|-----------|---------|------------|
+| 1         | 12      | OWNER      |
+| 2         | 12      | READ       |
+
+If "David" also wanted "Alexandre" (and no one else) to view and modify "The
+corpus" (and its children), we would have:
+
+| person_id | node_id | permission |
+|-----------|---------|------------|
+| 1         | 12      | OWNER      |
+| 2         | 12      | READ       |
+| 3         | 13      | WRITE      |
+
+If "Alexandre" created "That project" and wants "Bidule" (and no one else) to be
+able to view and modify it (and its children), the table should then have:
+
+| person_id | node_id | permission |
+|-----------|---------|------------|
+| 3         | 19      | OWNER      |
+| 6         | 19      | WRITE      |

gargantext/urls.py

@@ -10,7 +10,7 @@ from django.conf.urls import include, url
 
 from django.contrib import admin
 
-# import gargantext.views.api
+import gargantext.views.api.urls
 import gargantext.views.generated.urls
 import gargantext.views.pages.urls
 
@@ -18,5 +18,6 @@ import gargantext.views.pages.urls
 urlpatterns = [
     url(r'^admin/', admin.site.urls),
     url(r'^generated/', include(gargantext.views.generated.urls)),
+    url(r'^api/', include(gargantext.views.api.urls)),
     url(r'^', include(gargantext.views.pages.urls)),
 ]

gargantext/util/http.py

@@ -9,6 +9,8 @@ from urllib.parse import quote_plus as urlencode
 from gargantext import settings
 
 
+# authentication
+
 def requires_auth(func):
     """Provides a decorator to force authentication on a given view.
     Also passes the URL to redirect towards as a GET parameter.
@@ -21,8 +23,57 @@ def requires_auth(func):
     return _requires_auth
 
 
+# download from a given URL
+
 import urllib.request
 
 def get(url):
     response = urllib.request.urlopen(url)
     html = response.read()
+
+
+# retrieve GET parameters from a request
+
+def get_parameters(request):
+    parameters = {}
+    print(request.GET)
+    print(request.GET._iterlists())
+    for key, value in request.GET._iterlists():
+        if key.endswith('[]'):
+            parameters[key[:-2]] = value
+        else:
+            parameters[key] = value[0]
+    return parameters
+
+
+# REST
+
+from rest_framework.views import APIView
+
+
+# provide a JSON response
+
+import json
+import datetime
+
+class JSONEncoder(json.JSONEncoder):
+    def default(self, obj):
+        if isinstance(obj, datetime.datetime):
+            return obj.isoformat()[:19] + 'Z'
+        elif isinstance(obj, (set, tuple)):
+            return list(obj)
+        else:
+            return super(self.__class__, self).default(obj)
+json_encoder = JSONEncoder(indent=4)
+def JsonHttpResponse(data, status=200):
+    return HttpResponse(
+        content      = json_encoder.encode(data),
+        content_type = 'application/json; charset=utf-8',
+        status       = status
+    )
+
+
+# provide exceptions for JSON APIs
+
+from rest_framework.exceptions import APIException
+from rest_framework.exceptions import ValidationError as ValidationException

gargantext/util/scheduling.py

@@ -36,11 +36,8 @@ from celery import shared_task
 def scheduled_celery(func):
     """Provides a decorator to schedule a task with Celery.
     """
-    @shared_task
-    def _func(*args, **kwargs):
-        func(*args, **kwargs)
     def go(*args, **kwargs):
-        _func.apply_async(args=args, kwargs=kwargs)
+        shared_task(func).apply_async(args=args, kwargs=kwargs)
     return go
 
 

gargantext/util/validation.py

+from gargantext.util.http import ValidationException
+
+from datetime import datetime
+
+
+__all__ = ['validate']
+
+
+_types_names = {
+    bool:       'boolean',
+    int:        'integer',
+    float:      'float',
+    str:        'string',
+    dict:       'object',
+    list:       'array',
+    datetime:   'datetime',
+}
+
+
+def validate(value, expected, path='input'):
+    # Is the expected type respected?
+    if 'type' in expected:
+        expected_type = expected['type']
+        if not isinstance(value, expected_type):
+            if expected_type in (bool, int, float, str, datetime, ):
+                try:
+                    if expected_type == bool:
+                        value = value not in {0, 0.0, '', '0', 'false'}
+                    elif expected_type == datetime:
+                        value = value + '2000-01-01T00:00:00Z'[len(value):]
+                        value = datetime.strptime(value, '%Y-%m-%dT%H:%M:%SZ')
+                    else:
+                        value = expected_type(value)
+                except ValueError:
+                    raise ValidationException('%s should be a JSON %s, but could not be parsed as such' % (path, _types_names[expected_type], ))
+            else:
+                raise ValidationException('%s should be a JSON %s' % (path, _types_names[expected_type], ))
+    else:
+        expected_type = type(value)
+
+    # Is the value in the expected range?
+    if 'range' in expected:
+        expected_range = expected['range']
+        if isinstance(expected_range, tuple):
+            if expected_type in (int, float):
+                tested_value = value
+                tested_name = 'value'
+            elif expected_type in (str, list):
+                tested_value = len(value)
+                tested_name = 'length'
+            if tested_value < expected_range[0]:
+                raise ValidationException('%s should have a minimum %s of %d' % (path, tested_name, expected_range[0], ))
+            if len(expected_range) > 1 and tested_value > expected_range[1]:
+                raise ValidationException('%s should have a maximum %s of %d' % (path, tested_name, expected_range[1], ))
+        elif isinstance(expected_range, (list, set, )) and value not in expected_range:
+            expected_values = expected_range if isinstance(expected_range, list) else expected_range
+            expected_values = [str(value) for value in expected_values if isinstance(value, expected_type)]
+            if len(expected_values) < 16:
+                expected_values_str = '", "'.join(expected_values)
+                expected_values_str = '"' + expected_values_str + '"'
+            else:
+                expected_values_str = '", "'.join(expected_values[:16])
+                expected_values_str = '"' + expected_values_str + '"...'
+
+            raise ValidationException('%s should take one of the following values: %s' % (path, expected_values_str, ))
+
+    # Do we have to translate through a dictionary?
+    if 'translate' in expected:
+        translate = expected['translate']
+        if callable(translate):
+            value = translate(value)
+            if value is None and expected.get('required', False):
+                raise ValidationException('%s has been given an invalid value' % (path, ))
+            return value
+        try:
+            value = expected['translate'][value]
+        except KeyError:
+            if expected.get('translate_fallback_keep', False):
+                return value
+            if expected.get('required', False):
+                raise ValidationException('%s has been given an invalid value' % (path, ))
+            else:
+                return expected.get('default', value)
+
+    # Are we handling an iterable?
+    if expected_type in (list, dict):
+        if 'items' in expected:
+            expected_items = expected['items']
+            if expected_type == list:
+                for i, element in enumerate(value):
+                    value[i] = validate(element, expected_items, '%s[%d]' % (path, i, ))
+            elif expected_type == dict:
+                if expected_items:
+                    for key in value:
+                        if key not in expected_items:
+                            raise ValidationException('%s should not have a "%s" key.' % (path, key, ))
+                for expected_key, expected_value in expected_items.items():
+                    if expected_key in value:
+                        value[expected_key] = validate(value[expected_key], expected_value, '%s["%s"]' % (path, expected_key, ))
+                    elif 'required' in expected_value and expected_value['required']:
+                        raise ValidationException('%s should have a "%s" key.' % (path, expected_key, ))
+                    elif 'default' in expected_value:
+                        value[expected_key] = expected_value['default']
+
+    # Let's return the proper value!
+    return value

gargantext/views/api/nodes.py

+from gargantext.util.http import *
+from gargantext.util.db import *
+from gargantext.models import *
+from gargantext.constants import *
+
+from gargantext.util.validation import validate
+
+
+class NodesList(APIView):
+
+    _fields = ['id', 'parent_id', 'name', 'typename', 'hyperdata']
+    _types = NODETYPES
+
+    def _query(self, request):
+        # parameters validation
+        parameters = get_parameters(request)
+        parameters = validate(parameters, {'type': dict, 'items': {
+            'pagination_limit': {'type': int, 'default': 10},
+            'pagination_offset': {'type': int, 'default': 0},
+            'pagination_offset': {'type': int, 'default': 0},
+            'fields': {'type': list, 'default': self._fields, 'items': {
+                'type': str, 'range': self._fields,
+            }},
+            # optional filtering parameters
+            'type': {'type': list, 'default': self._types, 'required': False, 'items': {
+                'type': str, 'range': self._types,
+            }},
+            'parent_id': {'type': int, 'required': False},
+        }})
+        # start the query
+        query = session.query(*tuple(
+            getattr(Node, field) for field in parameters['fields']
+        ))
+        # filter by type
+        if 'type' in parameters:
+            query = query.filter(Node.typename.in_(parameters['type']))
+        # filter by parent
+        if 'parent_id' in parameters:
+            query = query.filter(Node.parent_id == parameters['parent_id'])
+        # paginate the query
+        count = query.count()
+        if parameters['pagination_limit'] == -1:
+            query = query[parameters['pagination_offset']:]
+        else:
+            query = query[
+                parameters['pagination_offset'] :
+                parameters['pagination_limit']
+            ]
+        # return the result!
+        return parameters, query, count
+
+
+    def get(self, request):
+        """Displays the list of nodes corresponding to the query.
+        """
+        parameters, query, count = self._query(request)
+        return JsonHttpResponse({
+            'parameters': parameters,
+            'count': count,
+            'records': [dict(zip(parameters['fields'], node)) for node in query]
+        })
+
+    def delete(self, request):
+        """Removes the list of nodes corresponding to the query.
+        WARNING! THIS IS TOTALLY UNTESTED!!!!!
+        """
+        parameters, query, count = self._query(request)
+        for node in query:
+            node.delete()
+        session.commit()
+        return JsonHttpResponse({
+            'parameters': parameters,
+            'count': count,
+        }, 200)

gargantext/views/api/urls.py

 from django.conf.urls import url
 
-# from . import main
+from . import nodes
 
 
 urlpatterns = [
-    # url(r'^$', main.home),
+    url(r'^nodes$', nodes.NodesList.as_view()),
 ]

gargantext/views/pages/corpora.py

+from gargantext.util.http import *
+from gargantext.util.db import *
+from gargantext.util.db_cache import cache
+from gargantext.models import *
+from gargantext.constants import *
+from gargantext.settings import *
+
+from datetime import datetime
+
+
+def _get_user_project_corpus(request, project_id, corpus_id):
+    """Helper method to get a corpus, knowing the project's and corpus' ID.
+    Raises HTTP errors when parameters (user, IDs...) are invalid.
+    """
+    user = cache.User[request.user.username]
+    project = session.query(Node).filter(Node.id == project_id).first()
+    corpus = session.query(Node).filter(Node.id == corpus_id).filter(Node.parent_id == project_id).first()
+    if corpus is None:
+        raise Http404()
+    if not user.owns(corpus):
+        raise HttpResponseForbidden()
+    return user, project, corpus
+
+
+@requires_auth
+def corpus(request, project_id, corpus_id):
+    user, project, corpus = _get_user_project_corpus(request, project_id, corpus_id)
+    # response!
+    return render(
+        template_name = 'pages/corpora/corpus.html',
+        request = request,
+        context = {
+            'debug': DEBUG,
+            'user': user,
+            'date': datetime.now(),
+            'project': project,
+            'corpus': corpus,
+            # 'processing': processing,
+            # 'number': number,
+            'view': 'documents'
+        },
+    )
+
+@requires_auth
+def chart(request, project_id, corpus_id):
+    user, project, corpus = _get_user_project_corpus(request, project_id, corpus_id)

gargantext/views/pages/urls.py

 from django.conf.urls import url
 
-from . import main, auth, projects
+from . import main, auth
+from . import projects, corpora
 
 
 urlpatterns = [
@@ -14,8 +15,12 @@ urlpatterns = [
     url(r'^auth/login/?$', auth.login),
     url(r'^auth/logout/?$', auth.logout),
 
-    # overview on projects
+    # projects
     url(r'^projects/?$', projects.overview),
     url(r'^projects/(\d+)/?$', projects.project),
 
+    # corpora
+    url(r'^projects/(\d+)/corpora/(\d+)?$', corpora.corpus),
+    url(r'^projects/(\d+)/corpora/(\d+)/chart?$', corpora.chart),
+
 ]

requirements.txt

@@ -10,6 +10,7 @@ dateparser==0.3.2
 django-celery==3.1.17
 django-pgfields==1.4.4
 django-pgjsonb==0.0.16
+djangorestframework==3.3.2
 html5lib==0.9999999
 jdatetime==1.7.2
 kombu==3.0.33

static/css/d3/dc.css

+.dc-chart {
+    float: left;
+}
+
+.dc-chart rect.bar {
+    stroke: none;
+    fill: steelblue;
+}
+
+.dc-chart rect.bar:hover {
+    fill-opacity: .5;
+}
+
+.dc-chart rect.stack1 {
+    stroke: none;
+    fill: red;
+}
+
+.dc-chart rect.stack2 {
+    stroke: none;
+    fill: green;
+}
+
+.dc-chart rect.deselected {
+    stroke: none;
+    fill: #ccc;
+}
+
+.dc-chart .sub .bar {
+    stroke: none;
+    fill: #ccc;
+}
+
+.dc-chart .pie-slice {
+    fill: white;
+    font-size: 12px;
+    cursor: pointer;
+}
+
+.dc-chart .pie-slice :hover{
+    fill-opacity: .8;
+}
+
+.dc-chart .selected path{
+    stroke-width: 3;
+    stroke: #ccc;
+    fill-opacity: 1;
+}
+
+.dc-chart .deselected path{
+    strok: none;
+    fill-opacity: .5;
+    fill: #ccc;
+}
+
+.dc-chart .axis path, .axis line {
+    fill: none;
+    stroke: #000;
+    shape-rendering: crispEdges;
+}
+
+.dc-chart .axis text {
+    font: 10px sans-serif;
+}
+
+.dc-chart .grid-line line {
+    fill: none;
+    stroke: #ccc;
+    opacity: .5;
+    shape-rendering: crispEdges;
+}
+
+.dc-chart .brush rect.background {
+    z-index: -999;
+}
+
+.dc-chart .brush rect.extent {
+    fill: steelblue;
+    fill-opacity: .125;
+}
+
+.dc-chart .brush .resize path {
+    fill: #eee;
+    stroke: #666;
+}
+
+.dc-chart path.line {
+    fill: none;
+    stroke: steelblue;
+    stroke-width: 1.5px;
+}
+
+.dc-chart circle.dot{
+    fill: steelblue;
+}
+
+.dc-chart g.stack1 path.line {
+    stroke: green;
+}
+
+.dc-chart g.stack1 circle.dot{
+    fill: green;
+}
+
+.dc-chart g.stack2 path.line {
+    stroke: red;
+}
+
+.dc-chart g.stack2 circle.dot{
+    fill: red;
+}
+
+.dc-chart g.dc-tooltip path{
+    fill: none;
+    stroke: grey;
+    stroke-opacity: .8;
+}
+
+.dc-chart path.area {
+    fill: steelblue;
+    fill-opacity: .3;
+    stroke: none;
+}
+
+.dc-chart g.stack1 path.area {
+    fill: green;
+}
+
+.dc-chart g.stack2 path.area {
+    fill: red;
+}
+
+.dc-chart .node {
+    font-size: 0.7em;
+    cursor: pointer;
+}
+
+.dc-chart .node :hover{
+    fill-opacity: .8;
+}
+
+.dc-chart .selected circle {
+    stroke-width: 3;
+    stroke: #ccc;
+    fill-opacity: 1;
+}
+
+.dc-chart .deselected circle {
+    strok: none;
+    fill-opacity: .5;
+    fill: #ccc;
+}
+
+.dc-chart .bubble {
+    stroke: none;
+    fill-opacity: 0.6;
+}
+
+.dc-data-count {
+    float: right;
+    margin-top: 15px;
+    margin-right: 15px;
+}
+
+.dc-data-count .filter-count {
+    color: #3182bd;
+    font-weight: bold;
+}
+
+.dc-data-count .total-count {
+    color: #3182bd;
+    font-weight: bold;
+}
+
+.dc-data-table {}
+
+.dc-chart g.state{
+    cursor: pointer;
+}
+
+.dc-chart g.state :hover{
+    fill-opacity: .8;
+}
+
+.dc-chart g.state path {
+    stroke: white;
+}
+
+.dc-chart g.selected path {
+}
+
+.dc-chart g.deselected path {
+    fill: grey;
+}
+
+.dc-chart g.selected text {
+}
+
+.dc-chart g.deselected text {
+    display: none;
+}
+
+.dc-chart g.county path {
+    stroke: white;
+    fill: none;
+}
+
+.dc-chart g.debug rect{
+    fill: blue;
+    fill-opacity: .2;
+}
+
+.dc-chart g.row rect {
+    fill-opacity: 0.8;
+    cursor: pointer;
+}
+
+.dc-chart g.row rect:hover {
+    fill-opacity: 0.6;
+}
+
+.dc-chart g.row text {
+    fill: white;
+    font-size: 12px;
+}

static/css/jquery/jquery.dynatable.css

+/*
+ * jQuery Dynatable plugin 0.3.1
+ *
+ * Copyright (c) 2014 Steve Schwartz (JangoSteve)
+ *
+ * Dual licensed under the AGPL and Proprietary licenses:
+ *   http://www.dynatable.com/license/
+ *
+ * Date: Tue Jan 02 2014
+ */
+th {
+  background: #bd2525;
+}
+th a {
+  color: #fff;
+}
+th a:hover {
+  color: #fff;
+  text-decoration: underline;
+}
+
+.dynatable-search {
+  float: left;
+  margin-bottom: 10px;
+}
+
+.dynatable-pagination-links {
+  float: right;
+}
+
+.dynatable-record-count {
+  display: block;
+  padding: 5px 0;
+}
+
+.dynatable-pagination-links span,
+.dynatable-pagination-links li {
+  display: inline-block;
+}
+
+.dynatable-page-link,
+.dynatable-page-break {
+  display: block;
+  padding: 5px 7px;
+}
+
+.dynatable-page-link {
+  cursor: pointer;
+}
+
+.dynatable-active-page,
+.dynatable-disabled-page {
+  cursor: text;
+}
+.dynatable-active-page:hover,
+.dynatable-disabled-page:hover {
+  text-decoration: none;
+}
+
+.dynatable-active-page {
+  background: #bd2525;
+  border-radius: 5px;
+  color: #fff;
+}
+.dynatable-active-page:hover {
+  color: #fff;
+}
+.dynatable-disabled-page,
+.dynatable-disabled-page:hover {
+  background: none;
+  color: #999;
+}

static/css/jquery/jquery.easy-pie-chart.css

+.easyPieChart {
+    position: relative;
+    text-align: center;
+}
+
+.easyPieChart canvas {
+    position: absolute;
+    top: 0;
+    left: 0;
+}

static/js/bootstrap/bootstrap-carousel.js

+/* ==========================================================
+ * bootstrap-carousel.js v2.0.3
+ * http://twitter.github.com/bootstrap/javascript.html#carousel
+ * ==========================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function ($) {
+
+  "use strict"; // jshint ;_;
+
+
+ /* CAROUSEL CLASS DEFINITION
+  * ========================= */
+
+  var Carousel = function (element, options) {
+    this.$element = $(element)
+    this.options = options
+    this.options.slide && this.slide(this.options.slide)
+    this.options.pause == 'hover' && this.$element
+      .on('mouseenter', $.proxy(this.pause, this))
+      .on('mouseleave', $.proxy(this.cycle, this))
+  }
+
+  Carousel.prototype = {
+
+    cycle: function (e) {
+      if (!e) this.paused = false
+      this.options.interval
+        && !this.paused
+        && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))
+      return this
+    }
+
+  , to: function (pos) {
+      var $active = this.$element.find('.active')
+        , children = $active.parent().children()
+        , activePos = children.index($active)
+        , that = this
+
+      if (pos > (children.length - 1) || pos < 0) return
+
+      if (this.sliding) {
+        return this.$element.one('slid', function () {
+          that.to(pos)
+        })
+      }
+
+      if (activePos == pos) {
+        return this.pause().cycle()
+      }
+
+      return this.slide(pos > activePos ? 'next' : 'prev', $(children[pos]))
+    }
+
+  , pause: function (e) {
+      if (!e) this.paused = true
+      clearInterval(this.interval)
+      this.interval = null
+      return this
+    }
+
+  , next: function () {
+      if (this.sliding) return
+      return this.slide('next')
+    }
+
+  , prev: function () {
+      if (this.sliding) return
+      return this.slide('prev')
+    }
+
+  , slide: function (type, next) {
+      var $active = this.$element.find('.active')
+        , $next = next || $active[type]()
+        , isCycling = this.interval
+        , direction = type == 'next' ? 'left' : 'right'
+        , fallback  = type == 'next' ? 'first' : 'last'
+        , that = this
+        , e = $.Event('slide')
+
+      this.sliding = true
+
+      isCycling && this.pause()
+
+      $next = $next.length ? $next : this.$element.find('.item')[fallback]()
+
+      if ($next.hasClass('active')) return
+
+      if ($.support.transition && this.$element.hasClass('slide')) {
+        this.$element.trigger(e)
+        if (e.isDefaultPrevented()) return
+        $next.addClass(type)
+        $next[0].offsetWidth // force reflow
+        $active.addClass(direction)
+        $next.addClass(direction)
+        this.$element.one($.support.transition.end, function () {
+          $next.removeClass([type, direction].join(' ')).addClass('active')
+          $active.removeClass(['active', direction].join(' '))
+          that.sliding = false
+          setTimeout(function () { that.$element.trigger('slid') }, 0)
+        })
+      } else {
+        this.$element.trigger(e)
+        if (e.isDefaultPrevented()) return
+        $active.removeClass('active')
+        $next.addClass('active')
+        this.sliding = false
+        this.$element.trigger('slid')
+      }
+
+      isCycling && this.cycle()
+
+      return this
+    }
+
+  }
+
+
+ /* CAROUSEL PLUGIN DEFINITION
+  * ========================== */
+
+  $.fn.carousel = function (option) {
+    return this.each(function () {
+      var $this = $(this)
+        , data = $this.data('carousel')
+        , options = $.extend({}, $.fn.carousel.defaults, typeof option == 'object' && option)
+      if (!data) $this.data('carousel', (data = new Carousel(this, options)))
+      if (typeof option == 'number') data.to(option)
+      else if (typeof option == 'string' || (option = options.slide)) data[option]()
+      else if (options.interval) data.cycle()
+    })
+  }
+
+  $.fn.carousel.defaults = {
+    interval: 5000
+  , pause: 'hover'
+  }
+
+  $.fn.carousel.Constructor = Carousel
+
+
+ /* CAROUSEL DATA-API
+  * ================= */
+
+  $(function () {
+    $('body').on('click.carousel.data-api', '[data-slide]', function ( e ) {
+      var $this = $(this), href
+        , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
+        , options = !$target.data('modal') && $.extend({}, $target.data(), $this.data())
+      $target.carousel(options)
+      e.preventDefault()
+    })
+  })
+
+}(window.jQuery);
\ No newline at end of file

static/js/bootstrap/bootstrap-transition.js

+/* ===================================================
+ * bootstrap-transition.js v2.0.3
+ * http://twitter.github.com/bootstrap/javascript.html#transitions
+ * ===================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function ($) {
+
+  $(function () {
+
+    "use strict"; // jshint ;_;
+
+
+    /* CSS TRANSITION SUPPORT (http://www.modernizr.com/)
+     * ======================================================= */
+
+    $.support.transition = (function () {
+
+      var transitionEnd = (function () {
+
+        var el = document.createElement('bootstrap')
+          , transEndEventNames = {
+               'WebkitTransition' : 'webkitTransitionEnd'
+            ,  'MozTransition'    : 'transitionend'
+            ,  'OTransition'      : 'oTransitionEnd'
+            ,  'msTransition'     : 'MSTransitionEnd'
+            ,  'transition'       : 'transitionend'
+            }
+          , name
+
+        for (name in transEndEventNames){
+          if (el.style[name] !== undefined) {
+            return transEndEventNames[name]
+          }
+        }
+
+      }())
+
+      return transitionEnd && {
+        end: transitionEnd
+      }
+
+    })()
+
+  })
+
+}(window.jQuery);
\ No newline at end of file

static/js/jquery/jquery.easy-pie-chart.js

+// Generated by CoffeeScript 1.4.0
+
+/*
+Easy pie chart is a jquery plugin to display simple animated pie charts for only one value
+
+Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
+and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
+
+Built on top of the jQuery library (http://jquery.com)
+
+@source: http://github.com/rendro/easy-pie-chart/
+@autor: Robert Fleischmann
+@version: 1.0.1
+
+Inspired by: http://dribbble.com/shots/631074-Simple-Pie-Charts-II?list=popular&offset=210
+Thanks to Philip Thrasher for the jquery plugin boilerplate for coffee script
+*/
+
+
+(function() {
+
+  (function($) {
+    $.easyPieChart = function(el, options) {
+      var addScaleLine, animateLine, drawLine, easeInOutQuad, renderBackground, renderScale, renderTrack,
+        _this = this;
+      this.el = el;
+      this.$el = $(el);
+      this.$el.data("easyPieChart", this);
+      this.init = function() {
+        var percent;
+        _this.options = $.extend({}, $.easyPieChart.defaultOptions, options);
+        percent = parseInt(_this.$el.data('percent'), 10);
+        _this.percentage = 0;
+        _this.canvas = $("<canvas width='" + _this.options.size + "' height='" + _this.options.size + "'></canvas>").get(0);
+        _this.$el.append(_this.canvas);
+        if (typeof G_vmlCanvasManager !== "undefined" && G_vmlCanvasManager !== null) {
+          G_vmlCanvasManager.initElement(_this.canvas);
+        }
+        _this.ctx = _this.canvas.getContext('2d');
+        if (window.devicePixelRatio > 1.5) {
+          $(_this.canvas).css({
+            width: _this.options.size,
+            height: _this.options.size
+          });
+          _this.canvas.width *= 2;
+          _this.canvas.height *= 2;
+          _this.ctx.scale(2, 2);
+        }
+        _this.ctx.translate(_this.options.size / 2, _this.options.size / 2);
+        _this.$el.addClass('easyPieChart');
+        _this.$el.css({
+          width: _this.options.size,
+          height: _this.options.size,
+          lineHeight: "" + _this.options.size + "px"
+        });
+        _this.update(percent);
+        return _this;
+      };
+      this.update = function(percent) {
+        if (_this.options.animate === false) {
+          return drawLine(percent);
+        } else {
+          return animateLine(_this.percentage, percent);
+        }
+      };
+      renderScale = function() {
+        var i, _i, _results;
+        _this.ctx.fillStyle = _this.options.scaleColor;
+        _this.ctx.lineWidth = 1;
+        _results = [];
+        for (i = _i = 0; _i <= 24; i = ++_i) {
+          _results.push(addScaleLine(i));
+        }
+        return _results;
+      };
+      addScaleLine = function(i) {
+        var offset;
+        offset = i % 6 === 0 ? 0 : _this.options.size * 0.017;
+        _this.ctx.save();
+        _this.ctx.rotate(i * Math.PI / 12);
+        _this.ctx.fillRect(_this.options.size / 2 - offset, 0, -_this.options.size * 0.05 + offset, 1);
+        return _this.ctx.restore();
+      };
+      renderTrack = function() {
+        var offset;
+        offset = _this.options.size / 2 - _this.options.lineWidth / 2;
+        if (_this.options.scaleColor !== false) {
+          offset -= _this.options.size * 0.08;
+        }
+        _this.ctx.beginPath();
+        _this.ctx.arc(0, 0, offset, 0, Math.PI * 2, true);
+        _this.ctx.closePath();
+        _this.ctx.strokeStyle = _this.options.trackColor;
+        _this.ctx.lineWidth = _this.options.lineWidth;
+        return _this.ctx.stroke();
+      };
+      renderBackground = function() {
+        if (_this.options.scaleColor !== false) {
+          renderScale();
+        }
+        if (_this.options.trackColor !== false) {
+          return renderTrack();
+        }
+      };
+      drawLine = function(percent) {
+        var offset;
+        renderBackground();
+        _this.ctx.strokeStyle = $.isFunction(_this.options.barColor) ? _this.options.barColor(percent) : _this.options.barColor;
+        _this.ctx.lineCap = _this.options.lineCap;
+        _this.ctx.lineWidth = _this.options.lineWidth;
+        offset = _this.options.size / 2 - _this.options.lineWidth / 2;
+        if (_this.options.scaleColor !== false) {
+          offset -= _this.options.size * 0.08;
+        }
+        _this.ctx.save();
+        _this.ctx.rotate(-Math.PI / 2);
+        _this.ctx.beginPath();
+        _this.ctx.arc(0, 0, offset, 0, Math.PI * 2 * percent / 100, false);
+        _this.ctx.stroke();
+        return _this.ctx.restore();
+      };
+      animateLine = function(from, to) {
+        var currentStep, fps, steps;
+        fps = 30;
+        steps = fps * _this.options.animate / 1000;
+        currentStep = 0;
+        _this.options.onStart.call(_this);
+        _this.percentage = to;
+        if (_this.animation) {
+          clearInterval(_this.animation);
+          _this.animation = false;
+        }
+        return _this.animation = setInterval(function() {
+          _this.ctx.clearRect(-_this.options.size / 2, -_this.options.size / 2, _this.options.size, _this.options.size);
+          renderBackground.call(_this);
+          drawLine.call(_this, [easeInOutQuad(currentStep, from, to - from, steps)]);
+          currentStep++;
+          if ((currentStep / steps) > 1) {
+            clearInterval(_this.animation);
+            _this.animation = false;
+            return _this.options.onStop.call(_this);
+          }
+        }, 1000 / fps);
+      };
+      easeInOutQuad = function(t, b, c, d) {
+        var easeIn, easing;
+        easeIn = function(t) {
+          return Math.pow(t, 2);
+        };
+        easing = function(t) {
+          if (t < 1) {
+            return easeIn(t);
+          } else {
+            return 2 - easeIn((t / 2) * -2 + 2);
+          }
+        };
+        t /= d / 2;
+        return c / 2 * easing(t) + b;
+      };
+      return this.init();
+    };
+    $.easyPieChart.defaultOptions = {
+      barColor: '#ef1e25',
+      trackColor: '#f2f2f2',
+      scaleColor: '#dfe0e0',
+      lineCap: 'round',
+      size: 110,
+      lineWidth: 3,
+      animate: false,
+      onStart: $.noop,
+      onStop: $.noop
+    };
+    $.fn.easyPieChart = function(options) {
+      return $.each(this, function(i, el) {
+        var $el;
+        $el = $(el);
+        if (!$el.data('easyPieChart')) {
+          return $el.data('easyPieChart', new $.easyPieChart(el, options));
+        }
+      });
+    };
+    return void 0;
+  })(jQuery);
+
+}).call(this);

templates/pages/corpora/corpus.html

+{% extends "pages/menu.html" %}
+
+{% block css %}
+{% load staticfiles %}
+
+<link rel="stylesheet" type="text/css" href="{% static "css/bootstrap.css" %}">
+<!-- here goes import stylesheet js/bootstrap/bootstrap-multiselect.css, mais ca marche pas-->
+
+<link rel="stylesheet" type="text/css" href="{% static "css/morris.css" %}">
+
+<link rel="stylesheet" type="text/css" href="{% static "css/d3/dc.css"%}"/>
+
+<link rel="stylesheet" type="text/css" href="{% static "css/jquery/jquery.easy-pie-chart.css"%}">
+<link rel="stylesheet" type="text/css" href="{% static "css/jquery/jquery.dynatable.css"%}"/>
+
+<script type="text/javascript" src="{% static "js/d3/d3.js"%}"></script>
+<script type="text/javascript" src="{% static "js/d3/dc.js"%}"></script>
+<script type="text/javascript" src="{% static "js/d3/crossfilter.js"%}"></script>
+
+<style>
+.no-transition {
+  -webkit-transition: height 0.1s;
+  -moz-transition: height 0.1s;
+  -ms-transition: height 0.1s;
+  -o-transition: height 0.1s;
+  transition: height 0.1s;
+}
+th { color: #fff; }
+
+th a {
+  color: #fff;
+  font-weight: normal;
+  font-style: italic;
+  font-size: 0.9em;
+}
+
+.dynatable-record-count {
+  font-size: 0.7em;
+}
+.dynatable-pagination-links {
+  font-size: 0.7em;
+}
+
+</style>
+
+{% endblock %}
+
+
+
+{% block content %}
+
+<div class="container">
+    <div class="container">
+        <div class="jumbotron">
+            <div class="row">
+                <div id="monthly-move-chart">
+                    <center>
+                        Select a time range in the chart with blue bars to zoom in
+                    <p align="center">
+                    <a class="btn btn-xs btn-default" role="button" href="/chart/corpus/{{ corpus.id }}/data.csv">Save</a>
+                    <a class="btn btn-xs btn-default" href="javascript:volumeChart.filterAll();dc.redrawAll();">Reset</a></p>
+
+                    <div class="clearfix"></div>
+                    </center>
+                </div>
+            </div>
+        <div class="row">
+            <div id="monthly-volume-chart"></div>
+        </div>
+
+        <div id="content_loader">
+          <br>
+          <center>
+            <img width="10%" src="{% static "img/ajax-loader.gif"%}"></img>
+          </center>
+          <br>
+        </div>
+
+    </div>
+</div>
+
+
+<input type="hidden" id="list_id" value="{{ list_id }}"></input>
+
+<div class="container">
+
+
+    <div class="jumbotron">
+        <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
+            <div class="panel panel-body">
+                <div class="panel-heading">
+                    <h4 class="panel-title">
+                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+                        <p id="corpusdisplayer" onclick='Final_UpdateTable("click")' class="btn btn-primary btn-lg" style="width:200px; margin:0 auto; display:block;">Open Folder</h2></p>
+                        </a>
+                    </h4>
+                </div>
+                <div id="collapseOne" class="panel-collapse collapse no-transition" role="tabpanel">
+                  <div class="panel-body">
+                    <div id="div-table"></div>
+                            <p align="right">
+                                <button id="move2trash" class="btn btn-primary btn-lg" >Trash It!</button>
+                            </p>
+
+                  </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+<div id="filter_search" style="visibility:hidden">
+    <span style="font-size:70%;">
+      <input title="Search in Titles" id="searchTI" name="searchTI" type="checkbox" checked onclick="return false">TI&nbsp;
+      <input title="Search in Abstracts" id="searchAB" name="searchAB" type="checkbox">AB
+    </span>&nbsp;&nbsp;
+
+    <select id="example-single-optgroups" onchange="SearchFilters(this);">
+        <!-- <optgroup label=""> -->
+            <option id="filter_all" value="filter_all">All</option>
+            <!-- <option id="filter_title" value="filter_title">Title</option> -->
+            <!-- <option id="filter_date" value="filter_date">Date</option> -->
+        <!-- </optgroup> -->
+        <!-- <optgroup label="Duplicates"> -->
+            <!-- <option value="filter_doi">By DOI</option> -->
+            <option id="filter_dupl-titles" value="filter_dupl-titles">Duplicates by Title</option>
+        <!-- </optgroup> -->
+    </select>
+
+</div>
+
+<script type="text/javascript" src="{% static "js/jquery/jquery.min.js" %}"></script>
+<script src="{% static "js/bootstrap/bootstrap.min.js" %}"></script>
+<!-- here goes import script js/bootstrap/bootstrap-multiselect.js, mais ca marche pas-->
+<script type="text/javascript" src="{% static "js/jquery/jquery.dynatable.js" %}"></script>
+
+<!-- custom-lib for dynatable.js and dc.js -->
+<script type="text/javascript" src="{% static "js/gargantext/Docs_dyna_chart_and_table.js" %}"></script>
+
+
+
+{% endblock %}