166 lines
5 KiB
JavaScript
166 lines
5 KiB
JavaScript
Elm.Native.Text = {};
|
|
Elm.Native.Text.make = function(elm) {
|
|
elm.Native = elm.Native || {};
|
|
elm.Native.Text = elm.Native.Text || {};
|
|
if (elm.Native.Text.values) return elm.Native.Text.values;
|
|
|
|
var toCss = Elm.Native.Color.make(elm).toCss;
|
|
var Element = Elm.Graphics.Element.make(elm);
|
|
var List = Elm.Native.List.make(elm);
|
|
var Utils = Elm.Native.Utils.make(elm);
|
|
|
|
function makeSpaces(s) {
|
|
if (s.length == 0) { return s; }
|
|
var arr = s.split('');
|
|
if (arr[0] == ' ') { arr[0] = " " }
|
|
for (var i = arr.length; --i; ) {
|
|
if (arr[i][0] == ' ' && arr[i-1] == ' ') {
|
|
arr[i-1] = arr[i-1] + arr[i];
|
|
arr[i] = '';
|
|
}
|
|
}
|
|
for (var i = arr.length; i--; ) {
|
|
if (arr[i].length > 1 && arr[i][0] == ' ') {
|
|
var spaces = arr[i].split('');
|
|
for (var j = spaces.length - 2; j >= 0; j -= 2) {
|
|
spaces[j] = ' ';
|
|
}
|
|
arr[i] = spaces.join('');
|
|
}
|
|
}
|
|
arr = arr.join('');
|
|
if (arr[arr.length-1] === " ") {
|
|
return arr.slice(0,-1) + ' ';
|
|
}
|
|
return arr;
|
|
}
|
|
|
|
function properEscape(str) {
|
|
if (str.length == 0) return str;
|
|
str = str //.replace(/&/g, "&")
|
|
.replace(/"/g, '"')
|
|
.replace(/'/g, "'")
|
|
.replace(/</g, "<")
|
|
.replace(/>/g, ">")
|
|
.replace(/\n/g, "<br/>");
|
|
var arr = str.split('<br/>');
|
|
for (var i = arr.length; i--; ) {
|
|
arr[i] = makeSpaces(arr[i]);
|
|
}
|
|
return arr.join('<br/>');
|
|
}
|
|
|
|
function toText(str) { return Utils.txt(properEscape(str)); }
|
|
|
|
// conversions from Elm values to CSS
|
|
function toTypefaces(list) {
|
|
var typefaces = List.toArray(list);
|
|
for (var i = typefaces.length; i--; ) {
|
|
var typeface = typefaces[i];
|
|
if (typeface.contains(' ')) {
|
|
typefaces[i] = "'" + typeface + "'";
|
|
}
|
|
}
|
|
return typefaces.join(',');
|
|
}
|
|
function toLine(line) {
|
|
var ctor = line.ctor;
|
|
return ctor === 'Under' ? 'underline' :
|
|
ctor === 'Over' ? 'overline' : 'line-through';
|
|
}
|
|
|
|
// setting styles of Text
|
|
function style(style, text) {
|
|
var newText = '<span style="color:' + toCss(style.color) + ';'
|
|
if (style.typeface.ctor !== '[]') {
|
|
newText += 'font-family:' + toTypefaces(style.typeface) + ';'
|
|
}
|
|
if (style.height.ctor !== "Nothing") {
|
|
newText += 'font-size:' + style.height._0 + 'px;';
|
|
}
|
|
if (style.bold) {
|
|
newText += 'font-weight:bold;';
|
|
}
|
|
if (style.italic) {
|
|
newText += 'font-style:italic;';
|
|
}
|
|
if (style.line.ctor !== 'Nothing') {
|
|
newText += 'text-decoration:' + toLine(style.line._0) + ';';
|
|
}
|
|
newText += '">' + Utils.makeText(text) + '</span>'
|
|
return Utils.txt(newText);
|
|
}
|
|
function height(px, text) {
|
|
return { style: 'font-size:' + px + 'px;', text:text }
|
|
}
|
|
function typeface(names, text) {
|
|
return { style: 'font-family:' + toTypefaces(names) + ';', text:text }
|
|
}
|
|
function monospace(text) {
|
|
return { style: 'font-family:monospace;', text:text }
|
|
}
|
|
function italic(text) {
|
|
return { style: 'font-style:italic;', text:text }
|
|
}
|
|
function bold(text) {
|
|
return { style: 'font-weight:bold;', text:text }
|
|
}
|
|
function link(href, text) {
|
|
return { href: toText(href), text:text };
|
|
}
|
|
function line(line, text) {
|
|
return { style: 'text-decoration:' + toLine(line) + ';', text:text };
|
|
}
|
|
|
|
function color(color, text) {
|
|
return { style: 'color:' + toCss(color) + ';', text:text };
|
|
}
|
|
|
|
function block(align) {
|
|
return function(text) {
|
|
var raw = {
|
|
ctor :'RawHtml',
|
|
html : Utils.makeText(text),
|
|
align: align,
|
|
guid : null,
|
|
args : [],
|
|
};
|
|
var pos = A2(Utils.htmlHeight, 0, raw);
|
|
return A3(Element.newElement, pos._0, pos._1, raw);
|
|
}
|
|
}
|
|
|
|
function markdown(text, guid) {
|
|
var raw = {
|
|
ctor:'RawHtml',
|
|
html: text,
|
|
align: null,
|
|
guid: guid,
|
|
args: [],
|
|
};
|
|
var pos = A2(Utils.htmlHeight, 0, raw);
|
|
return A3(Element.newElement, pos._0, pos._1, raw);
|
|
}
|
|
|
|
return elm.Native.Text.values = {
|
|
toText: toText,
|
|
|
|
height : F2(height),
|
|
italic : italic,
|
|
bold : bold,
|
|
line : F2(line),
|
|
monospace : monospace,
|
|
typeface : F2(typeface),
|
|
color : F2(color),
|
|
link : F2(link),
|
|
|
|
leftAligned : block('left'),
|
|
rightAligned : block('right'),
|
|
centered : block('center'),
|
|
justified : block('justify'),
|
|
markdown : markdown,
|
|
|
|
toTypefaces:toTypefaces,
|
|
toLine:toLine,
|
|
};
|
|
};
|