The major browsers have support for the <object/> tag.
I want to incorporate a video player on my site to play .mkv video, but I cannot use most because the are based on flash, which can only play .flv & .f4v.
That's why I'm switching to the <object/> tag
But, if I wanted to incorporate a tag with the name of <mkvvideo/>, would a simple plugin associated with that tag be usable, or does the core programming of the browser handle that?
Thanks
You can't associate plugins with tags.
Instead you register the mimetypes (and file extensions) that your plugin supports and use that mimetype with the object tag (in this case video/x-matroska).
Related
I've set up Contentful as the headless CMS of my blog. Everything works, except rendering assets (in my case images specifically). My blog is built using Symfony and uses Twig for templating.
This is how (a part of the) content is currently rendered:
I'm using Contentful's default rich text renderer for Twig, as described here. Unfortunately, it doesn't say anything about assets. But given that there's an EmbeddedImage class available, I would expect support for images.
What step am I missing?
You need to define a custom renderer for the assets in the same way as described for a custom heading here.
The reason why assets don't work "out of the box" is that the renderer can't know what type of asset is being returned. For example, is it a .jpg, .mp4, .wav file etc. You may have a variety of different assets in your Rich Text and will need to render the different asset files accordingly to your HTML.
The full list of node types you can define custom renderers for is here.
In manifest.json, we specify our background page and can put an html or a js file for it. Since it is only a script that executes what sense does it make to have an html file for it?
I mean where is UI going to get shown anyway?
Similarly the devtools_page property has to be an html file. What sense does that make?
It will not be shown anywhere (that's the essence of "background"), but some elements on it make sense.
You can have an <audio> tag, and if you play it, it will be heard.
You can have an <iframe> with some other page loaded invisibly.
..and so on
As for devtools_page, it would actually be visible in the interface (as an extra panel in the DevTools)
It is possible that devtools_page must be an HTML file just for legacy reasons: it was not updated when manifest version 2 rolled out with changes to how background pages are specified. Still, the same arguments as above apply.
background_page is a legacy feature from the initial support of extensions in Chrome. background.scripts was added in Chrome 18. I can't speak for Google's original intentions but I'd guess that in the original design using an page felt more natural and would be less likely to confuse developers. Once they realized how many background_pages were just being used to load JavaScript it made sense to explicitly support that.
I've setup two pages with the background-size:cover; with one using a .jpg and one using a .png. Both pages render fine in Chrome/Safari/Firefox on the desktop, but for some reason the .jpg version does not render on iPhone/iPad in Chrome/Safari.
PNG Version
JPG Version
I suspect it might have something to do with the compression of the .jpg which I set to the lowest (smallest file size) setting in Photoshop, but I could not find any actual info on this. Any advice is much appreciated!
EDIT:
I am already using the browser specific prefixes in my css (e.g. -webkit-,-moz,-o-).
background-size is a new CSS property and therefore isn't available everywhere yet
although in mobile devices -webkit-background-size:cover; should do the trick
For Safari versions <5.1 the css3 property background-size doesn't work. In such cases you need webkit.
So you need to use -webkit-background-size attribute to specify the background-size.
Hence use -webkit-background-size:cover.
Reference-Safari versions using webkit
I would like my Chrome extension content script to detect the language or locale of the page's content (not the browser language/locale). I assume there is a method for this in the Chrome extension API, but should I be using standard Javascript libraries instead?
This is the Chrome extension method: chrome.tabs.detectLanguage(...). From the description:
Detects the primary language of the content in a tab.
You could use standard javascript DOM functions to look for a lang attribute on the root html element (or possibly the body element). But keep in mind that a page might not be entirely in one language, so different elements of the page may be marked up with different lang attributes.
Also, if you want to support xhtml, I'd suggest looking the xml:lang attribute as well.
I want to play a video file from my web app. I use JSF. I want to know how we can open the video file with the help of any video player installed in the client's system. I know how to open a pdf file the same way. But I want to know how to open a video file.
There's no standard JSF component for this. It's however not different from as you would do in plain HTML. Just drop the video file in public webcontent (so that it's reachable by an URL) and use the HTML <embed> and/or the <object> element which points to the URL of the video file. That's basically all. Note that you can just use EL in template text. So e.g. <embed src="#{bean.videoURL}"> would work perfectly fine, as long as it generates the HTML code the way you intend (open page in browser, rightclick and View Source to see it).
The way how to create and parameterize the HTML <embed> or <object> tag in turn depends on the video format (MPEG, MOV, FLV, etc). You basically need to consult the documentation of the video format vendor for details how to use it. Since you didn't mention what format the video file is in, we can't help you further in detail. Googling the smart way should however yield sufficient examples. E.g. "embed mpeg in html".
PrimeFaces has however a <p:media> component which makes it all easier for developers who are lazy in Googling for examples and/or figuring the browser specific inconsitenties ;) It'll outright generate the right HTML code necessary for the provided video format.
See also:
How to stream audio/video files such as MP3, MP4, AVI, etc using a Servlet
This works in browsers those support HTML5.
<video controls="controls">
<source src="resources/myVideo.mp4" type="video/mp4"/>
</video>