MarkdownView

MarkdownView is a Pythonista UI library component. It is a drop-in replacement for ui.TextView that supports both editing markdown tagged text and viewing it as HTML.

Features

• Integrated markdown editing and HTML viewing modes - end editing and HTML is shown, click somewhere on the HTML text and markdown editing starts in the same position.
• Markdown editing supported by additional keys. (Thanks JonB for help on Obj-C.)
• Implements ui.TextView API for easy integration to existing code.
• Customizable through attributes or CSS.

Quick start

Download (from Github) both the MarkdownView.py script and this readme.md file into same directory, and you can run the script in Pythonista to view and try out editing this readme file.

Import MarkdownView as a module and use wherever you would use a TextView. Markdown text can be set and accessed with the text attribute. Implement a delegate with textview_did_end_editing or textview_did_change method to handle saving the contents - see the end of the MarkdownView.py file for an example.

@mikael , first thanks for sharing. Whilst, I am not sure I am taking the right approach here, I remembered this post and thought this would provide a solution.

I want to use the MarkDownView to display .py files. Basically after searching for text in files, display the results in a ui.TableView, then clicking the file will show the code. I did this using a ui.TextView
My idea was then to go though the text and use MarkDown to bring attention to the found items in the file.
I don't want to edit the file, only mark it down, and display it. Later possibly use the links.

So have it downloaded. All is fine. I don't know markdown, of course using here in the forum a little sometimes as well as I read the docs on the site.

I realise this is a long spiel to just ask the following
Do you have any hints for processing the script once read in to get the best readability (so the script is handled correctly by markdown)

I have put 3 back ticks followed by python at the beginning and text and at end with another 3 back ticks.
I have replaced triple single quotes with triple double quotes.

For the code below

from faker import Faker
fake = Faker()

# first, import a similar Provider or use the default one
from faker.providers import BaseProvider

# create new provider class
class MyProvider(BaseProvider):
    def foo(self):
        return 'bar'

    def orange(self):
        return [fake.first_name(), fake.first_name()]

# then add new provider to faker instance
fake.add_provider(MyProvider)

# now you can use:
print fake.foo()
print fake.orange()

I get the following

It's better on larger files, but included this because it's small

By ideas would be great

Do I understand your use case correctly:

You want to show the code, but with comments - written in markdown - formatted as HTML?

@mikael , I just want to show the code with comments as closely as possible as it would be shown in the editor.
That's step one.
Once I get that far, I would go through the text to hilite the phrases in that were searched for.
I have done nothing about trying to emphasize the text at this point.
I am reading from the .py file
Make those few adjustments to the text listed above .text value

@Phuket2
Not sure, but I think the three backtick thing is a github markdown flavor, not standard markdown.
You might try prepending 4 spaces to each line. Also, vanilla markdown does not do syntax highligting..

@JonB @Phuket2 Yes, three backticks is only a feature of github-flavored markdown (I think they call them "fenced code blocks" in the documentation). Three backticks won't work on sites like stack overflow. All the features that are part of GFM but not part of vanilla markdown can be found in GitHub's "Mastering Markdown" guide.

i think you might be better off with pygments, rather than markdown

Ok, thanks for the info guys. I will have a look at pygments. I am not trying to do anything fancy. Just to present of a list of .py files that has a phrase, then if you click the row shows you the script I another view.
The TextView works well. It's just as far as a I can see you have no possibility to hilite any text.

If the ui.TextView.selected_range() could be set without being in edit mode, that would have been perfect. We go to heaven if it could take a list of 2-tuples So multiple ranges could be selected at once.
Just saying @omz 😬😱

But even, being able to use the selected_range with a single tuple, would still be pretty nice. A added bonus would be able to control the selection/hilite color

another option would be to add a blank ui.View on top of your ui.TextView, with a background color set that has a low alpha. That is how I am adding line highlighting to my in pythonista debugger.

This requires some objc to get at the underlying textstorage. The code below is for the built in editor, but should work similar to a textview, except there is no gutterWidth. The yellow box is simply a custom View() with alpha 0.2.

@JonB , thanks. The blank ui looks a bit too complicated for me. I have Pygments working in a ui.webview now. Well, with no color. Not sure what I am doing wrong. Been basically copying the examples from the site. It's ok, it seems straight forward enough. I think very nice to know this lib also. I see I can also pass hl_lines to the formatter also. They are also not working yet. It will be something stupid I have done. Something is working because linenos work.
Anyway, this seems to be a good option given I don't need editing.

you might need the full=True for you formatter, otherwise you will,need to also load a css file.

@JonB , thanks. It's was the full = True. Presto, all working. Including the line numbers and line hilighting. It's a very power lib for doing this sort of thing. Thanks for all your help.
I am just using 'colourful' style, passed a range to hilte rows 18-23. Will pay around with more of the API.

@mikael , sorry long conversation on your share code. It went in a direction I didn't expect. But given I don't need editing this is great. The only bummer is that pygments is not a standard install for Pythonista

pygments is included in pythonista.

anyway, mikael MarkDownView is pretty neat. I really liked the use of the input accessory.

@JonB , well that makes sense. I hate making statements here. More wrong than right. I was sure I had checked for it, but maybe used a wrong case or something. But good to know it's included. I installed or reinstalled it using stash anyway 😱

@JonB , trying to create a small helper around pygments. Don't think it will be that useful to people, but will still share it when I am finished.
I know this sort of stuff you would just write inline, meaning you don't even have to think about it. But a lot of us, not there 😳

Anyway here is the gist

@Phuket2: no worries, you kept the thread visible for a while, and looks like some more people found the MarkdownView because of it.

@JonB: Thanks! I have been refactoring this a bit for a specific purpose, essentially splitting into two separate components, TextView for editing markdown and a WebView that can be touched and you get the corresponding caret position in the markdown text.

Plus I changed the implementation to be proxy-wrapped to get rid of manual relaying of properties and methods.

Plus used a swipe down gesture to hide the keyboard instead of a "Done" button (to get more room on the iPhone - plus, feels nice).

Let me know if these are of specific interest, and I will take the time to polish & document & publish.

But @JonB, where's pygments? Does it have some different name on Pythonista?

I do like the proxy wrapper - your previous post certainly opened my eyes on this subject, and will inform my own custom components in the future.

pygments should be in the standard library /site packages. import pygments should just work... at least in the beta version.

@JonB, no, no pygments here, and I think Sir Phuket did not find it either. Maybe we should put it on the wishlist.

@mikael Hmm, are you sure? pygments should be included, and I'm fairly certain that was already the case in version 1.5 (or even 1.4).

Pygments v1.6 has been in Pythonista for more than an year and is still in the current release and the current beta on 4 different iOS devices here.

https://github.com/cclauss/pythonista-module-versions/blob/master/pythonista_module_versions.py Click the History button and look at comments in the oldest version from 04 Jan 2015.

@omz and all: My mistake. I could not find any documentation and the code completion did not offer up "pygments" - but if I just import it and run the script, it works - so it must be there somewhere. :-)

Regards,
The boy who cried wolf