GMDEditor.py

GMDEditor.py

# coding: utf-8
#-----------------------------
# Copyright (c) <Ilya Shoshin>
# <2014>
#-----------------------------
import ui
from markdown2 import markdown

#-----------------------------
# consts
#-----------------------------
kSTATUS_BAR_Y_OFFSET = 20
kBUTTON_HEIGHT = 44
#-----------------------------
# setup view and view controllers
#-----------------------------
screen_size = ui.get_screen_size();				# get screen size 
main_view = ui.View()											# main view
# setup labels
lbl_title = ui.Label(name='md_lbl_title')
lbl_title.background_color = '#DBE0FF'
lbl_title.text = "GMDEditor"
lbl_title.alignment = ui.ALIGN_CENTER
main_view.add_subview(lbl_title)
lbl_editor = ui.Label(name='md_lbl_')
lbl_editor.background_color = '#DBE0FF'
lbl_editor.text = "Editor"
lbl_editor.alignment = ui.ALIGN_CENTER
main_view.add_subview(lbl_editor)
lbl_preview = ui.Label(name='md_lbl_preview')
lbl_preview.background_color = '#DBE0FF'
lbl_preview.text = "Preview"
lbl_preview.alignment = ui.ALIGN_CENTER
main_view.add_subview(lbl_preview)
# setup editor text view
md_editor = ui.TextView(name='md_editor')	# editor textview
# textview delegate
class MDEditorDelegate (object):
	def textview_did_change(self, textview):
		preview()
delegate = MDEditorDelegate()
md_editor.delegate = delegate
md_editor.font = ('Verdana', 17)
main_view.add_subview(md_editor)
# setup priview web view
md_viewer = ui.WebView(name='md_viewer')  # preview webview
md_viewer.scales_page_to_fit = False
md_viewer.background_color = 'white'
main_view.add_subview(md_viewer)
# setup buttons
btn_opts = {
              'H1':{'title': 'H1', 'value': '#', 'image':''},
              'H2':{'title': 'H2','value': '##', 'image':''},
              'H3':{'title': 'H3','value': '###', 'image':''},
              'link':{'title': 'link','value': '[]()', 'image':''},
              'quote':{'title': '"','value': '>', 'image':''},
              'code':{'title': '','value': '    ', 'image':'ionicons-code-32'}
              }
# action button handler
class ActionButtonHandler (object):
	def button_tapped(self, sender):
		name = str(sender.name)
		pos = md_editor.selected_range[0]
		md_editor.replace_range((pos, pos), btn_opts[name]['value'])
handler = ActionButtonHandler()

def setup_buttons(y, w, h, space, container, action):
	offset = space
	for i, name in enumerate(sorted(btn_opts.keys())):
		button = ui.Button(name=name)
		button.frame = (space, y, w, h)
		button.title = btn_opts[name]['title']
		button.border_width = 1
		space += w + offset
		name = btn_opts[name]['image']
		if not name == '':
			button.image = ui.Image.named(name)
		button.action = action
		container.add_subview(button)
		
# setup layout
if screen_size[1] >= 768:
	# iPad
	main_view.frame 	= (0, 0, screen_size[1], screen_size[0]) 
	#label
	lbl_title.frame = (0, kSTATUS_BAR_Y_OFFSET, screen_size[1], 25)
	# buttons
	y = lbl_title.frame[1] + lbl_title.frame[3]
	setup_buttons(y, 82, kBUTTON_HEIGHT, 1, main_view, handler.button_tapped)
	# labels
	y += kBUTTON_HEIGHT
	lbl_editor.frame  = (0, y, screen_size[1] / 2, 25)
	lbl_preview.frame = (screen_size[1] / 2, y, screen_size[1] / 2, 25)
	# editor & viewer
	y = lbl_editor.frame[1] + lbl_editor.frame[3]
	md_editor.frame = (0, y, screen_size[1] / 2, screen_size[0]-y) 
	md_viewer.frame = (md_editor.frame[2], y, screen_size[1] / 2, screen_size[0]-y)
	main_view.present(style='full_screen', orientations=['landscape'], hide_title_bar=True)
else:
	# iPhone
	# ToDo
	main_view.present(orientations=['portrait'], hide_title_bar=True)
	
#-----------------------------
# md functions
#-----------------------------

def preview():
	html = markdown(md_editor.text, extras=['smarty-pants'])
	md_viewer.load_html(html)