1
0
Fork 0

Added playlist

master
Matthieu Lalonde 12 years ago
parent 3093c9ccd9
commit 39bc55c93f

@ -16,6 +16,8 @@
@import "/resources/vendors/bootstrap/2.1.1/css/bootstrap.min.css"; @import "/resources/vendors/bootstrap/2.1.1/css/bootstrap.min.css";
@import "/resources/vendors/jquery/datatables/1.9.4/extras/ColReorder/media/css/ColReorder.css";
@import "/resources/css/datatables.css"; @import "/resources/css/datatables.css";
@import "/resources/css/app.css"; @import "/resources/css/app.css";
@import "/resources/css/player.css"; @import "/resources/css/player.css";

@ -371,6 +371,7 @@ div#wrapperPlayer {
} }
table.dataTable tbody tr.selected td, table.dataTable tbody tr.selected td,
div.drag-table-item table tr.selected td,
table.dataTable tbody tr.selected td.sorting_1, table.dataTable tbody tr.selected td.sorting_1,
table.dataTable tbody tr.selected td.sorting_2, table.dataTable tbody tr.selected td.sorting_2,
table.dataTable tbody tr.selected td.sorting_3, table.dataTable tbody tr.selected td.sorting_3,
@ -397,6 +398,10 @@ body > .ui-layout-center > div > div.ui-layout-north > div.third > div.dataTable
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6086e5', endColorstr='#4966b1',GradientType=0 ); /* IE6-9 */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6086e5', endColorstr='#4966b1',GradientType=0 ); /* IE6-9 */
} }
div.drag-table-item {
opacity: 0.8;
}
div#wrapperPlayer { div#wrapperPlayer {
background: url('../img/viewport_background.png') repeat-x; background: url('../img/viewport_background.png') repeat-x;
height: 50px; height: 50px;

@ -70,7 +70,7 @@ _
, "servers/:server": "_routerActionClient" , "servers/:server": "_routerActionClient"
, "playlist/:item": "_routerActionPlaylistItem" , "playlist/:item": "_routerActionPlaylistItem"
, ":server/items/:item": "_routerActionServerItem" , ":server/items/:item": "_routerActionServerItem"
//"*actions": "defaultRoute" // matches http://example.com/#anything-here , "*actions": "_routerDefaultAction" // matches http://example.com/#anything-here
} }
, historyStart: window.history.length , historyStart: window.history.length
@ -86,6 +86,7 @@ _
, "_routerActionClient" , "_routerActionClient"
, "_routerActionItem" , "_routerActionItem"
, "_routerActionServerItem" , "_routerActionServerItem"
, "_routerDefaultAction"
, "_serverInit" , "_serverInit"
@ -191,6 +192,7 @@ _
listItem = _.extend({}, listItem, { listItem = _.extend({}, listItem, {
server: event.hostname server: event.hostname
, database: event.dbId , database: event.dbId
, order: new Date().toString()
}); });
that.playlist.on("add", function __fnAppSavePlaylistModel(model) { that.playlist.on("add", function __fnAppSavePlaylistModel(model) {
@ -218,6 +220,13 @@ _
return this; return this;
} }
, _routerDefaultAction: function () {
var that = this
;
Backbone.Router.prototype.navigate("playlist", true);
}
, _routerActionAbout: function () { , _routerActionAbout: function () {
var that = this var that = this
; ;

@ -7,6 +7,7 @@ require.config({
"jquery-ui": ["jquery"] "jquery-ui": ["jquery"]
, "jquery-event-drag": ["jquery"] , "jquery-event-drag": ["jquery"]
, "jquery-layout": ["jquery", "jquery-ui"] , "jquery-layout": ["jquery", "jquery-ui"]
, "jquery-clone-styles": ["jquery"]
, "datatables": ["jquery"] , "datatables": ["jquery"]
@ -62,6 +63,7 @@ require.config({
, "jquery-ui": "../vendors/jquery/ui/1.9.0/jquery-ui-all" , "jquery-ui": "../vendors/jquery/ui/1.9.0/jquery-ui-all"
, "jquery-event-drag": "../vendors/jquery/event-drag/2.2/jquery.event.drag" , "jquery-event-drag": "../vendors/jquery/event-drag/2.2/jquery.event.drag"
, "jquery-layout": "../vendors/jquery/layout/1.2.0/jquery.layout.min" , "jquery-layout": "../vendors/jquery/layout/1.2.0/jquery.layout.min"
, "jquery-clone-styles": "../vendors/jquery/cloneStyles"
, "datatables": "../vendors/jquery/datatables/1.9.4/media/js/jquery.dataTables.min" , "datatables": "../vendors/jquery/datatables/1.9.4/media/js/jquery.dataTables.min"
, "dt-scroller": "../vendors/jquery/datatables/1.9.4/extras/Scroller/media/js/dataTables.scroller.min" , "dt-scroller": "../vendors/jquery/datatables/1.9.4/extras/Scroller/media/js/dataTables.scroller.min"

@ -14,6 +14,7 @@ define([
, "jquery-ui" , "jquery-ui"
, "jquery-event-drag" , "jquery-event-drag"
, "jquery-clone-styles"
, "datatables" , "datatables"
, "dt-scroller" , "dt-scroller"
@ -293,21 +294,22 @@ _
List.__super__.initialize.apply(this, arguments); List.__super__.initialize.apply(this, arguments);
//this.$el.find("table:first").html("<tr><td><h1>" + this.type + "</h1></td></tr>"); if (that.options.type === "playlist" && that.options.collection) {
this.$el.find("tr").draggable();
this.$el.find("td").draggable();
if (that.options.type === "playlist") {
that.options.collection.fetch(); that.options.collection.fetch();
that.options.collection.on("add", function __fnPlaylistAddRow(model) {
if (that.dataTable) {
that.dataTable.fnAddData(model.toJSON(), that.$el.is(":visible"));
}
});
} }
return this; return this;
} }
// FIXME: Sometimes the parent element's size is 0 and resizing fails.
, resize: function () { , resize: function () {
var that = this var that = this
, parentEl = that.options.parentEl//that.$el.parent() , parentEl = that.options.parentEl || that.$el.parent()
, parentWidth = parentEl.innerWidth() , parentWidth = parentEl.innerWidth()
, parentHeight = parentEl.innerHeight() , parentHeight = parentEl.innerHeight()
; ;
@ -325,9 +327,7 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl
, render: function () { , render: function () {
var that = this var that = this
, initialHeight = that.$el.innerHeight() - 20 , initialHeight = that.$el.innerHeight() - 20
; , dataTableOpts = {
this.dataTable = this.$el.find("table:first").dataTable({
sScrollY: initialHeight + "px" sScrollY: initialHeight + "px"
, sDom: "RTrtS" , sDom: "RTrtS"
, oColReorder: { , oColReorder: {
@ -346,9 +346,6 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl
//, bProcessing: true //, bProcessing: true
//, bServerSide: true //, bServerSide: true
// Default sorting order
, aaSorting: [[2, "asc"], [6, "asc"], [3, "asc"], [5, "asc"], [4, "asc"]]
, aaData: that.collection.toJSON() , aaData: that.collection.toJSON()
, aoColumns: that.tableSchema , aoColumns: that.tableSchema
@ -382,6 +379,8 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl
$(this) $(this)
.closest("tr") .closest("tr")
.clone() .clone()
.css($(this).getStyleObject())
.addClass("selected")
) )
.parent() .parent()
; ;
@ -403,8 +402,11 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl
//var rowModel = that.collection.get(aData.id); //var rowModel = that.collection.get(aData.id);
//view.rows.push(new DtRowView({id: aData.id, el: nRow, model: rowModel})); //view.rows.push(new DtRowView({id: aData.id, el: nRow, model: rowModel}));
} }
/*
, fnServerData: function(sSource, aoData, fnCallback, settings) { , fnServerData: function(sSource, aoData, fnCallback, settings) {
console.log(sSource, aoData, fnCallback, settings);
}
/*
// function used to populate the DataTable with the current // function used to populate the DataTable with the current
// content of the collection // content of the collection
var populateTable = function() var populateTable = function()
@ -440,7 +442,25 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl
} }
} }
*/ */
}); }
;
// Default sorting order
if (that.options.type !== "playlist") {
dataTableOpts.aaSorting = [[2, "asc"], [6, "asc"], [3, "asc"], [5, "asc"], [4, "asc"]];
} else {
var schemaLastItem = (that.tableSchema.length - 1);
dataTableOpts.aaSorting = [[schemaLastItem, "asc"]];
that.tableSchema[schemaLastItem].mData = "order";
for (var i = 0; i < schemaLastItem; i++) {
that.tableSchema[i].bSortable = false;
}
dataTableOpts.aoColumns = that.tableSchema;
}
this.dataTable = this.$el.find("table:first").dataTable(dataTableOpts);
} }

Loading…
Cancel
Save