Event handler for location.hash changing? - events

I have a Flash document viewer embedded in my page, where the user can view the preview version of the document, and then purchase the full version if they like. Is it possible to have a hyperlink in the document itself "BUY NOW" which would command the browser to do something on the current page without having to refresh?
I'm imagining something like:
www.example.com/currentpage.php#buy
...as a link in the embedded document, which would in theory scroll to a position in the parent web page. Are there any mechanisms, maybe event handlers where I can run some js upon being directed to the "#buy" anchor?
EDIT: I just discovered Javascript has a
window.location.hash
object that I can check, but I don't want to poll for it, the question remains if there are any mechanisms or events to detect it changing?

Related

NativeScript Vue: What is the purpose of navigatingTo, navigatingFrom and other Page events?

I am trying to understand how a Page event like navigatedFrom would be used.
Here is a base template:
<Page #navigatedFrom="navigatedFunc">
<StackLayout></StackLayout>
</Page>
Say in my script sections, I had the function navigatedFunc listed in the methods sections:
navigatedFunc: function(args) {
// what would I do here or check against? How would you check against a specific screen title you navigated from?
}
would it be used to check the specific view you navigated from? Like can I do a conditional check in that function that would say if a user comes from the Account page, then do something?
Those events are used if you want to run some code when a page appears or disappears. If you're familiar with native iOS apps, they're like the viewDidAppear and viewDidDisappear methods.
The navigatingTo event triggers when entering the page where it is registered.
The navigatedTo event triggers when when the navigation to the page has finished.
The navigatingFrom event triggers when a navigation away from the page starts.
The navigatedFrom event triggers when the navigation away from the page finished.
This image from the NativeScript documentation might help you visualize the flow:

Monitor click events on bookmarks (Google Apps Script)

Is there a way to monitor click events on bookmarks in google documents with google apps script? I want to get bookmark id when someone selects a bookmark and than run some more code which needs that bookmark id to get processed.
With Brian Bennett's help I managed to solve this issue with Web Apps. There is a little bit more code to write but it works.
Write a doGet function:
doGet function is called when a user visits your Web App. With doGet function I opened a document with ID given through get parameters and displayed it as html. To get a html of the document I used this function.
Find and display bookmarks:
You can find bookmarks in the html of the document as html tag with id of the bookmark. I changed the css of all this tags so I could see them (change background, height, width or something like that).
listen to click events on bookmarks with jquery or just javascript:
Listen to click events on those tags (bookmakrs) with jquery or javascript. If you use jquery, you need to import a jquery library. When click event happens get the id of the bookmark from the id attribute of the tag.
Use that bookmark id as you wish...

Is there a way to make Omniture capture the url/page loaded via ajax as a "Load" event and not a "Click" event?

I am currently working on a Ajax based mobile website project and am not able to get Omniture to work correctly. Here is a brief detail of the problem.
Assume a mobile site which has multiple pages, like example.com/a, example.com/b, example.com/c, example.com/d, example.com/e, example.com/f, etc.
Each page of the site, has Omniture's code, like:
<html><head></head><body>
<script type="text/javascript" src="//domain-and-path-to-omniture-code-files/s_code.js">
<script type="text/javascript">
s.pageName = "blah";
// some other ... s.blahBlah ... properties here...
/************* DO NOT ALTER ANYTHING BELOW THIS LINE ! **************/
var s_code=s.t();if(s_code)document.write(s_code);
</script>
<div id="content">SOME CONTENT</div>
</body>
User opens the browser and opens one url/page, like example.com/a
The page (example.com/a) has multiple links to the content on the same page, like #topic1, #topic2, #topic3, etc. and also has links to other static pages of the site, like example.com/b, example.com/c, example.com/d, etc.
I use jQuery to control click events on these links.
When user clicks on a named link, like #topic1, #topic2, etc., the page is animated/smooth-scrolled to the target element/content-section; and Omniture's "s.tl()" function is triggered, to track/capture the click event with relevant/required details.
## THIS IS THE PROBLEM AREA ## When user clicks on a link to a different static page, like example.com/b, example.com/c, etc., instead of allowing the browser to do a full page-load, the Ajax version of the target page is loaded into the content holder (by Ajax version, I mean to say that the page only has bare-minimum markup/content and not the entire html/head/common-css/js includes/etc).
Now the problem is that, when the page is loaded normally, Omniture captures it correctly as a "Load" event, but when it's loaded via JavaScript/Ajax, Omniture captures it as a "Click" event!
The Ajax/version of the page, does not include Omniture library "s_code.js" JS again (for obvious reasons, its already there on the parent/main page). Along with the required content, this page only has a script-tag, which sets required "s.blahBlah" values for the new page and the call to "s.t();".
I also tried to keep the Omniture code separate, in a common JS file, which is already loaded with the parent page, and only set the required "s.blahBlah" values in the Ajax call/function (which is also in a global/already loaded JS file), but still Omniture captures it as a "Click" event.
// s.tl(); ... gets captured as a click event
// s.t(); ... on normal page load... gets captured as a load event
// s.t(); ... after DOM-ready/page loaded via Ajax... gets captures as a click event
Any ideas! How can I make Omniture capture a load event? Is there a function like "s.l()" or something to trigger Omniture's "Load" event on demand.
The problem was not Omniture capturing it incorrectly, it was the tool "Omnibug", which I use to see the requests.
Omnibug 0.5.448 logs all "s.t()" calls made before page load event as Omniture "Load" event and any "s.t()" call made afterwards is captured as "Click" event.
Apparently, I was not the only one facing this issue. Others had already reported this to the developer of Omnibug (https://github.com/simpsora/omnibug/issues/4) and a fix has been made by him/a new version Omnibug 0.5.500 has been released.
The new version of Omnibug 0.5.500 captures all "s.t()" calls as "Load" events correctly and all "s.tl()" calls as "Click" event.
Thanks!

How does Facebook handle requests between Home page and Profile page

I am just wondering how facebook manage requests to "my profile page" and "home page" and some other pages that seem to reload just some content.
For example when I am on "my profile page" on facebook, i Hit the home button and the top bar button and chat panel on right side remain intact (they are not reloaded). I have monitored XMLHTTPRequest in webkit console and no ajax is generated, so its not Ajax (i think). Otherwise, if FULL http requests are generated when clicking those links, I thought the full page must be reloaded, I am right? So I have no clue how is this handled. Can you give me a hand please?
Thanks :)
It's a type of performance optimization called "quickling", they also use a "pagecache" strategy to reduce the data from server. In the lower level, it depends on javascript perform as a LinkController, which delegate a hyper-link click event and then send an ajax (or use iframe) to request the pagelet data from server, the response will be a json-formed data structure, then javascript will insert the content of current page. Uri in your address bar can be dealled with the hash change event in old browsers and H5's History API (pushState) to manage the history record of browser.

How to get back button to work with anchors (#) and iframes

I am working on a site where the main part of it is driven by an ajax style navigation system using anchors in the url to define the application state.
On top of this I now need to support IFrames that are loaded on top of this application. The problem I'm having is that the back button breaks if I make use of fragments.
I've created a very simple sample, that isn't using any of the ajax libraries. All it has is a link that adds an anchor to the url and an iframe, with some normal links in it.
If I click then anchor link first, then I click the link in the iframe, I would expect the first back click to take back to the original iframe page and the second click to remove the anchor from the url.
I'm aware of all the various solutions out there (YUI, reallysimplehistory, jquery plugin) and they all work great, but they don't cater for iframes.
I'm also aware that I could add some JS to the framed pages and possibly route all navigation through the parent page, but I'm hoping that isn't necessary.
So the question is, can anyone explain what is going on inside the history object in this sample? Secondly is there anything I can do from the parent iframe to coax the history object to pick up these navigation entries?
Note: I'm only enquiring about FF/Safari/Chrome in this sample. IE needs to looked at separately.
Refer to
JavaScript .hashchange performance. Can it bring any slowdown?
and
How does Gmail handle back/forward in rich JavaScript?

Resources