From 2b6034b5c144966c9396e8e42141c982389cb652 Mon Sep 17 00:00:00 2001
From: Igor Shymko <i.shymko@thenewmotion.com>
Date: Mon, 15 Sep 2014 22:21:44 +0300
Subject: [PATCH] dynamic css loading

---
 markdown-preview-mode.el | 16 ++++++++++++++--
 preview.html             |  9 ++++++++-
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/markdown-preview-mode.el b/markdown-preview-mode.el
index 0a6809e..21002bc 100644
--- a/markdown-preview-mode.el
+++ b/markdown-preview-mode.el
@@ -37,6 +37,7 @@
 (defvar mdpm:local-client nil)
 (defvar mdpm:remote-clients nil)
 (defvar mdpm:preview-url (concat (file-name-directory load-file-name) "preview.html"))
+(defvar mdpm:style "http://thomasf.github.io/solarized-css/solarized-dark.min.css")
 
 (defun mdpm:open-browser-preview ()
   (browse-url mdpm:preview-url))
@@ -85,9 +86,20 @@
   (mdpm:sent-preview-to mdpm:local-client))
 
 (defun mdpm:sent-preview-to (websocket)
-  (markdown markdown-output-buffer-name)
+  (when markdown-preview-mode
+    (markdown markdown-output-buffer-name))
   (with-current-buffer (get-buffer markdown-output-buffer-name)
-    (websocket-send-text websocket (buffer-substring-no-properties (point-min) (point-max)))))
+    (websocket-send-text websocket
+                         (concat
+                          "<div>"
+                          "<span id='style'>"
+                          mdpm:style
+                          "</span>"
+                          "<div id='content'>"
+                          (buffer-substring-no-properties (point-min) (point-max))
+                          "</div>"
+                          "</div>")
+                         )))
 
 (defun mdpm:start ()
   (mdpm:start-websocket-server)
diff --git a/preview.html b/preview.html
index f7f26f3..b2af54b 100644
--- a/preview.html
+++ b/preview.html
@@ -21,11 +21,18 @@
              console.log('Code: ' + event.code + ' reason: ' + event.reason);
          };
          socket.onmessage = function(event) {
-             $("#markdown-body").html(event.data);
+             loadCSS($(event.data).find("#style").text());
+             $("#markdown-body").html($(event.data).find("#content").html());
          };
          socket.onerror = function(error) {
              alert("Error: " + error.message);
          };
+
+         loadCSS = function(href) {
+             var cssLink = $("<link rel='stylesheet' type='text/css' href='"+href+"'>");
+             $("link[type='text/css']").remove();
+             $("head").append(cssLink);
+         };
      })(jQuery);
     </script>
   </head>