Django - Displaying video with jwplayer - django

I am currently trying to display a video on a website using jwplayer. The view for the page is
def video(request):
return render_to_response('video_player/video.html', context_instance=RequestContext(request)
And the html template being used contains this in the head:
<script type="text/javascript" src="/jwplayer/jwplayer.js"></script>
And this in the body:
<div id="myElement">Loading the player...</div>
<script type="text/javascript">
jwplayer("myElement").setup({
file: "{{ MEDIA }}videos/test.mp4",
image: "{{ MEDIA }}videos/cute-bunny.jpg"
});
</script>
It doesn't display anything other than 'Loading the player', i think there may be something wrong with me calling the media_root. It is defined as:
MEDIA_ROOT = 'C:/Users/Timmy/Documents/GitHub/GroupProject/media'

You should be using the {{ MEDIA_URL }} tag in your templates, which you define in settings.py.
Example in settings.py:
MEDIA_URL = '/media/'
MEDIA_ROOT, like STATIC_ROOT, is the directory that Django uses to upload media files to and serve media files from, not the URL path.
See: https://docs.djangoproject.com/en/dev/howto/static-files/#serving-files-uploaded-by-a-user

Related

Problem in loading the logo in different URLs in Django

I have the same html for Tools.html and home.html but I realized the logo can be loaded in this URL:
path('',views.home),
But in this URL I do not see the logo and also the favicon:
path('Tools/', views.Tools ),
http://127.0.0.1:8000/
http://127.0.0.1:8000/Tools/
views:
def Tools(request):
p=product.objects.filter(category__name='Tools')
return render(request,'Tools.html',{'p':p})
def home(request):
p=product.objects.filter(category__name='home')
return render(request,'home.html',{'p':p})
urls:
urlpatterns = [
path('Tools/', views.Tools ),
path('',views.home),
]
the following codes are for favicon and logo in html file:
<link rel="icon" type="image/x-icon" href="static/logo.png">
<img class="img" width="270px" src="static/logo.svg">
Why is this happening?
You should not hardcode static/logo.png, the right way is to use {% static 'logo.png' %}. Then it will always search in your static folder. You just need to start the template with {% load static %}. Assuming, that you have set in settings something like:
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'
and you keep such files in your_project/static folder it should work for every level on every app.
More info in Django DOCS

How to serve files to download from HTML using django templating

I'm stuck in my project where i want to serve some files to download on clicking the download button on my webpage.
Can anyone kindly direct me how to serve downloadable files on the web pages using template in django.
in normal html, we can achieve as
<a href="<path_of_file>" download>
I am beginner in django. need some assistance with django templating
Generally, to render the dictionary text "{{ inser_me }}" in HTML and i created the entry in "views.py" as below.
def index(request):
my_dict = {'insert_me':"Now I am coming from first_app/index.html!"}
return render(request,'app/index.html',context=my_dict)
I saw about media file handling and added the below in "settings.py"
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
and I put the contents under media directory. I can able to download the file if I use as "http://localhost/media/file_name"
can you please advise how i need to instruct in views.py to access this url.
<a href="{{ ?? }}" download>
Just replace with the file url in your template:
<a href="{{ my_file.url }}" download>

Django templates - Image from media_root rendered in homepage, but not other pages

I have an image that renders on my homepage, but it doesn't on a different page using the same code. I figure the problem may be the difference my url path maybe? It's the only difference I can find. When I inspect each element, this is what I see:
Working image: /event/image.png
Broken Image: /event/media/image.png
I'm rendering the image like this in my template:
<img src="media/{{event.image}}" class="img-responsive" />
My model is just aa model.Image field and here are is my view for the Broken image page:
def event(request, product_id):
event = get_object_or_404(Event, id=product_id)
image = event.image
context = {'event':event, 'image':image}
template = 'tourney.html'
return render(request, template, context)
In my terminal, it says image not found. So how can I change my settings so that it looks in the right directory no matter which path I'm in? Here are my media settings:
if DEBUG:
MEDIA_URL = '/media/'
STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'static', 'static-only')
MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'static', 'media')
STATICFILES_DIRS = (
os.path.join(os.path.dirname(BASE_DIR), 'static', 'static'),
)
You need a leading slash: "/media/...".
However, even better would be to use the built-in property that gives you the full URL including MEDIA_URL:
<img src="{{ event.image.url }}" class="img-responsive">
Instead of building url by yourself, like media/{{event.image}}, let Django do that job for you:
<img src="{{ event.image.url }}" class="img-responsive" />
That way, Django will create proper URL, using MEDIA_URL from your settings. Be aware that your web server configuration must match that and serve images from MEDIA_ROOT on MEDIA_URL

Managing static/images in Django with AppEngine

I am trying to add an image to my simple google app engine code, but it doesn't work if I follow the tutorial. It works if my image is in my app directory, but not when I move it to static.
When I am using it in plain html like:
<img src="../static/myimage.jpg"></img>
or
 
and many other variations, the image just does not show (it shows when it is outside of static dir). When I am doing it as in the tutorial, defining STATIC_URL in my settings file:
STATIC_URL = '/static/'
And adding this lines (or variations like "/my_image.jpg" and so on)
{% load staticfiles %}
<img src="{% static "my-app/myimage.jpg" %}" alt="My image"/>
causes server error (500). I am using django 1.3
Here is the directory structure:
my-app
\static
myimage.jpg
\templates
base.html
# and other html files
\urls.py, settings.py #and other .py files
App.yaml:
-url: /(.*\.(gif|png|jpg))
static_files: static/\1
upload: static/(.*\.(gif|png|jpg))
setting.py:
ROOT_URLCONF = 'urls'
urls.py:
STATIC_URL = '/static/'
What did you set STATIC_ROOT to?
Generally though, using GAE's static file handlers in app.yaml will give you better caching and probably lower cost than serving the images with django's staticfiles.

Django template substitution in include JS scripts

I've got a javascript widget written for my Django project, which is included at the top of my templates.
<script src="{{ STATIC_URL }}/js/widget.js"></script>
The widget needs to load its own stylesheet, but since it's not actually a Django template, it doesn't know where the static root is. Does it need find its .css relative to itself, or is there a way for Django to tell it about {{ STATIC_URL }}?
You can either do relative URLs in your Javascript, which is probably preferable, or you can define a global variable:
<script>var static_url = '{{ STATIC_URL }}';</script>
<script src="{{ STATIC_URL }}/js/widget.js"></script>
Then, you can use static_url anywhere in your JS code.
I would create the STATIC_URL variable in your settings.py file, making it accessible on your entire site.
STATIC_URL = 'https://your.js.server'