use streaming proxy
This commit is contained in:
parent
16a9439152
commit
c230b57dca
9 changed files with 34 additions and 25 deletions
|
@ -211,13 +211,13 @@ function renderAnnotation(config, video, ascroll, clip) {
|
||||||
}
|
}
|
||||||
var values = []
|
var values = []
|
||||||
clip.annotations.forEach(a => {
|
clip.annotations.forEach(a => {
|
||||||
values.push(a.value.replace(/src="\//g, `src="${pandoraURL}/`).replace(/href="\//g, `href="${pandoraURL}/`))
|
values.push(a.value.replace(/src="\//g, `src="${streamPrefix}/`).replace(/href="\//g, `href="${pandoraURL}/`))
|
||||||
})
|
})
|
||||||
values = values.join('<br><br>')
|
values = values.join('<br><br>')
|
||||||
div.innerHTML = `
|
div.innerHTML = `
|
||||||
<div class="frame">
|
<div class="frame">
|
||||||
<figure>
|
<figure>
|
||||||
<img src="${pandoraURL}/${annotation.id.split('/')[0]}/${imageResolution}p${annotation.in}.jpg">
|
<img src="${streamPrefix}/${annotation.id.split('/')[0]}/${imageResolution}p${annotation.in}.jpg">
|
||||||
${figcaption}
|
${figcaption}
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
|
@ -228,7 +228,7 @@ function renderAnnotation(config, video, ascroll, clip) {
|
||||||
document.addEventListener('scroll', onVisibilityChange(div.querySelector('.frame'), function(visible) {
|
document.addEventListener('scroll', onVisibilityChange(div.querySelector('.frame'), function(visible) {
|
||||||
var src
|
var src
|
||||||
if (config.edit) {
|
if (config.edit) {
|
||||||
src = `${pandoraURL}/${annotation.id.split('/')[0]}/480p.webm`
|
src = `${streamPrefix}/${annotation.id.split('/')[0]}/480p.webm`
|
||||||
}
|
}
|
||||||
if (config.loaded && visible) {
|
if (config.loaded && visible) {
|
||||||
updatePlayer(video, frame, annotation['in'], annotation['out'], src)
|
updatePlayer(video, frame, annotation['in'], annotation['out'], src)
|
||||||
|
@ -248,7 +248,7 @@ function renderAnnotations(config) {
|
||||||
video.WebKitPlaysInline = true
|
video.WebKitPlaysInline = true
|
||||||
video.muted = true
|
video.muted = true
|
||||||
if (config.item) {
|
if (config.item) {
|
||||||
setVideoSrc(video, `${pandoraURL}/${config.item}/480p.webm`)
|
setVideoSrc(video, `${streamPrefix}/${config.item}/480p.webm`)
|
||||||
}
|
}
|
||||||
video.addEventListener('timeupdate', timeupdate)
|
video.addEventListener('timeupdate', timeupdate)
|
||||||
video.addEventListener('touchstart', showOverlay)
|
video.addEventListener('touchstart', showOverlay)
|
||||||
|
@ -268,7 +268,7 @@ function renderAnnotations(config) {
|
||||||
if (frame) {
|
if (frame) {
|
||||||
var src
|
var src
|
||||||
if (config.edit) {
|
if (config.edit) {
|
||||||
src = `${pandoraURL}/${config.first.id.split('/')[0]}/480p.webm`
|
src = `${streamPrefix}/${config.first.id.split('/')[0]}/480p.webm`
|
||||||
}
|
}
|
||||||
updatePlayer(video, frame, config.first['in'], config.first['out'], src)
|
updatePlayer(video, frame, config.first['in'], config.first['out'], src)
|
||||||
}
|
}
|
||||||
|
|
|
@ -200,8 +200,8 @@ function renderPlayer(config) {
|
||||||
video.muted = false
|
video.muted = false
|
||||||
video.controls = true
|
video.controls = true
|
||||||
if (config.item) {
|
if (config.item) {
|
||||||
setVideoSrc(video, `${pandoraURL}/${config.item}/480p.webm`)
|
setVideoSrc(video, `${streamPrefix}/${config.item}/480p.webm`)
|
||||||
video.poster = `${pandoraURL}/${config.item}/480p.jpg`
|
video.poster = `${streamPrefix}/${config.item}/480p.jpg`
|
||||||
}
|
}
|
||||||
video.addEventListener('timeupdate', timeupdate)
|
video.addEventListener('timeupdate', timeupdate)
|
||||||
var box = document.createElement('div')
|
var box = document.createElement('div')
|
||||||
|
|
|
@ -59,11 +59,11 @@ body {
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="video-block">
|
<div class="video-block">
|
||||||
<img src="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
|
<img src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
|
||||||
<video
|
<video
|
||||||
id="timeline-video"
|
id="timeline-video"
|
||||||
src="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64p.mp4"
|
src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64p.mp4"
|
||||||
poster="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg"
|
poster="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg"
|
||||||
controlsList="nodownload"
|
controlsList="nodownload"
|
||||||
autoplay
|
autoplay
|
||||||
loop
|
loop
|
||||||
|
@ -82,7 +82,7 @@ body {
|
||||||
<div class="overlay">
|
<div class="overlay">
|
||||||
<img src="{% static 'svg/play.svg' %}">
|
<img src="{% static 'svg/play.svg' %}">
|
||||||
</div>
|
</div>
|
||||||
<img src="https://archive.njp.ma/{{ item.id }}/480p.jpg">
|
<img src="{{ stream_prefix }}/{{ item.id }}/480p.jpg">
|
||||||
<figcaption>
|
<figcaption>
|
||||||
{{ item.title | safe }}
|
{{ item.title | safe }}
|
||||||
{% if item.date %}({{item.date | safe }}){% endif %}
|
{% if item.date %}({{item.date | safe }}){% endif %}
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
<script>
|
<script>
|
||||||
var config = {{ config | safe }};
|
var config = {{ config | safe }};
|
||||||
var pandoraURL = "{{ pandora_url }}";
|
var pandoraURL = "{{ pandora_url }}";
|
||||||
|
var streamPrefix = "{{ stream_prefix }}";
|
||||||
</script>
|
</script>
|
||||||
<script src="{% static 'js/api.js' %}"></script>
|
<script src="{% static 'js/api.js' %}"></script>
|
||||||
<script src="{% static 'js/play.js' %}"></script>
|
<script src="{% static 'js/play.js' %}"></script>
|
||||||
|
|
|
@ -30,11 +30,11 @@
|
||||||
<figure>
|
<figure>
|
||||||
<div>
|
<div>
|
||||||
{% for item in film.data.items %}
|
{% for item in film.data.items %}
|
||||||
<img src="https://archive.njp.ma/{{ item.id }}/480p.jpg">
|
<img src="{{ stream_prefix }}/{{ item.id }}/480p.jpg">
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
<figcaption>
|
<figcaption>
|
||||||
<img src="https://archive.njp.ma/{{ film.data.items.0.id }}/timeline64p.jpg">
|
<img src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timeline64p.jpg">
|
||||||
</figcaption>
|
</figcaption>
|
||||||
<figcaption>
|
<figcaption>
|
||||||
{{ film.data.title | safe }}
|
{{ film.data.title | safe }}
|
||||||
|
|
|
@ -22,11 +22,11 @@
|
||||||
<div class="index">
|
<div class="index">
|
||||||
{% if featured %}
|
{% if featured %}
|
||||||
<div class="video-block">
|
<div class="video-block">
|
||||||
<img src="https://archive.njp.ma/{{ featured }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
|
<img src="{{ stream_prefix }}{{ featured }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
|
||||||
<video
|
<video
|
||||||
id="timeline-video"
|
id="timeline-video"
|
||||||
src="https://archive.njp.ma/{{ featured }}/timelineslitscan64p.mp4"
|
src="{{ stream_prefix }}{{ featured }}/timelineslitscan64p.mp4"
|
||||||
poster="https://archive.njp.ma/{{ featured }}/timelineslitscan64pframe.jpg"
|
poster="{{ stream_prefix }}{{ featured }}/timelineslitscan64pframe.jpg"
|
||||||
controlsList="nodownload"
|
controlsList="nodownload"
|
||||||
autoplay
|
autoplay
|
||||||
loop
|
loop
|
||||||
|
|
|
@ -38,6 +38,7 @@
|
||||||
<script>
|
<script>
|
||||||
var config = {{ text.json | safe }};
|
var config = {{ text.json | safe }};
|
||||||
var pandoraURL = "{{ pandora_url }}";
|
var pandoraURL = "{{ pandora_url }}";
|
||||||
|
var streamPrefix = "{{ stream_prefix }}";
|
||||||
</script>
|
</script>
|
||||||
<script src="/static/js/api.js?2021112223"></script>
|
<script src="/static/js/api.js?2021112223"></script>
|
||||||
{% if text.data.view == 'player' %}
|
{% if text.data.view == 'player' %}
|
||||||
|
|
|
@ -18,6 +18,7 @@ def index(request):
|
||||||
context = {}
|
context = {}
|
||||||
context['films'] = Film.objects.filter(public=True).count()
|
context['films'] = Film.objects.filter(public=True).count()
|
||||||
context['texts'] = Text.objects.filter(public=True).count()
|
context['texts'] = Text.objects.filter(public=True).count()
|
||||||
|
context['stream_prefix'] = get_stream_prefix(request)
|
||||||
featured = Film.objects.filter(featured=True)
|
featured = Film.objects.filter(featured=True)
|
||||||
featured_count = featured.count()
|
featured_count = featured.count()
|
||||||
if featured_count:
|
if featured_count:
|
||||||
|
|
|
@ -11,6 +11,8 @@ from . import models
|
||||||
|
|
||||||
logger = logging.getLogger(__name__)
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
stream_prefix_cache = {}
|
||||||
|
|
||||||
def get_ip(request):
|
def get_ip(request):
|
||||||
if 'HTTP_X_FORWARDED_FOR' in request.META:
|
if 'HTTP_X_FORWARDED_FOR' in request.META:
|
||||||
ip = request.META['HTTP_X_FORWARDED_FOR'].split(',')[0]
|
ip = request.META['HTTP_X_FORWARDED_FOR'].split(',')[0]
|
||||||
|
@ -21,17 +23,17 @@ def get_ip(request):
|
||||||
return ip
|
return ip
|
||||||
|
|
||||||
def get_stream_prefix(request):
|
def get_stream_prefix(request):
|
||||||
return settings.DEFAULT_PANDORA_API.replace('/api/', '/')
|
#domain = settings.DEFAULT_PANDORA_API.split('/')[2]
|
||||||
'''
|
domain = 'njp.ma'
|
||||||
domain = settings.DEFAULT_PANDORA_API.split('/')[3]
|
prefix = "https://media.v1.%s" % domain
|
||||||
prefix = "https://v2.%s/" % domain
|
|
||||||
cdn = {
|
cdn = {
|
||||||
'Eastern Asia': "https://v1.%s/" % domain,
|
'Eastern Asia': "https://media.v2.%s" % domain,
|
||||||
'Southern Asia': "https://v1.%s/" % domain,
|
'Southern Asia': "https://media.v2.%s" % domain,
|
||||||
'Asia': "https://v1.%s/" % domain,
|
'Asia': "https://media.v2.%s" % domain,
|
||||||
}
|
}
|
||||||
'''
|
|
||||||
ip = get_ip(request)
|
ip = get_ip(request)
|
||||||
|
if ip in stream_prefix_cache:
|
||||||
|
return stream_prefix_cache[ip]
|
||||||
try:
|
try:
|
||||||
g = GeoIP2()
|
g = GeoIP2()
|
||||||
country = g.country(ip)
|
country = g.country(ip)
|
||||||
|
@ -42,15 +44,19 @@ def get_stream_prefix(request):
|
||||||
location = info.get(key)
|
location = info.get(key)
|
||||||
#print(location)
|
#print(location)
|
||||||
if location in cdn:
|
if location in cdn:
|
||||||
|
stream_prefix_cache[ip] = cdn[location]
|
||||||
return cdn[location]
|
return cdn[location]
|
||||||
except:
|
except:
|
||||||
logger.error('using default prefix, no geoip data found, run ./mange.py update_geoio', exc_info=True)
|
logger.error('using default prefix, no geoip data found, run ./mange.py update_geoio', exc_info=True)
|
||||||
|
stream_prefix_cache[ip] = prefix
|
||||||
return prefix
|
return prefix
|
||||||
|
stream_prefix_cache[ip] = prefix
|
||||||
return prefix
|
return prefix
|
||||||
|
|
||||||
def films(request):
|
def films(request):
|
||||||
context = {}
|
context = {}
|
||||||
context['films'] = models.Film.objects.filter(public=True).order_by('position', 'data__title')
|
context['films'] = models.Film.objects.filter(public=True).order_by('position', 'data__title')
|
||||||
|
context['stream_prefix'] = get_stream_prefix(request)
|
||||||
context['settings'] = settings
|
context['settings'] = settings
|
||||||
return render(request, 'films.html', context)
|
return render(request, 'films.html', context)
|
||||||
|
|
||||||
|
@ -66,10 +72,10 @@ def film_play(request, slug, id):
|
||||||
context = {}
|
context = {}
|
||||||
context['settings'] = settings
|
context['settings'] = settings
|
||||||
context['config'] = json.dumps({
|
context['config'] = json.dumps({
|
||||||
'stream_prefix': get_stream_prefix(request),
|
|
||||||
'layer': 'transcripts',
|
'layer': 'transcripts',
|
||||||
'item': id
|
'item': id
|
||||||
})
|
})
|
||||||
|
context['stream_prefix'] = get_stream_prefix(request)
|
||||||
context['pandora_url'] = settings.DEFAULT_PANDORA_API.replace('/api/', '')
|
context['pandora_url'] = settings.DEFAULT_PANDORA_API.replace('/api/', '')
|
||||||
return render(request, 'film_play.html', context)
|
return render(request, 'film_play.html', context)
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue