0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

some improvements to Ox.Editable

Browse source
This commit is contained in:
rlx 2011-10-27 08:47:31 +00:00
parent 188656bd99
commit 1eb93125e6
2 changed files with 34 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
source/Ox.UI/js/Form/Ox.Editable.js
View file

@ -58,11 +58,7 @@ Ox.Editable = function(options, self) {
//padding: '0 4px 0 4px' //padding: '0 4px 0 4px'
width: self.options.width + 'px' width: self.options.width + 'px'
}) })
.html( .html(formatValue())
self.options.format
? self.options.format(self.options.value)
: self.options.value
)
//[self.options.editing ? 'hide' : 'show']() //[self.options.editing ? 'hide' : 'show']()
.appendTo(that); .appendTo(that);
@ -73,7 +69,7 @@ Ox.Editable = function(options, self) {
//left: 200, //left: 200,
//top: 200 //top: 200
}) })
.html(self.options.value.replace(/ /g, ' ')) .html(formatTestValue())
.hide() .hide()
.appendTo(that.$element); .appendTo(that.$element);
@ -81,7 +77,7 @@ Ox.Editable = function(options, self) {
changeOnKeypress: true, changeOnKeypress: true,
style: 'square', style: 'square',
type: self.options.type, type: self.options.type,
value: Ox.parseHTML(self.options.value) value: formatInputValue()
}, self.options.type == 'textarea' ? { }, self.options.type == 'textarea' ? {
width: self.options.width width: self.options.width
} : {})) } : {}))
@ -109,13 +105,9 @@ Ox.Editable = function(options, self) {
function change(event) { function change(event) {
var height, width; var height, width;
self.options.value = formatValue(event.value); self.options.value = event.value;
self.$value.html( self.$value.html(formatValue);
self.options.format self.$test.html(formatTestValue());
? self.options.format(self.options.value)
: self.options.value
);
self.$test.html(self.options.value.replace(/ /g, ' '));
height = self.options.height || self.$test.height(); height = self.options.height || self.$test.height();
//height = Math.max(self.$test.height(), 14); //height = Math.max(self.$test.height(), 14);
width = Math.max(self.$test.width() + 2, 8); width = Math.max(self.$test.width() + 2, 8);
@ -180,24 +172,33 @@ Ox.Editable = function(options, self) {
} }
} }
function formatValue(value) { function formatInputValue() {
if (self.options.type == 'input') { return self.options.type == 'input'
value = value.replace(/ /g, ' '); ? self.options.value
} else { : self.options.value.replace(/<br\/?>/g, '\n');
value = value.replace(/\n/g, '<br/>')
.replace(/<br\/>$/, '<br/>&nbsp;');
} }
return value;
function formatTestValue() {
Ox.print('TEST VALUE =', self.options.type == 'input'
? self.options.value.replace(/ /g, '&nbsp;')
: self.options.value.replace(/\n$/, '<br/>&nbsp;')
.replace(/\n/g, '<br/>'));
return self.options.type == 'input'
? self.options.value.replace(/ /g, '&nbsp;')
: self.options.value.replace(/\n$/, '<br/>&nbsp;')
.replace(/\n/g, '<br/>');
}
function formatValue() {
return self.options.format
? self.options.format(self.options.value)
: self.options.value
} }
function submit() { function submit() {
self.options.value = self.$input.value().trim(); self.options.value = Ox.parseHTML(self.$input.value());
self.$input.value(self.options.value); self.$input.value(formatInputValue());
self.$value.html( self.$value.html(formatValue());
self.options.format
? self.options.format(self.options.value)
: self.options.value
);
cancel(); cancel();
that.triggerEvent('submit', { that.triggerEvent('submit', {
value: self.options.value value: self.options.value

8
source/Ox/js/HTML.js
View file

@ -37,10 +37,9 @@ Ox.parseHTML <f> Takes HTML from an untrusted source and returns something sane
Ox.parseHTML = (function() { Ox.parseHTML = (function() {
var defaultTags = [ var defaultTags = [
// fixme: why not p? 'a', 'b', 'blockquote', 'br', 'cite', 'code',
'a', 'b', 'blockquote', 'cite', 'code',
'del', 'em', 'i', 'img', 'ins', 'del', 'em', 'i', 'img', 'ins',
'li', 'ol', 'q', 'rtl', 's', 'li', 'ol', 'p', 'q', 'rtl', 's',
'strong', 'sub', 'sup', 'ul', '[]' 'strong', 'sub', 'sup', 'ul', '[]'
], ],
parse = { parse = {
@ -89,7 +88,8 @@ Ox.parseHTML = (function() {
matches.forEach(function(match, i) { matches.forEach(function(match, i) {
html = html.replace(new RegExp(tab + i + tab, 'gi'), match); html = html.replace(new RegExp(tab + i + tab, 'gi'), match);
}); });
html = html.replace(/\n/g, '<br/>\n'); //html = html.replace(/\n/g, '<br/>\n');
html = html.replace(/\n/g, '<br/>');
// close extra opening (and remove extra closing) tags // close extra opening (and remove extra closing) tags
// note: this converts '&quot;' to '"' // note: this converts '&quot;' to '"'
return Ox.element('<div>').html(html).html(); return Ox.element('<div>').html(html).html();