Add content-type header detection

background/background.js

@@ -13,6 +13,7 @@ var defaults = {
     toc: false
   },
   raw: false,
+  header: true,
   match,
   origins: {
     'file://': match
@@ -63,6 +64,10 @@ chrome.storage.sync.get((res) => {
   if (options.content.emoji === undefined) {
     options.content.emoji = false
   }
+  // v3.0 -> v3.1
+  if (options.header === undefined) {
+    options.header = true
+  }
 
   Object.keys(md).forEach((compiler) => {
     if (!options[compiler]) {
@@ -83,16 +88,40 @@ chrome.storage.sync.get((res) => {
   })
 })
 
+function inject (id) {
+  chrome.tabs.executeScript(id, {
+    code: [
+      'document.querySelector("pre").style.visibility = "hidden"',
+      'var theme = "' + state.theme + '"',
+      'var raw = ' + state.raw,
+      'var content = ' + JSON.stringify(state.content),
+      'var compiler = "' + state.compiler + '"'
+    ].join(';'), runAt: 'document_start'})
+
+  chrome.tabs.insertCSS(id, {file: 'css/content.css', runAt: 'document_start'})
+  chrome.tabs.insertCSS(id, {file: 'vendor/prism.css', runAt: 'document_start'})
+
+  chrome.tabs.executeScript(id, {file: 'vendor/mithril.min.js', runAt: 'document_start'})
+  chrome.tabs.executeScript(id, {file: 'vendor/prism.js', runAt: 'document_start'})
+  chrome.tabs.executeScript(id, {file: 'content/emoji.js', runAt: 'document_start'})
+  chrome.tabs.executeScript(id, {file: 'content/content.js', runAt: 'document_start'})
+}
+
 chrome.tabs.onUpdated.addListener((id, info, tab) => {
   if (info.status === 'loading') {
     chrome.tabs.executeScript(id, {
-      code: 'JSON.stringify({location, loaded: window.state})',
+      code: 'JSON.stringify({' +
+        'location: window.location,' +
+        'contentType: document.contentType,' +
+        'loaded: !!window.state' +
+      '})',
       runAt: 'document_start'
     }, (res) => {
       if (chrome.runtime.lastError) {
         // Origin not allowed
         return
       }
+
       try {
         var win = JSON.parse(res)
       }
@@ -101,28 +130,22 @@ chrome.tabs.onUpdated.addListener((id, info, tab) => {
         return
       }
 
-      var path =
-        state.origins[win.location.origin] ||
-        state.origins['*://' + win.location.host] ||
-        state.origins['*://*']
-
-      if (!win.loaded && new RegExp(path).test(win.location.href)) {
-        chrome.tabs.executeScript(id, {
-          code: [
-            'document.querySelector("pre").style.visibility = "hidden"',
-            'var theme = "' + state.theme + '"',
-            'var raw = ' + state.raw,
-            'var content = ' + JSON.stringify(state.content),
-            'var compiler = "' + state.compiler + '"'
-          ].join(';'), runAt: 'document_start'})
-
-        chrome.tabs.insertCSS(id, {file: 'css/content.css', runAt: 'document_start'})
-        chrome.tabs.insertCSS(id, {file: 'vendor/prism.css', runAt: 'document_start'})
-
-        chrome.tabs.executeScript(id, {file: 'vendor/mithril.min.js', runAt: 'document_start'})
-        chrome.tabs.executeScript(id, {file: 'vendor/prism.js', runAt: 'document_start'})
-        chrome.tabs.executeScript(id, {file: 'content/emoji.js', runAt: 'document_start'})
-        chrome.tabs.executeScript(id, {file: 'content/content.js', runAt: 'document_start'})
+      if (win.loaded) {
+        return
+      }
+
+      if (state.header && /text\/(?:x-)?markdown/i.test(win.contentType)) {
+        inject(id)
+      }
+      else {
+        var path =
+          state.origins[win.location.origin] ||
+          state.origins['*://' + win.location.host] ||
+          state.origins['*://*']
+
+        if (new RegExp(path).test(win.location.href)) {
+          inject(id)
+        }
       }
     })
   }
@@ -171,7 +194,10 @@ chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
     })
   }
   else if (req.message === 'origins') {
-    sendResponse({origins: state.origins})
+    sendResponse({origins: state.origins, header: state.header})
+  }
+  else if (req.message === 'header') {
+    set({header: req.header})
   }
   else if (req.message === 'add') {
     state.origins[req.origin] = match

content/options.js

@@ -4,6 +4,7 @@ var state = {
   protocols: ['https', 'http', '*'],
   origin: '',
   origins: {},
+  header: false,
   timeout: null,
   file: true
 }
@@ -21,6 +22,11 @@ var events = {
     state.origin = e.target.value
   },
 
+  header: (e) => {
+    state.header = !state.header
+    chrome.runtime.sendMessage({message: 'header', header: state.header})
+  },
+
   add: () => {
     var host = state.origin
       .replace(/^(file|http(s)?):\/\//, '')
@@ -74,6 +80,7 @@ chrome.extension.isAllowedFileSchemeAccess((isAllowedAccess) => {
 function get () {
   chrome.runtime.sendMessage({message: 'origins'}, (res) => {
     state.origins = res.origins
+    state.header = res.header
     m.redraw()
   })
 }
@@ -83,6 +90,11 @@ get()
 function oncreate (vnode) {
   componentHandler.upgradeElements(vnode.dom)
 }
+function onupdate (vnode) {
+  if (vnode.dom.classList.contains('is-checked') !== state.header) {
+    vnode.dom.classList.toggle('is-checked')
+  }
+}
 
 m.mount(document.querySelector('main'), {
   view: () =>
@@ -123,6 +135,19 @@ m.mount(document.querySelector('main'), {
       m('.mdl-cell mdl-cell--8-col-tablet mdl-cell--12-col-desktop',
         m('h4', 'Allowed Origins')
       ),
+      m('.mdl-cell mdl-cell--8-col-tablet mdl-cell--12-col-desktop',
+        m('label.mdl-switch mdl-js-switch mdl-js-ripple-effect',
+          {oncreate, onupdate,
+          title: 'Toggle header detection'},
+          m('input[type="checkbox"].mdl-switch__input', {
+            checked: state.header,
+            onchange: events.header
+          }),
+          m('span.mdl-switch__label', 'Detect ',
+            m('code', 'text/markdown'), ' and ', m('code', 'text/x-markdown'),
+            ' content type')
+        )
+      ),
       m('.mdl-cell mdl-cell--8-col-tablet mdl-cell--12-col-desktop',
         m('table.mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp',
           Object.keys(state.origins).sort().map((origin) =>