The code now runs with the new-style classes. But there is lots more to do. Running applications are as ugly as sin because the CSS styles don't yet apply; use of teams has yet to be tested; backwards compatibility is only partly implemented; many examples need testing under the compatibility rules, then upgrading
// wrapper to provide local copy of the jQuery object.
(function($) {
var log = mkws.log;
+ var _old2new = { // Maps old-style widget names to new-style
+ 'Authname': 'auth-name',
+ 'ConsoleBuilder': 'console-builder',
+ 'Coverart': 'cover-art',
+ 'GoogleImage': 'google-image',
+ 'MOTD': 'motd',
+ 'MOTDContainer': 'motd-container',
+ 'Perpage': 'per-page',
+ 'SearchForm': 'search-form',
+ };
function handleNodeWithTeam(node, callback) {
// First branch for DOM objects; second branch for jQuery objects
for (var i = 0; i < list.length; i++) {
var cname = list[i];
- if (cname.match(/^mkwsTeam_/)) {
- teamName = cname.replace(/^mkwsTeam_/, '');
+ if (cname.match(/^mkws-team-/)) {
+ teamName = cname.replace(/^mkws-team-/, '');
+ } else if (cname.match(/^mkws-/)) {
+ // New-style names of the form mkws-foo-bar
+ type = cname.replace(/^mkws-/, '');
} else if (cname.match(/^mkws/)) {
- type = cname.replace(/^mkws/, '');
+ // Old-style names of the form mkwsFooBar
+ var tmp = cname.replace(/^mkws/, '');
+ type = _old2new[tmp] || tmp;
}
}
for (var tname in mkws.teams) {
var team = mkws.teams[tname];
team.visitWidgets(function(t, w) {
- var w1 = team.widget(t + "-Container-" + from);
- var w2 = team.widget(t + "-Container-" + to);
+ var w1 = team.widget(t + "-container-" + from);
+ var w2 = team.widget(t + "-container-" + to);
if (w1) {
w1.node.hide();
}
var s = "";
for (var type in mkws.widgetType2function) {
if (s) s += ',';
- s += '.mkws' + type;
- s += ',.mkws' + type + "-Container-wide";
- s += ',.mkws' + type + "-Container-narrow";
+ s += '.mkws-' + type;
+ s += ',.mkws-' + type + "-container-wide";
+ s += ',.mkws-' + type + "-container-narrow";
+ // ### Do we need to do something about old-style names?
}
return s;
}
//"use strict";
// $(document).ready(function () {
-mkws.registerWidgetType('Popup', function() {
+mkws.registerWidgetType('popup', function() {
var $ = mkws.$;
var debug = mkws.log;
debug("init popup window");
var popup_window = $(this.node);
- // var popup_window = $(".mkwsPopup"); // $(document).ready()
+ // var popup_window = $(".mkws-popup"); // $(document).ready()
if (!popup_window) {
debug("no popup found, skip...");
return;
close: function() {}
});
- // open at search query submit: "input.mkwsButton"
+ // open at search query submit: "input.mkws-button"
var id_botton = that.attr("popup_button");
if (id_botton) {
$(id_botton).button().click(function() {
// Used by the Records widget and onRecord()
function recordElementId(s) {
- return 'mkwsRec_' + s.replace(/[^a-z0-9]/ig, '_');
+ return 'mkws-rec_' + s.replace(/[^a-z0-9]/ig, '_');
}
that.recordElementId = recordElementId;
// Used by onRecord(), showDetails() and renderDetails()
function recordDetailsId(s) {
- return 'mkwsDet_' + s.replace(/[^a-z0-9]/ig, '_');
+ return 'mkws-det_' + s.replace(/[^a-z0-9]/ig, '_');
}
teamName = teamName || m_teamName;
if (teamName === 'AUTO') {
- selector = (selector + '.mkwsTeam_' + teamName + ',' +
- selector + ':not([class^="mkwsTeam"],[class*=" mkwsTeam"])');
+ selector = (selector + '.mkws-team-' + teamName + ',' +
+ selector + ':not([class^="mkwsTeam"],[class*=" mkwsTeam"],[class^="mkws-team-"],[class*=" mkws-team-"])');
} else {
- selector = selector + '.mkwsTeam_' + teamName;
+ selector = selector + '.mkws-team-' + teamName;
}
var node = $(selector);
function renderDetails(data, marker) {
var template = loadTemplate("Record");
var details = template(data);
- return '<div class="mkwsDetails mkwsTeam_' + m_teamName + '" ' +
+ return '<div class="mkws-details mkws-team-' + m_teamName + '" ' +
'id="' + recordDetailsId(data.recid[0]) + '">' + details + '</div>';
}
that.renderDetails = renderDetails;
var template = m_template[name];
if (template === undefined && Handlebars.compile) {
var source;
- var node = $(".mkwsTemplate_" + name + " .mkwsTeam_" + that.name());
+ var node = $(".mkws-template_" + name + " .mkws-team-" + that.name());
if (node && node.length < 1) {
- node = $(".mkwsTemplate_" + name);
+ node = $(".mkws-template_" + name);
}
if (node) source = node.html();
if (!source) source = m_templateText[name];
-mkws.registerWidgetType('Authname', function() {
+mkws.registerWidgetType('auth-name', function() {
var that = this;
this.team.queue("authenticated").subscribe(function(authName) {
-mkws.registerWidgetType('Builder', function() {
+mkws.registerWidgetType('builder', function() {
var that = this;
var team = this.team;
});
this.node.append(button);
button.click(function() {
- var query = team.widget('Query').value();
- var sort = team.widget('Sort').value();
- var perpage = team.widget('Perpage').value();
+ var query = team.widget('query').value();
+ var sort = team.widget('sort').value();
+ var perpage = team.widget('per-page').value();
- var html = ('<div class="mkwsRecords" ' +
+ var html = ('<div class="mkws-records" ' +
'autosearch="' + query + '" ' +
'sort="' + sort + '" ' +
'perpage="' + perpage + '"></div>');
});
});
-mkws.registerWidgetType('ConsoleBuilder', function() {
- mkws.promotionFunction('Builder').call(this);
+mkws.registerWidgetType('console-builder', function() {
+ mkws.promotionFunction('builder').call(this);
this.callback = function(s) {
console.log("generated widget: " + s);
}
-mkws.registerWidgetType('Categories', function() {
+mkws.registerWidgetType('categories', function() {
var that = this;
if (!mkws.authenticated) {
var text = [];
text.push("Select category: ");
- text.push("<select name='mkwsCategory' " +
+ text.push("<select name='mkws-category' " +
"onchange='mkws.limitCategory(\"" + that.team.name() + "\", this.value)'>");
text.push("<option value=''>[All]</option>");
$(data).find('category').each(function() {
-mkws.registerWidgetType('Log', function() {
+mkws.registerWidgetType('log', function() {
var that = this;
this.team.queue("log").subscribe(function(teamName, timestamp, message) {
// source files.
-mkws.registerWidgetType('Targets', function() {
+mkws.registerWidgetType('targets', function() {
if (!this.config.show_switch) return;
var that = this;
});
-mkws.registerWidgetType('Stat', function() {
+mkws.registerWidgetType('stat', function() {
var that = this;
this.team.queue("stat").subscribe(function(data) {
var template = that.team.loadTemplate(that.config.template || "Stat");
});
-mkws.registerWidgetType('Pager', function() {
+mkws.registerWidgetType('pager', function() {
var that = this;
var M = mkws.M;
});
});
-mkws.registerWidgetType('Details', function() {
+mkws.registerWidgetType('details', function() {
var that = this;
var recid = that.node.attr("data-mkws-recid");
if (this.team.gotRecords()) {
that.autosearch();
});
-mkws.registerWidgetType('Records', function() {
+mkws.registerWidgetType('records', function() {
var that = this;
var team = this.team;
that.team.queue("record").publish(hit);
hit.detailLinkId = team.recordElementId(hit.recid[0]);
hit.detailClick = "mkws.showDetails('" + team.name() + "', '" + hit.recid[0] + "');return false;";
- hit.containerClass = "mkwsSummary mkwsTeam_" + team.name();
+ hit.containerClass = "mkws-summary mkws-team-" + team.name();
hit.containerClass += " " + hit.detailLinkId;
// ### At some point, we may be able to move the
// m_currentRecordId and m_currentRecordData members
});
-mkws.registerWidgetType('Navi', function() {
+mkws.registerWidgetType('navi', function() {
var that = this;
var teamName = this.team.name();
});
-// It seems this and the Perpage widget doen't need to subscribe to
+// It seems this and the per-page widget doen't need to subscribe to
// anything, since they produce events rather than consuming them.
//
-mkws.registerWidgetType('Sort', function() {
+mkws.registerWidgetType('sort', function() {
var that = this;
this.node.change(function() {
});
-mkws.registerWidgetType('Perpage', function() {
+mkws.registerWidgetType('per-page', function() {
var that = this;
this.node.change(function() {
});
-mkws.registerWidgetType('Done', function() {
+mkws.registerWidgetType('done', function() {
var that = this;
this.team.queue("complete").subscribe(function(n) {
var template = that.team.loadTemplate(that.config.template || "Done");
});
-mkws.registerWidgetType('Switch', function() {
+mkws.registerWidgetType('switch', function() {
if (!this.config.show_switch) return;
var tname = this.team.name();
var output = {};
});
-mkws.registerWidgetType('Search', function() {
+mkws.registerWidgetType('search', function() {
var output = {};
output.team = this.team.name();
output.queryWidth = this.config.query_width;
});
-mkws.registerWidgetType('SearchForm', function() {
+mkws.registerWidgetType('search-form', function() {
var team = this.team;
this.node.submit(function() {
- var val = team.widget('Query').value();
+ var val = team.widget('query').value();
team.newSearch(val);
return false;
});
});
-mkws.registerWidgetType('Results', function() {
+mkws.registerWidgetType('results', function() {
var template = this.team.loadTemplate(this.config.template || "Results");
this.node.html(template({team: this.team.name()}));
this.autosearch();
});
-mkws.registerWidgetType('Ranking', function() {
+mkws.registerWidgetType('ranking', function() {
var output = {};
output.perPage = [];
output.sort = [];
});
-mkws.registerWidgetType('Lang', function() {
+mkws.registerWidgetType('lang', function() {
// dynamic URL or static page? /path/foo?query=test
/* create locale language menu */
if (!this.config.show_lang) return;
});
-mkws.registerWidgetType('MOTD', function() {
- var container = this.team.widget('MOTDContainer');
+mkws.registerWidgetType('motd', function() {
+ var container = this.team.widget('motd-container');
if (container) {
// Move the MOTD from the provided element down into the container
this.node.appendTo(container.node);
// is copied up into its team, allowing it to affect other widgets in
// the team.
//
-mkws.registerWidgetType('Config', function() {
+mkws.registerWidgetType('config', function() {
var c = this.config;
for (var name in c) {
if (c.hasOwnProperty(name)) {
});
-mkws.registerWidgetType('Progress', function() {
+mkws.registerWidgetType('progress', function() {
var that = this;
this.node.hide();
this.team.queue("stat").subscribe(function(data) {
// no actual functionality. We register these to prevent ignorable
// warnings when they occur.
-mkws.registerWidgetType('Query', function() {});
-mkws.registerWidgetType('MOTDContainer', function() {});
-mkws.registerWidgetType('Button', function() {});
+mkws.registerWidgetType('query', function() {});
+mkws.registerWidgetType('motd-container', function() {});
+mkws.registerWidgetType('button', function() {});
})(mkws.$); // jQuery wrapper
// A widget for one record
-mkws.registerWidgetType('Record', function() {
+mkws.registerWidgetType('record', function() {
if (!this.config.maxrecs) this.config.maxrecs = 1;
var that = this;
var team = this.team;
that.autosearch();
});
-mkws.registerWidgetType('Image', function() {
- mkws.promotionFunction('Records').call(this);
+mkws.registerWidgetType('image', function() {
+ mkws.promotionFunction('records').call(this);
if (!this.config.template) this.config.template = 'Image';
});
-mkws.registerWidgetType('GoogleImage', function() {
- mkws.promotionFunction('Image').call(this);
+mkws.registerWidgetType('google-image', function() {
+ mkws.promotionFunction('image').call(this);
if (!this.config.target) this.config.target = 'Google_Images';
});
-mkws.registerWidgetType('Lolcat', function() {
- mkws.promotionFunction('GoogleImage').call(this);
+mkws.registerWidgetType('lolcat', function() {
+ mkws.promotionFunction('google-image').call(this);
if (!this.config.autosearch) this.config.autosearch = 'kitteh';
});
-mkws.registerWidgetType('Coverart', function() {
- mkws.promotionFunction('Image').call(this);
+mkws.registerWidgetType('cover-art', function() {
+ mkws.promotionFunction('image').call(this);
if (!this.config.target) this.config.target = 'AmazonBooks';
});
-mkws.registerWidgetType('Reference', function() {
- mkws.promotionFunction('Record').call(this);
+mkws.registerWidgetType('reference', function() {
+ mkws.promotionFunction('record').call(this);
if (!this.config.target) this.config.target = 'wikimedia_wikipedia_single_result';
if (!this.config.template) this.config.template = 'Reference';
this.config.template_vars.paragraphs = this.config.paragraphs || 0;
<i>{{md-title-responsibility}}</i>
{{/if}}
{{{mkws-paragraphs md-description paragraphs sentences}}}
-<p class="mkwsCredit">Wikipedia</p>
+<p class="mkws-credit">Wikipedia</p>
-mkws.registerWidgetType('Termlists', function() {
+mkws.registerWidgetType('termlists', function() {
// Initially hide the termlists; display when we get results
var that = this;
var team = this.team;
});
-mkws.registerWidgetType('Facet', function() {
+mkws.registerWidgetType('facet', function() {
var facetConfig = {
xtargets: [ "Sources", 16, false ],
subject: [ "Subjects", 10, true ],
}
var s = [];
- s.push('<div class="mkws', type, ' mkwsTeam_', attrs._team, '"');
+ s.push('<div class="mkws', type, ' mkws-team-', attrs._team, '"');
for (var name in attrs) {
if (name !== '_team')
s.push(' ', name, '="', attrs[name], '"');
if (fn) {
fn.call(that);
log("made " + type + " widget(node=" + node + ")");
- } else if (type.match(/-Container-(narrow|wide)$/)) {
+ } else if (type.match(/-[Cc]ontainer-(narrow|wide)$/)) {
// Not really a widget: no need to log its lack of promotion
} else {
log("made UNPROMOTED widget(type=" + type + ", node=" + node + ")");
field - for the xtargets facet ONLY, the opaque identifier of the target
}}
-<div class="mkwsFacetTitle">{{caption}}</div>
+<div class="mkws-facet-title">{{caption}}</div>
{{#each terms}}
- <div class="mkwsTerm">
+ <div class="mkws-term">
<a href="#" {{{linkdata}}}>{{term}}</a> <span>{{count}}</span>
</div>
{{/each}}
click - handler script to remove limit
}}
{{#each filters}}
- {{{mkws-translate facet}}}: <a class="mkwsRemovable" href="#" onclick="{{{click}}}">{{value}}</a>
+ {{{mkws-translate facet}}}: <a class="mkws-removable" href="#" onclick="{{{click}}}">{{value}}</a>
{{#unless @last}}|{{/unless}}
{{/each}}
<div style="float: clear">
{{#if prevClick}}
- <a href="#" class="mkwsPrev" onclick="{{prevClick}}"><< {{{mkws-translate "Prev"}}}</a> |
+ <a href="#" class="mkws-prev" onclick="{{prevClick}}"><< {{{mkws-translate "Prev"}}}</a> |
{{else}}
- <span class="mkwsPrev"><< {{{mkws-translate "Prev"}}}</span> |
+ <span class="mkws-prev"><< {{{mkws-translate "Prev"}}}</span> |
{{/if}}
{{#if morePrev}}...{{/if}}
{{#if click}}
<a href="#" onclick="{{click}}">{{number}}</a>
{{else}}
- <span class="mkwsCurrentPage">{{number}}</span>
+ <span class="mkws-current-page">{{number}}</span>
{{/if}}
{{/each}}
{{#if moreNext}}...{{/if}}
{{#if nextClick}}
- | <a href="#" class="mkwsNext" onclick="{{nextClick}}">{{{mkws-translate "Next"}}} >></a>
+ | <a href="#" class="mkws-next" onclick="{{nextClick}}">{{{mkws-translate "Next"}}} >></a>
{{else}}
- | <span class="mkwsNext">{{{mkws-translate "Next"}}} >></span>
+ | <span class="mkws-next">{{{mkws-translate "Next"}}} >></span>
{{/if}}
</div>
done - number of targets complete
waiting - number of targets waiting
}}
-<span class="mkwsDone">{{#mkws-repeat done}}█{{/mkws-repeat}}</span>
+<span class="mkws-done">{{#mkws-repeat done}}█{{/mkws-repeat}}</span>
{{~#if waiting~}}
-<span class="mkwsWaiting">{{#mkws-repeat waiting}}█{{/mkws-repeat}}</span>
+<span class="mkws-waiting">{{#mkws-repeat waiting}}█{{/mkws-repeat}}</span>
{{~/if~}}
<form>
{{~#if showSort~}}
{{{mkws-translate "Sort by"}}}
- <select class="mkwsSort mkwsTeam_{{team}}">
+ <select class="mkws-sort mkws-team-{{team}}">
{{#each sort}}
{{#if selected}}
<option value="{{{key}}}" selected="selected">{{{mkws-translate label}}}</option>
{{~/if~}}
{{~#if showPerPage}}
{{{mkws-translate "and show"}}}
- <select class="mkwsPerpage mkwsTeam_{{team}}">
+ <select class="mkws-per-page mkws-team-{{team}}">
{{#each perPage}}
{{#if selected}}
<option value="{{perPage}}" selected="selected">{{perPage}}</option>
}}
<table width="100%" border="0" cellpadding="6" cellspacing="0">
<tr>
- <td class="mkwsTermlists-Container-wide mkwsTeam_{{team}}" width="250" valign="top">
- <div class="mkwsTermlists mkwsTeam_{{team}}"></div>
+ <td class="mkws-termlists-container-wide mkws-team-{{team}}" width="250" valign="top">
+ <div class="mkws-termlists mkws-team-{{team}}"></div>
</td>
- <td class="mkwsMOTDContainer mkwsTeam_{{team}}" valign="top">
- <div class="mkwsRanking mkwsTeam_{{team}}"></div>
- <div class="mkwsPager mkwsTeam_{{team}}"></div>
- <div class="mkwsNavi mkwsTeam_{{team}}"></div>
- <div class="mkwsRecords mkwsTeam_{{team}}"></div>
+ <td class="mkws-motd-container mkws-team-{{team}}" valign="top">
+ <div class="mkws-ranking mkws-team-{{team}}"></div>
+ <div class="mkws-pager mkws-team-{{team}}"></div>
+ <div class="mkws-navi mkws-team-{{team}}"></div>
+ <div class="mkws-records mkws-team-{{team}}"></div>
</td>
</tr>
<tr>
<td colspan="2">
- <div class="mkwsTermlists-Container-narrow mkwsTeam_{{team}}"></div>
+ <div class="mkws-termlists-container-narrow mkws-team-{{team}}"></div>
</td>
</tr>
</table>
team - MKWS team
queryWidth - configured width for search box
}}
-<form name="mkwsSearchForm" class="mkwsSearchForm mkwsTeam_{{team}}" action="">
- <input class="mkwsQuery mkwsTeam_{{team}}" type="text" size="{{queryWidth}}">
- <input class="mkwsButton mkwsTeam_{{team}}" type="submit" value="{{{mkws-translate "Search"}}}">
+<form name="mkws-search-form" class="mkws-search-form mkws-team-{{team}}" action="">
+ <input class="mkws-query mkws-team-{{team}}" type="text" size="{{queryWidth}}">
+ <input class="mkws-button mkws-team-{{team}}" type="submit" value="{{{mkws-translate "Search"}}}">
</form>
records - number of records returned and available
hits - number of hits across all targets
}}
- -- <span class="mkwsClientCount">{{{mkws-translate "Active clients"}}} : {{activeclients}}/{{clients}}</span> -- {{{mkws-translate "Retrieved records"}}} : {{records}}/{{hits}}
+ -- <span class="mkws-client-count">{{{mkws-translate "Active clients"}}} : {{activeclients}}/{{clients}}</span> -- {{{mkws-translate "Retrieved records"}}} : {{records}}/{{hits}}
facets - array of facet names
}}
-<div class="mkwsTermlistsTitle">Termlists</div>
+<div class="mkws-termlists-title">Termlists</div>
{{#each facets}}
- <div class="mkwsFacet mkwsTeam_{{../team}}" data-mkws-facet="{{this}}"></div>
+ <div class="mkws-facet mkws-team-{{../team}}" data-mkws-facet="{{this}}"></div>
{{/each}}