app/assets/javascripts/textile-editor.js.coffee in redcloth-rails-0.1.0 vs app/assets/javascripts/textile-editor.js.coffee in redcloth-rails-0.1.1
- old
+ new
@@ -20,11 +20,11 @@
# - select text to add and remove tags, selection stays highlighted
# - seamlessly change between tags and modifiers
# - doesn't need to be in the body onload tag
# - can supply your own, custom IDs for the editor to be drawn around
#
-#todo:
+# TODO:
# - a clean way of providing image and link inserts
# - get the selection to properly show in IE
#
#more on textile:
# - Textism, http://www.textism.com/tools/textile/index.php
@@ -41,20 +41,19 @@
@access = access # set to -1 if tag does not need to be closed
@title = title # sets the title attribute of the button to give 'tool tips'
@sve = sve # sve = simple vs. extended. add an 's' to make it show up in the simple toolbar
@open = open # set to -1 if tag does not need to be closed
@standard = true # this is a standard button
- # this.framework = 'prototype'; // the JS framework used
window.TextileEditorButton = TextileEditorButton
class TextileEditorButtonSeparator
constructor: (sve) ->
@separator = true
- @sve = sve
+ @sve = sve
window.TextileEditorButtonSeparator = TextileEditorButtonSeparator
class TextileEditor
@@ -66,24 +65,23 @@
@getButtons: () ->
TextileEditor.buttons || new Array()
constructor: (canvas, view) ->
-
- toolbar = document.createElement("div")
- toolbar.id = "textile-toolbar-" + canvas
+ toolbar = document.createElement("div")
+ toolbar.id = "textile-toolbar-" + canvas
toolbar.className = "textile-toolbar"
+
@canvas = document.getElementById(canvas)
- @canvas.parentNode.insertBefore toolbar, @canvas
+ @canvas.parentNode.insertBefore(toolbar, @canvas)
@openTags = new Array()
# Create the local Button array by assigning theButtons array to edButtons
- edButtons = new Array()
- edButtons = TextileEditor.getButtons()
+ edButtons = TextileEditor.getButtons()
standardButtons = new Array()
- i = 0
+ i = 0
while i < edButtons.length
thisButton = @prepareButton(edButtons[i])
if view is "s"
if edButtons[i].sve is "s"
toolbar.appendChild thisButton
@@ -93,94 +91,91 @@
toolbar.innerHTML += thisButton
else
toolbar.appendChild thisButton
standardButtons.push thisButton
i++
- # end for
+
te = this
buttons = toolbar.getElementsByTagName("button")
- i = 0
+ i = 0
while i < buttons.length
-
- #$A(toolbar.getElementsByTagName('button')).each(function(button) {
unless buttons[i].onclick
buttons[i].onclick = ->
te.insertTag this
- false
- # end if
- buttons[i].tagStart = buttons[i].getAttribute("tagStart")
- buttons[i].tagEnd = buttons[i].getAttribute("tagEnd")
- buttons[i].open = buttons[i].getAttribute("open")
+ return false
+
+ buttons[i].tagStart = buttons[i].getAttribute("tagStart")
+ buttons[i].tagEnd = buttons[i].getAttribute("tagEnd")
+ buttons[i].open = buttons[i].getAttribute("open")
buttons[i].textile_editor = te
- buttons[i].canvas = te.canvas
+ buttons[i].canvas = te.canvas
i++
# draw individual buttons (edShowButton)
prepareButton: (button) ->
if button.separator
- theButton = document.createElement("span")
+ theButton = document.createElement("span")
theButton.className = "ed_sep"
return theButton
+
if button.standard
- theButton = document.createElement("button")
+ theButton = document.createElement("button")
theButton.id = button.id
- theButton.setAttribute "class", "standard"
- theButton.setAttribute "tagStart", button.tagStart
- theButton.setAttribute "tagEnd", button.tagEnd
- theButton.setAttribute "open", button.open
- img = document.createElement("img")
+ theButton.setAttribute("class", "standard")
+ theButton.setAttribute("tagStart", button.tagStart)
+ theButton.setAttribute("tagEnd", button.tagEnd)
+ theButton.setAttribute("open", button.open)
+
+ img = document.createElement("img")
img.src = button.display
- theButton.appendChild img
+ theButton.appendChild(img)
else
return button
- # end if !custom
+
theButton.accessKey = button.access
- theButton.title = button.title
- theButton
+ theButton.title = button.title
+ return theButton
# if clicked, no selected text, tag not open highlight button
# (edAddTag)
addTag: (button) ->
unless button.tagEnd is ""
@openTags[@openTags.length] = button
-
- #var el = document.getElementById(button.id);
- #el.className = 'selected';
button.className = "selected"
+ return button
+
# if clicked, no selected text, tag open lowlight button
# (edRemoveTag)
removeTag: (button) ->
i = 0
while i < @openTags.length
if @openTags[i] is button
- @openTags.splice button, 1
+ @openTags.splice(button, 1)
#var el = document.getElementById(button.id);
#el.className = 'unselected';
button.className = "unselected"
i++
+ return undefined
+
# see if there are open tags. for the remove tag bit...
# (edCheckOpenTags)
checkOpenTags: (button) ->
tag = 0
i = 0
while i < @openTags.length
tag++ if @openTags[i] is button
i++
- if tag > 0
- true # tag found
- else
- false # tag not found
+ return (tag > 0) # tag found / not found
+
# insert the tag. this is the bulk of the code.
# (edInsertTag)
insertTag: (button, tagStart, tagEnd) ->
-
- #console.log(button);
myField = button.canvas
myField.focus()
if tagStart
button.tagStart = tagStart
button.tagEnd = (if tagEnd then tagEnd else "\n")
@@ -202,12 +197,11 @@
# set-up newline regex's so we can swap tags across multiple paragraphs
newlineReplaceRegexClean = /\r\n\s\n/g
newlineReplaceRegexDirty = "\\r\\n\\s\\n"
newlineReplaceClean = "\r\n\n"
- else if myField.selectionStart or myField.selectionStart is "0" # MOZ/FF/NS/S support
-
+ else if myField.selectionStart or myField.selectionStart == 0 or myField.selectionStart == '0' # MOZ/FF/NS/S support
# figure out cursor and selection positions
startPos = myField.selectionStart
endPos = myField.selectionEnd
cursorPos = endPos
scrollTop = myField.scrollTop
@@ -297,23 +291,24 @@
listItems = matches.length if matches = selectedText.match(/\n(\S)/g)
posDiffPos = 3 + listItems * 3
# now lets look and see if the user is trying to muck with a block or block modifier
else if button.tagStart.match(/^(h1|h2|h3|h4|h5|h6|bq|p|\>|\<\>|\<|\=|\(|\))/g)
- insertTag = ""
- insertModifier = ""
- tagPartBlock = ""
- tagPartModifier = ""
+ insertTag = ""
+ insertModifier = ""
+ tagPartBlock = ""
+ tagPartModifier = ""
tagPartModifierOrig = "" # ugly hack but it's late
- drawSwitch = ""
- captureIndentStart = false
- captureListStart = false
- periodAddition = "\\. "
+ drawSwitch = ""
+ captureIndentStart = false
+ captureListStart = false
+ periodAddition = "\\. "
periodAdditionClean = ". "
- listItemsAddition = 0
- re_list_items = new RegExp("(\\*+|\\#+)", "g") # need this regex later on when checking indentation of lists
- re_block_modifier = new RegExp("^(h1|h2|h3|h4|h5|h6|bq|p| [\\*]{1,} | [\\#]{1,} |)(\\>|\\<\\>|\\<|\\=|[\\(]{1,}|[\\)]{1,6}|)", "g")
+ listItemsAddition = 0
+ re_list_items = new RegExp("(\\*+|\\#+)", "g") # need this regex later on when checking indentation of lists
+ re_block_modifier = new RegExp("^(h1|h2|h3|h4|h5|h6|bq|p| [\\*]{1,} | [\\#]{1,} |)(\\>|\\<\\>|\\<|\\=|[\\(]{1,}|[\\)]{1,6}|)", "g")
+
if tagPartMatches = re_block_modifier.exec(selectedText)
tagPartBlock = tagPartMatches[1]
tagPartModifier = tagPartMatches[2]
tagPartModifierOrig = tagPartMatches[2]
tagPartModifierOrig = tagPartModifierOrig.replace(/\(/g, "\\(")
@@ -501,21 +496,20 @@
@removeTag button
cursorPos = startPos + button.tagEnd.length
# set the appropriate DOM value with the final text
if FF is true
- myField.value = finalText
+ myField.value = finalText
myField.scrollTop = scrollTop
else
sel.text = finalText
- # build up the selection capture, doesn't work in IE
if textSelected
+ # build up the selection capture, doesn't work in IE
myField.selectionStart = startPos + newlineStartPos
myField.selectionEnd = endPos + posDiffPos - posDiffNeg - newlineEndPos
- #alert('s: ' + myField.selectionStart + ' e: ' + myField.selectionEnd + ' sp: ' + startPos + ' ep: ' + endPos + ' pdp: ' + posDiffPos + ' pdn: ' + posDiffNeg)
else
myField.selectionStart = cursorPos
- myField.selectionEnd = cursorPos
+ myField.selectionEnd = cursorPos
window.TextileEditor = TextileEditor
\ No newline at end of file