fix pre block indentation/spaces

markdown2.py

@@ -1740,7 +1740,7 @@ class Markdown(object):
                     codeblock = codeblock.replace(old, new)
                 return codeblock
             lexer = self._get_pygments_lexer(lexer_name)
-            if lexer:
+            if lexer and self.extras.get('no-code-highlighting', True) is True:
                 codeblock = unhash_code( codeblock )
                 colored = self._color_with_pygments(codeblock, lexer,
                                                     **formatter_opts)

md_in_popup.py

@@ -24,62 +24,67 @@ def mini(val, min):
 
 STYLE_FILE = os.path.join(sublime.packages_path(), 'User', 'MarkdownLivePreview.css')
 def get_style():
-    """Of course, this is temporal, there will be an option to customize the CSS"""
+    content = None
     if os.path.exists(STYLE_FILE):
         with open(STYLE_FILE) as fp:
             content = fp.read()
-            if content:
+            return content
-                return content
+    if not content:
+        content = """
+            html {
+                --light-bg: color(var(--background) blend(#999 85%))
+            }
+            body {
+                padding:10px;
+                padding-top: 0px;
+                font-family: "Open Sans", sans-serif;
+                background-color: var(--background);
+                font-size: 15px;
+            }
 
-    return """
+            blockquote {
-        html {
+                font-style: italic;
-            --light-bg: color(var(--background) blend(#aaa 80%))
+                display: block;
-        }
+                margin-left: 30px;
-        body {
+                border: 1px solid red;
-            padding:10px;
+            }
-            font-family: "Open Sans", sans-serif;
-            background-color: var(--background);
-            font-size: 15px;
-        }
 
-        blockquote {
+            code {
-            font-style: italic;
+                padding-left: 0.2rem;
-            display: block;
+                padding-right: 0.2rem;
-            margin-left: 30px;
+                background-color: var(--light-bg);
-            border: 1px solid red;
+                margin: 0;
-        }
+                border-radius: 3px;
+                margin: 5px;
+            }
 
-        code {
+            pre {
-            padding-left: 0.2rem;
+                display: block;
-            padding-right: 0.2rem;
+                margin-top: 20px;
-            background-color: var(--light-bg);
+                line-height: 1.7;
-            margin: 0;
+                background-color: var(--light-bg);
-            border-radius: 3px;
+                padding-left: 10px;
-            margin: 5px;
+                width: 100%;
-        }
+                border-radius: 3px;
-
+            }
-        pre {
+            pre code {
-            display: block;
+                padding-left: 0;
-            margin-top: 20px;
+            }
-            line-height: 2;
+        """
-            background-color: var(--light-bg);
+    return content + "pre code .space {color: var(--light-bg)}"
-            padding-left: 10px;
-        }
-        pre code {
-            padding-left: 0;
-        }
-    """
 
 def pre_with_br(html):
     """Because the phantoms of sublime text does not support <pre> blocks
     this function replaces every \n with a <br> in a <pre>"""
 
     while True:
-        obj = re.search(r'<pre>.*?</pre>', html, re.DOTALL)
+        obj = re.search(r'<pre>(.*?)</pre>', html, re.DOTALL)
         if not obj:
             break
         html = list(html)
-        html[obj.start(0):obj.end(0)] = ''.join(html[obj.start(0):obj.end(0)]).replace('\n', '<br>').replace('<pre>', '<pre class="pre">')
+        html[obj.start(0):obj.end(0)] = '<pre >' + ''.join(html[obj.start(1):obj.end(1)]) \
+                                            .replace('\n', '<br>') \
+                                            .replace(' ', '&nbsp;') + '</pre>'
         html = ''.join(html)
     return html
 
@@ -108,18 +113,32 @@ def create_preview(window, md_view):
 def show_html(md_view, preview):
     html = ('<style>{}</style>'.format(get_style()) +
             pre_with_br(markdown2.markdown(get_view_content(md_view),
-                        extras=['fenced-code-blocks'])))
+                        extras=['fenced-code-blocks', 'no-code-highlighting'])))
+
+    # the option no-code-highlighting does not exists
+    # in the official version of markdown2 for now
+    # I personaly edited the file (markdown2.py:1743)
+
+    html = html.replace('&nbsp;', '&nbspespace;') # save where are the spaces
+
     html = HTMLParser().unescape(html)
+
+    # exception, again, because <pre> aren't supported by the phantoms
+    html = html.replace('&nbspespace;', '<i class="space">.</i>')
+    print(html)
     preview.erase_phantoms('markdown_preview')
     preview.add_phantom('markdown_preview',
-                         sublime.Region(0),
+                         sublime.Region(-1),
                          html,
-                         sublime.LAYOUT_INLINE,
+                         sublime.LAYOUT_BLOCK,
                          lambda href: sublime.run_command('open_url', {'url': href}))
     # 0 < y < 1
     y = md_view.text_to_layout(md_view.sel()[0].begin())[1] / md_view.layout_extent()[1]
+    vector = [0, y * preview.layout_extent()[1]]
     # remove half of the viewport_extent.y to center it on the screen (verticaly)
-    vector = 0, y * preview.layout_extent()[1] - preview.viewport_extent()[1] / 2
+    vector[1] -= preview.viewport_extent()[1] / 2
+    vector[1] = mini(vector[1], 0)
+    vector[1] += preview.line_height()
     preview.set_viewport_position(vector, animate=False)
 
 def get_view_content(view):
@@ -180,3 +199,12 @@ class MarkdownInPopupCommand(sublime_plugin.EventListener):
                     md_view_settings.erase('markdown_preview_enabled')
                     md_view_settings.erase('markdown_preview_id')
                 sublime.set_timeout_async(callback, 250)
+
+class MarkdownInPopupTestCommand(sublime_plugin.ApplicationCommand):
+
+    def run(self):
+        md(markdown2.markdown("""
+```python
+print("hello world")
+```
+""", extras=['no-code-highlighting', 'fenced-code-blocks']))

sample.md

@@ -26,15 +26,18 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 
 > Code tells you how, comments tells you why
 
-    print('hello world')
+	print('hello world')
-    print('hi')
+	print('hi')
 
 ```python
 print('This is some pretty')
 print('cool stuff')
+if test:
+	print('hello world')
+	
 ```
 
-This is some `code` ccc
+This is some `code` 
 
 - a
 - list

todo.md

@@ -2,20 +2,8 @@
 
 - add message in status bar 
 - add **custom css** feature @done
-- sync scroll @done @improve: scroll preview to center when possible
+- sync scroll @done
 - regive focus to the right markdown view @done
 - set the title of the preview @done
 - disable previewing when the preview is closed @done
 - check when setting is activated and create panel and stuff @done
-
-This is pretty cool
-
-```ruby
-print('hello world')
-def test():
-    puts 'hello'
-    if test:
-        print('hi')
-```
-
-this is some `code`!