Pretty Print JSON

655 views
Skip to first unread message

Jack Wootton

unread,
Mar 13, 2017, 6:02:38 PM3/13/17
to js-code-prettifier
Is JSON supported?  If so, is there a way to turn on line numbering for every line? The documented solution doesn't work for JSON.

Please check this plunker for an example of JSON and prettify.

Mike Samuel

unread,
Mar 13, 2017, 6:06:46 PM3/13/17
to js-code-prettifier
Lang-js works pretty well with json

--
You received this message because you are subscribed to the Google Groups "js-code-prettifier" group.
To unsubscribe from this group and stop receiving emails from it, send an email to js-code-prettifier+unsub...@googlegroups.com.
To post to this group, send email to js-code-prettifier@googlegroups.com.
Visit this group at https://groups.google.com/group/js-code-prettifier.
For more options, visit https://groups.google.com/d/optout.

Jack Wootton

unread,
Mar 17, 2017, 9:59:12 AM3/17/17
to js-code-prettifier
I'm getting lang-js 404


    <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=js&amp;autorun=false&amp;skin=doxy"></script>

Mike Samuel

unread,
Mar 17, 2017, 10:00:42 AM3/17/17
to js-code-prettifier
js is loaded by default​.  It shouldn't generate a 404 though.

--

Amro

unread,
Mar 30, 2017, 1:05:45 PM3/30/17
to js-code-prettifier
Note that lang-json is just an alias for lang-js.

GMRsr

unread,
Apr 19, 2017, 4:44:44 PM4/19/17
to js-code-prettifier
Jack:  The link to the example is helpful but I have one question:  The HTML text that you show, where is it written?  Can you write this in MS Word and save the file as HTML and then if you print that HTML file it will show the key words formatted in color?  I am trying to print Python scripts in color and I have found a clunky way to do it that takes several steps.  It appears that the <pre Class = "prettyprint linenums"> Script Text </pre> might be a cleaner way to make paper printouts for my Python scripts.  Can what you posted simply be placed into an editor like IDLE (if you are familiar with IDLE which is simply an IDE) and when you use the IDLE "print window" function it will print with keywords in color?

Mike Samuel

unread,
Apr 19, 2017, 4:57:48 PM4/19/17
to js-code-prettifier, glenn...@gmail.com
On Wed, Apr 19, 2017 at 12:27 PM, GMRsr <glenn...@gmail.com> wrote:
> Jack: The link to the example is helpful but I have one question: The HTML
> text that you show, where is it written? Can you write this in MS Word and
> save the file as HTML and then if you print that HTML file it will show the

If you have an IDE like IDLE, I would write it in that instead of in MS Word.
Once you've got the code formatted properly in vanilla HTML you can
add the run_prettify script the way Jack had it.

> key words formatted in color? I am trying to print Python scripts in color
> and I have found a clunky way to do it that takes several steps. It appears
> that the <pre Class = "prettyprint linenums"> Script Text </pre> might be a

<xmp class="prettyprint lang-py linenums">
# My python code
</xmp>

should work for Python.

> cleaner way to make paper printouts for my Python scripts. Can what you
> posted simply be placed into an editor like IDLE (if you are familiar with
> IDLE which is simply an IDE) and when you use the IDLE "print window"
> function it will print with keywords in color?

Prettify's default style tend to use emphasis and italics when printing
https://github.com/google/code-prettify/blob/master/src/prettify.css#L40-L50
so that the output still works in greyscale, but it does not strip out colors.

If you're having problems with colors when printing using a particular
skin, feel free to file a bug, and see if the default styles work for
you.

Mike Samuel

unread,
Apr 19, 2017, 11:10:04 PM4/19/17
to Glenn M Russo, js-code-prettifier


On Wed, Apr 19, 2017 at 7:10 PM, Glenn M Russo <glenn...@gmail.com> wrote:
So are you saying that in IDLE I can paste the script from the example in Plunker:

I'm making claims about neither IDLE nor Plunker as I've used neither.

If those are incrementally building HTML documents you'd have to understand the details of how that works and when the document ready event is fired to know what prettify sees.

Amro

unread,
Apr 20, 2017, 10:13:06 AM4/20/17
to js-code-p...@googlegroups.com
@GMRsr:

For code-prettify this involves creating an HTML file, placing your
python script inside a PRE/XMP tag (with appropriate html encoding),
adding the prettify JS/CSS in the head, opening the page and printing
from your web browser.

But if your goal is to just print it on paper, why not just use the
"print" functionality of whatever IDE you're using. If IDLE doesn't do
syntax highlighting, plenty of other editors support that out of the
box (Notepad++ and Vim to name a few).
> --
> You received this message because you are subscribed to the Google Groups
> "js-code-prettifier" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to js-code-prettif...@googlegroups.com.
> To post to this group, send email to js-code-p...@googlegroups.com.

Glenn M Russo

unread,
Apr 20, 2017, 11:16:17 AM4/20/17
to mikes...@gmail.com, js-code-prettifier
So are you saying that in IDLE I can paste the script from the example in Plunker:

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    
    <pre class="prettyprint linenums">
    <code class="language-json">
        {
          "address": {
            "streetAddress": "21 2nd Street",
            "city": "New York"
          },
          "phoneNumber": [
            {
              "location": "home",
              "code": 44
            }
          ]
        }
    </code>
</pre>

  </body>

</html>

And paste the Python script into the blue highlighted area and then "save" and "run" in the IDLE file to get an output in IDLE interactive that can then be printed?  I think that I am missing a leap of knowledge, forgive me for being slow on the uptake.  I opened IDLE and opened a new file.  I pasted the script above and substituted inside the highlighted area with some initial portion of a Python script to test the color retention. But when I 'saved' and then hit 'run' the IDLE file gave me a error when it saw the <!DOCTYPE html> tag in line one.  I never got to see if there could be an output from 'Run' that would be printable.  As I said, I know am missing something that is being assumed that I know - I am a bit new at this.  [you can see what I placed into the IDLE file (not IDLE interactive - when I placed it into IDLE interactive and did a 'print window' I sent it to the default .pdf printer and got a black and white output) ].  Below is what I pasted into the IDLE file and the interactive.  

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    
    <pre class="prettyprint linenums">
    <code class="language-json">
        {
          import matplotlib
            matplotlib.use("TkAgg")
            from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg, NavigationToolbar2TkAgg
            #from matplotlib.figure import Figure
            import matplotlib.animation as animation
            from matplotlib import style
            from matplotlib import pyplot as plt

            }
          ]
        }
    </code>
</pre>

  </body>

</html>

Regards,

Glenn M Russo

Glenn M Russo
Avatar Financial Consultants

Business Development M&A and Structured Debt Financing

 

 

 

 

 

 

 

Mobile: 609-685-9641
Email: 
glenn...@gmail.com
http://www.linkedin.com/in/glennmrusso

 

 
 

Glenn M Russo

unread,
Apr 20, 2017, 11:16:18 AM4/20/17
to js-code-p...@googlegroups.com
Thanks.  That is very helpful.  I just use IDLE bc it comes with  Python - not attached to it.  I'll try notepad++.

/gmr

> email to js-code-prettifier+unsub...@googlegroups.com.
> To post to this group, send email to js-code-prettifier@googlegroups.com.
--
You received this message because you are subscribed to a topic in the Google Groups "js-code-prettifier" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/js-code-prettifier/fFgsmqXMgqw/unsubscribe.
To unsubscribe from this group and all its topics, send an email to js-code-prettifier+unsub...@googlegroups.com.
To post to this group, send email to js-code-prettifier@googlegroups.com.

Mike Samuel

unread,
Apr 20, 2017, 11:28:40 AM4/20/17
to js-code-prettifier
On Thu, Apr 20, 2017 at 10:12 AM, Amro <amroam...@gmail.com> wrote:
> @GMRsr:
>
> For code-prettify this involves creating an HTML file, placing your
> python script inside a PRE/XMP tag (with appropriate html encoding),
> adding the prettify JS/CSS in the head, opening the page and printing
> from your web browser.
>
> But if your goal is to just print it on paper, why not just use the
> "print" functionality of whatever IDE you're using. If IDLE doesn't do
> syntax highlighting, plenty of other editors support that out of the
> box (Notepad++ and Vim to name a few).

enscript -E ( http://www.unix.com/man-page/redhat/1/enscript/ )
predates the internet, but I find it's still the best thing on those
rare occasions when I need to print out a bunch of source code, tape
it all over the walls, and use it to bleed a red marker dry.

Amro

unread,
Apr 20, 2017, 12:26:15 PM4/20/17
to js-code-p...@googlegroups.com
You seem to be misunderstanding what code-prettify does..
It is a syntax highlighter that runs **in the browser**, written in JavaScript.
It takes plain source code text and applies syntax highlighting inplace.
After that if you'd like to print the result to paper, you simply send the page to a printer right from the browser (usually Ctrl-P shortcut).

The source code can be included in the current HTML page (inside a PRE tag), in which case you call PR.prettyPrint() to process all PRE tags marked with "class=prettyprint". There's a second API you can call PR.prettyPrintOne() which directly takes the source code to process instead of extracting it from the page's DOM, useful for cases where snippets of code are dynamically added.

You can't use IDLE to run code-prettify, you must open the web page in a browser..


Amro

unread,
Apr 20, 2017, 12:44:56 PM4/20/17
to js-code-p...@googlegroups.com
On Thu, Apr 20, 2017 at 6:28 PM, Mike Samuel <mikes...@gmail.com> wrote:
> enscript -E ( http://www.unix.com/man-page/redhat/1/enscript/ )
> predates the internet, but I find it's still the best thing on those
> rare occasions when I need to print out a bunch of source code, tape
> it all over the walls, and use it to bleed a red marker dry.

nice, never knew this existed.

Since the OP is familiar with Python, they can also use the "pygments"
package. It can export source codes to HTML/RTF/LaTeX (even ASCII
sequences for shell output), both programmatic use or executable from
the command line: http://pygments.org/docs/cmdline/

Glenn M Russo

unread,
Apr 20, 2017, 2:11:10 PM4/20/17
to js-code-p...@googlegroups.com

I did misunderstand.  Thanks.  I get it now.  I also learned that if I use notepad++ that it prints syntax in color directly.  So I'm going to switch editors.
Thanks again.

/gmr

To unsubscribe from this group and stop receiving emails from it, send an email to js-code-prettifier+unsubscribe@googlegroups.com.

To post to this group, send email to js-code-prettifier@googlegroups.com.
Visit this group at https://groups.google.com/group/js-code-prettifier.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to a topic in the Google Groups "js-code-prettifier" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/js-code-prettifier/fFgsmqXMgqw/unsubscribe.
To unsubscribe from this group and all its topics, send an email to js-code-prettifier+unsub...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages