Repository: bokeh/bokeh

Issue:
Allow for the injection of raw HTML code
Currently, the Widget library contains a `Paragraph` and a `PreText` widget allowing the user to put basic text on the rendered page.  Neither of these widgets allows for the inclusion of formatted text using HTML markup.  A widget should be added to support the inclusion of raw HTML.  The widget can be a simple div named div tag.



Discussion:
Same need here!

This is a good idea and I feel like we've had this request before, although I can't find another issue for it.

Can I suggest though that in the short-term you should be able to use a CustomModel to achieve the same. If one person made it and shared it then others could use.

@birdsarah I am not sure how I could make a CustomModel which nicely packages up the python and the JS code at the same time.  It seems easier to just make a div tag widget which could be used.  Just model it off the current paragraph widget and subclass it off the Markup widget.


Resolving patch:
diff --git a/bokeh/models/widgets/markups.py b/bokeh/models/widgets/markups.py
--- a/bokeh/models/widgets/markups.py
+++ b/bokeh/models/widgets/markups.py
@@ -4,18 +4,13 @@
 from __future__ import absolute_import
 
 from ...core.properties import abstract
-from ...core.properties import Int, String
+from ...core.properties import Int, String, Bool
 from .widget import Widget
 
 @abstract
 class Markup(Widget):
     """ Base class for HTML markup widget models. """
 
-class Paragraph(Markup):
-    """ A block (paragraph) of text.
-
-    """
-
     text = String(default="", help="""
     The contents of the widget.
     """)
@@ -29,6 +24,20 @@ class Paragraph(Markup):
     """)
 
 
+class Paragraph(Markup):
+    """ A block (paragraph) of text.
+
+    """
+
+class Div(Markup):
+    """ A block (div) of text.
+
+    """
+
+    render_as_text = Bool(False, help="""
+    Should the text be rendered as raw text (False, default), or should the text be interprited as an HTML string (True)
+    """)
+
 class PreText(Paragraph):
     """ A block (paragraph) of pre-formatted text.
 
diff --git a/examples/plotting/file/slider_callback_policy.py b/examples/plotting/file/slider_callback_policy.py
--- a/examples/plotting/file/slider_callback_policy.py
+++ b/examples/plotting/file/slider_callback_policy.py
@@ -1,5 +1,5 @@
 from bokeh.io import vform, output_file, show
-from bokeh.models import CustomJS, Slider, Paragraph, PreText
+from bokeh.models import CustomJS, Slider, Div
 
 # NOTE: the JS functions to forvide the format code for strings is found the answer
 # from the user fearphage at http://stackoverflow.com/questions/610406/javascript-equivalent-to-printf-string-format
@@ -20,10 +20,10 @@
       };
     }
 
-    para.set('text', "Slider Values\\n\\n  Slider 1: {0}\\n  Slider 2: {1}\\n  Slider 3: {2}".format(s1, s2, s3))
+    para.set('text', "<h1>Slider Values</h1><p>Slider 1: {0}<p>Slider 2: {1}<p>Slider 3: {2}".format(s1, s2, s3))
 """)
 
-para = PreText(text = "Slider Values:\n\n  Slider 1: 0\n  Slider 2: 0\n  Slider 3: 0", width = 200, height = 150)
+para = Div(text="<h1>Slider Values:</h1><p>Slider 1: 0<p>Slider 2: 0<p>Slider 3: 0", width=200, height=150, render_as_text=False)
 
 s1 = Slider(title="Slider 1 (Continuous)", start=0, end=1000, value=0, step=1, callback=callback, callback_policy="continuous")
 s2 = Slider(title="Slider 2 (Throttle)", start=0, end=1000, value=0, step=1, callback=callback, callback_policy="throttle", callback_throttle=2000)


Test patch: