Javascript top level object - window doesn't seem to cut it - javascript

Hey JS gurus... I am juggling w/ some crazy weird google map stuff. I need to store 2 numbers (lat/long), click on a pin, and on the new page, use these numbers.
So I tried to store these in the good ole' window:
window.lat = ...;
window.lng = ...;
however, the window after the click on the map is not the same window that holds our lat, lng.
So the question is: does our 'new' window hold a reference to the one that has out lat/lng? I tried window.top, window.parent, window.frames, it's all equal to window...
Alternatively, where can I store those values to be able to restore them later?

You cannot persist Javascript variables across pages.
Instead, you should use a cookie.

You need to look at cookies/sessions to hold values over different pages:
JavaScript Cookies: (note i've never actually used these, but presume this info is up to date)
http://www.quirksmode.org/js/cookies.html
Sessions: (PHP as example, but all server-side languages support sessions)
http://www.tizag.com/phpT/phpsessions.php

Either you have to use Cookie or you should pass these numbers as URL variables.
Every time you load the Window the complete DOM be written again, that's why your variables no more exist after page reload.

Related

Google Tag Manager - Capture domain on first page load in variable

I have a situation where there is the same GTM container on six different domains. The user can potentially land on any of the six initially, but there are multiple user paths that can take them to one or more f the sites before making a purchase.
I need to know which website the user landed on first
I thought I could simply use a custom dimension set to page host, scoped to session. But in testing it looks like the last value is passed with the ecommm purchase tag vs the initial value set in the session.
So I am trying to use a custom javascript variable. I want to have it set an 'originSite' variable to the {{page hostname}} IF that variable was not previously set.
function () {
var originSite;
if (originSite == '' || originSite == null ) {
originSite = "{{Page Hostname}}"
return originSite
} else {
return originSite
}
}
But when I click over to another domain, this returns the new page hostname vs keeping it the same. So does declaring the var itself set this back to empty each time?
I also tried a DataLayer push that only fired once per session. But even with cross-domain set up for all the different sites, this is firing the first pageview of each domain. :(
Any assistance or suggestions would be appreciated...I'm struggling to solve this.
Re-declaring the variable is not the problem here, rather just a poor design. The problem is that JS context is wiped on page loads.
You want to preserve your variables explicitly if you want them to carry over through pageviews. The most common way to do so is via storing the values in cookies. People also use local storage, session storage, backend or even web sql for preservation.

js function to go back in browser history to last browsed page of specific domain?

I need the js function to go back in history to the last pages used in a specific domain.
reason: I send people to a subdomain to see specific content-galleries (gallery.mydomain.xyz/#1etc). I need them to return to the last page where they left of from the specific tld (mydomain.xyz/pageX) after having clicked through a number of images/videos there at subdomain...
is this possible? any ideas?
thx!
It's not possible using the built-in browser history, no, because your access to that from JavaScript is close to non-existent.
What you can do instead is save the location you want to take them back to in, say, session storage (use local storage instead if this is in a different window), and then link back to that page.
More about session storage / local storage in the web storage spec, but the short version is that it stores strings in a storage area specific to your origin, so for instance:
localStorage.setItem("last-location", "foo");
...stores "foo" in local storage for your origin, with the key "last-location". You can then use getItem to get it later when you need it:
var lastLocation = localStorage.getItem("last-location");
you could use a simple get/post variable to tell where the user is coming from and store that in a session variable for later use when the user is to be returned. As far as I know you cant access the users browsing history from the browsing client with Javascript as its a violation of the sandbox design but that may have changed recently
thx both of you for the quick answer!
... I kind of see, not being a versatile coder myself. but I get the problem involved. and see session-storage is where I want to look at then...
I will have to make this a coding job given my non-skills here :-}
but now I know what to ask for. thx again.

Architecture for temporary storing of values within a javascript library

I am currently writing a javascript library that wraps a REST API provided by a third party (intended to be used on server side, but wouldn't like to limit it to). One of the actions defined by the api is 'login' which gives me a session key that I need to use on further requests. Currently, everytime I go to use this library I need to login again as there is no persistence of this session key. My question is, what is the best way to persist it throughout a session?
My first instinct was to give the library a callback that would store it and a callback that would retrieve it and the implementation can determine how that session key is persisted:
var thirdPartyApi = new ThirdPartyApi({
loginCredentials: {..},
setSessionKeyCallback: function() {},
getSessionKeyCallback: function() {}
});
thirdPartyApi.makeSomeRequest('foo');
Can you recommend the best architecture for this problem?
It seems like you want to use the REST Api in a browser. There are some factors you need to take into account, such as, navigating away from the page and coming back to it later.
You can use Web Storage to store the key. There are two types, localStorage and sessionStorage. The only difference between then is that sessionStorage is deleted when the browser window is closed, while localStorage isn't. Web Storage is supported by all modern browsers and IE8+ http://www.w3schools.com/html/html5_webstorage.asp
The localStorage object can be used as such:
localStorage.setItem("bar", foo);
var foo = localStorage.getItem("bar");
localStorage.removeItem("bar");
sessionStorage object can be used the same way.
both localStorage and sessionStorage are global objects that can be accessed from anywhere, so there is no need for any special architecture on your ThirdPartyApi object.

How to achieve the role played by "public static variables of Java" in JavaScript or a webpage?

On my homepage I have to set a cookie using the name of the logged in user. The cookie set and get part has to be done in JS. On the subsequent sub pages I have to retrieve the cookie(username) using the set variable name.
How can I store the username/cookie name so that it is publicly accessible across all the pages? This username will obviously change with each new user and is not constant.
I have tried doing this using external JS file but in every new page the value is reset to default which I don't want.
The exact solution to my problem is like the work done by:
public static variable
in Java (not final). I want to achieve this in JS.
There is no such thing in Javascript unless you use a storage API (client side storage, or cookies, or something like that). The reason is that when you move from one page to another, it doesn't particularly matter to the browser. It wipes its slate and starts over, keeping explicitly stored data like cookies and such, and deleting everything else that is dynamically created. So the short of it is, if you want each page to know the name, you have to include the name in each page's code (manually or via script).
I don't quite know your application. In javascript you have function prototypes. In a function prototype you can declare 'static' members like so:
function C(params for constructor){
C.aStaticVariable = 5;
}
alert(C.aStaticVariable); //available everywhere

A javascript variable used in multiple Web pages

Is there any way to define a variable that can be used in multiple Web pages? For example, a string variable stores a certain value in page A and that value can be accessed in page B. I know cookies can do it. Is there any other way?
window.name can also hold about 2MB of data as a string.
See: http://www.thomasfrank.se/sessionvars.html
In descending order or support: Passing it in the URI, cookies, frames, HTML5 storage
Cookies are the sensible approach. It is what they were designed for.

Categories

Resources