diff --git a/public/js/main.js b/public/js/main.js index 41b920b..2153922 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -73,9 +73,17 @@ var AppRouter = Backbone.Router.extend({ }, list: function() { + var self = this; var state = this.viewStates['list'] || {}; this.viewStates['list'] = state; - return new MediaListView(state); + + var view = new MediaListView(state); + // it is automatically unbound when we destroy the view + view.on('mediaclick', function(media) { + self.navigate('/media/' + media.id, {trigger: true}); + }); + + return view; }, universe: function () { diff --git a/public/js/utils.js b/public/js/utils.js index e17582a..6128405 100644 --- a/public/js/utils.js +++ b/public/js/utils.js @@ -185,3 +185,15 @@ window.utils.StateTracker = function() { self.off('deleted'); }; }; + +window.utils.pieceFromMedia = function (media) { + /* For pieces created from a Media we want them to still have an unique id + * but a 'checksum' that points to the original Media.*/ + var attrs = _.clone(media.attributes); + var piece = new Media.Piece(attrs); + piece.set('checksum', attrs['_id']); + /* XXX: keep this */ + piece.unset('_id'); + return piece; +}; + diff --git a/public/js/views/mediaedit.js b/public/js/views/mediaedit.js index 3326111..943242c 100644 --- a/public/js/views/mediaedit.js +++ b/public/js/views/mediaedit.js @@ -15,6 +15,8 @@ window.EditView = PanelView.extend({ this.render(); }, render: function () { + var self = this; + $(this.el).html(template.mediaedit()); var state = this.options['state'] || new utils.StateTracker(); @@ -41,6 +43,15 @@ window.EditView = PanelView.extend({ }); this.medialist.on('dragstart', this.clearSearch); + // automatically unbound when we close this view. + this.medialist.on('mediadoubleclick', function(media) { + if (!self.editview) { + return; + } + self.editview.addMedia(media); + }); + + var resp = state.enterView(); if (resp.model) { if (resp.changed) { diff --git a/public/js/views/medialist.js b/public/js/views/medialist.js index f9bdb15..8e6e4c2 100644 --- a/public/js/views/medialist.js +++ b/public/js/views/medialist.js @@ -186,16 +186,22 @@ window.MediaListView = MasterView.extend({ } return model.pretty_duration(); }, model); + + this.mediaClick = function (viewmodel) { + self.trigger('mediaclick', viewmodel.model()); + }; + + this.mediaDoubleClick = function (viewmodel) { + self.trigger('mediadoubleclick', viewmodel.model()); + }; + }, allowDrop: ko.observable(allow_drop), dragHandler: function(item, event, ui){ // Instantiate drag element as Media.Piece - var attrs = _.clone(item.model().attributes); - var piece = new Media.Piece(attrs); - piece.set('checksum', attrs['_id']); - piece.unset('_id'); + var piece = utils.pieceFromMedia(item.model()); return kb.viewModel(piece) }, @@ -267,7 +273,11 @@ window.MediaListView = MasterView.extend({ }; _.bindAll(this, 'onCollectionChange', 'addDummyRow', 'removeDummyRow', 'destroyView', 'deleteModel', 'save', 'editListName', '_model_change_cb', 'clearChanges', 'hasChanges', '_bindModel', '_unbindModel'); + _.bindAll(this, 'mediaClick', 'mediaDoubleClick'); + this.view_model.collection.subscribe(this.onCollectionChange); + this.view_model.on('mediaclick', this.mediaClick); + this.view_model.on('mediadoubleclick', this.mediaDoubleClick); this._bindModel(model); ko.applyBindings(this.view_model, el[0]); @@ -313,10 +323,28 @@ window.MediaListView = MasterView.extend({ this.clearChanges(); }, + mediaClick: function (viewmodel) { + this.trigger('mediaclick', viewmodel); + }, + + mediaDoubleClick: function (viewmodel) { + this.trigger('mediadoubleclick', viewmodel); + }, + + addMedia: function (media) { + var piece = utils.pieceFromMedia(media); + this.model.get('pieces').add(piece); + }, + releaseView: function() { // Release resources this.collection.off("filter"); this._unbindModel(this.model); + this.view_model.off('mediaclick'); + this.view_model.off('mediadoubleclick'); + this.off('mediaclick'); + this.off('mediadoubleclick'); + this.search_view.destroy(); kb.release(this.view_model); }, diff --git a/views/templates/medialist.jade b/views/templates/medialist.jade index dda9c3d..d73e35d 100644 --- a/views/templates/medialist.jade +++ b/views/templates/medialist.jade @@ -88,7 +88,8 @@ block content tr(data-bind=inndbind) td.center - if (!is_playlist) - - var target = "attr:{href: '/media/'+checksum().split('-')[0]}"; + - var target = "click: $root.mediaClick, event:{ dblclick: $root.mediaDoubleClick }"; + - var thumbnail_target = "attr:{ src: checksum() ? '" + thumbnail_dir + "'+checksum().split('-')[0]+'.jpg' : '/pics/generic.jpg' }" a.plain(data-bind=target) img(width="150",height="100",data-bind=thumbnail_target)