Setting s object variables in Tealium - javascript

Relatively basic question but I can't find an answer. I've emailed Tealium as well, but thought I'd ask the masses here.
I want to explicitly set something within the s object, in this case s.referrer. When I set it in an extension, it doesn't take. Referrer isn't one of the things I can map directly to, so that's not an option.
I thought I could simply call out an s object assignment statement since I did it once before with s.linkTrackVars and it looked like it worked based on results in the reporting, but now, I decided to go check and the Tealium Web Companion claims there's nothing set there either.
How do I call out, in plain JS, setting something in the s object in Tealium?

This is possibly because since you're running your s-code within a Tealium SiteCatalyst tag, and it's not globally setting s on the window to anything anymore, by default.
If you want to change a particular value, do the following:
Create a new data layer value within the Tealium UI that'll be used to store your value (and generally aid in the graphical mapping)
In your extension, scoped to the tag, set the the value of that data layer value (b.[variable_name])
Create a new mapping within the SiteCatalyst tag and select the SiteCatalyst value to want to map to (referrer in your case). On the other side of the mapping, specify that data layer value you made a couple of steps ago

Related

How to set User Defined field in Google Analytics (gtag.js, analytics.js) filter?

In Google Analytics filters, it is possible to leverage a User Defined variable:
However, I cannot find any reference or documentation which specifically states how to set the User Defined variable nor do I understand if the value for Filter Pattern field should include the User Defined value or both the variable name and its value.
I'd like to understand the process for setting this User Defined variable with gtag.js and analytics.js. Can I set it in the Javascript tracking code? If so, how?
Thank you.
Update
I found a link here which goes deeper into User Defined. Now I understand its purpose. The problem is the examples in the link talk about setting this variable with the legacy Google Analytics version (ga.js). gtag.js and analytics.js ostensibly employ a different mechanism to set the variable. But it's still unclear how to set this User Defined variable.
Custom variables (and user defined variable) have been replaced with Custom Dimensions and Metrics in analytics.js and gtag.js
GA Help Center - Custom dimensions & metrics

Best style for initial state that varies.

I'm new to reactJS and want to know if what I am doing is in good style and makes sense.
We have a pretty old app that is written in PHP and uses smarty templates/a mess of jquery for front-end rendering. We have recently started implementing react.js and I'm working on a feature where users can view a list of incomplete candidates. This list depends on a site and a test.
A php script is getting called with requests for site and test. There are functions in this php script that then return an array of the incomplete candidates that a smarty template renders.
Right now I have refactored so in the smarty template there is a div where I've implemented a jsx script tag that contains a panel with a list of incomplete candidates.
My question is two fold:
Does it make sense to use "site" and "test" as state and then use some kind of AJAX script to get the array of incomplete candidates or is it in better style to simple set the array of incomplete candidates as state.
How can I set this initial state without the use of Ajax? (Is there say a way I pass state directly from PHP to my react.js components or pass a variable from smarty to react.js.
Regarding my first question I think I need a better grasp on state but from my understanding and from what I've read here: If a Component needs to alter one of its attributes at some point in time, that attribute should be part of its state, otherwise it should just be a prop for that Component.
From my point of view this state is the visit and test and it determines what users should be listed.
I would love some input on if my thinking is flawed. I am still wrapping my head around react.
Cheers.
Does it make sense to use "site" and "test" as state
They should be state if they change at runtime and this component should logically own them (no parent component cares about their current value, or there is no parent component).
They should be instance properties if this component is the logical owner and they don't affect render.
Otherwise: props.
and then use some kind of AJAX script to get the array of incomplete candidates or is it in better style to simple set the array of incomplete candidates as state
If you need to fetch new data based on changing parameters, ajax is the way to do it. I'm not sure what the question here is, because you say "... or is it in better style to ..." but you'd d the ajax, and then put the result in state.
How can I set this initial state without the use of Ajax?
You put it in a global variable (json in a script tag), or a data-foo attribute of an element, and the JS reads that and uses it in getInitialState.
where I've implemented a jsx script tag
If you're using JSXTransformer on the client, it has to load a bunch of code which then searches for script tags, tokenizes and parses the scripts to an AST, performs some transformations on the code, generates a string from the modified AST, and then executes it.
It's a good development tool, but isn't intended for production. The alternatives are not using JSX, or compiling it to plain JS ahead of time and having php send that.

Find Leaflet map objects present on page, without a variable reference

I have an idea for a browser plugin which would manipulate Leaflet maps on third-party sites. But I'm stuck on a simple thing: I'm not sure how to discover Leaflet map DOM elements on a page, and then access the associated Leaflet map object.
Is $('.leaflet-container') a reliable way to find all map objects?
How to actually access the map object from that object, so I can do something like: $('.leaflet-container').eachLayer(...), which doesn't work.
This question is essentially the same as How can I get a leaflet.js instance using only a DOM object?, but the answer there was a workaround which doesn't help.
Yes, that should be sufficient, although it's not a documented behavior and could at least theoretically change in future versions of Leaflet
There's no way to do this. The reference to the map is owned by the code creating the map, and it could have discarded it or might be storing it in a location you do not have access to. Leaflet itself does not store a reference to the map anywhere where you can access it
On a side note, it is my opinion that you should rather let users of your code explicitly pass references to you, rather than you trying to automatically find references. See for example the inversion of control principle, where the caller supplies dependencies; Law of Demeter is also somewhat applicable - don't pry into other codes internals (unless you really, really have to).
OK, so this is a solution that could work, but it is brittle and limited. If you have a way to more directly find the reference, that's ideal.
I wanted to get a map reference where I do not want to modify upstream code; it's a one-off where brittleness is OK.
I know my map is going to be defined on the window.FOO scope (i.e. it's a global reference) and that it will be in the format map0000 where 0000 is a random number. So I constructed a quick function to scan the global window object's properties for variables matching this pattern.
window[Object.keys(window).find(key => key.substr(0,3) === "map")];
This returns a Leaflet map reference but could break if there is more than one map on the page. You could also add a validation that it's a real Leaflet map by testing it's properties.
Again, this is not ideal, but, if your use case is limited enough, it is one way to achieve this. Thanks!

How can I clone a <browser> element in Firefox using XUL?

I am developing a firefox extension where I need to save the state of an arbitrary web page in order to be able to restore that webpage later. The quirk is that I need to restore the entire state of the page, including the state of all javascript variables. The "saving" can be done in memory, it doesn't need to be serializable.
So, is there a way to exactly clone a browser element, so that it starts running from the same point of execution that the original is currently at?
If not, how much effort would it require to add this to firefox (using C++), and which files and documentation would I start looking at?
No, there isn't a way to do exactly what you want. Even the built-in session restore will only restore form fields (and some other selected things), but not the full JS and native object state.
Implementing something like this yourself not feasible (and would be also a massive task):
You could uneval() most js objects, but that will loose type information and you'll only get the source, but not any internal state (think "hidden" state via closures). Native objects like window or document need some special treatment, and getting the internal state isn't exactly always possible here without some C++-level "reflection".
You could potentially get a lot of the actual state using the debugger API in new ways, however I don't see any way to actually restore it later. And "a lot" is still not the same as "all".
About the closed-over "hidden" state:
There is no way I know of to reliably get the internal state of counter in the following example, let alone restore it later, without getting as low-level as a platform-dependent full memory dump.
var count = (function() {
var counter = 0;
return function() { return ++counter; };
})();
count();
count();
I guess that you could walk the properties of all objects and save them somewhere but preserving context of e.g. bound functions would be difficult. Maybe you could make some use of the session store?
See:
Session_store_API and nsISessionStore

Call Coffeescript global variable in method

My question basically refers to this example:
https://github.com/vlandham/vlandham.github.com/blob/master/vis/gates/coffee/vis.coffee
At the end of this script (on line 202) it calls the (view_type) parameter from the front end and based on the view type ('year' or 'all') renders the exact method. I need to implement the a similar strategy, but within the show_details() method of this script (on line 176)..What I precisely need is to retrieve the view_type in the show_details() method and based on the view type ('year' or 'all') decide what the content variable (in show_details() method) should display..any ideas or help will be really helpful. Thank you.
So cofeescript automatically inserts local var statements for any variable referenced inside a function (precisely to prevent global leakage that JavaScript causes by default). This means you have to explicitly pollute some global namespace which in a browser would be the window object. Nothing in CofeeScript will prevent you from assigning a field of your choice with what ever value you need and reading it back any time you need. Note that this is messy and prevented for a reason (its hard to keep this kind of code clean, also there is no window object in a server side envrionment like node.js), but it will work.

Categories

Resources