Regex for javascript include query to filename - javascript

There is jquery modal box called fancybox and its pretty cool i like it and intend to use it for my site, but the problem is that my flash video is actually video player and videos passed to it like query e.g. player.swf?videosource=video1.flv and this modal does not work it show contents of flash file as if you open in in text editor.
Inside there's code
ajaxLoader = null, imgPreloader = new Image(), imgRegExp = /\.(jpg|gif|png|bmp|jpeg)(.*)?$/i, swfRegExp = /[^\.]\.(swf)\s*$/i,
I believe i need to modify this regex "/[^\.]\.(swf)\s*$/i" expression to somehow include what i have after swf can someone help me do it i going crazy nothing i tried works.

This regex should accept your player.swf?videosource=video1.flv query:
/[^\.]\.(swf)(?:\?.+)?\s*$/i

Related

Bookmarklet to grab info from current url and insert into new one

I'd like a bookmarklet that takes info from my current url (like these):
https://www.themoviedb.org/tv/88396-falcon-winter-soldier
https://www.themoviedb.org/movie/64688-21-jump-street
https://www.themoviedb.org/person/7447-alec-baldwin
Extracts just id portion, the first set of numbers (88396, 64688, 7447, etc) and appends it to a new url like this:
https://webhookurl.com/webhook?movieID=(id from url)
Which opens in a background tab ideally.
I'm super new to javascript, been trying to cobble something together from similar answers on here but unable to figure it out. Any help is very much appreciated.
update: thanks to some help here with the regex and tinkering until i got the other tab thing to work, i now have a finished bookmarklet that works. thanks
ud2: changed again to 1. match urls with no '-film-name' after the id number, and also to open in a small new window rather than new tab so i can easily close after the webhook is accepted and it doesn't obstruct my view of the page
javascript:(function(){ open(window.location.toString().replace(/^https:\/\/www.themoviedb.org\/.*?\/([0-9]+)-?.*/, 'https://fakewebhook.com/webhook?movieID=$1'), "", "width=400, height=200");})()
You may use regex to form the new url from the given url.
'https://www.themoviedb.org/tv/88396-falcon-winter-soldier'.replace(/^https:\/\/www.themoviedb.org\/tv\/([0-9]+)-.+/, 'https://webhookurl.com/webhook?movieID=$1')

Dynamically change videojs captions with addTextTrack()

I'm trying to build some thing like a video gallery which you can select a video to show up by clicking on its thumbnail. Now I'm at phase of loading appropriate subtitles for the chosen video. Thanks to google I understand that videojs has a method to help me called addTextTrack() but unfortunately there is not a good sample or documentation for it. After all I tried to find its parameters and behavior via reading the video.dev.js codes. but as I understand this method has just three params (kind, label, language) and the thing that I didn't understand is that: How can I set the src to load the subtitle file. I think its a bug and it doesn't work properly and I want to report it if you're agree with me.
The following code adds cc icon to the player but it doesn't show the subtitle (How can it be shown when I didn't tell him the URL to load)
var myPlayer = videojs('video-id');
myPlayer.addTextTrack('captions', 'En', 'English');
I checked videojs 5.0.0 addTextTrack method and there wasn't any significant changes.
After about a month without any answer to my question, I don't know yet why addTextTrack() doesn't work properly. But thanks God, I found a way to achieve my goal:
To dynamically changing all text tracks
var oldTracks = player.remoteTextTracks();
var i = oldTracks.length;
while (i--) {
player.removeRemoteTextTrack(oldTracks[i]);
}
myNewTracks.forEach(function(track) {
player.addRemoteTextTrack(track);
});
The text track did never get updated dynamically and after a long search, I had found a solution for my problem. When I change the video source I replace the text track and set it on mode="showing":
let player = videojs('first-player');
player.addRemoteTextTrack({
kind: 'captions',
src: 'my-track-path.vtt',
mode: 'showing'
}, false);

opening a new window based on the current url of the page

So ostensibly I'm trying to make a button or a link who's target is contingent on the current page's URL. I'm working on a Wordpress portfolio site that opens up different projects in an Ajax window, but I also want to be able to link to the separate project page from that window. For instance, if I click the thumbnail for a project titled "Blue" it opens up the project in the ajax window and the url changes to "www.website.com/#blue." Incidentally, the url of the corresponding project page would then be "www.website.com/projects/blue". The idea is to hardcode the button into the Ajax window and write a script that generates the correct URL for the project page so my client doesn't have to copy-paste the code for the button and update the target URL every time she posts a project. This is what I came up with, but I'm not great with Jquery or Javascript and I think something might be wrong with my syntax or the structure of the script. Right now, nothing happens when I press the button.
First it splits the url at each "/" and creates an array from the different strings, then it removes the "#" from the unique string, and opens a new window with the new address.
EDIT There were some syntax errors, but it's still not working. Any thoughts on this new version:
$(".comment_button").click(function(){
var parse_url = window.location.href.split('/');
var project_name = parse_url[2].replace("#", "");
window.open("http://www.balletinform.com/projects/" + project_name);
});
Tried using a element ?, with target="_blank" attribute ?
<a id="blue" href="www.website.com/projects/blue" target="_blank">blue</a>
If I understand correctly, what you want to get is the #blue part of the url.
If so, you can use window.location.hash.
Your function will then looks like window.open("http://www.balletinform.com/projects/" + window.location.hash.substring(1));
Your current function was setting project_name to "www.balletinform.com" ([0]=>"http:"; splitted(/); [1]=>""; splitted('/'); [2]=>"www.balletinform.com"; splitted('/'); [3]=>"#blue").
So an alternative solution would have been var project_name = parse_url[parse_url.length-1].replace("#", "");
var new_url=""+(window.location.href).replace('#','projects/');
window.open(new_url);
Try replacing # with 'projects/'

Fade and replace image with other image depending on hash

First, here is my crazy code that you will hate
So I have this image that I want to replace with a jQuery fade effect whenever the hash changes. I want for it to check the hash on onLoad too. Right now I have a crazy code that I am pretty sure doesn't work because I am a kind of new Javascript developer. It is a horrible code.
If the code worked, it would do this:
//Home Hashes
var home = [
"#home",
"#news",
"#team",
"#cont",
"#about",
"#FAQ"];
It would check for for the hashes in each of these arrays, if it finds a match in one array, it will fade out the current image, switch them out, and fade the new image in. Depending on what array it is in, it will choose a different image.
(BTW, when changing the image it is changing the src in the html.)
I am using this to change my logo based on where you are on the site. My site has different logos for different sections.
You need to use onload plus hashchange
window.onload = checkHash;
window.onhashchange = checkHash;
function checkHash() {
// check stuff
}
Working Fiddle :: careful hash does change :-)
http://jsfiddle.net/R9cNW/9/

Detecting & displaying links in a form's text area

When I enter a link (video, image, URL, etc.) in Facebook's "What's on your mind?" form, it auto-detects the link and converts it to a thumbnail with a brief description below the text-area. Can anyone provide me with insight or a link to get me going on how to achieve this?
There's a javascript attached to the textarea change event. The javascript detects if the content of the textarea is a url, if it is, the javascript call a webservice that visit the url looking for the page title, the page description, etc, (or the open graph protocol meta tags), if it find each one of the tags they are returned to the javascript who proper organize then.
Facebook also cache this content, and if the same url is posted by another user, he uses the cache values instead of revisiting the page.
The open graph protocol meta tags:
http://developers.facebook.com/docs/opengraphprotocol/
using something like
var input = document.getElementById("textarea");
input.addEventListener("change", checkLink(e));
input.addEventListener("blur", checkLink(e));
function checkText(text){
var exp = "((ht|f)tp(s?))(:((\/\/)(?!\/)))(((w){3}\.)?)([a-zA-Z0-9\-_]+(\.(com|edu|gov|int|mil|net|org|biz|info|name|pro|museum|co\.uk)))(\/(?!\/))(([a-zA-Z0-9\-_\/]*)?)([a-zA-Z0-9])+\.((jpg|jpeg|gif|png)(?!(\w|\W)))";
return text.match(exp);
}
function checkLink(e){
//here you would want to use a regular expression and check for http:
var regularExpression = !!checkText(e.target.innerHTML); // returns true or false
if(regularExpression){
e.target.innerHTML += "<a href='#'><img src="" alt="" /></a>";
}
}
good resource for regular expressions - http://regexlib.com/Search.aspx?k=image&c=-1&m=-1&ps=20
Warning -- have to leave for work so regular expressions are not checked.
Take the link value and run it through a regular expression that looks for ^http:...[^\s] or ^https:...[^\s] and returns those.
Then, pass those URLs to your server and have your server retrieve the document and return a snippit for you to then put in your document. You must have your own server to help because Javascript, by itself, has security restrictions. Google same origin policy for more info.

Categories

Resources