### # Copyright (C) 2014 Andrey Antukh # Copyright (C) 2014 Jesús Espino Garcia # Copyright (C) 2014 David Barragán Merino # # This program is free software: you can redistribute it and/or modify # it under the terms of the GNU Affero General Public License as # published by the Free Software Foundation, either version 3 of the # License, or (at your option) any later version. # # This program is distributed in the hope that it will be useful, # but WITHOUT ANY WARRANTY; without even the implied warranty of # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the # GNU Affero General Public License for more details. # # You should have received a copy of the GNU Affero General Public License # along with this program. If not, see . # # File: modules/common/wisiwyg.coffee ### taiga = @.taiga bindOnce = @.taiga.bindOnce module = angular.module("taigaCommon") # How to test lists (-, *, 1.) # test it with text after & before the list # + is the cursor position # CASE 1 # - aa+ # --> enter # - aa # - + # CASE 1 # - + # --> enter # + # CASE 3 # - bb+cc # --> enter # - bb # - cc # CASE 3 # +- aa # --> enter # - aa ############################################################################# ## WYSIWYG markitup editor directive ############################################################################# tgMarkitupDirective = ($rootscope, $rs, $selectedText, $template, $compile) -> previewTemplate = $template.get("common/wysiwyg/wysiwyg-markitup-preview.html", true) link = ($scope, $el, $attrs, $model) -> element = angular.element($el) previewDomNode = $("
", {class: "preview"}) #openHelp = -> # window.open($rootscope.urls.wikiHelpUrl(), "_blank") closePreviewMode = -> element.parents(".markdown").find(".preview").remove() element.parents(".markItUp").show() $scope.$on "markdown-editor:submit", -> closePreviewMode() preview = -> markdownDomNode = element.parents(".markdown") markItUpDomNode = element.parents(".markItUp") $rs.mdrender.render($scope.projectId, $model.$modelValue).then (data) -> html = previewTemplate({data: data.data}) html = $compile(html)($scope) markdownDomNode.append(html) markItUpDomNode.hide() markdown = element.closest(".markdown") markdown.on "mouseup.preview", ".preview", (event) -> event.preventDefault() target = angular.element(event.target) if !target.is('a') and $selectedText.get().length return markdown.off(".preview") closePreviewMode() setCaretPosition = (textarea, caretPosition) -> if textarea.createTextRange range = textarea.createTextRange() range.move("character", caretPosition) range.select() else if textarea.selectionStart textarea.focus() textarea.setSelectionRange(caretPosition, caretPosition) # Calculate the scroll position totalLines = textarea.value.split("\n").length line = textarea.value[0..(caretPosition - 1)].split("\n").length scrollRelation = line / totalLines $el.scrollTop((scrollRelation * $el[0].scrollHeight) - ($el.height() / 2)) addLine = (textarea, nline, replace) -> lines = textarea.value.split("\n") if replace lines[nline] = replace + lines[nline] else lines[nline] = "" cursorPosition = 0 for line, key in lines cursorPosition += line.length + 1 || 1 break if key == nline textarea.value = lines.join("\n") #return the new position if replace return cursorPosition - lines[nline].length + replace.length - 1 else return cursorPosition markdownSettings = nameSpace: "markdown" onShiftEnter: {keepDefault:false, openWith:"\n\n"} onEnter: keepDefault: false, replaceWith: () -> "\n" afterInsert: (data) -> lines = data.textarea.value.split("\n") cursorLine = data.textarea.value[0..(data.caretPosition - 1)].split("\n").length newLineContent = data.textarea.value[data.caretPosition..].split("\n")[0] lastLine = lines[cursorLine - 1] # unordered list - match = lastLine.match /^(\s*- ).*/ if match emptyListItem = lastLine.match /^(\s*)\-\s$/ if emptyListItem markdownCaretPositon = addLine(data.textarea, cursorLine - 1) else markdownCaretPositon = addLine(data.textarea, cursorLine, "#{match[1]}") # unordered list * match = lastLine.match /^(\s*\* ).*/ if match emptyListItem = lastLine.match /^(\s*\* )$/ if emptyListItem markdownCaretPositon = addLine(data.textarea, cursorLine - 1) else markdownCaretPositon = addLine(data.textarea, cursorLine, "#{match[1]}") # ordered list match = lastLine.match /^(\s*)(\d+)\.\s/ if match emptyListItem = lastLine.match /^(\s*)(\d+)\.\s$/ if emptyListItem markdownCaretPositon = addLine(data.textarea, cursorLine - 1) else markdownCaretPositon = addLine(data.textarea, cursorLine, "#{match[1] + (parseInt(match[2], 10) + 1)}. ") setCaretPosition(data.textarea, markdownCaretPositon) if markdownCaretPositon #I18N markupSet: [ { name: "First Level Heading" key: "1" placeHolder: "Your title here..." closeWith: (markItUp) -> markdownTitle(markItUp, "=") }, { name: "Second Level Heading" key: "2" placeHolder: "Your title here..." closeWith: (markItUp) -> markdownTitle(markItUp, "-") }, { name: "Third Level Heading" key: "3" openWith: "### " placeHolder: "Your title here..." }, { separator: "---------------" }, { name: "Bold" key: "B" openWith: "**" closeWith: "**" }, { name: "Italic" key: "I" openWith: "_" closeWith: "_" }, { name: "Strike" key: "S" openWith: "~~" closeWith: "~~" }, { separator: "---------------" }, { name: "Bulleted List" openWith: "- " }, { name: "Numeric List" openWith: (markItUp) -> markItUp.line+". " }, { separator: "---------------" }, { name: "Picture" key: "P" replaceWith: '![[![Alternative text]!]](<<<[![Url:!:http://]!]>>> "[![Title]!]")' beforeInsert:(markItUp) -> prepareUrlFormatting(markItUp) afterInsert:(markItUp) -> urlFormatting(markItUp) }, { name: "Link" key: "L" openWith: "[" closeWith: '](<<<[![Url:!:http://]!]>>> "[![Title]!]")' placeHolder: "Your text to link here..." beforeInsert:(markItUp) -> prepareUrlFormatting(markItUp) afterInsert:(markItUp) -> urlFormatting(markItUp) }, { separator: "---------------" }, { name: "Quotes" openWith: "> " }, { name: "Code Block / Code" openWith: "```\n" closeWith: "\n```" }, { separator: "---------------" }, { name: "Preview" call: preview className: "preview-icon" }, # { # separator: "---------------" # }, # { # name: $tr.t("markdown-editor.help") # call: openHelp # className: "help" # } ] afterInsert: (event) -> target = angular.element(event.textarea) $model.$setViewValue(target.val()) prepareUrlFormatting = (markItUp) -> console.log(markItUp) regex = /(<<<|>>>)/gi result = 0 indices = [] (indices.push(result.index)) while ( (result = regex.exec(markItUp.textarea.value)) ) markItUp.donotparse = indices console.log(indices) urlFormatting = (markItUp) -> console.log(markItUp.donotparse) regex = /<<>>/gi endIndex = 0 loop result = regex.exec(markItUp.textarea.value) break if !result if result.index not in markItUp.donotparse endIndex = result.index break value = markItUp.textarea.value url = value.substring(startIndex, endIndex).replace('<<<', '').replace('>>>', '') url = url.replace('(', '%28').replace(')', '%29') url = url.replace('[', '%5B').replace(']', '%5D') value = value.substring(0, startIndex) + url + value.substring(endIndex+3, value.length) markItUp.textarea.value = value markItUp.donotparse = undefined markdownTitle = (markItUp, char) -> heading = "" n = $.trim(markItUp.selection or markItUp.placeHolder).length for i in [0..n-1] heading += char return "\n"+heading+"\n" element.markItUp(markdownSettings) element.on "keypress", (event) -> $scope.$apply() $scope.$on "$destroy", -> $el.off() return {link:link, require:"ngModel"} module.directive("tgMarkitup", ["$rootScope", "$tgResources", "$selectedText", "$tgTemplate", tgMarkitupDirective])