How to make looping in Qweb by adding a newline (line break) - html

I have a Many2many field and would like to make a new line after each item.
When trying with other separators like : ',', '/', ... that's work. The problem was only with '\n'. I even tried with '
'
Here is my code:
<span t-esc="'\n'.join(map(lambda x: x.name, move.myfield_ids))"/>
Any help, please ? What's wrong?
Thanks.

Spaces, tabs or line breaks (white spaces) are largely ignored, whitespace in between words is treated as a single character, and whitespace at the start and end of elements and outside elements is ignored.
Whitespace character processing can be summarized as follows:
All spaces and tabs immediately before and after a line break are ignored
All tab characters are handled as space characters
Line breaks are converted to spaces
Any space immediately following another space (even across two separate inline elements) is ignored
Sequences of spaces at the beginning and end of a line are removed
1. Use the CSS white-space property to set how white space inside an element is handled
Example: Using pre-wrap value
<span style="white-space: pre-wrap;" t-esc="'\n'.join(map(lambda x: x.name, move.myfield_ids))"/>
2. You can get the same result using the raw directive, which behaves the same as esc but does not HTML-escape its output. It can be useful to display separately constructed markup (e.g. from functions) or already sanitized user-provided markup.
Example: Using <br/>
<span t-raw="'<br/>'.join(map(lambda x: x.name, move.myfield_ids))"/>

Related

Printing HTML entity codes to Screen

How do you quote, type in a code line an HTML entity code word, such as a "non-breaking-space", and have the code word itself be printed to screen? Instead of the result of that word? (similar to using "& gt;" (NO space in word) for the > bracket; see, I can't even quote that word without putting in a space...)
I believe it will be write like this &nbsp (no break space).

web2py: textareas lose initial newline

I'm not sure if this is a web2py problem or a general html problem, but when I create a form in web2py that contains an editable string in a textarea, and the string contains an initial newline, like "\nsecond_line", the textarea does not display or save the newline - it is cut out. It works fine if there is a character before the newline: "firstline\nsecond_line" shows as on two lines. It is also only relevant for the first newline. If I have a string like "\n\nthird_line", then the textarea shows a single newline at the start.
This is with the most recent (non beta) version of web2py, on safari 9.1.3 and chrome 56.0.2924.87.
Ah. "By HTML 4.0 appendix B chapter 3.1, “a line break immediately following a start tag must be ignored, as must a line break immediately before an end tag. This applies to all HTML elements without exception.”"

indicate automatic line break in white-space: pre-wrap element

I'm using white-space: pre-wrap style on a HTML <pre> element to allow lines to break when they are longer than the browser window is wide.
Unfortunately those broken lines also look as if they have a line break at the end; the user cannot see if it was an automatic line break.
Is there a way to show either at the end of the line that wrapping is going on (as emacs does with a \ character), or at the beginning of wrapped lines that they are a continuation of a previous line (e.g. with →)?
Copying & pasting should not copy the continuation characters.
Example code:
<pre style="white-space: pre-wrap">for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, posx+selwidth-selheight, selheight, posx-selheight, selheight]);</pre >
Preferred rendering, with a → at the beginning of continuation lines:
for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=
→initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0,
→posx+selwidth-selheight, selheight, posx-selheight, selheight]);
Pre is intended to keep text as it was typed. It helped keep poems and speciality text as they were intended to be seen and not formatted by the browser. I would think most people will be able to tell a line of text is being wrapped in Pre with whitespace: pre-wrap because it would look something like this:
Five little monkeys jumping on the
bed, {{line break}}
One fell off and bumped his head. {{line break}}
Mama called the Doctor and the
Doctor said,{{line break}}
"No more monkeys jumping on the bed!'.{{line break}}
If you went with straight HTML <p> it would look as you had typed it in your example and <pre> with whitespace: pre-wrap would look the space as you have it typed.
To color the ends of each line you might try putting a <span> and give it CSS to color and size or do a <span> on the whole sentence giving it a CSS background color.
AFAIK not with CSS, instead you can replace every newline with 2 newlines so newlines will be distinguished when text wraps, to do this either manually enter two -or more- line-breaks <br>s for each new line, or if you can use javascript then you can replace each semi-colon ; -because the provided example in the question is code where each line ends with ;- replace it with ;\n\n -or with ;<br><br> instead- thus it will recognized.
JS Fiddle
var pre = document.getElementsByTagName('pre')[0],
preHTML = pre.innerHTML;
pre.innerHTML = preHTML.replace(/;\s*/g, ";\n\n");
<pre style="white-space: pre-wrap">for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, posx+selwidth-selheight, selheight, posx-selheight, selheight]);</pre >

How to convert spaces into tabs in ruby on rails correctly?

I'm converting linebreaks and extra spaces.
def simple_format_plus(string)
(h(string).gsub(/\n/, '<br/>').gsub(' ', "\t")).html_safe
end
In my views I'm calling:
<p><%= simple_format_plus(post.content) %></p>
However the html output doesn't show the "\t" part. I've even tried disabling the css, but the problem still persists. For some reason I can't display more than one space in succession.
There are 3 spaces instead of 1 in this line .
still displays as:
There are 3 spaces instead of 1 in this line .
If I inspect the <p> element the extra spaces show up in the developer console however, but not in the browser.
tab can't be interpreted in HTML. You can use &nbsp for three or the number of times you want. The helper method can be re-written like
def simple_format_plus(string)
(h(string).gsub(/\n/, '<br/>').gsub(' ', "&nbsp&nbsp&nbsp")).html_safe
end
Consecutive space characters are interpreted in HTML as a single space. If you want to display each space character as is in the source HTML file, then surround that part with <pre> ... </pre>.

difference between " " and nbsp; or " "

Hello I am trying to compile an EPUB v2.0 with html code extracted from Indesign. I have noticed there are a lot of "special characters" either at the beginning of a paragraph or at the end. For example
<p class="text_indent0px font_size0_8em line_height1_325 margin_bottom1px margin_left0px margin_right0px sans_serif floatleft">E<span class="small_caps">VELYNE</span> </p>
What is this
and can I either get rid of it or replace it with a "nbsp;"?
&#9
Is the ascii code for tabs. So I guess the paragraphs were indented with tabs.
If you want to replace them with then use 4 of them
That would be a horizontal tab (i.e. the same as using the tab key).
If you want to replace it, I would suggest doing a find/replace using an ePub editor like Sigil (http://sigil-ebook.com/).
represents the horizontal tab
Similarly represent space.
To replace you have to use
In the HTML encoding &#{number}, {number} is the ascii code. Therefore, is a tab which typically condenses down to one space in HTML, unless you use CSS (or the <pre> tag) to treat it as pre formatted text.
Therefore, it's not safe to replace it with a non-breaking or a regular space unless you can guarantee that it's not being displayed as a tab anywhere.
div:first-child {
white-space: pre;
}
<div> Test</div>
<div> Test</div>
<pre> Test</pre>
See https://developer.mozilla.org/en-US/docs/Web/CSS/white-space and http://ascii.cl/
is the entity used to represent a non-breaking space
decimal char code of space what we enter using keyboard spacebar
decimal char code of horizontal tab
and both represent space but is non-breaking means multiple sequential occurrence will not be collapsed into one where as for the same case, ` will collapse to one space
= approx. 4 spaces and approx. 8 spaces
There are four types of character reference scheme used.
Using decimal character codes (regex-pattern: &#[0-9]+;),
Using hexadecimal character codes (regex-pattern: &#x[a-f0-9]+;),
Using named character codes (regex-pattern: &[a-z]+;),
Using the actual characters (regex-pattern: .).
Al these conversions are rendered same way. But, the coding style is different. For example, if you need to display a latin small letter E with diaeresis then you could use any of the below convention:
ë (decimal notation),
ë (hexadecimal notation),
ë (html notation),
ë (actual character),
Likewise, as you said, what should be used (a) (decimal notation) or (b) (html notation) or (c) (decimal notation).
So, from the above analogy, it can be said that the (a), (b) and (c) are three different kind of notation of three different characters.
And, this is for your information that, (a) is a Horizontal Tab, the (b) one is the non-breaking space which is actually   in decimal notation and the (c) is the decimal notation for normal space character.
Now, technically space at the end of the paragraph, is nothing but meaningless. Better, you could discard those all. And if you still need to use space inside <pre> elements, not in <p> or <div>.
Hope this helps...