How to format content in html textarea as xml on the fly - html

I have a page that users are able to add xml markup into a text area input. I'd like after they enter it that it be color-coded and formatted as xml would look in an IDE such as Visual Studio. Anybody know of a script or tool that would allow for this within a client-side browser?

Take a look at CodeMirror, a syntax-highlighting editor in Javascript for browsers. This is an example for XML editing.

Short answer: you can't.
Not in an TEXTAREA, as the one here in SO.
The example in SO is very good, as it has a TEXTAREA where we type the text, and a DIV box below where you can see what you type formatted.
You could also go through the contentEditable = "true", but it's a real pain to do it properly...

A nice option would be this: vkBeautify
Here is an example:
(function() {
function createShiftArr(step) {
var space = ' ';
if ( isNaN(parseInt(step)) ) { // argument is string
space = step;
} else { // argument is integer
switch(step) {
case 1: space = ' '; break;
case 2: space = ' '; break;
case 3: space = ' '; break;
case 4: space = ' '; break;
case 5: space = ' '; break;
case 6: space = ' '; break;
case 7: space = ' '; break;
case 8: space = ' '; break;
case 9: space = ' '; break;
case 10: space = ' '; break;
case 11: space = ' '; break;
case 12: space = ' '; break;
}
}
var shift = ['\n']; // array of shifts
for(ix=0;ix<100;ix++){
shift.push(shift[ix]+space);
}
return shift;
}
function vkbeautify(){
this.step = ' '; // 4 spaces
this.shift = createShiftArr(this.step);
};
vkbeautify.prototype.xml = function(text,step) {
var ar = text.replace(/>\s{0,}</g,"><")
.replace(/</g,"~::~<")
.replace(/\s*xmlns\:/g,"~::~xmlns:")
.replace(/\s*xmlns\=/g,"~::~xmlns=")
.split('~::~'),
len = ar.length,
inComment = false,
deep = 0,
str = '',
ix = 0,
shift = step ? createShiftArr(step) : this.shift;
for(ix=0;ix<len;ix++) {
// start comment or <![CDATA[...]]> or <!DOCTYPE //
if(ar[ix].search(/<!/) > -1) {
str += shift[deep]+ar[ix];
inComment = true;
// end comment or <![CDATA[...]]> //
if(ar[ix].search(/-->/) > -1 || ar[ix].search(/\]>/) > -1 || ar[ix].search(/!DOCTYPE/) > -1 ) {
inComment = false;
}
} else
// end comment or <![CDATA[...]]> //
if(ar[ix].search(/-->/) > -1 || ar[ix].search(/\]>/) > -1) {
str += ar[ix];
inComment = false;
} else
// <elm></elm> //
if( /^<\w/.exec(ar[ix-1]) && /^<\/\w/.exec(ar[ix]) &&
/^<[\w:\-\.\,]+/.exec(ar[ix-1]) == /^<\/[\w:\-\.\,]+/.exec(ar[ix])[0].replace('/','')) {
str += ar[ix];
if(!inComment) deep--;
} else
// <elm> //
if(ar[ix].search(/<\w/) > -1 && ar[ix].search(/<\//) == -1 && ar[ix].search(/\/>/) == -1 ) {
str = !inComment ? str += shift[deep++]+ar[ix] : str += ar[ix];
} else
// <elm>...</elm> //
if(ar[ix].search(/<\w/) > -1 && ar[ix].search(/<\//) > -1) {
str = !inComment ? str += shift[deep]+ar[ix] : str += ar[ix];
} else
// </elm> //
if(ar[ix].search(/<\//) > -1) {
str = !inComment ? str += shift[--deep]+ar[ix] : str += ar[ix];
} else
// <elm/> //
if(ar[ix].search(/\/>/) > -1 ) {
str = !inComment ? str += shift[deep]+ar[ix] : str += ar[ix];
} else
// <? xml ... ?> //
if(ar[ix].search(/<\?/) > -1) {
str += shift[deep]+ar[ix];
} else
// xmlns //
if( ar[ix].search(/xmlns\:/) > -1 || ar[ix].search(/xmlns\=/) > -1) {
str += shift[deep]+ar[ix];
}
else {
str += ar[ix];
}
}
return (str[0] == '\n') ? str.slice(1) : str;
}
window.vkbeautify = new vkbeautify();
})();
var xmlData = '<note><to>Tove</to><from>Jani</from><heading>Reminder</heading><body>Don\'t forget me this weekend!</body></note>';
xmlData = vkbeautify.xml(xmlData);
$('textarea').val(xmlData);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea cols="30" rows="10"></textarea>

Related

Creating A Worksheet Generator

I hope you are having a great day!
I have an ecommerce website with pdfs and ebooks for sale. We are based on "education" and we have seen a few websites that have worksheet generators. We tried using httrack to see how they made the script but nothing worked. We would love some help in how does it work and are there any tutorials for that type of task. Thanks and have a great day!
Edit: We forgot to say, we want something similar to education.com
I think this code useful for you....
code.
<html>
<head>
<title>Math WorkSheet</title>
<script type="text/javascript">
// For: http://codingforums.com/showthread.php?t=184125
var NProblems = 25;
var xvals = [];
var yvals = [];
for (var i = 0; i < NProblems; i++) {
// xvals.push(i); yvals.push(i+1); // limit to problem values to (0,1) ... 25
xvals.push(i % 10);
yvals.push((i % 10) + 1); // limit to single digit problems
}
function MakeTable(act) {
var tmp = '';
var str = '<table border="1" width="80%"><tr>';
i = 0;
while (i < NProblems) {
x = xvals[i];
y = yvals[i];
str += '<td align="right">' + x;
if (act == 'add') {
str += '<br>+ ' + y;
tmp = x + y;
}
if (act == 'sub') {
str += '<br>- ' + y;
tmp = x - y;
}
if (act == 'mul') {
str += '<br>* ' + y;
tmp = x * y;
}
if (act == 'div') {
str += '<br>/ ' + y;
tmp = (x / y).toFixed(2);
}
str += '<br>_____';
if (document.getElementById('answers').checked) {
str += '<br>' + tmp;
} else {
str += '<br> '
}
str += '<br> </td>';
i++;
if ((i % 5) == 0) {
str += '</tr><tr>';
}
}
str += '</tr></table>';
return str;
}
function GenerateWS() {
var x = 0;
var y = 0;
var str = '';
var str = '';
var sel = document.getElementById('MathAction').value;
switch (sel) {
case 'add':
str += MakeTable(sel);
break;
case 'sub':
str += MakeTable(sel);
break;
case 'mul':
str += MakeTable(sel);
break;
case 'div':
str += MakeTable(sel);
break;
default:
alert('No choice selected');
break;
}
document.getElementById('TBL').innerHTML = str;
}
function randOrd() {
return (Math.round(Math.random()) - 0.5);
}
function NewSet() {
xvals.sort(randOrd);
yvals.sort(randOrd);
}
</script>
</head>
<body>
<select id="MathAction">
<option value="add">Addition</option>
<option value="sub">Subtraction</option>
<option value="mul">Multiplication</option>
<option value="div">Division</option>
</select>
<button onclick="NewSet()">New worksheet</button>
<input type="checkbox" id="answers">Show Answers
<button onclick="GenerateWS()">Generate Worksheet</button>
<div id="TBL"></div>
</body>
</html>

How to prevent my github page from making post title 'title-cased'

I have created a github page and have chosen one of proposed Jekyll themes called minima. To add a post I have created a file called 2018-11-16-My-first-post-on-github.md. However, the post title displayed is a text converted to title case: My First Post On Github, so every first letter in each word is made upper case. How can I prevent that? Is this theme-dependent?
exports.toTitleCase = function(str){
var smallWords = /^(a|an|and|as|at|but|by|en|for|if|in|nor|of|on|or|per|the|to|vs?\.?|via)$/i;
return (str+'').replace(/[A-Za-z0-9\u00C0-\u00FF]+[^\s-]*/g, function(match, index, title){
if (index > 0 && index + match.length !== title.length &&
match.search(smallWords) > -1 && title.charAt(index - 2) !== ":" &&
(title.charAt(index + match.length) !== '-' || title.charAt(index - 1) === '-') &&
title.charAt(index - 1).search(/[^\s-]/) < 0) {
return match.toLowerCase();
}
if (match === 'tus') {
return match;
}
if (match.substr(1).search(/[A-Z]|\../) > -1) {
return match;
}
// Avoid uppercasing 'mod_deflate', apt-file - kvz
if (match.match(/.[\_\-\/\d]./)) {
return match;
}
// Avoid uppercasing '`frame`', '/sftp/import' - kvz
if (match.match(/(^[`\/]|[`]$)/)) {
return match;
}
// Avoid uppercasing: 'tmpfs' or anything that doesn't have a vowel - kvz
if (!match.match(/[aeiou]/)) {
return match;
}
return match.charAt(0).toUpperCase() + match.substr(1);
});
};
exports.newPost = function (content, opts, cb){
var self = this;
var matches = [];
var oldTitle = '';
var newTitle = '';
var oldLine = '';
var heading = '';
var newLine = '';
var changes = [];
var words = [];
var frontMatter = content.split('---')[1];
if (frontMatter) {
matches = frontMatter.match(/^(title\s*:\s*)\"?(.+?)\"?[\ \t]*$/im);
oldTitle = matches[2];
newTitle = self.toTitleCase(oldTitle).trim();
oldLine = matches[0];
newLine = matches[1] + '"' + newTitle + '"';
if (oldLine !== newLine) {
changes.push({oldTitle: oldTitle, newTitle: newTitle});
content = content.replace(oldLine, newLine);
}
}
if (opts.body === true) {
matches = content.match(/^\#{1,6} ([a-zA-Z0-9\-\;\!\?\%\&\;\:\.\/\(\)\ ]+)$/mg)
for (var i in matches) {
words = matches[i].split(' ')
heading = words.shift();
oldTitle = words.join(' ');
newTitle = self.toTitleCase(oldTitle).trim();
oldLine = heading + ' ' + oldTitle;
newLine = heading + ' ' + newTitle;
if (oldLine !== newLine) {
changes.push({oldTitle: oldTitle, newTitle: newTitle});
content = content.replace(oldLine, newLine);
}
}
}
if (changes.length === 0) {
content = null;
}
return cb(null, content, changes);
};
Jekyll automatically converts your post title to uppercase upon import. You can fix this by using a plugin, or by using a YAML file or Front matter to specify your title value directly.

How can I properly write the following if statement with getLabel()

I'm getting the following error and would like to know how to rewrite this code properly.
ReferenceError: Function function getLabel() {/* */} can not be used as the left-hand side of assignment or as an operand of ++ or -- operator. (line 61, file "DLContactsToSheet")
var Phones = "";
for ( var g=0;g<contacts[i].getPhones().length;g++)
{
if (contacts[i].getPhones()[g].getLabel() = "MOBILE_PHONE") {
Phones += "C: "
} else if (contacts[i].getPhones()[g].getLabel() = "WORK_PHONE") {
Phones += "W: "
} else if (contacts[i].getPhones()[g].getLabel() = "HOME_PHONE") {
Phones += "H: "
} else {
Phones += "O: "
}
Phones += contacts[i].getPhones()[g].getPhoneNumber();
Phones += "\n";
}
try{ContactArray.push(Phones);}
catch(e){ContactArray.push("N/A")}
It would appear that the reference error is caused by an '=' rather than an '==' in your conditions.
Rewriting the conditions as if (phone.getLabel() == 'MOBILE_PHONE') { /* ... */ } etc should do the trick.
You need to hard code them, in order to fetch them.
Code
function fieldType() {
var contacts = ContactsApp.getContacts(), phones = [];
for(var i = 0, iLen = contacts.length; i < iLen; i++) {
var con = contacts[i], f = ContactsApp.Field;
var c = con.getPhones(f.MOBILE_PHONE), w = con.getPhones(f.HOME_PHONE), h = con.getPhones(f.WORK_PHONE);
phones = getNumber(phones, c, "C: ");
phones = getNumber(phones, w, "W: ");
phones = getNumber(phones, h, "H: ");
}
}
function getNumber(phones, type, prefix) {
var typeNumbers = [];
var pNumber = type.length > 0 ? type.map( function (d) { return prefix + d.getPhoneNumber() + "\n"; }) : null;
if(pNumber) {
typeNumbers.push(pNumber);
}
return phones.concat(typeNumbers);
}
Note
See method description for more info: getPhoneNumber()
You should probably store the value for each iteration in a variable before any conditional statements. A case-switch statement is probably also better suited for this.
for ( var g=0;g<contacts[i].getPhones().length;g++)
{
var phone_type = contacts[i].getPhones()[g].getLabel()
switch(phone_type) {
case "MOBILE_PHONE":
Phones += "C: "
break;
case "WORK_PHONE":
Phones += "W: "
break;
case "HOME_PHONE":
Phones += "H: "
break;
default:
Phones += "O: "
}
Phones += contacts[i].getPhones()[g].getPhoneNumber();
Phones += "\n";
}

play audio range in html5

I would like to be able to have buttons that can play certain audio ranges from a larger file. Something like:
<button onclick="playClip('http://blah/source1.mp3', 2.5, 3.0, 1.0)">Play clip 1</button>
<button onclick="playClip('http://blah/source2.mp3', 10.0, 2.0, 0.5)">Play clip 2 slow</button>
where playClip has a pattern like this:
function playClip(src, startOffset, length, rate) {
// What to put here?
}
Or instead of a length, an ending offset.
Can some one point me to code that can do that, or help me write it? The closest I could find is https://gist.github.com/remy/753003/download# but I need different sized clips, from possibly different files, and with a playback rate specified. I'm afraid I've limited experience with Javascript.
I'm trying to replace a Silverlight app that does this.
Thanks.
-John
Either use Media Fragments URI syntax:
var src,
startOffset,
endOffset,
playbackRate,
audio = new Audio(src + '#t=' + startOffset + ',' + endOffset);
audio.onloadedmetadata = function() {
audio.playbackRate = playbackRate;
audio.play();
};
or timeupdate event:
var audio = new Audio( ... ),
startOffset,
endOffset,
playbackRate;
audio.onloadedmetadata = function() {
audio.playbackRate = playbackRate;
audio.currentTime = startOffset;
audio.play();
};
audio.ontimeupdate = function() {
if (audio.currentTime >= endOffset) {
audio.pause();
}
};
References:
Specifying playback range
Jumping to time offsets in HTML5 video
Here's an extract of my current code, which uses both the audio control's events and timeout to make sure the audio stops. There's a reference to a volume slider you might need to trim.
var jt_audioControl;
var jt_audioSource;
var jt_audioFiles;
var jt_audioFileIndex;
var jt_audioFile;
var jt_audioStartTime;
var jt_audioEndTime;
var jt_audioPlaybackRate;
var jt_audioTimeoutHandle;
var jt_audioLink;
var jt_audioMimeType;
var jt_audioMediaType;
var jt_volumeSlider;
function jt_onAudioTimeUpdate() {
if (jt_audioEndTime > 0.0) {
if (jt_audioControl.currentTime >= jt_audioEndTime) {
//alert('stopped: jt_audioControl.currentTime = ' + jt_audioControl.currentTime + ' jt_audioEndTime = ' + jt_audioEndTime);
jt_audioControl.pause();
//jt_audioStartTime = jt_audioEndTime = 0.0;
}
}
}
function jt_onAudioCanPlay() {
jt_audioControl.pause();
jt_audioControl.currentTime = jt_audioStartTime;
jt_audioControl.defaultPlaybackRate = jt_audioPlaybackRate;
jt_audioControl.playbackRate = jt_audioPlaybackRate;
jt_audioControl.play();
jt_audioControl.currentTime = jt_audioStartTime;
jt_volumeSliderChanged(); // Set initial value to slider.
var timeout = (((jt_audioEndTime - jt_audioStartTime)) / jt_audioPlaybackRate) * 1000;
//alert('jt_audioEndTime = ' + jt_audioEndTime + ', timeout = ' + timeout);
if (jt_audioEndTime > 0.0) {
jt_audioTimeoutHandle = setTimeout(jt_onAudioEnded, timeout);
//alert('jt_audioTimeoutHandle = ' + jt_audioTimeoutHandle);
}
else if (jt_audioTimeoutHandle != null) {
clearTimeout(jt_audioTimeoutHandle);
jt_audioTimeoutHandle = null;
}
}
function jt_onAudioEnded() {
//alert('ended called');
if (jt_audioFiles == null)
return;
while (jt_audioControl.position < jt_audioControl.duration)
;
jt_audioFileIndex = jt_audioFileIndex + 1;
if (jt_audioFileIndex < jt_audioFiles.length) {
jt_createAudio(jt_audioFiles[jt_audioFileIndex]);
}
else {
jt_audioControl.pause();
jt_audioFiles = null;
jt_audioFileIndex = 0;
}
}
function jt_onAudioError(e) {
var msg;
switch (e.target.error.code) {
case e.target.error.MEDIA_ERR_ABORTED:
msg = 'You aborted the video playback.';
break;
case e.target.error.MEDIA_ERR_NETWORK:
msg = 'A network error caused the video download to fail part-way.';
break;
case e.target.error.MEDIA_ERR_DECODE:
msg = 'The video playback was aborted due to a corruption problem or because the video used features your browser did not support.';
break;
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
msg = 'The video could not be loaded, either because the server or network failed or because the format is not supported.';
break;
default:
msg = 'An unknown error occurred.';
break;
}
alert('Error loading media: ' + msg + ' Media file: ' + jt_audioFile + ' MIME type: ' + jt_audioMimeType);
}
function jt_addSource(url) {
var srcUrl;
var doConvertCheck = false;
var offset = url.lastIndexOf(".");
if (offset == -1) {
if (jt_audioSource == null) {
jt_audioSource = document.createElement('source');
jt_audioControl.appendChild(jt_audioSource);
}
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg3';
jt_audioSource.type = jt_audioMediaType;
jt_audioSource.src = url;
jt_audioControl.load();
return;
}
var base = url.substr(0, offset);
var ext = url.substr(offset).toLowerCase();
var newExt = ext;
if (jt_audioControl.canPlayType('audio/mpeg3')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg3';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/mpeg')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/mp3')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mp3';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/ogg')) {
jt_audioMimeType = 'audio/ogg';
jt_audioMediaType = 'audio/ogg';
if (ext != '.ogg')
newExt = '-aa.ogg';
}
else {
alert('Sorry, can not play file: ' + url);
}
srcUrl = base + newExt;
if (srcUrl.lastIndexOf('~', 0) === 0) {
if (window.location.hostname == '') {
srcUrl = srcUrl.substr(2);
}
else {
var url = 'http://' + window.location.hostname;
if (window.location.port.toString() != '')
url = usrl + ':' + window.location.port.toString()
srcUrl = url + srcUrl.substr(1);
}
}
//alert('srcUrl = ' + srcUrl);
if (jt_audioSource == null) {
jt_audioSource = document.createElement('source');
jt_audioControl.appendChild(jt_audioSource);
}
jt_audioSource.type = jt_audioMediaType;
if (doConvertCheck) {
jt_audioLink = "/ConvertCheck?path=" + srcUrl + "&" + "mimeType=" + jt_audioMimeType
jt_audioSource.src = jt_audioLink;
}
else {
jt_audioSource.src = srcUrl;
}
jt_audioControl.load();
}
function jt_extractTimeRange(url) {
var rangeFieldIndex = url.lastIndexOf("#t");
if (rangeFieldIndex >= 0) {
var rangeString = url.substr(rangeFieldIndex + 2);
var range = rangeString.split(',');
jt_audioStartTime = parseFloat(range[0]);
jt_audioEndTime = parseFloat(range[1]);
}
else {
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
return url;
}
return url.substr(0, rangeFieldIndex);
}
function jt_createAudio(url) {
url = jt_extractTimeRange(url);
if (jt_audioControl == null) {
jt_audioFile = url;
jt_audioControl = new Audio();
// The ontimeupdate handler seems to be called unreliably, so we'll use
// setTimeout as well in the oncanplay handler.
jt_audioControl.ontimeupdate = jt_onAudioTimeUpdate;
jt_audioControl.onloadedmetadata = jt_onAudioCanPlay;
jt_audioControl.onended = jt_onAudioEnded;
jt_audioControl.onerror = jt_onAudioError;
jt_addSource(url);
// We'll let the oncanplay call play once loaded.
}
else if (jt_audioFile != url) {
jt_audioFile = url;
jt_addSource(url);
}
else {
//jt_onAudioLoaded();
jt_audioControl.load();
}
}
function jt_playAudioFile(url) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 1.0;
jt_createAudio(url);
}
function jt_playSlowAudioFile(url) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 0.5;
jt_createAudio(url);
}
function jt_playAudioFileList(urls) {
jt_audioFiles = urls;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 1.0;
if ((urls != null) && (urls.length > 0)) {
jt_createAudio(urls[0]);
}
}
function jt_playSlowAudioFileList(urls) {
jt_audioFiles = urls;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 0.5;
if ((urls != null) && (urls.length > 0)) {
jt_createAudio(urls[0]);
}
}
function jt_playAudioFileSegment(url, startTime, endTime) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
url = url + '#t' + startTime.toString() + ',' + endTime.toString();
jt_audioPlaybackRate = 1.0;
jt_createAudio(url);
}
function jt_playSlowAudioFileSegment(url, startTime, endTime) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
url = url + '#t' + startTime.toString() + ',' + endTime.toString();
jt_audioPlaybackRate = 0.5;
jt_createAudio(url);
}
function jt_stopAudio() {
if (jt_audioControl != null)
jt_audioControl.pause();
}
function jt_volumeSliderChanged() {
if (jt_volumeSlider == null) {
jt_volumeSlider = document.getElementById('volumeSlider');
if (jt_volumeSlider == null)
return;
}
var value = jt_volumeSlider.value;
if (jt_audioControl != null)
jt_audioControl.volume = value / 10;
$.ajax({
url: "/Common/SetUserOptionAjax?key=AudioVolume&value=" + value.toString(),
type: "POST"
});
}

IE 8 - Invalid source HTML for this operation

What is wrong with
el.insertAdjacentHTML(hashVal[0], html);
where html is "<a title=\"\">1</a>" and hashVal[0] is "afterBegin".
This is related to a rating functionality. I think due to this error, the rating star is not displaying in ie 8. Other browsers are ok.
I have given the full flow of code below. I am using extjs.
var starLink = star.createChild({
tag: 'a',
html: this.values[i],
title: this.showTitles ? this.titles[i] : ''
});
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
createChild : function(config, insertBefore, returnDom) {
config = config || {tag:'div'};
if (insertBefore) {
return Ext.DomHelper.insertBefore(insertBefore, config, returnDom !== true);
}
else {
return Ext.DomHelper[!this.dom.firstChild ? 'insertFirst' : 'append'](this.dom, config, returnDom !== true);
}
},
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
insertFirst : function(el, o, returnElement){
return doInsert(el, o, returnElement, afterbegin, 'firstChild');
},
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function doInsert(el, o, returnElement, pos, sibling, append){
el = Ext.getDom(el);
var newNode;
if (pub.useDom) {
newNode = createDom(o, null);
if (append) {
el.appendChild(newNode);
} else {
(sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
}
} else {
newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
}
return returnElement ? Ext.get(newNode, true) : newNode;
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function createHtml(o){
var b = '',
attr,
val,
key,
cn,
i;
if(typeof o == "string"){
b = o;
} else if (Ext.isArray(o)) {
for (i=0; i < o.length; i++) {
if(o[i]) {
b += createHtml(o[i]);
}
}
} else {
b += '<' + (o.tag = o.tag || 'div');
for (attr in o) {
val = o[attr];
if(!confRe.test(attr)){
if (typeof val == "object") {
b += ' ' + attr + '="';
for (key in val) {
b += key + ':' + val[key] + ';';
}
b += '"';
}else{
b += ' ' + ({cls : 'class', htmlFor : 'for'}[attr] || attr) + '="' + val + '"';
}
}
}
if (emptyTags.test(o.tag)) {
b += '/>';
} else {
b += '>';
if ((cn = o.children || o.cn)) {
b += createHtml(cn);
} else if(o.html){
b += o.html;
}
b += '</' + o.tag + '>';
}
}
return b;
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
insertHtml : function(where, el, html){
var hash = {},
hashVal,
range,
rangeEl,
setStart,
frag,
rs;
where = where.toLowerCase();
hash[beforebegin] = ['beforeBegin', 'previousSibling'];
hash[afterend] = ['afterEnd', 'nextSibling'];
if (el.insertAdjacentHTML) {
if(tableRe.test(el.tagName) && (rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html))){
return rs;
}
hash[afterbegin] = ['afterBegin', 'firstChild'];
hash[beforeend] = ['beforeEnd', 'lastChild'];
if ((hashVal = hash[where])) {
el.insertAdjacentHTML(hashVal[0], html);
return el[hashVal[1]];
}
} else {