зеркало из https://github.com/mozilla/popcorn-js.git
Fixing review comments.
This commit is contained in:
David Humphrey
Родитель
c941ad5f2f
Коммит
ca47490350
|
|
@ -29,7 +29,7 @@
|
|||
"{{/empty}}" ,
|
||||
|
||||
data: '{' +
|
||||
' "header": "Colors", ' +
|
||||
' "header": "Test 1", ' +
|
||||
' "items": [ ' +
|
||||
' {"name": "red", "first": true, "url": "#Red"}, ' +
|
||||
' {"name": "green", "link": true, "url": "#Green"}, ' +
|
||||
|
|
@ -61,7 +61,7 @@
|
|||
"{{/empty}}" ;
|
||||
},
|
||||
data: {
|
||||
header: "Colors",
|
||||
header: "Test 2",
|
||||
items: [
|
||||
{ name: "red", first: true, url: "#Red" },
|
||||
{ name: "green", link: true, url: "#Green" },
|
||||
|
|
@ -94,7 +94,7 @@
|
|||
data: function(plugin, options) {
|
||||
return JSON.parse('' +
|
||||
'{' +
|
||||
' "header": "Colors", ' +
|
||||
' "header": "Test 3", ' +
|
||||
' "items": [ ' +
|
||||
' {"name": "red", "first": true, "url": "#Red"}, ' +
|
||||
' {"name": "green", "link": true, "url": "#Green"}, ' +
|
||||
|
|
|
|||
|
|
@ -39,9 +39,8 @@
|
|||
* data: the data to be rendered using the mustache template. This can be a JSON String,
|
||||
* a JavaScript Object literal, or a Function returning a String or Literal.
|
||||
*
|
||||
* static: an optional argument indicating that the template and json data are static
|
||||
* and can be safely preloaded and cached. Defaults to False (i.e., json data
|
||||
* will be loaded only when needed, and every time needed vs. at setup).
|
||||
* dynamic: an optional argument indicating that the template and json data are dynamic
|
||||
* and need to be loaded dynamically on every use. Defaults to True.
|
||||
*
|
||||
* Example:
|
||||
var p = Popcorn('#video')
|
||||
|
|
@ -77,7 +76,7 @@
|
|||
' ],' +
|
||||
' "empty": false' +
|
||||
'}',
|
||||
static: true // The json is not going to change, load it early.
|
||||
dynamic: false // The json is not going to change, load it early.
|
||||
} )
|
||||
|
||||
// Example showing Functions instead of Strings.
|
||||
|
|
@ -99,11 +98,13 @@
|
|||
|
||||
Popcorn.plugin( "mustache" , function() {
|
||||
|
||||
var getData,
|
||||
data,
|
||||
getTemplate,
|
||||
template,
|
||||
self;
|
||||
function get( name, options ) {
|
||||
return options._instance[name];
|
||||
}
|
||||
|
||||
function set( name, options, value ) {
|
||||
options._instance[name] = value;
|
||||
}
|
||||
|
||||
return {
|
||||
manifest: {
|
||||
|
|
@ -119,54 +120,58 @@
|
|||
target : 'mustache-container',
|
||||
template : {elem:'input', type:'text', label:'Template'},
|
||||
data : {elem:'input', type:'text', label:'Data'},
|
||||
static : {elem:'input', type:'checkbox', label:'Static'} /* TODO: how to show a checkbox/boolean? */
|
||||
dynamic : {elem:'input', type:'text', label:'Dynamic'} /* TODO: how to show a checkbox/boolean? */
|
||||
}
|
||||
},
|
||||
|
||||
_setup : function( options ) {
|
||||
this.start = options.start;
|
||||
this.end = options.end;
|
||||
options._instance = { getData: null,
|
||||
data: null,
|
||||
getTemplate: null,
|
||||
template: null };
|
||||
|
||||
var shouldReload = !!options.dynamic;
|
||||
|
||||
if (typeof options.template === 'function') {
|
||||
if (options.static) {
|
||||
template = options.template(this, options);
|
||||
if (!shouldReload) {
|
||||
set('template', options, options.template(options));
|
||||
} else {
|
||||
getTemplate = options.template;
|
||||
set('getTemplate', options, options.template);
|
||||
}
|
||||
} else if (typeof options.template === 'string') {
|
||||
template = options.template;
|
||||
set('template', options, options.template);
|
||||
} else {
|
||||
throw "Mustache Plugin Error: options.template must be a String or a Function.";
|
||||
}
|
||||
|
||||
if (typeof options.data === 'function') {
|
||||
if (options.static) {
|
||||
data = options.data(this, options);
|
||||
if (!shouldReload) {
|
||||
set('data', options, options.data(options));
|
||||
} else {
|
||||
getData = options.data;
|
||||
set('getData', options, options.data);
|
||||
}
|
||||
} else if (typeof options.data === 'string') {
|
||||
data = JSON.parse(options.data);
|
||||
set('data', options, JSON.parse(options.data));
|
||||
} else if (typeof options.data === 'object') {
|
||||
data = options.data;
|
||||
set('data', options, options.data);
|
||||
} else {
|
||||
throw "Mustache Plugin Error: options.data must be a String, Object, or Function.";
|
||||
}
|
||||
|
||||
self = this;
|
||||
},
|
||||
|
||||
start: function( event, options ) {
|
||||
// if not static=true, freshen json data on every call to start, just in case.
|
||||
if (getData) {
|
||||
data = getData(this, options);
|
||||
// if dynamic, freshen json data on every call to start, just in case.
|
||||
if (get('getData', options)) {
|
||||
set('data', options, get('getData', options)(options));
|
||||
}
|
||||
|
||||
if (getTemplate) {
|
||||
template = getTemplate(this, options);
|
||||
if (get('getTemplate', options)) {
|
||||
set('template', options, get('getTemplate', options)(options));
|
||||
}
|
||||
|
||||
var html = Mustache.to_html(template, data).replace(/^\s*/mg, '');
|
||||
var html = Mustache.to_html( get('template', options),
|
||||
get('data', options)
|
||||
).replace(/^\s*/mg, '');
|
||||
document.getElementById(options.target).innerHTML = html;
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -26,9 +26,9 @@ test("Popcorn Mustache Plugin", function () {
|
|||
start: 1, // seconds
|
||||
end: 3, // seconds
|
||||
template: "<h1>{{heading}}</h1>",
|
||||
data: '{"heading": "mustache"}',
|
||||
data: '{"heading": "mustache - test 1/3"}',
|
||||
target: 'mustache-div',
|
||||
static: true
|
||||
dynamic: false
|
||||
} );
|
||||
|
||||
// Dynamic functions
|
||||
|
|
@ -39,7 +39,7 @@ test("Popcorn Mustache Plugin", function () {
|
|||
return "<h1>{{heading}}</h1>";
|
||||
},
|
||||
data: function(plugin, options) {
|
||||
return JSON.parse('{"heading": "mustache"}');
|
||||
return JSON.parse('{"heading": "mustache - test 2/3"}');
|
||||
},
|
||||
target: 'mustache-div',
|
||||
} );
|
||||
|
|
@ -51,9 +51,9 @@ test("Popcorn Mustache Plugin", function () {
|
|||
template: function(plugin, options) {
|
||||
return "<h1>{{heading}}</h1>";
|
||||
},
|
||||
data: { heading: "mustache" },
|
||||
data: { heading: "mustache - test 3/3" },
|
||||
target: 'mustache-div',
|
||||
static: true
|
||||
dynamic: false
|
||||
} );
|
||||
|
||||
var video = document.getElementById('video');
|
||||
|
|
@ -61,21 +61,21 @@ test("Popcorn Mustache Plugin", function () {
|
|||
|
||||
video.addEventListener('timeupdate', function() {
|
||||
|
||||
function pass() {
|
||||
ok( /<h1>mustache<\/h1>/.test( mustacheDiv.innerHTML ), "Mustache template rendered" );
|
||||
function pass(a, b) {
|
||||
ok( "<h1>mustache - test " + a + "/" + b + "<\/h1>" === mustacheDiv.innerHTML, "Mustache template rendered" );
|
||||
plus();
|
||||
}
|
||||
|
||||
var t = Math.floor(video.currentTime);
|
||||
|
||||
if (t === 2 && !two) {
|
||||
pass();
|
||||
pass(1, 3);
|
||||
two = true;
|
||||
} else if (t === 6 && !six) {
|
||||
pass();
|
||||
pass(2, 3);
|
||||
six = true;
|
||||
} else if (t === 10 && !ten) {
|
||||
pass();
|
||||
pass(3, 3);
|
||||
ten = true;
|
||||
}
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче