--- a/cms/app-client/app/adapters/application.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/adapters/application.js	Thu Jan 21 21:07:02 2016 +0100
@@ -1,8 +1,8 @@
 import DS from 'ember-data';
 
-export { default } from 'ember-data-fixture-adapter';
+// export { default } from 'ember-data-fixture-adapter';
 
-// export default DS.RESTAdapter.extend({
-//   host: 'http://int.corpusdelaparole.huma-num.fr/corpus',
-//   namespace: 'api/v1',
-// });
+export default DS.RESTAdapter.extend({
+  host: 'http://127.0.0.1:8000',
+  namespace: 'api',
+});

--- a/cms/app-client/app/components/player-component.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/components/player-component.js	Thu Jan 21 21:07:02 2016 +0100
@@ -4,20 +4,25 @@
   classNames: ['player-component'],
   currentTime: "00:00",
   duration: "00:00",
+  documentLoaded: Ember.observer('document.mediaArray', function() {
+    var mediaList = this.get('document').get("mediaList");
+    if ((typeof(mediaList) !== 'undefined') && (mediaList.length > 0)){
+      if (this.audio.src){
+        this.pause();
+        this.updateProgress(0);
+      }
+      var mp3 = mediaList.findBy('format', 'audio/mpeg');
+      this.audio.src = mp3.url;
+      this.audio.load();
+      this.set("currentTime", "00:00");
+    }
 
-  _documentChanged: Ember.observer('document', function() {
-    this.pause();
-    this.changeTime(0);
-    this.updateProgress(0);
-    this.audio.src = this.get("document").get("master");
-    this.audio.load();
-    this.set("currentTime", "00:00");
   }),
 
   didInsertElement: function(){
     var _this = this;
 
-    this.audio = new Audio("http://stop.com.pk/file/music_folder/700.mp3");
+    this.audio = new Audio();
 
     this.button = {
       play: this.$('#action_play'),

--- a/cms/app-client/app/components/visu-carto.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/components/visu-carto.js	Thu Jan 21 21:07:02 2016 +0100
@@ -92,11 +92,6 @@
     }
     function handleMapObjectClick (event) {
       console.log("bbox: ", event.mapObject.displayObject.node.getBBox());
-      // console.log("event", event);
-      // console.log("originalTarget", event.event.originalTarget);
-      // console.log("getTotalLength", event.event.originalTarget.getTotalLength());
-      // console.log("getBBox", event.event.originalTarget.getBBox());
-      // console.log("event", event.event.originalTarget.attributes[1].d);
         if (event.mapObject.id === "backButton") {
             handleGoHome();
         }

--- a/cms/app-client/app/controllers/application.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/controllers/application.js	Thu Jan 21 21:07:02 2016 +0100
@@ -1,15 +1,26 @@
 import Ember from 'ember';
 
 export default Ember.Controller.extend({
-  queryParams: ['location', 'langue', 'discours', 'date', 'thematique'],
+  queryParams: ['location', 'langue', 'discours', 'date', 'thematique', 'detailId'],
   location: null,
   langue: null,
   discours: null,
   date: [],
   thematique: null,
-  isShowingModal: false,
-  currentDetails: null,
-  currentItem: {title: "example", master: 'http://www.noiseaddicts.com/samples_1w72b820/3921.mp3'},
+  detailId: null,
+
+  currentId: null,
+  currentItem: Ember.computed('currentId', function() {
+    Ember.$(".result-item").toggleClass("playing", false);
+    Ember.$("#"+this.get('currentId')).toggleClass("playing", true);
+    if (this.get('currentId') === null){
+      return null;
+    }
+    return this.store.findRecord('document', this.get('currentId'));
+  }),
+  modalItem: Ember.computed('detailId', function() {
+    return this.store.findRecord('document', this.get('detailId'));
+  }),
   filteredDocuments: Ember.computed('location', 'langue', 'discours', 'date', 'thematique', 'model', function() {
     var location = this.get('location');
     var langue = this.get('langue');
@@ -42,10 +53,6 @@
     }
     return documents;
   }),
-  currentItemChanged: Ember.observer('currentItem', function() {
-    Ember.$(".result-item").toggleClass("playing", false);
-    Ember.$("#"+this.get('currentItem').id).toggleClass("playing", true);
-  }),
   actions: {
     deleteTag: function(query, item){
       var newParams = null;
@@ -63,16 +70,17 @@
     },
     changeDocument: function(docDirection){
       var direction = (docDirection === "next") ? 1 : -1;
-      var index = this.get("filteredDocuments").indexOf(this.get("currentItem"));
-      if ( index !== -1){
-          if (typeof(this.get("filteredDocuments").objectAt(index+direction)) !== 'undefined'){
-            return this.set('currentItem', this.get("filteredDocuments").objectAt(index+direction));
+      var currentObject = this.get("filteredDocuments").findBy('id', this.get("currentItem").get('id'));
+      if ( currentObject !== 'undefined'){
+        var index = this.get("filteredDocuments").indexOf(currentObject);
+          if ( typeof(this.get("filteredDocuments").objectAt(index+direction)) !== 'undefined'){
+            return this.set('currentId', this.get("filteredDocuments").objectAt(index+direction).id);
           }
       }
-      return this.set('currentItem', this.get('filteredDocuments').get('firstObject'));
+      return this.set('currentId', this.get('filteredDocuments').get('firstObject').id);
     },
     play: function(item){
-      this.set("currentItem", item);
+      this.set("currentId", item.id);
     },
     details: function(item){
       if (Ember.$("#"+item.id).hasClass("details")){
@@ -83,8 +91,10 @@
       }
     },
     toggleModal: function(item){
-      this.set("isShowingModal", !this.isShowingModal);
-      this.set("currentDetails", item);
+      if (typeof(item) !== 'undefined'){
+        this.set("detailId", item.id);
+      }
+      this.set("detailId", null);
     }
   }
 });

--- a/cms/app-client/app/models/document.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/models/document.js	Thu Jan 21 21:07:02 2016 +0100
@@ -1,5 +1,6 @@
 import DS from 'ember-data';
 import Ember from 'ember';
+import _ from 'lodash/lodash';
 
 var Document = DS.Model.extend({
   // id: DS.attr('string'),
@@ -12,7 +13,7 @@
   mediaList: Ember.computed('mediaArray', function() {
     var res = [];
     var mp3 = null;
-    Ember.$.forEach(this.get('mediaArray'), function(m) {
+    _.forEach(this.get('mediaArray'), function(m) {
       if(m.format === 'audio/mpeg') {
         mp3 = m;
       } else if (m.format.startsWith('audio/')) {

--- a/cms/app-client/app/router.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/router.js	Thu Jan 21 21:07:02 2016 +0100
@@ -6,7 +6,6 @@
 });
 
 Router.map(function() {
-  // this.route('application', { path: '/detail/:document_id' });
   this.route('tabs/langues', { path: '/langues' });
   this.route('tabs/carto', { path: '/cartographie' });
   this.route('tabs/thematiques', { path: '/thematiques' });

--- a/cms/app-client/app/routes/tabs/chrono.js	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/routes/tabs/chrono.js	Thu Jan 21 21:07:02 2016 +0100
@@ -4,7 +4,6 @@
   actions: {
     queryParamsDidChange: function() {
       console.log("chrono params");
-      // console.log("visu-chrono ?", this.controller.get('visu-chrono'));
     },
   }
 });

--- a/cms/app-client/app/templates/application.hbs	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/app/templates/application.hbs	Thu Jan 21 21:07:02 2016 +0100
@@ -11,17 +11,20 @@
   {{partial "results"}}
 </div>
 
-{{#if isShowingModal}}
+{{#if detail}}
   {{#ember-wormhole to='info-modal'}}
     <div class="overlay" {{action 'toggleModal'}}></div>
     <div class="dialog">
-      <h1>{{currentDetails.title}}</h1>
-      <p><b>Description: </b>{{currentDetails.description}}</p>
-      <p><b>Interviewer: </b>{{currentDetails.interviewer}}</p>
-      <p><b>Type de Discours: </b>{{currentDetails.type}}</p>
-      <p><b>Localisation: </b>{{currentDetails.spatial}}</p>
-      <p><b>Langue: </b>{{currentDetails.language}}</p>
-      <p><b>Date de Creation: </b>{{currentDetails.created}}</p>
+      <div class="dialog-header">
+        <h2>Document details</h2>
+      </div>
+      <h3>{{modalItem.title}}</h3>
+      <p><b>Description: </b>{{modalItem.description}}</p>
+      <p><b>Interviewer: </b>{{modalItem.interviewer}}</p>
+      <p><b>Type de Discours: </b>{{modalItem.type}}</p>
+      <p><b>Localisation: </b>{{modalItem.spatial}}</p>
+      <p><b>Langue: </b>{{modalItem.language}}</p>
+      <p><b>Date de Creation: </b>{{modalItem.created}}</p>
       <button class="pull-right" {{action 'toggleModal'}}>Close</button>
     </div>
   {{/ember-wormhole}}

--- a/cms/app-client/package.json	Thu Jan 21 00:11:10 2016 +0100
+++ b/cms/app-client/package.json	Thu Jan 21 21:07:02 2016 +0100
@@ -40,6 +40,7 @@
     "ember-data-fixture-adapter": "1.13.0",
     "ember-disable-proxy-controllers": "^1.0.0",
     "ember-export-application-global": "^1.0.3",
+    "ember-lodash": "0.0.6",
     "ember-wormhole": "0.3.4"
   }
 }