I'm trying to use #font-face selector in cassius template with no luck.
Cassius uses # for interpolation, is there any way to escape it?
I've tried ## and \#, none of them works.
Following template
#font-face
font-family: 'Monsieur La Doulaise'
src: url('http://fonts.googleapis.com/css?family=Monsieur+La+Doulaise')
Results in
src: url('http://fonts.googleapis.com/css?family=Monsieur+La+Doulaise');}
This is pretty ugly, but may work:
...
defaultLayout $ do
let atSym = "#"
[cassius|#{atSym}font-face ... |]
...
in other words, bind a string to the value of "#" and interpolate that in the cassius file. I can't check the syntax now but it may work.
This is not a solution to your question but I thought I will let you know that ran into something related this morning. I had the following CSS section:
.myclass {
background: #d880efe;
background-image:url(#{StaticR img_myimage_png});
/* more stuff */
}
When Yesod compiled the CSS file, it did not generate the URL for the background-image. In fact, it skipped over the entire line and created a slightly different background property. I ended up skipping the `#{StaticR ...} and hard-coded the URL. When I get a chance I will create a reproducible code.
So I am guessing this is an issue with # interpolation and not so much escaping. Do you mind trying a #{Handler} for your src? If that line is not getting generated then it may be a different issue that we need to file a bug report for.
Related
I'm having a lot of trouble doing something as simple as just getting the tag of an Element from an XML file. This is the element, with sensitive info removed:
<FIXML xmlns="AAA/AAAAA-5-0-AAA" v="AAA.5.AAAA" xv="111" cv="AAA" s="2013-10-14">
I attempted to get the tag of this element with this simple line of code:
tag1 = root.tag
And for some reason this is not behaving as expected. It is giving me this value:
{AAA/AAAAA-5-0-AAA}FIXML
It's attaching the value of the first attribute to it, as a prefix in curly braces? Why on earth is it doing that? I just want it to return FIXML and nothing else, which according to the documentation here is what I understood it to do. Any ideas?
Python version: 3.7
User mzjn was correct here, I didn't realize that namespaces were returned as well. The way I resolved this was by stripping the namespace off:
# Strip namespace off of root tag
if '}' in tag:
tag = tag.split('}', 1)[1]
This resulted in the intended output by stripping everything after the closing tag. Obviously this assumes there's no } character in the tag or namespace itself.
I have a function in my library that takes some variables and returns an HTML page with those variables inserted. What is the best practice not to litter my module with a large HTML literal? I mean that when I read my code it just "doesn't seem right" to have a piece of HTML that I have to scroll through.
I use the format! macro with "{}" in places in the literal where I want insert variables so I guess that keeping the page as a file and loading it wouldn't work. I don't have to use format! macro, but it seems elegant to not process text manually when I have this kind of tool.
Would creating an entire module just to hold this page be a good practice? In my mind a module is something "bigger", but maybe that's the best thing to do?
You can save the HTML in an external file and include it via std::include_str. For example
let html_code = format!(include_str!("src/index.html"), my, values, in, the, template);
A playground application doesn't quite work here due to the compile-time requirement of the file, but locally the following worked:
src/
foo.txt -- "{}"
main.rs -- println!(include_str!("foo.txt"), 1234);
I tried to create a Map using folium library in python3. It work's fine until i add a Marker to the map. On adding Marker the output results in just a blank HTML page.
import folium
map = folium.Map(location=[20.59,78.96], tiles = "Mapbox Bright")
folium.Marker([26.80,80.76],popup="Hey, It's Moradabad").add_to(map)
map.save("mapOutput.html")
#MCO is absolutely correct.
I like to leverage html.escape() to handle the problem characters like so
import folium
import html
map = folium.Map(location=[20.59,78.96], tiles = "Mapbox Bright")
folium.Marker([26.80,80.76],popup=html.escape("Hey, It's Moradabad")).add_to(map)
map.save("mapOutput.html")
in my experience, folium is very sensitive to single quotes (').
The reason being, folium generates javascript, and transforms your strings into javascript strings, which it encloses with single quotes. It does, however, not escape any single quotes contained in the string (not even sure if that's possible in js), so having a single quote in the string has the same effect as not closing a string in python.
Solution: Replace all single quotes in your strings with backticks (`) or (better) use #Bob Haffner's answer.
Edit: out of sheer coincidence i stumbled over another solution just now. Apparently folium.Popup has an argument parse_html. Use it like this:
folium.Marker([x,y], popup=folium.Popup("Foo'Bar",parse_html=True)).add_to(map)
however, i could not make it work without running into a unicodeescape error. nonetheless it exists, supposedly for this purpose, and might work for you.
Edit 2: As i've been told on github, this issue will be fixed in the next release. Ref: folium#962
I like to integrate the Toasts from Materializecss to an SVG. I am able to import the css and js from Materializecss, but when I load the svg I get Uncaught TypeError: Cannot use 'in' operator to search for 'touchAction' in null
Example: http://www.idoodler.de/svgTest.svg
Is there any way to make this work?
I struggled with this for some time. I tried HTMLencoding the image, used base64-encoded image source, direct SVG inline image source. I got non of these to work, and that's mostly due to quotation marks. Plain old URLs proved simplest. (And the method I thought of last)
The solution proved very simple in the end:
Materialize.toast('<img src=\"http://www.idoodler.de/svgTest.svg\" />', 5000);
The escaping is kind of ugly and error prone, though. First time I got this working but calling my own function instead of triggering Materialize.toast() directly:
<script>
function imageToast(imageUrl) {
Materialize.toast('<img src="' + imageUrl + '" />', 5000);
}
</script>
imageToast(http://www.idoodler.de/svgTest.svg);
By wrapping the image source in it's own function, we don't have to deal with all kinds of quotation marks anymore. This solution should also work with inline sourcing of the image using pure SVG or base64.
My guess is that you want this kind of dynamic, right? My suggestion is simply to generate the SVG you want, save it, then apply toast() to the URL directly.
Sources:
https://css-tricks.com/probably-dont-base64-svg/
Here's a Codepen for you to try:
http://codepen.io/anon/pen/GJrvpj
Good luck.
I have a markdown file (utf8) that I am turning into a html file. My current setup is pretty straight forward (pseudo code):
var file = read(site.postLocation + '/in.md', 'utf8');
var escaped = marked( file );
write('out.html', escaped);
This works great, however I've now run into the issue where there are special characters in the markdown file (such as é) that will get messed up when viewed in a browser (é).
I've found a couple of npm modules that can convert html entities, however they all convert just about all convertable characters. Including those required by the markdown syntax (for example '#' becomes '#' and '.' becomes '.' and the markdown parser will fail.
I've tried the libs entities and node-iconv.
I imagine this being a pretty standerd problem. How can I only replace all strange letter characters without all the markdown required symbols?
As pointed out by hilarudeens I forgot to include meta charset html tag.
<meta charset="UTF-8" />
If you come across similar issues, I would suggest you check that first.