Ad unit detection count | Javascript - javascript

I'm creating a script where I want to check how many ad slots there are on a page. The way these slots are presented are like so:
//Adslot 1 declaration
gptadslots[1]= googletag.defineSlot('/150185454/Express/Home', [[1,1],[728,90],[900,250],[970,250],[970,90]],'div-gpt-ad-783061624906669251-1').setTargeting('pos',['top']).setTargeting('gwd', [ASPQ_adlwo6]).addService(googletag.pubads());
There are 5 instances of this on my static page so here is my logic around this.
The only consistent variable I can see is the following number as part of defineSlot which is "/150185454/". This is only defined within the <head> tag.
Here is my code so far which only covers the detection if there is an ad slot on the page:
var adUnit = '/150185454/',
headContent = document.getElementsByTagName('head')[0].innerHTML;
if (headContent.indexOf(adUnit) >= 0) {
console.log("UNIT IS ON THE PAGE");
}
Expectation:
If "/150185454/" is within the head then get the rest of the URL which would look like this: '/150185454/Express/Home'. The "Express/Home" is a page path within the site - we want to know which page this ad slot was presented on.
Then take only the page path name ('Express/Home') and append to a tracking URL.
I'm having trouble getting the rest of the URL after "/150185454/". I'm unsure how to achieve this as well as stripping the number to then append to the tracking URL which is posted.
I hope this is clear enough, please ask if more direction is needed.

Related

How to not restrict a javascript action to the page load?

I'm sorry, I'm totally clueless in javascript, and try to understand the bit of codes I get the best I can...
I'm working on a forum which is hosted on an online server, which makes I can't touch the html (I just have access to the header and the footer). And on this forum, there is a tagcloud in which tags are sorted by popularity order: I want to sort them with my own order (sorted years, country by alphabetical order, etc.).
For that, I created a "sorted tag cloud" in the footer (.TagCloud-order) in which I sorted the tags manually, and I asked with javascript to replace the current unsorted tagcloud (.TagCloud) with my own sorted tag-cloud:
$(document).ready(function() {
if(window.location.href === "https://forum.cinestudia.fr/") {
$('.TagsPage-content .TagCloud').replaceWith($('.TagCloud-order').html());
} else {
}
});
It works on page load, but then if I go to another page of the forum (like "Toutes les discussions") and that I come back to the main page containing the tag-cloud ("Etiquettes", the page matching the url in my javascript code), the original unsorted tag-cloud is back. You can see the result here: https://forum.cinestudia.fr/
The problem, basically, is that $(document).ready(function() works only when the page launches, but after that it doesn't anymore.
What kind of function can I use for this action being true each time the reader is back on this main url?
(i know a solution would be to put a short timer to change the tag-cloud every 0.1 seconds or less, but it seems really heavy for the browsers...).

Swap contents of a sidebar page with javascript

I've got a problem that I can't quite get my head around.
I've built 3 identical templates in my CMS except for the CSS that they call (it's not WordPress and has no access to the application layer). I have plugged in my navigation, sidebar and footer in the theme files (think of these as "pages" in a WordPress site rather than the PHP shortcodes one would normally use). My page content is then dynamically served.
My issue is that these templates are going to be used across a number of different websites. Thus the contents of the navigation, sidebar and footer all need to be able to change depending on which site they are in use on. The business requirements are that I have to have only one of each of these pages. I can't just make 20 copies of the theme if I were to have to do 20 websites.
My initial idea is to use something like this....
var url = window.location.href;
var site1 = url.indexOf('site1');
var site2 = url.indexOf('anothersite');
var site3 = url.indexOf('thefinalsite');
if (site1 >= 0) {
$('.sidebar_info').append('<li>Login</li><br/><li>Another Link</li>');
}
else if (site2 >= 0) {
$('.sidebar_info').append('<li>Not Login</li><br/><li>Link</li>');
}
else if (site3 >= 0) {
$('.sidebar_info').append('<li>Unique Link</li><br/><li>Some other Link</li>');
}
else {
$('.sidebar_info').append('<li>Nothing</li>');
}
While I'm pretty sure I could make this work it would be a headache if every time a site was commissioned to be built I have to go into 3 different pages and update the functions. Plus ideally down the line a less technical person would be able to spin one of these up themselves.
Any ideas on other ways I could accomplish this with JS or jQuery?
Much appreciated!

Capturing Values in Page Source that are not visible elements in Selenium

I'm a novice Selenium user and wanted to capture some web analytic information. Currently at my company we use Omniture, whose variables and functions to track certain values such as page name are in the javascript. Whenever a page with these anaylytics in their javascript is loaded, you can see what those values equal in the page source. The piece of the page source I want to capture looks as follows:
s.pageName="Vail:home";
s.channel="";
s.hier1="Vail,home,";
OmnitureTracking.pageViewType = 'None'; s.prop1="Vail";
s.prop2="Vail:home";
s.prop3="Vail:home:";
s.prop4="Vail:home:";
s.prop75="D=v75";
s.prop73="D=v73";
s.prop10="D=v10";
s.prop11="D=v11";
s.prop7="Logged Out";
s.eVar75="";
s.eVar73="";
s.eVar10="";
s.eVar11="";
s.eVar7="D=c7";
$(document).ready(function() {
I would like to use the following command for each value:
String sPageName = driver.findElement(ByLocator).getAttribute("s.pageName");
But without a visible locator on the page, what would I locate by?
I also thought about firing off the JavaScript using the following:
String sPageName = (String)((JavascriptExecutor)driver).executeScript("return s.getPageName();");
But the omniture javascript code changes from page to page, so upkeep of that script wouldn't be efficient.
Any ideas?

Injecting javascript code into an on click event with javascript and casper.js

I've just started using casperjs after trying to use python (selenium / requests and mechanise) to scrape a page only after some javascript loaded some dynamic content on the page.
Since this was very hard to do or very slow with selenium it was suggested I turn to Casper js (which requires phantomjs).
One thing I am wondering (I am quite new to javascript) is relating to a javascript onclick event.
The page I want to scrape by default shows ten names per page, and at the bottom has options to show (5) or show (100).
After diving into this code and inspecting it with firebug I am wondering if it is possible to change the onclick=loaditems(100) to something like... onclick=loaditems(Load X items), where X could be 200. (or whatever number it needs to be to load all the content on one page and make it easier for scraping. Is this possible?
update
* reviewer asked for the code used to select the 100 items per page....
The code (HTML) is..
<a title="Show 100 items per page"
onclick="lconn.profiles.Friending.setItemsPerPage(this,100)" href="javascript:void(0);">100</a>
and the Xpath is...
/html/body/div/div[2]/div[3]/div[3]/span/div/div/div/div/div[2]/div/div/form/div??/div[4]/div/ul/li[4]/a
problem
I am able to edit the onclick command and change the value to a higher number, however I do not know how to then execute it with the higher number of elements I want to display per page to see if it works.
I used a simple CSS selector for this task. You can change the onclick attribute with string operations. In this case I replace "100" with num. I also added a clickIt argument to click the changed link.
casper.changeItemsPerPageLink = function(num, clickIt){
casper.evaluate(function(num, clickIt){
num = ""+num;
var a = document.querySelector('a[title="Show 100 items per page"]');
a.innerHTML = num;
a.title = a.title.replace("100", num);
a.setAttribute("onclick", a.getAttribute("onclick").replace("100", num));
if (clickIt) {
a.click();
}
}, num, clickIt);
};
See my test code gist.

Why does my HTML5 aside section not display in my page?

I added the following into my _SiteLayout.cshtml, just above the section:
<aside class="amazad">
<script type="text/javascript"><!--
amazon_ad_tag = "platypus-42"; amazon_ad_width = "120"; amazon_ad_height = "600"; amazon_ad_link_target = "new";
//--></script>
</aside>
and added this to Site.css:
.amazad {
float: right;
}
But the ad strip doesn't display. Why not?
Everything inside the "aside" was generated by amazon's tools. They simply say to "place it in your html"; so what am I missing?
UPDATE
This might be the issue (from amazon, via a Bing search):
Relevant ads should appear on your pages shortly after you add the code, but sometimes it can take up to 48 hours for ads to show. This is because our crawler has to visit your page and determine its content so we can serve targeted ads.
But I would think it would at least show a placeholder to indicate its eventual whereabouts...?
Script tags are run not displayed but run.
You are only declaring variables in your script tag. There is no code there about where the advertisements are loaded. Perhaps you are specifying the destination element in amazon_ad_tag property in which case it should be:
amazon_ad_tag = ".amazad"
Since that is the class for your aside

Categories