Text wrapping near images

classic Classic list List threaded Threaded
17 messages Options
Reply | Threaded
Open this post in threaded view
|

Text wrapping near images

pwillard
Is there a way to wrap text around images so this looks more natural?  (Not so much whitespace.)

text wrap around image
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

nicoulaj
Hi,

Have you tried using the image macro float attribute ?

Something like:
image::images/image.png[float=left]

Julien
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
This post was updated on .
Yes, that is what I tried...   so not sure why this happened.

This is my statement:
image::images/stripper.png[float=left]

so... yeah... not what I'm after
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

Carsten
I'm new to asciidoctor, but have you tried this?

image:images/stripper.png[alt_text, role="left"]
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
Yes.  same result.  
Ted
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

Ted
I was able to get nice text wrapping around the image.

I tested the following document with Asciidoctor ver. 1.5.4 and ver. 1.5.5.


= Text Wrapping

image:MyTestImage.png[float=left]
Iced, fair trade, crema, doppio as roast, dripper sit trifecta sweet crema, robust blue mountain eu, robusta cinnamon crema plunger pot barista french press, whipped, brewed, aftertaste arabica eu blue mountain con panna caramelization instant grounds breve. Robust, redeye latte rich coffee saucer cortado sweet cup rich, medium, froth,  as, affogato single shot grinder mug cappuccino, decaffeinated and, white mug affogato filter, strong chicory saucer carajillo whipped. Crema, mug et, and mazagran redeye, single origin decaffeinated whipped sugar that, cream fair trade crema java cream shop fair trade carajillo strong, white fair trade spoon decaffeinated coffee, cup variety frappuccino plunger pot, et roast whipped americano carajillo. Con panna skinny, eu, saucer single origin strong sweet id variety, cultivar viennese skinny, variety, grinder single origin sit, a, spoon fair trade, medium so id cinnamon extraction.
- Ted @TedAtCIS
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

Carsten
Good to hear that!

: vs. :: seems to make the crucial difference.

Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

mojavelinux
Administrator
image:<target>[role=left] is preferred because we attach some additional styles to the role that are not added when you use the float attribute.

You can float either block image (two colons) or inline image (one colon), but when the image is part of the content, then the inline image is the most appropriate choice.

-Dan

On Mon, Feb 27, 2017 at 11:14 AM, Carsten [via Asciidoctor :: Discussion] <[hidden email]> wrote:
Good to hear that!

: vs. :: seems to make the crucial difference.




If you reply to this email, your message will be added to the discussion below:
http://discuss.asciidoctor.org/Text-wrapping-near-images-tp5277p5310.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML



--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
Got it, thanks

I'll replace "float" with "role"...
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
I wish I could get this working.

I'm really wanting it to behave like an "aside" with *my* selected image to the left.
Ted
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

Ted
Could you post your .adoc markup and give us some details about how you are rendering this? Are you creating HTML from asciidoctor? Or are you trying to create this in a PDF with asciidoctor-pdf?
- Ted @TedAtCIS
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

mojavelinux
Administrator
Image floating only applies to HTML output, as Ted is suggesting. It's not (yet) implemented in the PDF converter. 

-Dan

p.s. I have managed to get a prototype of floating working in PDF output, but it's very context dependent.

On Tue, Mar 7, 2017 at 9:07 AM, Ted [via Asciidoctor :: Discussion] <[hidden email]> wrote:
Could you post your .adoc markup and give us some details about how you are rendering this? Are you creating HTML from asciidoctor? Or are you trying to create this in a PDF with asciidoctor-pdf?
- Ted @TedAtCIS



If you reply to this email, your message will be added to the discussion below:
http://discuss.asciidoctor.org/Text-wrapping-near-images-tp5277p5339.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML



--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
In the famous words of Jaime Hyneman of Mythbusters, "There's your problem"

Since... "It's not (yet) implemented in the PDF converter. "

DOH!
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

mojavelinux
Administrator
There you go.

The problem is that wrapping text around an image is very difficult to do with Prawn, esp when you don't know the content ahead of time. Unlike with HTML, the converter has to place every single character on the canvas where it needs to go (and within surprisingly little control over line arrangement). And that means you have to know how much space the content is going to take up before you place anything on the canvas. It gets complicated very quickly considering an AsciiDoc document can have countless permutations of blocks.

This could be at least partially addressed if Prawn had a straightforward way to "undo" operations. Sadly, it does not. Once you write into the PDF, it's like you are writing with permanent marker. We've found ways around this by using a scratch document, but each time we do that, it slows down the processor considerably (one of main reasons Asciidoctor PDF is so much slower).

-Dan

On Wed, Mar 8, 2017 at 5:48 AM, pwillard [via Asciidoctor :: Discussion] <[hidden email]> wrote:
In the famous words of Jaime Hyneman of Mythbusters, "There's your problem"

Since... "It's not (yet) implemented in the PDF converter. "

DOH!


If you reply to this email, your message will be added to the discussion below:
http://discuss.asciidoctor.org/Text-wrapping-near-images-tp5277p5349.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML



--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
Is it unreasonable to think narrowly and maybe see if there is a way to emulate an assertion with a custom left side image with asciidoctor-pdf?

Or maybe... Images in tables...

(I'm just thinking out loud.... probably not good if it strays too much from the master)
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

mojavelinux
Administrator
Using tables is one way to control the layout. Just set frame=none,border=none,stripe=none (stripe control is in the upcoming release) on the table. Then, you can put an image to the left or right of a column of text. The text won't wrap around the image, but at least it will be to the side.

Is it unreasonable to think narrowly and maybe see if there is a way to emulate an assertion with a custom left side image with asciidoctor-pdf? 

That's exactly what I did in editions, which is a magazine layout tool. You can see the override code I used here:


(and that was just for one group of paragraphs ;)

-Dan

On Thu, Mar 9, 2017 at 12:46 PM, pwillard [via Asciidoctor :: Discussion] <[hidden email]> wrote:
Is it unreasonable to think narrowly and maybe see if there is a way to emulate an assertion with a custom left side image with asciidoctor-pdf?

Or maybe... Images in tables...

(I'm just thinking out loud.... probably not good if it strays too much from the master)


If you reply to this email, your message will be added to the discussion below:
http://discuss.asciidoctor.org/Text-wrapping-near-images-tp5277p5358.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML



--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Text wrapping near images

pwillard
Oh neat!