Is there a way to display an image using a string built from several values? Ie. I want to show an image whose path contains an attribute value. Example of my code (which doesn't work):
<img src="{'subdirectory/' + #title + '150p.png'}" />
This tries, and fails, to display an image with the path "subdirectory/main150p.png" if the current node's "title" attribute = "main".
Looks like you may be thinking in Javascript instead of in XPath. Try <img src="{concat('subdirectory/', #title, '150p.png')}" />
Related
Hi I have this HTML code from a website: I want to be able to extract multiple images, I have cases where there is 3-4 images. How would I go about doing that?
<div style="float: right;"><u>Chakra required:</u>
<img src="https://naruto-arena.net/images/energy/energy_2.gif">
<img src="https://naruto-arena.net/images/energy/energy_4.gif">
</div>
My code:
chakras1 = soup.find_all("div")[42].img['src']
print(chakras1)
Result:
https://naruto-arena.net/images/energy/energy_2.gif
I only get the FIRST image but now the second one.
To extract multiple images from within a tag, I personally stick to using for loops. So what I mean is once you find the div tag that you want to look within and say you call that chakras1, I would write the following:
for img in chakras1.find_all("img"):
print(img)
For me the steps kind of go as follows:
find the specific tags you are looking for (img src)
see what tag those tags are within (
navigate through the HTML to that tag (using beautiful soup's .find or .find_all functions depending on what you want to use)
once you have navigated to the tag search within that tag for the tags you're really looking for.
One quick note, with this method, if you are looking through multiple div tags, you're also going to need to loop through those as well.
I hope this makes sense!
I have entries that contain an image as a channel entry field. I am using the following syntax in my template to generate an alt tag w/ data. The problem I have is that I haven't found a way to add a class attribute to the generated img tag.
{info-image wrap="image" class="img-responsive"}
outputs
<img src="http://secretproject.dev/images/uploads/general/dedication2.jpg" alt="dedication2">
where the alt data is the image title.
If I take another approach and write
<img class="img-responsive" src="{info-image}" alt="{title}">
then the title comes from the entry itself and not the file title.
In summary, I need both class and alt attributes but seem to be stuck with one or the other. Is there a way to achieve this in either syntax? Is there another approach? Thanks
You can use the variable pair syntax as described in the documentation.
{info-image}
<img src="{url}" alt="{title}" class="img-responsive">
{/info-image}
I have gotten the hang of using the html agility pack to find specific nodes using their attributes and xpaths. The problem is, I've been doing this manually for each of my projects (opening the website html and scanning for the nodes that have the text i need). Is there a way to select a single node by its inner text? This would make it easier to write an update script for websites whose content scheme is the same, but attribute tags change values over time. Thanks in advance!
Would be better if you have provided sample HTML, but since you haven't, let's assume we have HTML containing this markup :
<body>
<div class="foo">bar</div>
</body>
You can select the <div> by it's attribute using HtmlAgilityPack's SelectSingleNode() and XPath like so :
myHtmlDocument.DocumentNode.SelectSingleNode("//div[#class='foo']");
or you can select the same by the inner text like so :
myHtmlDocument.DocumentNode.SelectSingleNode("//div[.='bar']");
Hope this help.
I would like to add a target (e.g. _blank) property for a basicLeafNode on the Widget Container from the extension library.
I do not see the property for this.
Instead I could use the onClick property and return an URL. But then I still would have no target defined.
I could add a postScript method
var target = url;
view.postScript("window.open('"+target+"','_blank')")
but this fires when the container is loaded.
Can I add a target property without using the onClick Property?
In case I use the onClick property what method should I use or how I prevent the postscript is executed when the container is loaded?
The basicLeafNode doesn't currently provide a target property. You have 2 courses of action:
implement your own custom node as Michael suggested (hard)
use a class on the link e.g. "newpageopen" and add an onPageReady script that selects all a elements with the calss newpageopen and add the target property to the resulted HTML.
Something like this:
require(["dojo/ready","dojo/query"], function(ready){
ready(function(){
dojo.query("a.newpageopen").attr("target", "_blank");
});
});
Hope that helps;
To make this list of solutions a bit longer here another on wich does not require dojo or jquery:
Instead of using your code as SSJS like:
var target = url;
view.postScript("window.open('"+target+"','_blank')")
You can use the Client Side Code and add SSJS code in #{javascript:}' wich i think is the shortest solution on this Problem. Here a hardcoded example:
<xe:basicLeafNode>
<xe:this.onClick><![CDATA[window.open('#{javascript: return "http://www.google.com";}','_blank');]]></xe:this.onClick>
</xe:basicLeafNode>
the above example will also work with viewScope variables or SSJS funktions:
<xe:basicLeafNode>
<xe:this.onClick><![CDATA[window.open('#{javascript: return viewScope.url;}','_blank');]]></xe:this.onClick>
</xe:basicLeafNode>
You can add the target attribute using JavaScript. It's kind of inconvenient way but would work.
You can use dojo.query to query the HTML output generated by basicLeafNode on the Widget Container. Once you get the node of <a> then you can add attribute using dojo.attr.
One problem you might face is that the ID generated by XPages contains the character :, which will not work so you would have to escape it.
function escapeColon(controlID) {
return controlID.replace(/:/g, "\\3A");
}
So your code would be something like:
dojo.addOnLoad(function() {
dojo.attr(dojo.query(escapeColon("#{id:ID_of_basicLeafNode}") + " > a")[0], "target", "_blank");
});
The code escapeColon("#{id:ID_of_basicLeafNode}") + " > a" would generate a CSS selector. Here I am assuming that basicLeafNode on the Widget Container would generate something like this <div id="_id1:basicLeafNode"><a href=".... So the CSS selector would search for a tag with that ID and inside it the <a> tag. You would have to modify this based on the output that is generated.
As I said its a bit inconvenient. Also I haven't tested this code.
Given the following HTML code (which, I realise, sucks, but that's not something I can currently solve):
<img height="64" width="64" class='list_item' src="/img/icon/first.jpg"
title="This is the first item::Completed the item "I did this first"" alt="First" />
gives me a result of (this is an image.to_s)
name:
type:
id:
value:
disabled:
src: /img/icon/first.jpg
width: 64
height: 64
alt: First
Note lack of "title" element. This does not actually change (the lack of the title element)
If I get the contents of the parent div of one of those icons, I get something like:
<img class="list_item" I="" did="" this="" first="" src="/img/icon/first.jpg" alt="First">
The broken HTML of the original has been turned into separate attributes somewhere down the line, but the title tag appears to have been stripped completely, and since it's the contents of the title tag I need, I'm a little stuck.
This has been tried with lastest Watir on Ruby 1.9.2 using Firefox.
Perfect world solution: I'd like to get the original transmitted HTML for the image tag, so I can "special case" (ie, hack) around the stupid double-quote problem.
Good Enough Solution: the contents of the title tag.
There is actually a #title method on Watir::Image. With the above incorrect HTML the output would be like this (where 'i' is the Image object):
i.title
=> "This is the first item::Completed the item "
This shows only part of the title.
But you could use #html and then parse all the necessary information out of it with some magic:
i.html
=> "<IMG class=list_item title=\"This is the first item::Completed the item \" alt=First src=\"/img/icon/first.jpg\" width=64 height=64 first?? this did I>"
But as other answers above have mentioned - you cannot get it out correctly due to the bad HTML. Maybe there's some other way to accomplish your bigger goal you're having?
getting the title probably isn't working because the way the title attribute is set on that element isn't valid. entities " and < and > need to be escaped inside html attributes, with " and < and > respectively. Escape the quotes and try again.
Not sure, but I don't think Watir supports image titles. I looked over the Supported Elements page, title was x'ed out. I don't see it in the RDoc for Watir::Image type either.