How do I get the search results from a search engine? - javascript

I've been trying to figure out how to let a Greasemonkey user script open up a search engine page in the background and fetch search results. I've tried to look up examples to open up HTML pages, but afaik all examples of requests handle ajax calls instead of html calls.
Any hints would be grateful.

The standard Greasmonkey GM_xmlhttpRequest function (link to API) can handle any type of request, not just JSON. Under examples, check out the GET request code snippet.
Watch out though. Search engines like Google will not appreciate the screen scrapping (and will probably block you if you grab too many results too quickly).

Haven't done this in GreaseMonkey (don't know really in fact if you can do it);
though if you really want to do it by opening a new tab, and if you're not using any GM-specific stuff in your code (and don't want to run the code automatically, well, this can be an obstacle), you can take a look at Custom Buttons extension.
With it, you can create buttons that have access to Firefox internals and invoke stuff like gBrowser.addTab().
But working with CB is a bit more tricky than in GM.
These posts may help if you're interested:
JavaScript alert not working in Firefox 6
Mozilla: Tabbed browser / Manipulating content of a new tab
Code sample copied from Mozilla:
var newTabBrowser = gBrowser.getBrowserForTab(gBrowser.addTab("http://www.google.com/"));
newTabBrowser.addEventListener("load", function () {
newTabBrowser.contentDocument.body.innerHTML = "<div>hello world</div>";
}, true);

I've done something similar.
All you have to do is save the GM_xmlhttpRequest response in a DIV.
With this DIV you can do whatever you want (show, hide, display only some of the content, etc)
Just take a look at my script source code.
I'm positive it will help you.
I know you don't need, Mr. 14k rep, but i'll break it down for you anyway :)
function conectar() calls GM_xmlhttpRequest [GET] and stores only the part of the content that i want to use in #divtempora, which is a dummy div that the user never sees (hidden).
Then function resp_dxlegacy() walks through the dummy div, save the info i want in a variable and calls conectar() again passing this parameter and storing the content in another div, which is, finally, displayed to the user.

Related

javascript scratchblocks squarespace

I would like to use Scratchblocks (a tool for rendering visual Scratch code blocks from a text listing, on GitHub) on my Squarespace website. The problem I am getting is that the scratchblocks are never rendered on the first load - but only after a refresh.
This is in the header (set in the header for that particular blog):
<script src="https://scratchblocks.github.io/js/scratchblocks-v3.1-min.js""></script>
Then I think I need to call this function at the end of the page - I've put it in the footer:
scratchblocks.renderMatching('pre.blocks');
NOTE: When I view the source I sort of see this JavaScript twice at the end of the page. Not sure what is happening there.
Here's an example of it on my website, where it renders the scratchblocks only after a refresh. [UPDATE - following the fix provided below, this now renders first time, every time as far as I can tell.]
[http://www.glennbroadway.com/coding-zone/2017/4/6/simple-collisions-in-scratch]2
Here's an example of someone else using it and it working properly. I've inspected the source and I can't work out how they are doing it.
https://codeclubprojects.org/en-GB/scratch/memory/
I've also tried all the different methods listed elsewhere on stackoverflow for getting javascript to load only after the HTML has finished. I can't get any of them to work - but I think the problem is something to do with Squarespace, I just don't have the knowledge to work out what.
Any help would be greatly appreciated.
In Squarespace, when your custom Javascript only works after a page refresh, it most likely has to do with Squarespace's AJAX loading:
Occasionally, Ajax may conflict with embedded custom code or anchor
links. Ajax can also interfere with site analytics, logging hits on
the first page only.
You may be able to disable AJAX for your template. Or, see the other approaches outlined here: https://stackoverflow.com/a/42604055/5338581 including:
window.addEventListener("mercury:load", function(){
// do stuff
});
In addition, I would generally recommend placing custom code in the "Footer" code injection area unless you have a specific reason to do otherwise.

How do I modify a browser tab's text styling with Javascript?

I am trying to write a bit of code in a script that changes the color and/or text formatting of a browser's tab--any tab, not just the currently selected one--when a given process completes, so that I can tell, without tabbing back to said tab, if the process is finished or not.
What I'm looking for is the specific bit of code or call to make that accesses the tab's style (or whatever); something where I could go
tabWhereScriptFinishedExecution.style.color("#77ffa5");
tabWhereScriptFinishedExecution.style.fontWeight("bold");
or something. Tab Mix Plus and its different effects on the tabs reflecting various states and whatnot were what got me thinking about this.
I'm using Firefox, and working this into a Greasemonkey script, so I'd like to avoid using JQuery if possible.
As far as I know it is not possible to do the way you are trying to achieve it. You cannot style the tab text. It is part of the browser. Tab Mix Plus you are referring to is a plug in for Firefox.

How to detect where JavaScript alert is coming from?

I am trying to debug a very complex IE Intranet application. I am getting an alert with a custom message stating that an exception has occurred. I would like to find out more information about this exception as the message is not very helpful.
There is a master page which contains a lot of iFrames (and .htc files if that makes a difference) so I don't think that I can try and hijack window.alert. My last resort will be to try my luck with a file search.
Using IE 8, is there anyway I can detect where this alert is coming from? The ideal solution would be to somehow create a "breakOnAlert" function which inserts a debbuger statement at the correct alert location.
To clarify: The master page contains many iframes and I believe that the error+alert is coming from one of these. Each iframe is an aspx page (sometimes with dynamic html/javascript from the user) and contains inline and external JavaScript. Before posting I did try overriding alert in my page (a child page inside an iframe) but it didn't work. I am assuming that It doesn't work as each iframe has their own window object so they each have their own version of alert. For this to work I would need to find all iframes and override it for each one, something which I think would be very complicated to do. In the IE developer tools I can see a huge amount of script files (inline and external), so it would be very difficult to manually look for the alerts in there.
Since it's a real chore to do it in all iframes, I'd probably use Fiddler and programatically replace alert( with something like:
(function(n){alert(n);debugger;})(
IE should support the debugger statement, so you'd have a call-stack
This page explains how to do a text-replace in Fiddler
Example Fiddler custom rule to add to OnBeforeResponse:
if (oSession.oResponse.headers.ExistsAndContains("Content-Type", "html"))
{
oSession.utilDecodeResponse();
var oBody = System.Text.Encoding.UTF8.GetString(oSession.responseBodyBytes);
oBody = oBody.replace(/alert\(/gi, "(function(n){alert(n);debugger;})(");
oSession.utilSetResponseBody(oBody);
}
Ovveride alert function and set a breakpoint inside, then you can watch Stack Trace :)
function alert(message) {
var x = 'whatever';
}
$(function () {
alert('test');
});

Firefox XUL call function from content context

I know that this question was asked earlier but the OP didn't get any suitable answer.
So the question is:
How to access page context to call some js function in FF overlay (toolbar in my case).
I have <toolbarbutton> element with onclick="nextTrack()". nextTrack declared in the included JS file. Function executes when I press toolbar button, but I cannot exec function that I'm sure exists on the page.
I cannot modify the page, because it is an external site, but I really want to make my extension.
Of course I can (and I am) use something like mainDocument.getElementById("player_play").click(), but page already has an audioPlayer object that has all ability I need: play, pause, next, prev etc.
For more cleanliness I make an extension to control an audio player for vkontakte social network (well known social network in exUSSR countries). So you can look at example page here, maybe it can be helpfull: http://vk.com/wall6843477_2327.
When you start listening the bar with controls must appear you can find lot of stuff like audioPlayer.nextTrack(); audioPlayer.prevTrack(); etc.
You aren't accessing content directly, you are rather going through XPCNativeWrapper. This means that all JavaScript properties defined by the content page are invisible (which is a security feature). In your case, the simplest secure solution is to use the javascript: protocol:
mainDocument.defaultView.location.href = "javascript:void audioPlayer.play()";
This way you won't be able to get a result back but from it seems that you don't need to.

How do I create a Toolbar/ Bookmarklet using Javascript?

Hi i'm a JavaScript novice and need some help. I am trying to create a toolbar which can be viewed on any website through the use of a bookmarklet, the toolbar is simply just a div with a few links. But i am stuck on how to achieve this. Any help to accomplish this would be greatly appreciated.
most bookmarklets that do something complecated like "creating a toolbar" simply add an external script to the page that the bookmarklet is invoked on.
Basically all you have to do is write a link that contains javascript, which can be acheived by starting the href="" with javascript:
so lets just start with a script in an href that will add an external JavaScript to your page
addScript = function ( url ) {
myScript = document.createElement('script');
myScript.src = "url";
document.head.appendChild(myScript);
};
addScript("http://google.com/");
so if you shrink that down into a url you get..
click to add toolbar
however you want to make this bookmark-able so theres one more level of confusion we have to add... and this part has to be done in different ways depending on the browser
addBookmark( url, title ) {
if (window.sidebar) { // Firefox
window.sidebar.addPanel(url,bookmarkName,"");
} else if(window.external) { // IE
window.external.AddFavorite(url,bookmarkName);
}
}
You can include that on the page where you're going to have your add bookmark button. A couple things to note though
this isnt going to work in opera.. but who cares about opera
webkit browsers (chrome & safari) dont allow javascript to create bookmarklets
Finally you need to mash it all up into one ugly link
click to add bookmark
In the end though I suggest you look into making a Google Chrome Extension or a Firefox Plugin instead of a bookmarklet since you have more capability with either of the two.
As far as how to make a toolbar with JavaScript, well you're just going to have to make another question for that.. Its too much and you haven said enough about what you wan to do for me to answer it here.
bombedmetor,
Greg Guida's tip on including an external script will allow you to create an awesome, clean bookmarklet-based toolbar. Why? Because you'll be able to use JavaScript libraries like JQuery, etc.
Here's a quick example along the lines you asked for to help get you started. The bookmarklet creates a div element with a link to the Stack Overflow homepage.
javascript:void(function(){var divElmt=document.createElement('div');link1=document.createElement('a'); link1.href='http://stackoverflow.com';link1.innerHTML='StackOverflow Homepage';divElmt.style.backgroundColor='yellow';divElmt.style.position='fixed';divElmt.style.top='0px';divElmt.style.width='10em';divElmt.style.height='5em'; divElmt.style.border='solid red 4px';divElmt.style.zIndex='100'; divElmt.appendChild(link1);document.body.appendChild(divElmt);})();
To use the above bookmarklet, you create a new bookmark in your favorite browser and add the code above where you would normally place the URL.
The code does the following:
Creates a new div element.
Creates a new anchor element and sets the value of the href attribute.
Assigns some basic values to the style attributes of the new div (so you can see it easily).
Appends the anchor as a child element of the new div.
Appends the new div element as a child of the body element.
If all goes well, you should see a yellow box with a link to the Stack Overflow homepage at the top-right of your page after using the bookmarklet. bombedmetor - I hope this helps get you started. After you get comfortable with how these things work, you can apply Greg's wisdom to create your toolbar bookmarklet in a way that can be added to people's browsers with just a click or two.
Something to keep in mind: As Greg indicates, bookmarklet code is treated as the contents of the href attribute of an anchor element. This is why I used single quotes in the code above.
Some sites/articles to check out:
http://en.wikipedia.org/wiki/Bookmarklets
http://www.latentmotion.com/how-to-create-a-jquery-bookmarklet/

Categories