- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有什么:我正在编写我的非常普通的媒体播放器。所以在其中的某个地方我收集了字幕(假设每部电影大约有 2000 个)。所以每个字幕看起来像:
Object {
id: "1"
startTime: 2468
endTime: 4743
text: "Test subtitle."
}
我想:非常有效地做两件事:
.next()
方法应该让我得到下一个字幕。 .getByTime(neededTime)
以有效的方式对整个字幕集合进行二进制搜索。重点是 neededTime
可能介于 startTime
和 endTime
属性之间(即 3000)。问题:我要为我的字幕使用 Backbone 集合,但它如何处理这两个要求?我的意思是也许手动实现迭代器模式和二进制搜索会更好?
最佳答案
不知道这是否是最好的解决方案,但我以:
if (!Number.isInteger) {
Number.isInteger = function isInteger (nVal) {
return typeof nVal === "number" && isFinite(nVal) && nVal > -9007199254740992 && nVal < 9007199254740992 && Math.floor(nVal) === nVal;
};
}
/**
* Model
*/
var Subtitle = Backbone.Model.extend({
defaults: {
'startTime': '',
'endTime': '',
'text': ''
},
validate: function(attrs) {
if (!this.get('startTime')) return 'You missed startTime';
if (!this.get('endTime')) return 'You missed endTime';
if (!this.get('text')) return 'You missed text';
if (this.get('startTime') > this.get('endTime')) return 'startTime cannot be greater than endTime';
},
/**
* Compare two time periods
* @param that Subtitle with which we compare the current one
* @returns {number} positive if {@code this} is greater than {@code that}, negative if {@code this} is less than {@code that}
* and zero if they are equals or overlaps or one time period contains another.
*/
equals: function(that) {
if (!(that instanceof Subtitle)) throw Error('Cannot compare with element that does not belong to Subtitle type');
if (this.get('startTime') > that.get('endTime')) return 1;
else if (that.get('startTime') > this.get('endTime')) return -1;
else return 0;
},
/**
*
* @param moment moment for which we need to find a time period
* @returns {number} positive if {@code moment} belongs to time period greater than {@code this},
* negative if {@code moment} belongs to time period less than {@code this}
* and zero if the curect time period contain the {@code moment}.
*/
containMoment: function(moment) {
if (!Number.isInteger(moment)) throw Error('Moment should be an Integer');
if (moment >= this.get('startTime') && moment <= this.get('endTime')) return 0;
else if (moment < this.get('startTime')) return -1;
else if (moment > this.get('endTime')) return +1;
else throw Error('Impossible case :-)');
}
});
/**
* Collection
*/
var Subtitles = Backbone.Collection.extend({
model: Subtitle,
index: 0,
next: function() {
return this.at(this.index++);
},
getByMoment: function(moment) {
return this._binarySearch(this.toArray(), moment);
},
_binarySearch: function(array, moment) {
'use strict';
var minIndex = 0;
var maxIndex = array.length - 1;
var currentIndex;
var currentElement;
while (minIndex <= maxIndex) {
currentIndex = (minIndex + maxIndex) / 2 | 0;
currentElement = array[currentIndex];
if (currentElement.containMoment(moment) > 0) {
minIndex = currentIndex + 1;
}
else if (currentElement.containMoment(moment) < 0) {
maxIndex = currentIndex - 1;
}
else {
return array[currentIndex];
}
}
throw Error('No subtitle for this moment');
}
});
/**
* Test
*/
var data = [
{ id: '1',
startTime: 2468,
endTime: 4743,
text: 'Here\'s little Ben nodding off.' },
{ id: '2',
startTime: 5389,
endTime: 7698,
text: 'Look at Aunt Monica\'s Little boy.' },
{ id: '3',
startTime: 7948,
endTime: 11099,
text: '-Look, he\'s got Ross\' hair cut.\n-Let me see.' },
{ id: '4',
startTime: 11948,
endTime: 14907,
text: 'Oh, God!\nIs he just the sweetest thing?' },
{ id: '5',
startTime: 15148,
endTime: 17946,
text: 'You must just want\nto kiss him all over.' }
];
var subtitles = new Subtitles();
subtitles.add(data);
var moment = 3000;
console.log(subtitles.next().attributes);
console.log(subtitles.next().attributes);
console.log(subtitles.next().attributes);
console.log(subtitles.next().attributes);
console.log(subtitles.getByMoment(moment).attributes);
关于javascript - 主干集合 : iterate & search effectively,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25977522/
我开发了一个 jquery &backbone.js 网络应用程序。 一个组件有一个 html 表,该表后面是一个主干.js 集合。 此集合中的任何更改都应该导致 html 表的更新,所以我写 thi
我创建了一个由 HTTP Basic 保护的无状态 RESTful API。 在客户端,我将创建一个登录表单,向/auth-check 发送请求以检查凭据,并根据状态代码,将这些凭据存储在客户端并使用
我已经有一个具有经典结构的存储库 /branches /current /beta /tags /1.0 /2.0 /trunk 我想从当前的编辑器切换到 Eclipse,但我应该创建
我正在阅读 red bean SVN book ,它说要像这样布局主干、分支和标签文件夹: $ svn list file:///var/svn/multi-project-repo project-
当特定属性发生变化时,Backbone 模型触发自定义事件的好方法是什么? 到目前为止,这是我得到的最好的: var model = Backbone.Model.extend({ initi
我想避免在 Backbone.Collection 上的每个“添加删除重置”事件上重新渲染。 所以在 Backbone.View 中我可能有: this.listenTo(this.collectio
这一定是我没有正确理解的东西。 我有一个名为 Album 的 Backbone 模型: var Album = Backbone.Model.extend({ idAttribute: "_id",
假设我有一个具有一堆 bool 属性的 Backbone 模型: Car = Backbone.Model.extend({}); car_one = new Car({ a_c: true,
我从 collection.fetch() 调用中得到一个包含多个嵌套对象的对象。有没有办法解析这些子对象并将它们作为单独的模型传递到集合中? 这是我要返回的数据的示例。从服务器获取时,我想将它作为
有一个脚本(js),我希望在它上面运行,比如$(document).ready()。有一种方法可以在模板(例如 home_tpl.html)文件中编写脚本。但我确信这不是一个好方法。 我正在从主干 V
配合我正在尝试从主干集合中包含的所有模型中获取更大的属性。 举个例子: App.Models.Example = Backbone.Model.extend({ defaults: {
我遇到这样一种情况,我需要为一个人保存几个对象,但一次保存一个对象,并且在获取时,我将所有对象作为一个数组以及该人的信息。 这是模型的样子: //Model for one save { pe
我开始阅读一些 Backbone 教程,发现一件让我惊讶的事情。为什么模型是在 View 内部创建的?如果我想要一个模型有两个不同的 View (我认为 MVC 的用途)怎么办?假设我需要一个模型 C
我使用backbone.js 创建了一个小型网站。它托管在 IIS 7 中。 路由: routes: { "/": "index", "": "ind
我现在正在构建一个 View ,当我单击 .organization 链接时,我想触发我的编辑事件,但是单击此元素时,没有任何内容被触发,我无法理解为什么。 这是构建我的 View 的代码, App.
我有一些全局参数,我想在每次调用集合上的提取时发送这些参数...我的问题是我不想声明 data: { ... }每次我获取。 有没有一种方法可以在 Collection 本身内部提供默认参数,并可以添
Backbone 新手在这里。我想开始在 Web 应用程序上使用主干(后端是 Ruby on Rails),直到现在它的客户端功能还很少(一些用于执行 slideToggles 的 jquery,以及
我想知道是否有办法从其中一个模型中获取对集合的引用。例如,如果下面集合中的任何人以某种方式知道属于一个集合或多个集合。 Fiddle (function() { window.App = {
如何在集合获取中阻止模型的解析功能? $(function() { var Task = Backbone.Model.extend({ url : function(
我们一直在使用位于文件夹根目录中的存储库,一切都很好。然而,自从网站上线后,我们需要对一些工作进行分支,但由于缺少主干而无法这样做。 我的问题是,如何在当前目录结构中创建一个主干并将所有当前内容移动到
我是一名优秀的程序员,十分优秀!