fergalmoran/dss
1
0
Fork 0
mirror of https://github.com/fergalmoran/dss.git synced 2026-01-06 00:44:16 +00:00
Code Issues 13 Packages Projects Releases Wiki Activity

Fixed updating dom elements for re-rendered track

Browse Source
This commit is contained in:
Fergal Moran
2013-06-17 15:31:42 +01:00
parent 1063a2c87e
commit 5ed4e4e7a6
7 changed files with 145 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
static/js/app/views/mix/mixItemView.coffee
View File

@@ -38,10 +38,11 @@ define ['moment', 'app', 'vent', 'marionette', 'models/comment/commentCollection
@renderGenres()
return
onDomRefresh: ->
onShow: ->
#check if we're currently playing
if com.podnoms.player.isPlayingId @model.id
com.podnoms.settings.setupPlayerWrapper @model.get('id'), com.podnoms.player.getStreamUrl(), @el
@mixPlay(@model)
true
renderGenres: =>

3
static/js/app/views/mix/mixItemView.js
View File

@@ -60,9 +60,10 @@
this.renderGenres();
};
MixItemView.prototype.onDomRefresh = function() {
MixItemView.prototype.onShow = function() {
if (com.podnoms.player.isPlayingId(this.model.id)) {
com.podnoms.settings.setupPlayerWrapper(this.model.get('id'), com.podnoms.player.getStreamUrl(), this.el);
this.mixPlay(this.model);
}
return true;
};

4
static/js/app/views/user/userListView.coffee
View File

@@ -1,5 +1,5 @@
define ['marionette', 'models/user/userCollection', 'views/user/userItemView', 'text!/tpl/UserListView', 'libs/bootstrap/bootpag'],
(Marionette, UserCollection, UserItemView, Template) ->
define ['jquery', 'marionette', 'models/user/userCollection', 'views/user/userItemView', 'text!/tpl/UserListView', 'libs/bootstrap/bootpag'],
($, Marionette, UserCollection, UserItemView, Template) ->
class UserListView extends Marionette.CompositeView
template: _.template(Template)

2
static/js/app/views/user/userListView.js
View File

@@ -4,7 +4,7 @@
__hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
define(['marionette', 'models/user/userCollection', 'views/user/userItemView', 'text!/tpl/UserListView', 'libs/bootstrap/bootpag'], function(Marionette, UserCollection, UserItemView, Template) {
define(['jquery', 'marionette', 'models/user/userCollection', 'views/user/userItemView', 'text!/tpl/UserListView', 'libs/bootstrap/bootpag'], function($, Marionette, UserCollection, UserItemView, Template) {
var UserListView, _ref;
UserListView = (function(_super) {

22
static/js/com.podnoms.player.js
View File

@@ -59,7 +59,11 @@ com.podnoms.player = {
_whilePlaying: function () {
if (!this.trackLoaded) {
this.trackLoaded = true;
this.loadingEl.css('width', 100);
}
//need to call this every time as the boundaries may have changed.
this._calculateBounds();
this.currentPosition = this.currentSound.position;
var duration = this._getDurationEstimate(this.currentSound);
var percentageFinished = (this.currentSound.position / duration) * 100;
@@ -103,7 +107,7 @@ com.podnoms.player = {
this.loadingEl = options.loadingEl;
this.currentPath = options.url;
},
_setupParams: function () {
_calculateBounds: function () {
if (this.waveFormEl.position()) {
this.waveFormTop = this.waveFormEl.position().top;
this.waveFormLeft = this.waveFormEl.offset().left;
@@ -147,7 +151,15 @@ com.podnoms.player = {
},
setupPlayer: function (options) {
this._parseOptions(options);
this._setupParams();
this._calculateBounds();
this._createTimeDisplayLabel();
},
_createTimeDisplayLabel: function () {
this.timeDisplayLabel = $('<label>').text('00:00');
this.timeDisplayLabel.css('left', -100);
this.timeDisplayLabel.addClass('dss-time-display-label')
this.waveFormEl.append(this.timeDisplayLabel);
this.timeDisplayLabel.animate({ top: 0, left: this.playHeadEl.position().left });
},
startPlaying: function (options) {
var ref = this;
@@ -169,11 +181,7 @@ com.podnoms.player = {
if (options.success)
options.success();
//create the floating time display label
ref.timeDisplayLabel = $('<label>').text('00:00');
ref.timeDisplayLabel.css('left', -100);
ref.timeDisplayLabel.addClass('dss-time-display-label')
ref.waveFormEl.append(ref.timeDisplayLabel);
ref.timeDisplayLabel.animate({ top: 0, left: ref.playHeadEl.position().left });
ref._createTimeDisplayLabel();
}
else {
if (options.error)

136
static/js/libs/bootstrap/bootpag.js
View File

@@ -1,19 +1,127 @@
/*
bootpag - jQuery plugin for dynamic pagination
/**
* @preserve
* bootpag - jQuery plugin for dynamic pagination
*
* Copyright (c) 2013 botmonster@7items.com
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Project home:
* http://botmonster.com/jquery-bootpag/
*
* Version: 1.0.4
*
*/
(function($, window) {
Copyright (c) 2013 botmonster@7items.com
$.fn.bootpag = function(options){
Licensed under the MIT license:
http://www.opensource.org/licenses/mit-license.php
var $owner = this,
settings = $.extend({
total: 0,
page: 1,
maxVisible: null,
leaps: true,
href: 'javascript:void(0);',
hrefVariable: '{{number}}',
next: '&raquo;',
prev: '&laquo;'
},
$owner.data('settings') || {},
options || {});
Project home:
http://botmonster.com/jquery-bootpag/
if(settings.total <= 0)
return this;
Version: 1.0.4
if(!$.isNumeric(settings.maxVisible) && !settings.maxVisible){
settings.maxVisible = settings.total;
}
*/
(function(f,q){f.fn.bootpag=function(p){function k(e,b){var c,d=0==a.maxVisible?1:a.maxVisible,n=1==a.maxVisible?0:1,m=Math.floor((b-1)/d)*d,g=e.find("li");a.page=b=0>b?0:b>a.total?a.total:b;g.removeClass("disabled");c=1>b-1?1:a.leaps&&b-1>=a.maxVisible?Math.floor((b-1)/d)*d:b-1;g.first().toggleClass("disabled",1===b).attr("data-lp",c).find("a").attr("href",h(c));n=1==a.maxVisible?0:1;c=b+1>a.total?a.total:a.leaps&&b+1<a.total-a.maxVisible?m+a.maxVisible+n:b+1;g.last().toggleClass("disabled",b===
a.total).attr("data-lp",c).find("a").attr("href",h(c));d=g.filter("[data-lp="+b+"]");if(!d.not(".next,.prev").length){var k=b<=m?-a.maxVisible:0;g.not(".next,.prev").each(function(b){c=b+1+m+k;f(this).attr("data-lp",c).toggle(c<=a.total).find("a").html(c).attr("href",h(c))});d=g.filter("[data-lp="+b+"]")}d.addClass("disabled");l.trigger("page",b);l.data("settings",a)}function h(e){return a.href.replace(a.hrefVariable,e)}var l=this,a=f.extend({total:0,page:1,maxVisible:null,leaps:!0,href:"javascript:void(0);",
hrefVariable:"{{number}}",next:"&raquo;",prev:"&laquo;"},l.data("settings")||{},p||{});if(0>=a.total)return this;!f.isNumeric(a.maxVisible)&&!a.maxVisible&&(a.maxVisible=a.total);l.data("settings",a);return this.each(function(){var e,b,c=f(this),d=['<ul class="bootpag">'];a.prev&&d.push('<li data-lp="1" class="prev"><a href="'+h(1)+'">'+a.prev+"</a></li>");for(b=1;b<=Math.min(a.total,a.maxVisible);b++)d.push('<li data-lp="'+b+'"><a href="'+h(b)+'">'+b+"</a></li>");a.next&&(b=a.leaps&&a.total>a.maxVisible?
Math.min(a.maxVisible+1,a.total):2,d.push('<li data-lp="'+b+'" class="next"><a href="'+h(b)+'">'+a.next+"</a></li>"));d.push("</ul>");c.find("ul.bootpag").remove();c.append(d.join("")).addClass("pagination");e=c.find("ul.bootpag");c.find("li").click(function(){var a=f(this);a.hasClass("disabled")||k(e,parseInt(a.attr("data-lp"),10))});k(e,a.page)})}})(jQuery,window);
$owner.data('settings', settings);
function renderPage($bootpag, page){
var lp,
maxV = settings.maxVisible == 0 ? 1 : settings.maxVisible,
step = settings.maxVisible == 1 ? 0 : 1,
vis = Math.floor((page - 1) / maxV) * maxV,
$page = $bootpag.find('li');
settings.page = page = page < 0 ? 0 : page > settings.total ? settings.total : page;
$page.removeClass('disabled');
lp = page - 1 < 1 ? 1 :
settings.leaps && page - 1 >= settings.maxVisible ?
Math.floor((page - 1) / maxV) * maxV : page - 1;
$page
.first()
.toggleClass('disabled', page === 1)
.attr('data-lp', lp)
.find('a').attr('href', href(lp));
var step = settings.maxVisible == 1 ? 0 : 1;
lp = page + 1 > settings.total ? settings.total :
settings.leaps && page + 1 < settings.total - settings.maxVisible ?
vis + settings.maxVisible + step: page + 1;
$page
.last()
.toggleClass('disabled', page === settings.total)
.attr('data-lp', lp)
.find('a').attr('href', href(lp));;
var $currPage = $page.filter('[data-lp='+page+']');
if(!$currPage.not('.next,.prev').length){
var d = page <= vis ? -settings.maxVisible : 0;
$page.not('.next,.prev').each(function(index){
lp = index + 1 + vis + d;
$(this)
.attr('data-lp', lp)
.toggle(lp <= settings.total)
.find('a').html(lp).attr('href', href(lp));
});
$currPage = $page.filter('[data-lp='+page+']');
}
$currPage.addClass('disabled');
$owner.trigger('page', page);
$owner.data('settings', settings);
}
function href(c){
return settings.href.replace(settings.hrefVariable, c);
}
return this.each(function(){
var $bootpag, lp, me = $(this),
p = ['<ul class="bootpag">'];
if(settings.prev){
p.push('<li data-lp="1" class="prev"><a href="'+href(1)+'">'+settings.prev+'</a></li>');
}
for(var c = 1; c <= Math.min(settings.total, settings.maxVisible); c++){
p.push('<li data-lp="'+c+'"><a href="'+href(c)+'">'+c+'</a></li>');
}
if(settings.next){
lp = settings.leaps && settings.total > settings.maxVisible
? Math.min(settings.maxVisible + 1, settings.total) : 2;
p.push('<li data-lp="'+lp+'" class="next"><a href="'+href(lp)+'">'+settings.next+'</a></li>');
}
p.push('</ul>');
me.find('ul.bootpag').remove();
me.append(p.join('')).addClass('pagination');
$bootpag = me.find('ul.bootpag');
me.find('li').click(function paginationClick(){
var me = $(this);
if(me.hasClass('disabled')){
return;
}
renderPage($bootpag, parseInt(me.attr('data-lp'), 10));
});
renderPage($bootpag, settings.page);
});
}
})(jQuery, window);