Bookmarklet to go to URL based on selected text - javascript

How could I write a bookmarklet for Google Chrome that will take the selected text, append it to a predetermined URL, and then go to the modified URL.
For example, let's say the base URL is http://www.mybaseurl.com/. (This base URL is hardcoded in the bookmarklet code.) Now, suppose that on a random webpage I select the text dog. Then, if I click the bookmarklet while that text is selected, I want the bookmarklet to cause the browser to visit the following URL: http://www.mybaseurl.com/dog.
How can this be done?

You can get the currently selected text with window.getSelection(). So this bookmarklet can redirect based on the selected text:
javascript:window.location.href="http://www.mybaseurl.com/"+window.getSelection()

This method will open the url in a new window or tab (depending on browser settings), instead of opening the url in the current tab. So, you won't lose your place. It uses window.open instead of location=
javascript:(function(){s=document.selection?document.selection.createRange().text:window.getSelection?window.getSelection().toString():document.getSelection?document.getSelection():'';if(s==''){s=prompt('You%20did%20not%20select%20any%20text%20to%20search%20for.%20Enter%20the%20text%20to%20search%20for%20:','');}if(s){window.open('https://mxtoolbox.com/SuperTool.aspx?action=ptr%3a'+s, '_blank')};})()

Related

Chrome extension: Inject a script into a single webpage (provided by the user)

I have a chrome extension with a single text input field and a button that says "Test banner". My goal is to inject a script that will manipulate the DOM of the given webpage and add a big red banner at the top, but I only want to inject it into the single url that I put in the text field.
Basically my options.html has a text input and a button. When the user enters a URL like google.com I want to open the page and inject into only that instance of the page. My issue is that
$('#start-button').button().click(function() {
var url = $('#url').value;
window.open(url)
});
My url successfully opens, but I "wish" I could "open and inject". Since I can't do that I've been relegated to trying to setup a background.js that listens for a window being opened, but that code keeps injecting into every tab with the url that I set (example. If I type google.com, then it will keep injecting into every google.com tab that I open).
So my question is... is there some kind of api available where I can do window.openAndInject(url)?
Note: I am very very new to this. Please excuse any noob mistakes I may have made.

Open specific tab with <a href> and save to localStorage

I have a table whose current value is stored in localStorage (see JSfiddle). How do I set up a link in <a href> to open the desired table, e.g. second in order?
For example: I'm on the Home page and clicking <a href> redirects me to the List page, where tab Teacher is opened, and this option is also saved to localStorage (that is, when the List page is refreshed, the Teacher tab remains open).
Thank you!
If I understand correctly, you want to create a link to an HTML page, which, on that page, there are various options for a current tab to be selected, and you want, that when someone clicks on a particular link, that tab will already be open.
Am I right?
If so, then let's do the following.
If you're setting the value when the page loads based on localStorage, then by definition it will only open that which was opened last.
So the question is how do you make the particular link open only one tab, and another link open the other? It seems from your example that you want a link to the "student" tab and a separate link to the "teacher" tab.
To do this just with client side JavaScript, you can use the window location hash, and read it with JavaScript, and do the respective function based on the hash value.
Say you have some URL like example.com, which brings you to a default tab. Then, if you want a link to a non default tab, simply add something to the end of the URL preceded by a "#" symbol, then you can read it in JavaScript with location.hash
So the new URL may look like: example.com/#teacher, then somewhere in your page with JavaScript, do:
var page = location.hash //== "#teacher"
activateTab(page.replace("#", "")); //activates "teacher" tab, assuming that function would do something, but you get the idea

Pass selected text to default search engine

I am working on a Chrome/FF Quantum extension, and I've run into a problem. This extension creates a floating toolbar via content script, when the user selects some text on the webpage.
The toolbar has an "Open" button. What I want to do is to open a new tab, and pass the selected text to it. If the selected text is a valid URL, it should be opened. If it's only arbitrary text, it should be passed to the default search engine of the browser. Just like when the user types into the addressbar.
So far I have a content and a background script. The content script reads the selected text and sends it to the background script with chrome.runtime.sendMessage(). In that script I've tried both the chrome.tabs.create() and the window.open() methods, but if the selection is only arbitrary text, the new tab loads with the URL of the extension itself, and attaches the text to the path part.
Is it even possible to do, or I have to use a search engine as a user setting of the extension, and build the query myself?

Bookmark that takes the displaying URL and adds additional string

This is what I need to accomplish.
Say I go to example.com on Chrome browser. I have a certain bookmark on my browser, on which when I click it automatically takes the example.com URL and adds a certain string, for example cache: and when I click that bookmark it will take me to cache:example.com
When I go to example2.com and click on the bookmark again, it will take me to cache:example2.com
Is there a Javascript code or else that can make this possible?
Just add some javascript to change the window.location.href attribute.
The following will help
javascript:(
function(){
f='cache:'+window.location.href;
if(!window.open(f))
location.href=f;
}
)()
You can change and set the href to whatever you want
You have to add this javascript to an anchor tag so that when the link is dragged and dropped in a browser's bookmarklet bar, it get added. So the link will be like this:
<a title="GotoCache" href="javascript:(function(){f='cache:'+window.location.href;if(!window.open(f))location.href=f;})()">Goto Cache</a>
Add this link in a page and you are set :)

HTML in new tab

Can someone explain to me how can I open a new tab from a firefox extension, that contains HTML content from a string I have?
gBrowser.addTab, either using a data: URL, or opening and empty page then writing to its document. Info.
I think this is what you need - https://developer.mozilla.org/en/XUL/tabs#m-appendItem
I do not think this is possible:
Whether or not a page or tab opens is based on the user's preferences. If the user has tabbed browsing disabled, the new content will be in a new window and not a tab.
Each Browser tab requires a URL. So you would have to make a page, pass it the string as a query string or HTTP POST and then have that page return your string.
The other option is to use something like this.

Categories