Merge pull request #136 from agusmakmun/theming

support bootstrap theme

README.rst

@@ -11,7 +11,7 @@ martor |pypi version|
 .. image:: https://img.shields.io/pypi/pyversions/martor.svg
    :target: https://pypi.python.org/pypi/martor
 
-.. image:: https://img.shields.io/badge/Django-1.8%20%3E=%203.0-green.svg
+.. image:: https://img.shields.io/badge/Django-1.8%20%3E=%203.1-green.svg
   :target: https://www.djangoproject.com
 
 .. image:: https://travis-ci.org/agusmakmun/django-markdown-editor.svg?branch=master
@@ -25,8 +25,8 @@ Features
 
 * Live Preview
 * Integrated with `Ace Editor`_
-* Integrated with `Semantic-UI`_
-* Supports Multiple Fields (`fixed this issue`_)
+* Supported with `Bootstrap`_ and `Semantic-UI`_
+* Supported Multiple Fields (`fixed this issue`_)
 * Upload Images to imgur.com `(via API)` and `custom uploader`_.
 * Direct Mention users ``@[username]`` - `(requires user to logged in)`
 * Supports embed/iframe video from (Youtube, Vimeo, Dailymotion, Yahoo, Veoh, & Metacafe)
@@ -41,9 +41,9 @@ Features
 Preview
 ------------------------------
 
-.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/martor-preview-editor.png
+.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/bootstrap/martor-editor.png
 
-.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/martor-preview-result.png
+.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/bootstrap/martor-preview.png
 
 
 Requirements
@@ -110,6 +110,9 @@ to get ``IMGUR_CLIENT_ID`` and ``IMGUR_API_KEY``.
 
 ::
 
+    # Choices are: "semantic-ui", "bootstrap"
+    MARTOR_THEME = 'bootstrap'
+
     # Global martor settings
     # Input: string boolean, `true/false`
     MARTOR_ENABLE_CONFIGS = {
@@ -171,9 +174,9 @@ to get ``IMGUR_CLIENT_ID`` and ``IMGUR_API_KEY``.
 
     # If you need to use your own themed semantic ui dependency
     # replace the values with the file in your static files dir
-    MARTOR_ALTERNATIVE_SEMANTIC_JS_FILE = "semantic-themed/semantic.min.js"
-    MARTOR_ALTERNATIVE_SEMANTIC_CSS_FILE = "semantic-themed/semantic.min.css"
-    MARTOR_ALTERNATIVE_JQUERY_JS_FILE = "jquery/dist/jquery.js"
+    MARTOR_ALTERNATIVE_JS_FILE_THEME = "semantic-themed/semantic.min.js"   # default None
+    MARTOR_ALTERNATIVE_CSS_FILE_THEME = "semantic-themed/semantic.min.css" # default None
+    MARTOR_ALTERNATIVE_JQUERY_JS_FILE = "jquery/dist/jquery.js"            # default None
 
 Check this setting is not set else csrf will not be sent over ajax calls:
 
@@ -265,7 +268,7 @@ Checkout at http://127.0.0.1:8000/simple-form/ on your browser.
 Martor Commands Reference
 --------------------------------
 
-.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/martor-guide.png
+.. image:: https://raw.githubusercontent.com/agusmakmun/django-markdown-editor/master/.etc/images/bootstrap/martor-guide.png
 
 
 Notes
@@ -275,7 +278,8 @@ Notes
 
 
 .. _Ace Editor: https://ace.c9.io
-.. _Semantic-UI: http://semantic-ui.com
+.. _Bootstrap: https://getbootstrap.com
+.. _Semantic-UI: https://semantic-ui.com
 .. _PyPI: https://pypi.python.org/pypi/martor
 .. _django-markdownx: https://github.com/adi-/django-markdownx
 .. _Python Markdown: https://github.com/waylan/Python-Markdown

martor/__init__.py

@@ -1,5 +1,5 @@
 # -*- coding: utf-8 -*-
 
-__VERSION__ = '1.5.1'
+__VERSION__ = '1.5.2'
 __AUTHOR__ = 'Agus Makmun (Summon Agus)'
 __AUTHOR_EMAIL__ = 'summon.agus@gmail.com'

martor/admin.py

@@ -1,3 +1,6 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
 from django.contrib import admin
 from django.db import models
 

martor/api.py

@@ -1,3 +1,6 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
 import json
 import base64
 import requests
@@ -10,15 +13,12 @@ def imgur_uploader(image):
     """
     Basic imgur uploader return as json data.
     :param `image` is from `request.FILES['markdown-image-upload']`
-
-    Return:
-        success: {'status': 200, 'link': <link_image>, 'name': <image_name>}
-        error  : {'status': <error_code>, 'erorr': <erorr_message>}
+    :return json response
     """
-    url_api = 'https://api.imgur.com/3/upload.json'
+    api_url = 'https://api.imgur.com/3/upload.json'
     headers = {'Authorization': 'Client-ID ' + MARTOR_IMGUR_CLIENT_ID}
     response = requests.post(
-        url_api,
+        api_url,
         headers=headers,
         data={
             'key': MARTOR_IMGUR_API_KEY,
@@ -28,26 +28,21 @@ def imgur_uploader(image):
         }
     )
 
-    """
-    Some function we got from `response`:
-
-    ['connection', 'content', 'cookies', 'elapsed', 'encoding', 'headers','history',
-    'is_permanent_redirect', 'is_redirect', 'iter_content', 'iter_lines', 'json',
-    'links', 'ok', 'raise_for_status', 'raw', 'reason', 'request', 'status_code', 'text', 'url']
-    """
     if response.status_code == 200:
-        respdata = json.loads(response.content.decode('utf-8'))
+        response_data = json.loads(response.content.decode('utf-8'))
         return json.dumps({
-            'status': respdata['status'],
-            'link': respdata['data']['link'],
-            'name': respdata['data']['name']
+            'status': response_data['status'],
+            'link': response_data['data']['link'],
+            'name': response_data['data']['name']
         })
+
     elif response.status_code == 415:
         # Unsupport File type
         return json.dumps({
             'status': response.status_code,
             'error': response.reason
         })
+
     return json.dumps({
         'status': response.status_code,
         'error': response.content.decode('utf-8')

martor/extensions/emoji.py

@@ -1,12 +1,6 @@
 import markdown
 
-try:
-    from django.contrib.staticfiles.templatetags.staticfiles import static
-except ModuleNotFoundError:
-    from django.templatetags.static import static
-
-from ..settings import (MARTOR_MARKDOWN_BASE_EMOJI_URL,
-                        MARTOR_MARKDOWN_BASE_EMOJI_USE_STATIC)
+from ..settings import MARTOR_MARKDOWN_BASE_EMOJI_URL
 
 """
 >>> import markdown
@@ -102,11 +96,8 @@ def handleMatch(self, m):
         emoji = self.unescape(m.group(2))
         if emoji not in EMOJIS:
             return emoji
-        url = '{0}{1}.png'.format(
-            MARTOR_MARKDOWN_BASE_EMOJI_URL, emoji.replace(':', '')
-        )
-        if MARTOR_MARKDOWN_BASE_EMOJI_USE_STATIC is True:
-            url = static(url)
+
+        url = '{0}{1}.png'.format(MARTOR_MARKDOWN_BASE_EMOJI_URL, emoji.replace(':', ''))
         el = markdown.util.etree.Element('img')
         el.set('src', url)
         el.set('class', 'marked-emoji')

martor/fields.py

@@ -1,3 +1,6 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
 from django import forms
 
 from .settings import MARTOR_ENABLE_LABEL

martor/models.py

@@ -1,3 +1,6 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
 from django.db import models
 
 from .fields import MartorFormField

martor/settings.py

@@ -1,5 +1,11 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
 from django.conf import settings
 
+# Choices are: "semantic-ui", "bootstrap"
+MARTOR_THEME = getattr(settings, 'MARTOR_THEME', 'bootstrap')
+
 # Global martor settings
 # Input: string boolean, `true/false`
 MARTOR_ENABLE_CONFIGS = getattr(
@@ -11,7 +17,6 @@
         'living': 'false',      # to enable/disable live updates in preview
         'spellcheck': 'false',  # to enable/disable spellcheck in form textareas
         'hljs': 'true',         # to enable/disable hljs highlighting in preview
-        'semantic': 'true',    # to enable/disable using packaged semantic version
     }
 )
 
@@ -30,16 +35,6 @@
     settings, 'MARTOR_ENABLE_LABEL', False
 )
 
-MARTOR_ALTERNATIVE_SEMANTIC_JS_FILE = getattr(
-    settings, 'MARTOR_ALTERNATIVE_SEMANTIC_JS_FILE', None
-)
-MARTOR_ALTERNATIVE_SEMANTIC_CSS_FILE = getattr(
-    settings, 'MARTOR_ALTERNATIVE_SEMANTIC_CSS_FILE', None
-)
-MARTOR_ALTERNATIVE_JQUERY_JS_FILE = getattr(
-    settings, 'MARTOR_ALTERNATIVE_JQUERY_JS_FILE', None
-)
-
 # Imgur API Keys
 MARTOR_IMGUR_CLIENT_ID = getattr(
     settings, 'MARTOR_IMGUR_CLIENT_ID', ''
@@ -91,10 +86,18 @@
 MARTOR_MARKDOWN_BASE_EMOJI_URL = getattr(
     settings, 'MARTOR_MARKDOWN_BASE_EMOJI_URL', 'https://github.githubassets.com/images/icons/emoji/'
 )
-# to use static and keep backward compatibility
-# set to true if using bucket like storage engine
-MARTOR_MARKDOWN_BASE_EMOJI_USE_STATIC = getattr(
-    settings, 'MARTOR_MARKDOWN_BASE_EMOJI_USE_STATIC', False)
+
 MARTOR_MARKDOWN_BASE_MENTION_URL = getattr(
     settings, 'MARTOR_MARKDOWN_BASE_MENTION_URL', 'https://python.web.id/author/'
 )
+
+# Use alternative vendor theme file source
+MARTOR_ALTERNATIVE_JS_FILE_THEME = getattr(
+    settings, 'MARTOR_ALTERNATIVE_JS_FILE_THEME', None
+)
+MARTOR_ALTERNATIVE_CSS_FILE_THEME = getattr(
+    settings, 'MARTOR_ALTERNATIVE_CSS_FILE_THEME', None
+)
+MARTOR_ALTERNATIVE_JQUERY_JS_FILE = getattr(
+    settings, 'MARTOR_ALTERNATIVE_JQUERY_JS_FILE', None
+)

martor/static/martor/css/martor-admin.css

@@ -72,3 +72,10 @@ h5 {
 .ui.tabular.menu+.attached:not(.top).segment+.attached:not(.top).segment {
   width: auto;
 }
+
+fieldset .form-row>div {
+  width: 100%;
+}
+fieldset .form-row div>label {
+  display: contents!important;
+}