ec2-18-223-172-224.us-east-2.compute.amazonaws.com | ToothyWiki | MoonShadow | RecentChanges | Login | Webcomic
An inline comment display system using a wiki or similar as a back end.
To deploy:
- include the following HTML on your page where you wish the comment feed to be:
<script language="javascript"><!--
comments_config = {};
comments_config.page = 'MoonShadow/Comments';
// Other configuration options can go here (see below).
// Replace MoonShadow/Comments with the name of the page to be used for comments.
//--></script>
<script id="comments" language="javascript" src="http://toothycat.net/~sham/comments/comments.js"></script>
- use CSS to achieve the desired look and feel for the comment feed. The feed structure is as follows:
<div>
<div class="comments">
<ul>
<li>
<span class="info">
<span class="name"></span><span class="date"></span>
</span>
<span class="content">
<p></p>
<p></p>
.
.
</span>
</li>
<li>
<span class="info">
<span class="name"></span><span class="date"></span>
</span>
<span class="content">
<p></p>
<p></p>
.
.
</span>
</li>
.
.
</ul>
<div class="newcomment">
<p><span class="label"></span><input></p><p>
<span class="label"></span><textarea></textarea></p>
<p><button></button></p>
</div>
</div>
</div>
Sample CSS can be seen in the source of [this]. Submitted comments will be appended to the wiki page, and the current set of comments on the wiki page automatically displayed in the feed; the rest of the wiki page is not displayed.
NB. The HTML page must reside in the same domain as the wiki being used to store the comments. You can use ToothyWiki for pages with URLs of the form https://www.toothycat.net/~user/dir/page.html. If you have your own domain, you can't use ToothyWiki; you must run your own wiki (and add configuration options for the appropriate URLs). If you have your own domain, and your website is hosted by us, you *can* use a ToothyWiki page, but you require intervention from me in order to deploy; please contact me if you wish to do this.
Configuration options (along with defaults)
These are generally useful:
comments_config.initialText = 'Type your comment here.';
The default text displayed in the new comment text entry box.
comments_config.blockSeparator = '----';
This is prepended to each new comment.
comments_config.signaturePrefix = '::--';
This is appended to each new comment, followed by the nick supplied; use
comments_config.signaturePrefix = 0;
to disable.
These are for deployment using a different wiki as the CMS:
comments_config.wiki = '/wiki/wiki.pl';
This is the URL of the backing wiki
comments_config.raw = 'action=raw';
This is appended to the query string to fetch the raw text of a wiki page
comments_config.preview = 'action=bite';
This is appended to the query string to fetch a page containing a text edit form
comments_config.page_id = 'id=';
This is appended to the query string immediately before the page id for all actions
comments_config.textForm = 'text';
This is the name of the main text entry box on the edit page
comments_config.commentForm = 'summary';
This is the name of the edit summary box on the edit page
comments_config.saveButton = 'Save';
This is the name of the save page button on the edit page
comments_config.whoami = '/wiki/util.pl?whoami=1';
This is the path to a whoami service. The URL must return a single JSON object, containing the values 'result', 'ip' and 'nick'. If 'result' is false or undefined, 'ip' and 'nick' will be ignored; otherwise, if 'nick' if defined and not false the value will be used as the default for the nickname box, otherwise 'ip' will be used. If no such service is available, the functionality may be disabled using
comments_config.whoami = 0;
comments_config.defaultWikiText? = 'Autogenerated comments for ' + window.location;
This is additional text to use if the wiki page is empty when a comment is posted.
Todo:
- crossdomain submission of comments should be possible, though may require some hacking
- wrap login screen
hi
- hi2
- hi3
Type your comment here.
Seems to work fine from Chrome
Posting from test.toothycat.net
testing
woo!
test