Skip to content

Instantly share code, notes, and snippets.

@edsilv
Last active August 29, 2015 14:22
Show Gist options
  • Save edsilv/4a45e99431da95fc3416 to your computer and use it in GitHub Desktop.
Save edsilv/4a45e99431da95fc3416 to your computer and use it in GitHub Desktop.
HTML truncating algorithm

##Original HTML

<a>link one is really really long <img src="img.png" /></a>
<a>link two</a>
<a>link three</a>
<a>link four</a>

###Initialise

Parse the HTML into DOM elements.

IF there is more than one root element, wrap them in a span element.

<span>
  <a>link one is really really long <img src="img.png" /></a>
  <a>link two</a>
  <a>link three</a>
  <a>link four</a>
</span>

###Phase 1

IF there is more than one child DOM element THEN Remove the last DOM element. GOTO Measure

ELSE IF the remaining child element itself has child elements GOTO Phase 1(child element)

ELSE GOTO Phase 2

<span>
  <a>link one is really really long <img src="img.png" /></a>
  <a>link two</a>
  <a>link three</a>
</span>

###Phase 2

Get the text content of the remaining DOM element and truncate at the last space.

<span>
  <a>link one is really really</a>
</span>

GOTO Measure

###Measure

IF the HTML height is overflowing the containing element GOTO Current Phase

ELSE RETURN

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment