Post by Jordan on Jun 8, 2010 15:05:34 GMT -8
This script allows you to create multiple posting templates on the Modify Profile page under the added section titled "Posting Templates". Once you have created some templates (which are automatically saved as you type them, although you still need to press the Modify Profile button when you are finished), they will be available to you on the posting page and quick reply. All you have to do is click on a template and it's contents will be automatically inserted into your post.
A version 5 plugin can be found here.
Previews
- Modify Profile Page
- Posting Page
- Quick Reply
Since this code uses an HTML 5 feature, your browser needs to be the following version at a minimum.
Global Footer
<script type="text/javascript">
<!--
/*
* Posting Template
* Created By Jordan a.k.a. Triad
* support.proboards.com
*/
function PostingTemplate()
{
this.templates = {};
this.obj = {};
this.init();
}
PostingTemplate.prototype.init = function()
{
if(!localStorage)
return false;
if(pb_action == "modifyprofile" && document.modifyForm)
{
this.getTemplates();
this.addFields();
this.addEvent(document.modifyForm, this.saveTemplates);
this.obj["ubbc"] = this.$("template_ubbc");
this.obj["list"] = this.$("template_list");
}
else if(document.postForm || (pb_action == "display" && location.href.match(/(thread|board)=/i)))
{
this.getTemplates();
this.addTemplateList();
this.obj["list"] = this.$("template_list");
}
}
PostingTemplate.prototype.$ = function(id)
{
if(id) return document.getElementById(id);
return false;
}
PostingTemplate.prototype.addEvent = function(form, func)
{
if(document.addEventListener)
form.addEventListener("submit", func, false);
else if(document.attachEvent)
form.attachEvent("onsubmit", func);
else
form.onsubmit = func;
}
PostingTemplate.prototype.addTemplate = function()
{
if(this.obj.list.options.selectedIndex > 0)
{
var id = this.obj.list.options[this.obj.list.options.selectedIndex].value;
if(this.templates[id].ubbc.length > 0)
document.getElementsByName("message")[0].value += this.templates[id].ubbc;
}
}
PostingTemplate.prototype.selectTemplate = function()
{
if(this.obj.list.options.selectedIndex > 0)
this.obj.ubbc.value = this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value].ubbc;
else
this.obj.ubbc.value = "";
}
PostingTemplate.prototype.addSelectOptions = function(click)
{
var html = "";
for(key in this.templates)
{
html += '<option value="' + key + '">' + key + '</option>';
}
return html;
}
PostingTemplate.prototype.createTemplate = function()
{
var name = prompt("Enter the name of the template below.","");
if(!name.match(/^[a-zA-Z0-9]+$/i))
{
alert("Please only use the standard alpha letters and numbers for the template name. No commas, spaces, underscores, periods, semi-colons etc.");
return false;
}
for(key in this.templates)
{
if(name == key && this.templates[key].del == 0)
{
alert("This template name is already taken.");
return false;
}
}
if(name)
{
var option = document.createElement("option");
option.value = name;
option.innerHTML = name;
this.obj.list.appendChild(option);
this.obj.list.options.selectedIndex = this.obj.list.options.length-1;
this.obj.ubbc.value = "";
this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value] = {
ubbc: "",
del: 0
};
}
}
PostingTemplate.prototype.saveUBBC = function()
{
for(key in this.templates)
{
this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value].ubbc = this.obj.ubbc.value;
return true;
}
}
PostingTemplate.prototype.getTemplates = function()
{
var key = "";
for(x = 0; x < localStorage.length; x++)
{
key = localStorage.key(x);
if(key.match(new RegExp("^pT_" + pb_username + "_","i")))
{
this.templates[key.split("_")[2]] = {
ubbc: decodeURI(localStorage[key]),
del: 0
};
}
}
}
PostingTemplate.prototype.saveTemplates = function()
{
for(key in pT.templates)
{
if(pT.templates[key].del)
localStorage.removeItem("pT_" + pb_username + "_" + key);
else
localStorage.setItem("pT_" + pb_username + "_" + key, encodeURI(pT.templates[key].ubbc));
}
}
PostingTemplate.prototype.deleteTemplate = function()
{
var option = this.obj.list.options[this.obj.list.options.selectedIndex];
if(this.obj.list.options.selectedIndex > 0)
{
if(confirm("Are you sure you want to delete the \"" + option.value + "\" template?"))
{
this.templates[option.value].del = 1;
this.obj.list.removeChild(option);
this.obj.list.options.selectedIndex = 0;
this.obj.ubbc.value = "";
}
}
}
PostingTemplate.prototype.addTemplateList = function()
{
if(document.postForm)
{
var table = document.postForm.getElementsByTagName("table")[0].getElementsByTagName("table")[0];
var row = table.insertRow(document.postForm.message.parentNode.parentNode.parentNode.rowIndex);
var cell = row.insertCell(0);
cell.width = "30%";
cell.className = "windowbg2";
cell.innerHTML = '<font size="2">Posting Template:</font>';
cell = row.insertCell(1);
cell.width = "70%";
cell.className = "windowbg2";
cell.innerHTML = '<font size="1"><select id="template_list" onchange="pT.addTemplate();"><option>--------------------</option>' + this.addSelectOptions() + '</select></font>';
}
else if(document.getElementsByName("message")[0])
{
var target = document.getElementsByName("message")[0].parentNode;
var font = document.createElement("font");
font.size = 1;
font.innerHTML = '<select id="template_list" onchange="pT.addTemplate();" style="margin-left: 10px;"><option>--------------------</option>' + this.addSelectOptions() + '</select>';
target.parentNode.insertBefore(
font,
target.previousSibling
);
}
}
PostingTemplate.prototype.addFields = function()
{
if(document.modifyForm && pb_username == document.modifyForm.user.value)
{
var container = document.createElement("div");
container.innerHTML = '<font size="-1"><b>Posting Templates</b></font><hr size="1" />';
var table = document.createElement("table");
table.appendChild(document.createElement("tbody"));
var row = table.insertRow(0);
var cell = row.insertCell(0);
cell.width = "160";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1">UBBC Template:</font>';
cell = row.insertCell(1);
cell.width = "245"
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<table width="100%" cellspacing="0" cellpadding="0"><tr>' +
'<td width="1%" valign="middle"><font size="-1">' +
'<a href="Javascript:void(0);" onclick="pT.createTemplate();">Create</a><br />' +
'<a href="Javascript:void(0);" onclick="pT.deleteTemplate();">Delete</a>' +
'</font></td>' +
'<td width="99%" align="center" valign="middle"><font size="-1"><select id="template_list" onchange="pT.selectTemplate();"><option>--------------------</option>' + this.addSelectOptions() + '</select></font></td>' +
'</tr></table>';
cell = row.insertCell(2);
cell.width = "245"
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="1">Click on an option to manage your posting templates.</font>';
row = table.insertRow(1);
cell = row.insertCell(0);
cell.width = "160";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1">UBBC:</font>';
cell = row.insertCell(1);
cell.width = "245";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1"><textarea rows="5" cols="32" id= "template_ubbc" onkeyup="pT.saveUBBC();"></textarea></font>';
cell = row.insertCell(2);
cell.width = "245";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-2">The UBBC you add here will be available to you to insert into your posts on the posting page as well as in the quick reply section.</font>';
container.appendChild(table);
document.modifyForm.insertBefore(
container,
document.modifyForm.getElementsByTagName("hr")[1].previousSibling
);
}
}
var pT = new PostingTemplate();
//-->
</script>
January 15, 2011: Fixed error in the addTemplateList function. ~ Jordan
November 8, 2010: Code Compatibility ~ Jordan
A version 5 plugin can be found here.
Previews
- Modify Profile Page
- Posting Page
- Quick Reply
Since this code uses an HTML 5 feature, your browser needs to be the following version at a minimum.
Internet Explorer 8.0+The templates are stored on your computer by your browser which gives a limited amount of space per domain (website): 5MB per domain in Mozilla Firefox, Google Chrome, and Opera, 10MB per storage area in Internet Explorer. If you clear all browser history then the templates will also be cleared.
Firefox 3.5+
Safari 4.0+
Chrome 4.0+
Opera 10.5+
iPhone 2.0+
Android 2.0+
Global Footer
<script type="text/javascript">
<!--
/*
* Posting Template
* Created By Jordan a.k.a. Triad
* support.proboards.com
*/
function PostingTemplate()
{
this.templates = {};
this.obj = {};
this.init();
}
PostingTemplate.prototype.init = function()
{
if(!localStorage)
return false;
if(pb_action == "modifyprofile" && document.modifyForm)
{
this.getTemplates();
this.addFields();
this.addEvent(document.modifyForm, this.saveTemplates);
this.obj["ubbc"] = this.$("template_ubbc");
this.obj["list"] = this.$("template_list");
}
else if(document.postForm || (pb_action == "display" && location.href.match(/(thread|board)=/i)))
{
this.getTemplates();
this.addTemplateList();
this.obj["list"] = this.$("template_list");
}
}
PostingTemplate.prototype.$ = function(id)
{
if(id) return document.getElementById(id);
return false;
}
PostingTemplate.prototype.addEvent = function(form, func)
{
if(document.addEventListener)
form.addEventListener("submit", func, false);
else if(document.attachEvent)
form.attachEvent("onsubmit", func);
else
form.onsubmit = func;
}
PostingTemplate.prototype.addTemplate = function()
{
if(this.obj.list.options.selectedIndex > 0)
{
var id = this.obj.list.options[this.obj.list.options.selectedIndex].value;
if(this.templates[id].ubbc.length > 0)
document.getElementsByName("message")[0].value += this.templates[id].ubbc;
}
}
PostingTemplate.prototype.selectTemplate = function()
{
if(this.obj.list.options.selectedIndex > 0)
this.obj.ubbc.value = this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value].ubbc;
else
this.obj.ubbc.value = "";
}
PostingTemplate.prototype.addSelectOptions = function(click)
{
var html = "";
for(key in this.templates)
{
html += '<option value="' + key + '">' + key + '</option>';
}
return html;
}
PostingTemplate.prototype.createTemplate = function()
{
var name = prompt("Enter the name of the template below.","");
if(!name.match(/^[a-zA-Z0-9]+$/i))
{
alert("Please only use the standard alpha letters and numbers for the template name. No commas, spaces, underscores, periods, semi-colons etc.");
return false;
}
for(key in this.templates)
{
if(name == key && this.templates[key].del == 0)
{
alert("This template name is already taken.");
return false;
}
}
if(name)
{
var option = document.createElement("option");
option.value = name;
option.innerHTML = name;
this.obj.list.appendChild(option);
this.obj.list.options.selectedIndex = this.obj.list.options.length-1;
this.obj.ubbc.value = "";
this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value] = {
ubbc: "",
del: 0
};
}
}
PostingTemplate.prototype.saveUBBC = function()
{
for(key in this.templates)
{
this.templates[this.obj.list.options[this.obj.list.options.selectedIndex].value].ubbc = this.obj.ubbc.value;
return true;
}
}
PostingTemplate.prototype.getTemplates = function()
{
var key = "";
for(x = 0; x < localStorage.length; x++)
{
key = localStorage.key(x);
if(key.match(new RegExp("^pT_" + pb_username + "_","i")))
{
this.templates[key.split("_")[2]] = {
ubbc: decodeURI(localStorage[key]),
del: 0
};
}
}
}
PostingTemplate.prototype.saveTemplates = function()
{
for(key in pT.templates)
{
if(pT.templates[key].del)
localStorage.removeItem("pT_" + pb_username + "_" + key);
else
localStorage.setItem("pT_" + pb_username + "_" + key, encodeURI(pT.templates[key].ubbc));
}
}
PostingTemplate.prototype.deleteTemplate = function()
{
var option = this.obj.list.options[this.obj.list.options.selectedIndex];
if(this.obj.list.options.selectedIndex > 0)
{
if(confirm("Are you sure you want to delete the \"" + option.value + "\" template?"))
{
this.templates[option.value].del = 1;
this.obj.list.removeChild(option);
this.obj.list.options.selectedIndex = 0;
this.obj.ubbc.value = "";
}
}
}
PostingTemplate.prototype.addTemplateList = function()
{
if(document.postForm)
{
var table = document.postForm.getElementsByTagName("table")[0].getElementsByTagName("table")[0];
var row = table.insertRow(document.postForm.message.parentNode.parentNode.parentNode.rowIndex);
var cell = row.insertCell(0);
cell.width = "30%";
cell.className = "windowbg2";
cell.innerHTML = '<font size="2">Posting Template:</font>';
cell = row.insertCell(1);
cell.width = "70%";
cell.className = "windowbg2";
cell.innerHTML = '<font size="1"><select id="template_list" onchange="pT.addTemplate();"><option>--------------------</option>' + this.addSelectOptions() + '</select></font>';
}
else if(document.getElementsByName("message")[0])
{
var target = document.getElementsByName("message")[0].parentNode;
var font = document.createElement("font");
font.size = 1;
font.innerHTML = '<select id="template_list" onchange="pT.addTemplate();" style="margin-left: 10px;"><option>--------------------</option>' + this.addSelectOptions() + '</select>';
target.parentNode.insertBefore(
font,
target.previousSibling
);
}
}
PostingTemplate.prototype.addFields = function()
{
if(document.modifyForm && pb_username == document.modifyForm.user.value)
{
var container = document.createElement("div");
container.innerHTML = '<font size="-1"><b>Posting Templates</b></font><hr size="1" />';
var table = document.createElement("table");
table.appendChild(document.createElement("tbody"));
var row = table.insertRow(0);
var cell = row.insertCell(0);
cell.width = "160";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1">UBBC Template:</font>';
cell = row.insertCell(1);
cell.width = "245"
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<table width="100%" cellspacing="0" cellpadding="0"><tr>' +
'<td width="1%" valign="middle"><font size="-1">' +
'<a href="Javascript:void(0);" onclick="pT.createTemplate();">Create</a><br />' +
'<a href="Javascript:void(0);" onclick="pT.deleteTemplate();">Delete</a>' +
'</font></td>' +
'<td width="99%" align="center" valign="middle"><font size="-1"><select id="template_list" onchange="pT.selectTemplate();"><option>--------------------</option>' + this.addSelectOptions() + '</select></font></td>' +
'</tr></table>';
cell = row.insertCell(2);
cell.width = "245"
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="1">Click on an option to manage your posting templates.</font>';
row = table.insertRow(1);
cell = row.insertCell(0);
cell.width = "160";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1">UBBC:</font>';
cell = row.insertCell(1);
cell.width = "245";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-1"><textarea rows="5" cols="32" id= "template_ubbc" onkeyup="pT.saveUBBC();"></textarea></font>';
cell = row.insertCell(2);
cell.width = "245";
cell.vAlign = "top";
cell.className = "windowbg";
cell.innerHTML = '<font size="-2">The UBBC you add here will be available to you to insert into your posts on the posting page as well as in the quick reply section.</font>';
container.appendChild(table);
document.modifyForm.insertBefore(
container,
document.modifyForm.getElementsByTagName("hr")[1].previousSibling
);
}
}
var pT = new PostingTemplate();
//-->
</script>
January 15, 2011: Fixed error in the addTemplateList function. ~ Jordan
November 8, 2010: Code Compatibility ~ Jordan