Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
radiopanik
panikweb
Commits
09270903
Commit
09270903
authored
Sep 02, 2013
by
Simon Daron
Browse files
Player add links to go back to the sound page
parent
6fc8608c
Changes
6
Hide whitespace changes
Inline
Side-by-side
panikweb_templates/static/css/general.css
View file @
09270903
...
...
@@ -34,7 +34,7 @@ a.block:hover,nav a:hover{
text-decoration
:
none
;
}
button
:hover
{
opacity
:
0.
8
;
opacity
:
0.
5
;
}
button
,
.button
{
margin
:
0
0
0
0
;
...
...
panikweb_templates/static/css/specifics.css
View file @
09270903
...
...
@@ -380,7 +380,7 @@ background-color:#ff6633; border-color:#fff;}
-o-animation
:
loading
1s
infinite
linear
;
animation
:
loading
1s
infinite
linear
;
}
#Playlist
.playlistControls
button
{
#Playlist
.playlistControls
button
,
#Playlist
.playlistControls
.
button
{
margin
:
0
0.1em
0
0.1em
;
}
#Playlist
li
{
...
...
@@ -393,6 +393,7 @@ background-color:#ff6633; border-color:#fff;}
padding
:
0
0
0
1.5em
;
}
#player-container
#Playlist
ol
{
margin-top
:
0.5em
;
height
:
1.3em
;
overflow
:
hidden
;
}
...
...
panikweb_templates/static/js/audioPlayer.js
View file @
09270903
...
...
@@ -76,6 +76,7 @@
source
:{},
title
:
audio
.
attr
(
'
title
'
),
id
:
audio
.
attr
(
'
id
'
),
url
:
audio
.
attr
(
'
data-url
'
),
focus
:
audio
.
attr
(
'
data-player-focus
'
)
};
audio
.
children
(
'
source
'
).
each
(
function
(){
...
...
@@ -96,7 +97,9 @@
// Transform JSON sound object to HTML container for playlist.
_htmlifyJsonSound
:
function
(
sound
)
{
var
container
=
$
(
'
<li>
'
).
attr
(
'
data-origin
'
,
sound
.
id
);
var
audio
=
$
(
'
<audio>
'
,
this
.
options
.
html5audioOptions
).
attr
(
'
title
'
,
sound
.
title
).
hide
();
var
audio
=
$
(
'
<audio>
'
,
this
.
options
.
html5audioOptions
)
.
attr
(
'
title
'
,
sound
.
title
).
hide
()
.
attr
(
'
data-url
'
,
sound
.
url
);
$
.
each
(
sound
.
source
,
function
(
k
,
v
){
var
source
=
$
(
'
<source>
'
,{
src
:
v
,
type
:
k
});
audio
.
append
(
source
);
...
...
@@ -123,17 +126,18 @@
return
this
;
});
var
controls
=
$
(
'
<span>
'
,{
class
:
'
soundControls controls
'
});
var
html5
=
$
(
'
<button>
'
,{
class
:
'
icon-html5
'
,
click
:
function
(){
var
link
=
$
(
'
<a>
'
,{
href
:
sound
.
url
,
class
:
'
button icon-external-link
'
});
var
html5
=
$
(
'
<button>
'
,{
title
:
"
Display HTML5 audio
"
,
class
:
'
icon-html5
'
,
click
:
function
(){
audio
.
toggle
();
}}).
hide
();
var
remove
=
$
(
'
<button>
'
,{
class
:
'
icon-remove
'
,
click
:
function
(){
var
remove
=
$
(
'
<button>
'
,{
title
:
"
Remove from list
"
,
class
:
'
icon-remove
'
,
click
:
function
(){
container
.
remove
();
thePlaylist
.
_update
();
}});
var
stop
=
$
(
'
<button>
'
,{
class
:
'
icon-stop
'
,
click
:
function
(){
var
stop
=
$
(
'
<button>
'
,{
title
:
"
Stop
"
,
class
:
'
icon-stop
'
,
click
:
function
(){
audio
.
trigger
(
'
stop
'
);
}});
var
playpause
=
$
(
'
<button>
'
,{
class
:
'
icon-play
'
,
click
:
function
(){
}})
.
hide
()
;
var
playpause
=
$
(
'
<button>
'
,{
title
:
"
Play/Pause
"
,
class
:
'
icon-play
'
,
click
:
function
(){
if
(
audio
[
0
].
paused
==
false
)
{
audio
.
trigger
(
'
pause
'
);
}
else
{
...
...
@@ -141,10 +145,7 @@
}
}});
controls
.
append
(
playpause
).
append
(
stop
).
append
(
remove
).
append
(
html5
);
var
title
=
$
(
'
<span>
'
,{
class
:
"
button title
"
,
html
:
sound
.
title
,
click
:
function
(){
playpause
.
trigger
(
'
click
'
);
return
false
;
}});
var
title
=
$
(
'
<a>
'
,{
title
:
"
More information
"
,
href
:
sound
.
url
,
class
:
"
button title
"
,
html
:
sound
.
title
});
container
.
append
(
controls
).
append
(
title
).
append
(
audio
);
if
(
sound
.
focus
){
thePlaylist
.
setFocus
(
container
);}
return
container
;
...
...
panikweb_templates/static/js/specifics.js
View file @
09270903
...
...
@@ -8,60 +8,9 @@ $(function() {
}
var
$main
=
$
(
"
#Changing
"
);
var
$log
=
$
(
"
#userLog
"
);
var
$localList
=
$
(
'
#localList
'
).
playlist
({
controlContainer
:
$
(
'
<div>
'
,{
class
:
"
playListControls label
"
}).
sortable
(),
playlistContainer
:
$
(
'
<ol>
'
,{
id
:
"
myPlaylist
"
,
class
:
"
custom
"
}).
sortable
(),
onLoad
:
function
(
self
){
$
(
'
#playlistLabel
'
).
on
(
'
click
'
,
function
(){
self
.
playlistContainer
.
toggleClass
(
'
deploy
'
);
});
if
(
self
.
isActive
){
self
.
playlistContainer
.
scrollTo
(
self
.
isActive
,
800
);}
},
onPlay
:
function
(
self
){
$
(
'
#DirectStreamPanik
'
)[
0
].
pause
();
self
.
playlistContainer
.
scrollTo
(
self
.
isActive
,
800
);
/*self.isPlaying[0].scrollIntoView();
var posScroll = self.playlistContainer.scrollTop() + self.isPlaying.position().top - self.playlistContainer.height()/2 + self.isPlaying.height()/2;
self.playlistContainer.animate({
scrollTop:posScroll
}, 'slow'); */
},
onAdd
:
function
(
self
){
//self.isLastAdd[0].scrollIntoView();
self
.
playlistContainer
.
scrollTo
(
self
.
isLastAdd
,
800
).
delay
(
1000
).
scrollTo
(
self
.
isActive
,
800
).
clearQueue
();
},
onUpdate
:
function
(
self
){
//doLog(JSON.stringify(self.playlist, null, '\t'));
if
(
self
.
playlist
.
length
>=
1
){
self
.
element
.
show
();
$
(
'
#Player
'
).
addClass
(
'
withPlaylist
'
);
}
else
{
self
.
element
.
hide
();
$
(
'
#Player
'
).
removeClass
(
'
withPlaylist
'
);
}
}
});
/****************************************************/
/**** AUDIOPLAYER ****/
/****************************************************/
if
(
$
(
'
#player-container
'
).
offset
()){
var
topPosition
=
0
;
topPosition
=
$
(
'
#player-container
'
).
offset
().
top
;
$
(
window
).
bind
(
'
scroll load
'
,
function
(
event
)
{
//$('#player-container').removeClass('fixed');
var
y
=
$
(
this
).
scrollTop
()
-
$
(
'
#Player
'
).
height
();
if
(
topPosition
!==
0
&&
y
>=
topPosition
)
{
$
(
'
#Player
'
).
css
({
'
min-height
'
:
$
(
'
#Player
'
).
height
()});
$
(
'
#player-container
'
).
addClass
(
'
fixed
'
).
removeClass
(
'
normal
'
);
}
else
{
$
(
'
#Player
'
).
css
({
'
min-height
'
:
'
auto
'
});
$
(
'
#player-container
'
).
removeClass
(
'
fixed
'
).
addClass
(
'
normal
'
);
}
});
}
/****************************************************/
/**** AJAX REQUESTS ****/
/**** AJAX UTILITIES FOR REQUESTS ****/
/****************************************************/
String
.
prototype
.
decodeHTML
=
function
()
{
return
$
(
"
<div>
"
,
{
html
:
""
+
this
}).
html
();
...
...
@@ -114,29 +63,90 @@ $(function() {
}
loadPage_request
=
$
.
get
(
href
,
null
,
afterLoad
);
};
init
=
function
()
{
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
$
(
"
#All a, #All area
"
).
unbind
(
'
click
'
).
on
(
'
click
'
,
function
()
{
$
(
this
).
addClass
(
'
loading
'
);
var
href
=
$
(
this
).
attr
(
"
href
"
);
/* this checks the link points to a local document, be
* it because it's just a path, or because the server
* part points to the same domain */
if
(
!
href
)
{
doLog
(
'
No href attributes, unable to load content
'
,
'
error
'
);
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
return
false
;
}
else
if
(
!
$
(
this
).
attr
(
'
target
'
)
&&
(
href
.
indexOf
(
document
.
domain
)
>
-
1
||
href
.
indexOf
(
'
:
'
)
===
-
1
||
href
.
indexOf
(
'
:
'
)
>
5
))
{
loadPage
(
href
);
return
false
;
}
else
{
$
(
this
).
attr
(
'
target
'
,
'
_blanck
'
);
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
return
true
;
$
.
fn
.
ajaxifyClick
=
function
(
params
)
{
this
.
each
(
function
()
{
$
(
this
).
unbind
(
'
click
'
);
$
(
this
).
bind
(
'
click
'
,
function
(){
$
(
this
).
addClass
(
'
loading
'
);
var
href
=
$
(
this
).
attr
(
"
href
"
);
/* this checks the link points to a local document, be
* it because it's just a path, or because the server
* part points to the same domain */
if
(
!
href
)
{
doLog
(
'
No href attributes, unable to load content
'
,
'
error
'
);
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
return
false
;
}
else
if
(
!
$
(
this
).
attr
(
'
target
'
)
&&
(
href
.
indexOf
(
document
.
domain
)
>
-
1
||
href
.
indexOf
(
'
:
'
)
===
-
1
||
href
.
indexOf
(
'
:
'
)
>
5
))
{
loadPage
(
href
);
return
false
;
}
else
{
$
(
this
).
attr
(
'
target
'
,
'
_blanck
'
);
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
return
true
;
}
});
});
};
/****************************************************/
/**** AUDIOPLAYER ****/
/****************************************************/
if
(
$
(
'
#player-container
'
).
offset
()){
var
topPosition
=
0
;
topPosition
=
$
(
'
#player-container
'
).
offset
().
top
;
$
(
window
).
bind
(
'
scroll load
'
,
function
(
event
)
{
//$('#player-container').removeClass('fixed');
var
y
=
$
(
this
).
scrollTop
()
-
$
(
'
#Player
'
).
height
();
if
(
topPosition
!==
0
&&
y
>=
topPosition
)
{
$
(
'
#Player
'
).
css
({
'
min-height
'
:
$
(
'
#Player
'
).
height
()});
$
(
'
#player-container
'
).
addClass
(
'
fixed
'
).
removeClass
(
'
normal
'
);
}
else
{
$
(
'
#Player
'
).
css
({
'
min-height
'
:
'
auto
'
});
$
(
'
#player-container
'
).
removeClass
(
'
fixed
'
).
addClass
(
'
normal
'
);
}
});
}
var
$localList
=
$
(
'
#localList
'
).
playlist
({
controlContainer
:
$
(
'
<div>
'
,{
class
:
"
playListControls label
"
}).
sortable
(),
playlistContainer
:
$
(
'
<ol>
'
,{
id
:
"
myPlaylist
"
,
class
:
"
custom
"
}).
sortable
(),
onLoad
:
function
(
self
){
$
(
'
#playlistLabel
'
).
on
(
'
click
'
,
function
(){
self
.
playlistContainer
.
toggleClass
(
'
deploy
'
);
});
if
(
self
.
isActive
){
self
.
playlistContainer
.
scrollTo
(
self
.
isActive
,
800
);}
},
onPlay
:
function
(
self
){
$
(
'
#DirectStreamPanik
'
)[
0
].
pause
();
self
.
playlistContainer
.
scrollTo
(
self
.
isActive
,
800
);
/*self.isPlaying[0].scrollIntoView();
var posScroll = self.playlistContainer.scrollTop() + self.isPlaying.position().top - self.playlistContainer.height()/2 + self.isPlaying.height()/2;
self.playlistContainer.animate({
scrollTop:posScroll
}, 'slow'); */
},
onAdd
:
function
(
self
){
//self.isLastAdd[0].scrollIntoView();
self
.
isLastAdd
.
find
(
'
a
'
).
ajaxifyClick
();
self
.
playlistContainer
.
scrollTo
(
self
.
isLastAdd
,
800
).
delay
(
1000
).
scrollTo
(
self
.
isActive
,
800
).
clearQueue
();
},
onUpdate
:
function
(
self
){
//doLog(JSON.stringify(self.playlist, null, '\t'));
if
(
self
.
playlist
.
length
>=
1
){
self
.
element
.
show
();
$
(
'
#Player
'
).
addClass
(
'
withPlaylist
'
);
}
else
{
self
.
element
.
hide
();
$
(
'
#Player
'
).
removeClass
(
'
withPlaylist
'
);
}
}
});
init
=
function
()
{
$
(
"
#All a, #All area
"
).
removeClass
(
'
loading
'
);
$
(
"
#All a, #All area
"
).
ajaxifyClick
();
$
(
"
#search-form
"
).
unbind
(
'
submit
'
).
on
(
'
submit
'
,
function
(
event
)
{
event
.
preventDefault
();
$
(
this
).
addClass
(
'
loading
'
);
...
...
panikweb_templates/templates/includes/audio.html
View file @
09270903
...
...
@@ -21,6 +21,7 @@
<audio
data-player=
'true'
class=
'hidden'
data-url=
"{% url 'episode-view' emission_slug=episode.emission.slug slug=episode.slug %}"
title=
"{{episode.title}}"
id=
"Audio-{{ sound.file.url|slugify }}"
preload=
"{% if preload %}{{ preload }}{% else %}none{% endif %}"
...
...
panikweb_templates/templates/includes/player.html
View file @
09270903
...
...
@@ -34,7 +34,7 @@
</div>
<div
id=
"Playlist"
class=
"sub cf"
>
<div
id=
"localList"
class=
"padded"
>
<div
id=
"playlistLabel"
class=
"label button"
>
Playlist
<span
class=
"icon-list"
></span></div>
<div
id=
"playlistLabel"
class=
"label button"
>
Playlist
<span
class=
"icon-list"
title=
"Show/Hide playlist"
></span></div>
</div>
</div>
<script
type=
"text/javascript"
>
...
...
@@ -47,8 +47,8 @@
WhatsOnAir
.
fadeOut
();
if
(
onair
.
data
.
episode
||
onair
.
data
.
emission
){
var
result
=
''
;
result
=
result
+
(
$
.
type
(
onair
.
data
.
emission
)
==
'
object
'
?
'
<span>
'
+
onair
.
data
.
emission
.
title
+
'
</span>
|
'
:
''
);
result
=
result
+
(
$
.
type
(
onair
.
data
.
episode
)
==
'
object
'
?
'
<span>
'
+
onair
.
data
.
episode
.
title
+
'
</span>
'
:
''
);
result
=
result
+
(
$
.
type
(
onair
.
data
.
emission
)
==
'
object
'
?
'
<span>
'
+
onair
.
data
.
emission
.
title
+
'
</span>
'
:
''
);
result
=
result
+
(
$
.
type
(
onair
.
data
.
episode
)
==
'
object
'
?
'
|
<span>
'
+
onair
.
data
.
episode
.
title
+
'
</span>
'
:
''
);
//var container = $('
<
a
>
'
,{class:"intercepted",href:onair.data.emission.url,html:result});
WhatsOnAir.html(result);
} else if (onair.data.nonstop) {
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment