diff --git a/.editorconfig b/.editorconfig
index e7be2dec..84119a45 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -10,7 +10,7 @@ tab_width = 2
indent_size = 2
[*.js]
-indent_style = tab
+indent_style = space
tab_width = 2
[*.css]
diff --git a/.gitignore b/.gitignore
index cd8b18fd..ae99498d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,7 +2,28 @@
/.idea
*.iml
+# Eclipse
+/.project
+
# Ignore Node Modules
/node_modules/*
+
+# Ignore CI
/compiled_spec/*
/coverage/*
+
+# Ignore temporary core compile output
+/compiled_src/*
+
+# Ignore tscache
+.tscache
+
+# Ignore .baseDir related things
+# These are only used as transient items due to compiling TypeScript. They may
+# become useful when the project can fully move to TypeScript.
+.baseDir.ts
+.baseDir.js
+.baseDir.js.map
+
+# Ignore typescript tmp files
+*.tmp.txt
diff --git a/.npmignore b/.npmignore
new file mode 100644
index 00000000..edb059f8
--- /dev/null
+++ b/.npmignore
@@ -0,0 +1,13 @@
+# Non-package items
+/spec
+/test
+/docs
+/demo
+/experimental
+
+# Temporary files
+.tscache
+/compiled_spec
+/compiled_src
+/coverage
+
diff --git a/.travis.yml b/.travis.yml
index 40e3c0c6..c7369da8 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,10 +1,13 @@
language: node_js
+sudo: required
+dist: trusty
+addons:
+ chrome: stable
node_js:
- - "0.10"
+ - "12.2.0"
before_install:
- - npm install npm@1.4 -g
+ - npm install npm -g
before_script:
- npm install -g grunt-cli
script:
- - grunt ci
- - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js
+ - npm run-script ci
diff --git a/BUILDING.md b/BUILDING.md
index 4d807904..c7853330 100644
--- a/BUILDING.md
+++ b/BUILDING.md
@@ -1,10 +1,11 @@
-Building 编译项目
-==============================
-本项目采用 grunt 管理编译,有关 Grunt 系统的使用请参考[官方文档](http://gruntjs.com/getting-started)
-脚本弹幕部分的编译还需要 [TypeScript](http://www.typescriptlang.org/) 。这些库还会依赖于
-NodeJS环境。
+# Building 编译项目
-### 确定你是否需要编译 (Do I need to build CCL?)
+本项目采用 grunt 管理编译,有关 Grunt 系统的使用请参考
+[官方文档](http://gruntjs.com/getting-started) 脚本弹幕部分的编译需要
+[TypeScript](http://www.typescriptlang.org/) 。
+这些库还会依赖于NodeJS环境。
+
+### 确定你是否需要编译 Do I need to build CCL?
CommentCoreLibrary在库外提供了很多可扩展的空间,你可以相对简单的增加新的弹幕格式的支持,新的弹幕
运行模式的支持和挂载各种不同的定时元件。CCL提供了丰富的扩展支持,通过预处理过滤器和运行时过滤器可以
实现非常多的特殊功能支持。编译库意味着你可能需要一些默认环境没有的软件,比如 NodeJS 平台,为此需要
@@ -13,8 +14,8 @@ CommentCoreLibrary在库外提供了很多可扩展的空间,你可以相对
当然自己编译也会带来一些优势,比如更小的库大小和更加专注的功能支持。还有,希望帮助CCL实现更多支持的
开发者们也需要知道如何有效的编译。
-### 配置编译环境(Setup Build Environment)
-初次编译请确保你安装了 `node>=0.8.0`,为全局系统安装 grunt 请执行:
+### 配置编译环境Setup Build Environment
+初次编译请确保你安装了 `node>=1.0.0`,为全局系统安装 grunt 请执行:
npm install -g grunt-cli
@@ -31,10 +32,10 @@ CommentCoreLibrary在库外提供了很多可扩展的空间,你可以相对
即可按照默认模板编译。除此之外,你还可以改变编译目标:
-- build : 只编译项目,不会clean掉build文件夹下的产物
-- build-core : 只编译弹幕核心,不包括Acfun和Bilibili的解析器。这个更加适用各种二次开发不需要
- 已有的弹幕格式的
-- build-scripting : 只编译代码弹幕支持
+- `build` : 只编译项目,不会clean掉build文件夹下的产物
+- `build:core` : 只编译弹幕核心,不包括CommentProvider和parsers里面的解析器。
+ 这个更加适用不需要已有的弹幕格式的各种二次开发
+- `build:scripting` : 只编译代码弹幕支持
默认模式会自动看管 `src` 源码文件夹,并且在产生变化的时候自动生成新版。
diff --git a/Gruntfile.coffee b/Gruntfile.coffee
index 918299e9..26dac396 100644
--- a/Gruntfile.coffee
+++ b/Gruntfile.coffee
@@ -2,11 +2,12 @@ module.exports = (grunt) ->
require('load-grunt-tasks') grunt , {
pattern: ['grunt-*', '!grunt-template-jasmine-istanbul']
}
- grunt.file.readJSON('package.json')
+ # Read package.json to make sure it's there
+ pkg = grunt.file.readJSON('package.json')
# !! Compile configurations
- License = '/*!Copyright(c) CommentCoreLibrary (//github.com/jabbany/CommentCoreLibrary) - Licensed under the MIT License */'
- FilterType = "Simple" # "Comment" || "Simple"
+ LICENSE = '/*!Copyright(c) CommentCoreLibrary v' + pkg.version +
+ ' (//github.com/jabbany/CommentCoreLibrary) - Licensed under the MIT License */'
# !! End of config area
CSS = [
@@ -14,134 +15,143 @@ module.exports = (grunt) ->
'src/css/fontalias.css'
]
- SRC_CORE_CMP = [
- 'Comment'
- 'CommentSpaceAllocator'
- ]
-
SRC_CORE = [
'src/Array.js'
- 'src/core/CommentSpaceAllocator.js'
- 'src/core/Comment.js'
- 'src/filter/' + FilterType + 'Filter.js'
- 'src/CommentCoreLibrary.js'
+ 'src/CommentManager.js'
+ 'compiled_src/core/Comment.js'
+ 'compiled_src/core/CommentFactory.js'
+ 'compiled_src/core/CommentSpaceAllocator.js'
+ 'compiled_src/core/CommentUtils.js'
+ 'compiled_src/core/css-renderer/CssComment.js'
]
- SRC_SCRIPTING_KAGEROU =
- display: 'src/scripting/api/Display/Display.ts'
- runtime: 'src/scripting/api/Runtime/Runtime.ts'
- player: 'src/scripting/api/Player/Player.ts'
- utils: 'src/scripting/api/Utils/Utils.ts'
- tween: 'src/scripting/api/Tween/Tween.ts'
-
- SRC_PARSER = [
- 'src/parsers/AcfunFormat.js'
- 'src/parsers/BilibiliFormat.js'
+ SRC_MODULES =
+ 'filter': ['src/filter/CommentFilter.js']
+ 'provider': ['src/CommentProvider.js', 'src/Promises.js']
+ 'format-bilibili': ['src/parsers/BilibiliFormat.js']
+ 'format-acfun': ['src/parsers/AcfunFormat.js']
+ 'format-common': ['src/parsers/CommonDanmakuFormat.js']
+
+ # Typescript targets
+ SRC_TS_CORE = [
+ 'src/core/Comment.ts'
+ 'src/core/CommentFactory.ts'
+ 'src/core/CommentSpaceAllocator.ts'
+ 'src/core/CommentUtils.ts'
+ 'src/core/css-renderer/CssComment.ts'
]
- # !! Below are compile settings
- # Dynamically generate the core ts targets
- CMP_CORE_TS = { }
- CMP_CORE_NAME = [ ]
- for target in SRC_CORE_CMP
- CMP_CORE_NAME.push ("typescript:" + target)
- CMP_CORE_TS[target] =
- options:
- target: 'es5'
- basePath: 'src/core'
- src: "src/core/" + target + ".ts"
- dest: "src/core/" + target + ".js"
+ SRC_TS_SCRIPTING_KAGEROU =
+ 'Display': ['src/scripting/api/Display/Display.ts']
+ 'Runtime': ['src/scripting/api/Runtime/Runtime.ts']
+ 'Player': ['src/scripting/api/Player/Player.ts']
+ 'Utils': ['src/scripting/api/Utils/Utils.ts']
+ 'Tween': ['src/scripting/api/Tween/Tween.ts']
+
+ # ==== Below this point is logic to generate compile configurations ====
+ # You probably do not need to edit anything below here
+
+ # Dynamically generate the target for all
+ CMP_ALL = []
+ CMP_ALL = CMP_ALL.concat SRC_CORE
+ for name, source of SRC_MODULES
+ CMP_ALL = CMP_ALL.concat source
+
+ # Generate the core ts targets
+ CMP_CORE_TS =
+ 'core':
+ src: SRC_TS_CORE
+ outDir: 'compiled_src/'
+ CMP_CORE_NAME = ['ts:core']
# Dynamically generate the kagerou ts targets
- CMP_KAGEROU_TS = { }
- CMP_KAGEROU_NAME = [ ]
- for target,src of SRC_SCRIPTING_KAGEROU
- CMP_KAGEROU_NAME.push ('typescript:kagerou_engine_' + target)
- CMP_KAGEROU_TS['kagerou_engine_' + target] =
- options:
- target: 'es5'
- basePath: src.split('/')[0..-1].join('/')
+ CMP_KAGEROU_TS = {}
+ CMP_KAGEROU_NAME = []
+ for target, src of SRC_TS_SCRIPTING_KAGEROU
+ CMP_KAGEROU_NAME.push ('ts:kagerou_engine_' + target.toLowerCase())
+ CMP_KAGEROU_TS['kagerou_engine_' + target.toLowerCase()] =
src: src
- dest: 'build/scripting/api/' + src.split('/').pop().split('.')[0] + '.js'
+ out: 'dist/scripting/api/' + target + '.js'
# Append Typescript Tasks
- ts_config = {}
+ ts_config =
+ options:
+ target: 'es5'
+ sourceMap: false
+ rootDir: 'src/'
for key,value of CMP_CORE_TS
ts_config[key] = value
for key,value of CMP_KAGEROU_TS
ts_config[key] = value
- # Core concatenated with libraries
- # Actual concat ordering does not/should not matter
- SRC_CORELIB = SRC_CORE.concat(SRC_PARSER)
+ grunt.loadNpmTasks 'grunt-contrib-coffee'
+ grunt.loadNpmTasks 'grunt-contrib-jasmine'
- grunt.loadNpmTasks('grunt-contrib-coffee')
- grunt.loadNpmTasks('grunt-contrib-jasmine')
grunt.initConfig(
clean:
- scripting: ['build/scripting']
- build: ['build']
+ scripting: ['dist/scripting']
+ dist: ['dist']
# Concat CSS and JS files
- # core_only : builds CCL without parsers
- # all : builds CCL with everything
+ # dist_core : builds CCL with just the comment system
+ # dist_all : builds CCL with everything
+ # scripting_host : builds just the scripting host
concat:
- scripting_host:
+ dist_core:
files:
- 'build/scripting/Host.js': ['src/scripting/Host.js','src/scripting/Unpacker.js']
- core_only:
+ 'dist/css/style.css': CSS
+ 'dist/CommentCoreLibrary.js': SRC_CORE
+ dist_all:
files:
- 'build/style.css': CSS
- 'build/CommentCore.js': SRC_CORE
- all:
+ 'dist/css/style.css': CSS
+ 'dist/CommentCoreLibrary.js': CMP_ALL
+ scripting_host:
files:
- 'build/style.css': CSS
- 'build/CommentCoreLibrary.js': SRC_CORELIB
+ 'dist/scripting/Host.js': ['src/scripting/Host.js','src/scripting/Unpacker.js']
# Compile TypeScript
- typescript: ts_config
+ ts: ts_config
# Copy
copy:
scripting_sandbox:
files:[
- {expand: true, cwd:'src/scripting/api/', src: ['*.js'], dest:'build/scripting/api/'},
- {expand: true, cwd:'src/scripting/', src: ['OOAPI.js','Worker.js'], dest:'build/scripting/'}
+ {expand: true, cwd:'src/scripting/api/', src: ['*.js'], dest:'dist/scripting/api/'},
+ {expand: true, cwd:'src/scripting/', src: ['OOAPI.js','Worker.js'], dest:'dist/scripting/'}
]
# Auto-prefix CSS properties using Can I Use?
autoprefixer:
options:
browsers: ['last 3 versions', 'bb 10', 'android 3']
-
no_dest:
# File to output
- src: 'build/style.css'
+ src: 'dist/css/style.css'
# Minify CSS
cssmin:
minify:
- src: ['build/style.css']
- dest: 'build/style.min.css'
+ src: ['dist/css/style.css']
+ dest: 'dist/css/style.min.css'
+ # Minify JS
uglify:
- options: banner: License
- core_only:
- files:
- 'build/CommentCore.min.js': SRC_CORE
+ options:
+ banner: LICENSE
all:
files:
- 'build/CommentCoreLibrary.min.js': SRC_CORELIB
+ 'dist/CommentCoreLibrary.min.js': ['dist/CommentCoreLibrary.js']
# Watch files for changes
- #
watch:
- all:
- files: ['src/**/*', '!node_modules']
-
- # Run concat, autoprefixer, cssmin and uglify
+ scripting:
+ files: ['src/scripting/**/*', '!node_modules']
+ tasks: ['build:scripting']
+ core:
+ files: ['src/**/*', '!node_modules', '!src/scripting/**/*']
tasks: ['build']
+ # JSHint
jshint:
options:
curly: true,
@@ -161,37 +171,41 @@ module.exports = (grunt) ->
src: ['src/*.js']
# Jasmine test
-
jasmine:
coverage:
- src: 'src/**/*.js'
+ src: ['src/**/*.js', 'compiled_src/**/*.js']
options:
- specs: 'compiled_spec/*spec.js'
- helpers: 'spec/*helper.js'
+ specs: ['compiled_spec/*_spec.js']
+ helpers: ['compiled_spec/*_helper.js']
vendor: [
- 'node_modules/jasmine-jquery/vendor/jquery/jquery.js'
- 'node_modules/jasmine-jquery/lib/jasmine-jquery.js'
+ 'node_modules/jquery/dist/jquery.js'
+ 'node_modules/sinon/pkg/sinon.js'
+ 'node_modules/jasmine-sinon/lib/jasmine-sinon.js'
]
- template: require('grunt-template-jasmine-istanbul')
- templateOptions:
- report: 'coverage'
- coverage: 'coverage/coverage.json'
+ # Don't use this, it doesnt work anymore
+ #template: require('grunt-template-jasmine-istanbul')
+ #templateOptions:
+ # report: 'coverage'
+ # coverage: 'coverage/coverage.json'
ci:
- src: 'build/CommentCoreLibrary.js'
+ src: ['dist/CommentCoreLibrary.js']
options:
- specs: 'compiled_spec/*spec.js'
- helpers: 'spec/*helper.js'
+ specs: ['compiled_spec/*_spec.js']
+ helpers: ['compiled_spec/*_helper.js']
vendor: [
- 'node_modules/jasmine-jquery/vendor/jquery/jquery.js'
- 'node_modules/jasmine-jquery/lib/jasmine-jquery.js'
+ 'node_modules/jquery/dist/jquery.js'
+ 'node_modules/sinon/pkg/sinon.js'
+ 'node_modules/jasmine-sinon/lib/jasmine-sinon.js'
]
- template: require('grunt-template-jasmine-istanbul')
- templateOptions:
- report:
- type: 'lcovonly'
- options:
- dir: 'coverage'
- coverage: 'coverage/coverage.json'
+ # Don't use this, it doesnt work anymore
+ #template: require('grunt-template-jasmine-istanbul')
+ #templateOptions:
+ # report:
+ # type: 'lcovonly'
+ # options:
+ # dir: 'coverage'
+ # coverage: 'coverage/coverage.json'
+
coffee:
glob_to_multiple:
expand: true,
@@ -202,14 +216,15 @@ module.exports = (grunt) ->
)
# Register special compiles
- grunt.registerTask 'compile-ts-kagerou', CMP_KAGEROU_NAME
- grunt.registerTask 'compile-ts-core', CMP_CORE_NAME
+ grunt.registerTask 'compile:ts-core', CMP_CORE_NAME
+ grunt.registerTask 'compile:ts-kagerou', CMP_KAGEROU_NAME
# Register our tasks
- grunt.registerTask 'test', ['coffee', 'jasmine:coverage']
- grunt.registerTask 'build-scripting', ['clean:scripting','concat:scripting_host', 'compile-ts-kagerou', 'copy:scripting_sandbox']
- grunt.registerTask 'build-core', ['compile-ts-core', 'concat:core_only', 'autoprefixer', 'cssmin', 'uglify:core_only']
- grunt.registerTask 'build', ['compile-ts-core', 'concat:all', 'autoprefixer', 'cssmin', 'uglify:all']
+ grunt.registerTask 'build', ['compile:ts-core', 'concat:dist_all', 'autoprefixer', 'cssmin', 'uglify:all']
+ grunt.registerTask 'build:core', ['compile:ts-core', 'concat:dist_core', 'autoprefixer', 'cssmin', 'uglify:core']
+ grunt.registerTask 'build:scripting', ['clean:scripting','concat:scripting_host', 'compile:ts-kagerou', 'copy:scripting_sandbox']
+
grunt.registerTask 'ci', ['build', 'coffee', 'jasmine:ci']
- grunt.registerTask 'default', ['clean', 'build', 'build-scripting', 'watch']
+ grunt.registerTask 'test', ['coffee', 'jasmine:coverage']
+ grunt.registerTask 'default', ['clean', 'build', 'build:scripting']
diff --git a/LICENSE b/LICENSE
index 177c7d29..4486bca6 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,4 +1,4 @@
-Copyright (c) 2014 Jim Chen
+Copyright (c) 2017 Jim Chen
Permission is hereby granted, free of charge, to any person obtaining a copy of this software
and associated documentation files (the "Software"), to deal in the Software without restriction,
diff --git a/README.md b/README.md
index 331ee661..0d0a04d1 100644
--- a/README.md
+++ b/README.md
@@ -1,11 +1,12 @@
# CommentCoreLibrary 弹幕核心通用构件
[](http://badge.fury.io/js/comment-core-library)
[](http://badge.fury.io/bo/comment-core-library)
-[](http://gruntjs.com/)
[](http://opensource.org/licenses/MIT)
[](https://travis-ci.org/jabbany/CommentCoreLibrary)
[](https://coveralls.io/r/jabbany/CommentCoreLibrary?branch=master)
+Other Languages: [简体中文](README.zh_CN.md)
+
The CommentCoreLibrary is a set of Javascript modules that make up the
core controller for comments streaming on top of timed media (video or audio).
It is intended as a catalyst for the development of timed "danmaku" comments
@@ -16,7 +17,7 @@ inside their own projects (whether web based or not) are encouraged to learn
from and extend from the CommentCoreLibrary.
## Testing
-We have a live demo [here](http://jabbany.github.com/CommentCoreLibrary/demo).
+We have a live demo [here](http://jabbany.github.io/CommentCoreLibrary/demo).
Feel free to [open tickets](CONTRIBUTING.md) if this demo test has bugs.
## License
@@ -44,7 +45,6 @@ gem 'rails-assets-comment-core-library'
## Examples and Documentation
- [Documentation](docs/) can be found inside the `docs/` folder.
-- Some sample extension modules may be found in `src/extend/`.
- Experimental modules are in `experimental/`.
- You may test using test data found in `test/`.
@@ -55,35 +55,3 @@ We encourage any contributions to this project, please read
Also, feel free to have a look at our sister project
[ABPlayerHTML5](https://github.com/jabbany/ABPlayerHTML5) for a reference
implementation of a video player with CommentCoreLibrary.
-
-# 弹幕核心通用构件
-弹幕核心通用构件是一套基于JavaScript构建的弹幕控制器,意在催化HTML5下弹幕播放器的发展。同时方便
-希望了解弹幕播放器运作原理的开发者,提供简单但是深入的入门。开发者们可以根据弹幕核心通用构件来自定义
-自己的流媒体注释播放模式。
-
-不管你在开发基于Javascript的Web服务,还是其他的需要弹幕播放功能服务,都可以参考弹幕核心
-的实现代码。我们以简单的方法构建了 (1) 时间轴管理 (2) 基础空间规划 (3) 弹幕过滤 (4)
-高级弹幕效果 (5) 基础格式解析 (6) 代码弹幕支持。
-
-## 测试
-你可以在[这里](http://jabbany.github.com/CommentCoreLibrary/demo) 访问到测试页面。
-我们欢迎各种[BUG报告](CONTRIBUTING.md)。
-
-## 许可
-本项目采取非常宽松的MIT许可。该许可允许你把本项目运用在任何开源或是闭源的,非营利或商业性的项目中。
-您只需在使用到的地方添加下面一行注释:
-
- CommentCoreLibrary (//github.com/jabbany/CommentCoreLibrary) - Licensed under the MIT license
-
-## 使用
-- 有关本项目的[文档](docs/) 可以在 `docs/` 文件夹里面找到。
-- 一些功能性扩展模块会出现在 `src/extend/` 中。
-- 一些实验性模块在 `experimental/` 里。
-- 测试数据在 `test/` 里。
-
-## 做出贡献
-非常欢迎提交问题报告和意见建议,同时你也可以在GitHub上Fork本工程,并发送Pull请求来提交
-你对项目的贡献。我们非常欢迎二次开发哟!有关具体介绍请参考 [CONTRIBUTING](CONTRIBUTING.md)。
-
-我们欢迎对项目任何细节处的针对性研发,尤其比如:解析功能、高级弹幕/代码弹幕和CSS优化等。
-如果希望研发播放器的构造和功能,请参考姊妹项目 ABPlayerHTML5。
diff --git a/README.zh_CN.md b/README.zh_CN.md
new file mode 100644
index 00000000..94267604
--- /dev/null
+++ b/README.zh_CN.md
@@ -0,0 +1,39 @@
+# 弹幕核心通用构件 CommentCoreLibrary
+[](http://badge.fury.io/js/comment-core-library)
+[](http://badge.fury.io/bo/comment-core-library)
+[](http://gruntjs.com/)
+[](http://opensource.org/licenses/MIT)
+[](https://travis-ci.org/jabbany/CommentCoreLibrary)
+[](https://coveralls.io/r/jabbany/CommentCoreLibrary?branch=master)
+
+其它语言: [English](README.md)
+
+弹幕核心通用构件是一套基于JavaScript构建的弹幕控制器,意在催化HTML5下弹幕播放器的发展。同时方便
+希望了解弹幕播放器运作原理的开发者,提供简单但是深入的入门。开发者们可以根据弹幕核心通用构件来自定义
+自己的流媒体注释播放模式。
+
+不管你在开发基于Javascript的Web服务,还是其他的需要弹幕播放功能服务,都可以参考弹幕核心
+的实现代码。我们以简单的方法构建了 (1) 时间轴管理 (2) 基础空间规划 (3) 弹幕过滤 (4)
+高级弹幕效果 (5) 基础格式解析 (6) 代码弹幕支持。
+
+## 测试
+你可以在[这里](http://jabbany.github.io/CommentCoreLibrary/demo) 访问到测试页面。
+我们欢迎各种[BUG报告](CONTRIBUTING.md)。
+
+## 许可
+本项目采取非常宽松的MIT许可。该许可允许你把本项目运用在任何开源或是闭源的,非营利或商业性的项目中。
+您只需在使用到的地方添加下面一行注释:
+
+ CommentCoreLibrary (//github.com/jabbany/CommentCoreLibrary) - Licensed under the MIT license
+
+## 使用
+- 有关本项目的[文档](docs/) 可以在 `docs/` 文件夹里面找到。
+- 一些实验性模块在 `experimental/` 里。
+- 测试数据在 `test/` 里。
+
+## 做出贡献
+非常欢迎提交问题报告和意见建议,同时你也可以在GitHub上Fork本工程,并发送Pull请求来提交
+你对项目的贡献。我们非常欢迎二次开发哟!有关具体介绍请参考 [CONTRIBUTING](CONTRIBUTING.md)。
+
+我们欢迎对项目任何细节处的针对性研发,尤其比如:解析功能、高级弹幕/代码弹幕和CSS优化等。
+如果希望研发播放器的构造和功能,请参考姊妹项目 ABPlayerHTML5。
diff --git a/bower.json b/bower.json
index 4ba34c99..2977d4e6 100644
--- a/bower.json
+++ b/bower.json
@@ -1,8 +1,12 @@
{
- "name": "comment-core-library",
- "version": "0.9.2",
- "main": ["build/CommentCoreLibrary.js","build/style.css"],
- "ignore": [
+ "name": "comment-core-library",
+ "description": "Javascript library for organizing and displaying danmaku comments",
+ "license": "MIT",
+ "authors": [
+ "Jim Chen TagSoup: Filters: APIs:
" + "MAX:" + pmax + "
FPS:" + (avg > 0 ? Math.round(1000/avg) : 0);
- };
- this.getProfiles = function(){
- return profiles;
- };
- var self = this;
- var t = -1;;
- this.on = function(){
- if(t > 0)
- return;
- t = setInterval(function(){
- self.render();
- },150);
- $("profiler-start").style.color = "#0ff";
- };
- this.off = function(){
- if(t < 0)
- return;
- clearInterval(t);
- t = -1;
- $("profiler-start").style.color = "";
- $("pf-stats").innerHTML = "PF:OFF";
- };
- this.isOn = function(){
- return t >= 0;
- };
+var CCLDBG = new function() {
+ var x = 0;
+ var profiles = [];
+ var pmax = 0;
+ var smax = 0;
+ var sample = 0;
+ var avg = 0;
+ this.reset = function() {
+ profiles = [];
+ x = 0;
+ pmax = 0;
+ avg = 0;
+ sample = 0;
+ };
+ this.profiler = function() {
+ var t = (new Date()).getTime();
+ var tdiff = t - x;
+ if (tdiff < 10) {
+ return;
+ }
+ sample++;
+ if (sample % 100 == 0) {
+ sample = 0;
+ profiles.push(-1);
+ }
+ if (tdiff < 5000) {
+ avg += tdiff / 300;
+ profiles.push(tdiff);
+ if (tdiff > pmax) {
+ pmax = tdiff;
+ }
+ if (tdiff > smax) {
+ smax = tdiff;
+ }
+ if (profiles.length > 300) {
+ var del = profiles.shift();
+ avg -= del / 300;
+ }
+ }
+ x = t;
+ };
+ this.render = function() {
+ if (smax > avg * 4) {
+ smax = Math.round(avg * 4)
+ }
+ var ctx = $("profiler").getContext("2d");
+ if (ctx != null) {
+ ctx.fillStyle = "#00FFFF";
+ ctx.clearRect(0, 0, 300, 40);
+ for (var i = 0; i < profiles.length; i++) {
+ if (profiles[i] < 0) {
+ ctx.fillStyle = "#FF00FF";
+ ctx.fillRect(i, 0, 1, 40);
+ ctx.fillStyle = "#00FFFF";
+ continue;
+ }
+ var barh = Math.round((profiles[i] / (smax + 5)) * 40);
+ if (barh <= 40) {
+ ctx.fillRect(i, 40 - barh, 1, barh);
+ } else {
+ ctx.fillStyle = "#FFFF00";
+ ctx.fillRect(i, 40 - barh, 1, barh);
+ ctx.fillStyle = "#00FFFF";
+ }
+ }
+ ctx.fillStyle = "#FF0000";
+ ctx.fillRect(0, 40 - Math.round(avg / (smax + 5) * 40), 300, 1);
+ ctx.fillStyle = "#00FFFF";
+ };
+ $("pf-stats").innerHTML = "AVG:" + Math.round(avg) + "
" + "MAX:" + pmax + "
FPS:" + (avg > 0 ? Math.round(1000 / avg) : 0);
+ };
+ this.getProfiles = function() {
+ return profiles;
+ };
+ var self = this;
+ var t = -1;;
+ this.on = function() {
+ if (t > 0)
+ return;
+ t = setInterval(function() {
+ self.render();
+ }, 150);
+ $("profiler-start").style.color = "#0ff";
+ };
+ this.off = function() {
+ if (t < 0)
+ return;
+ clearInterval(t);
+ t = -1;
+ $("profiler-start").style.color = "";
+ $("pf-stats").innerHTML = "PF:OFF";
+ };
+ this.isOn = function() {
+ return t >= 0;
+ };
};
-function bind(){
- window.cm = new CommentManager($('commentCanvas'));
- cm.init();
-
- var tmr = -1;
- var start = 0;
- var playhead = 0;
-
- $("control-stop").addEventListener("click", function(e){
- if(e && e.preventDefault)
- e.preventDefault();
- stop();
- });
-
- $("control-resume").addEventListener("click", function(e){
- if(e && e.preventDefault)
- e.preventDefault();
- resume();
- });
-
- $("control-reset").addEventListener("click", function(e){
- if(e && e.preventDefault)
- e.preventDefault();
- playhead = 0;
- start = (new Date()).getTime();
- cm.clear();
- });
-
- $("w-main").addEventListener("keydown", function(k){
- if(k){
- if(k.keyCode === 70){
- state.format = (state.format === "hrf" ? "std" : "hrf");
- }else if(k.keyCode === 32){
- if(tmr < 0){
- resume();
- }else{
- stop();
- }
- }else if(k.keyCode === 66){
- $("player").style.backgroundColor = "#000"; //b
- $("c-region").style.color = "#fff";
- }else if(k.keyCode === 87){
- $("player").style.backgroundColor = "#fff"; //w
- $("c-region").style.color = "#000";
- }else if(k.keyCode === 82){
- var x = prompt("Resize player window (WxH or 'old','new')");
- if(x){
- if(x === "new")
- x = "672x438";
- if(x === "old")
- x = "512x384";
- var wh = x.split("x");
- var w = parseInt(wh[0]);
- var h = parseInt(wh[1]);
- if(w > 0 && h > 0){
- $("player").style.height = h + "px";
- $("player-unit").style.width = w + "px";
- if(cm)
- cm.setBounds();
- }
- }
- }else if(k.keyCode === 80){ //p
- if(CCLDBG.isOn()){
- CCLDBG.off();
- cm.filter.setRuntimeFilter(null);
- }else{
- CCLDBG.on();
- cm.filter.setRuntimeFilter(function(cmt){
- CCLDBG.profiler();
- return cmt;
- });
- }
- }
- }
- });
-
- window.isDebugRunning = function(){
- return tmr >= 0 || !$("abpVideo").paused;
- };
-
- window.displayTime = function(playhead){
- if(state.format === "hrf"){
- var sec = Math.floor(playhead / 1000);
- var millis = playhead % 1000;
- var millisText = (millis > 99 ? millis : ("0" + (millis > 9 ? millis : "0" + millis)));
- $("control-status").textContent = Math.floor(sec/60) + ":" +
- ((sec % 60) > 9 ? (sec % 60) : "0" + (sec % 60)) + ":" + millisText;
- }else{
- $("control-status").textContent = playhead;
- }
- };
-
- $("control-status").addEventListener("dblclick", function(e){
- var x = prompt("Please input time (" + (state.format === "hrf" ? "xx:xx:xxx" : "xxx") + "):");
- if(!x || x === "")
- return;
- if(state.format === "hrf"){
- var y = x.split(":");
- var m = parseInt(y[0]);
- var s = parseInt(y[1]);
- var ml = parseInt(y[2]);
- playhead = m * 60000 + s * 1000 + ml;
- }else{
- try{
- playhead = parseInt(x);
- }catch(e){}
- }
- });
-
- function stop(){
- if(state.mode === "timer"){
- cm.stopTimer();
- $("control-status").className = "status";
- clearInterval(tmr);
- tmr = -1;
- }else{
- $("abpVideo").pause();
- }
- }
- function resume(){
- if(state.mode !== "timer"){
- $("abpVideo").play();
- return;
- }
- if(tmr !== -1)
- return;
- $("control-status").className = "status active";
- cm.startTimer();
- start = new Date().getTime() - playhead;
- tmr = setInterval(function(){
- playhead = new Date().getTime() - start;
- displayTime(playhead);
- cm.time(playhead);
- },42);
- }
-
- /** Load **/
- window.loadDM = function(dmf,provider){
- if(provider == null)
- provider = 'bilibili';
- cm.clear();
- start = 0;
- try{
- clearTimeout(tmr);
- }catch(e){}
- if(trace){
- trace("Loading " + dmf + " : " + provider);
- }
- CommentLoader('../' + dmf, cm, provider);
- cm.startTimer();
- $("control-status").className = "status active";
- if(state.mode !== "timer"){
- $("abpVideo").play();
- return;
- }
- start = new Date().getTime();
- tmr = setInterval(function(){
- playhead = new Date().getTime() - start;
- cm.time(playhead);
- displayTime(playhead);
- },42);
- };
-
- var isWindowedFullscreen = false;
- function launchFullScreen(element) {
- cm.setBounds();
- if(element.requestFullscreen) {
- element.requestFullscreen();
- } else if(element.mozRequestFullscreen) {
- element.mozRequestFullscreen();
- } else if(element.webkitRequestFullscreen) {
- element.webkitRequestFullscreen();
- }
- }
- function launchWindowFull(element, e2){
- if(!isWindowedFullscreen){
- element.style.position = "fixed";
- element.style.top = "0";
- element.style.bottom = "0";
- element.style.left = "0";
- element.style.right = "0";
- element.style.width = "auto";
- element.style.height = "auto";
- e2.style.height = "100%";
- }else{
- element.style.position = "";
- element.style.top = "";
- element.style.bottom = "";
- element.style.left = "";
- element.style.right = "";
- }
- isWindowedFullscreen = !isWindowedFullscreen;
- }
- // Add Fullscreen Handlers
- var fs = function(){
- cm.setBounds();
- };
- document.addEventListener("fullscreenchange", fs);
- document.addEventListener("webkitfullscreenchange", fs);
- document.addEventListener("mozfullscreenchange", fs);
-
- $("fs-all").addEventListener("click", function(e){
- if(e && e.preventDefault)
- e.preventDefault();
- launchFullScreen($("player-unit"));
- });
- $("fs-win").addEventListener("click", function(e){
- if(e && e.preventDefault)
- e.preventDefault();
- launchWindowFull($("player-unit"), $("player"));
- });
+function bind() {
+ window.cm = new CommentManager($('commentCanvas'));
+ cm.init();
+
+ var tmr = -1;
+ var start = 0;
+ var playhead = 0;
+
+ $("control-stop").addEventListener("click", function(e) {
+ if (e && e.preventDefault)
+ e.preventDefault();
+ stop();
+ });
+
+ $("control-resume").addEventListener("click", function(e) {
+ if (e && e.preventDefault)
+ e.preventDefault();
+ resume();
+ });
+
+ $("control-reset").addEventListener("click", function(e) {
+ if (e && e.preventDefault)
+ e.preventDefault();
+ playhead = 0;
+ start = (new Date()).getTime();
+ cm.clear();
+ });
+
+ $("w-main").addEventListener("keydown", function(k) {
+ if (k) {
+ if (k.keyCode === 70) {
+ state.format = (state.format === "hrf" ? "std" : "hrf");
+ } else if (k.keyCode === 32) {
+ if (tmr < 0) {
+ resume();
+ } else {
+ stop();
+ }
+ } else if (k.keyCode === 66) {
+ $("player").style.backgroundColor = "#000"; //b
+ $("c-region").style.color = "#fff";
+ } else if (k.keyCode === 87) {
+ $("player").style.backgroundColor = "#fff"; //w
+ $("c-region").style.color = "#000";
+ } else if (k.keyCode === 82) {
+ var x = prompt("Resize player window (WxH or 'old','new')");
+ if (x) {
+ if (x === "new")
+ x = "672x438";
+ if (x === "old")
+ x = "512x384";
+ var wh = x.split("x");
+ var w = parseInt(wh[0]);
+ var h = parseInt(wh[1]);
+ if (w > 0 && h > 0) {
+ $("player").style.height = h + "px";
+ $("player-unit").style.width = w + "px";
+ if (cm)
+ cm.setBounds();
+ }
+ }
+ } else if (k.keyCode === 80) { //p
+ if (CCLDBG.isOn()) {
+ CCLDBG.off();
+ cm.filter.setRuntimeFilter(null);
+ } else {
+ CCLDBG.on();
+ cm.filter.setRuntimeFilter(function(cmt) {
+ CCLDBG.profiler();
+ return cmt;
+ });
+ }
+ }
+ }
+ });
+
+ window.isDebugRunning = function() {
+ return tmr >= 0 || !$("abpVideo").paused;
+ };
+
+ window.displayTime = function(playhead) {
+ requestAnimationFrame(function () {
+ if (state.format === "hrf") {
+ var sec = Math.floor(playhead / 1000);
+ var millis = playhead % 1000;
+ var millisText = (millis > 99 ? millis : ("0" + (millis > 9 ? millis : "0" + millis)));
+ $("control-status").textContent = Math.floor(sec / 60) + ":" +
+ ((sec % 60) > 9 ? (sec % 60) : "0" + (sec % 60)) + ":" + millisText;
+ } else {
+ $("control-status").textContent = playhead;
+ }
+ })
+ };
+
+ $("control-status").addEventListener("dblclick", function(e) {
+ var x = prompt("Please input time (" + (state.format === "hrf" ? "xx:xx:xxx" : "xxx") + "):");
+ if (!x || x === "")
+ return;
+ if (state.format === "hrf") {
+ var y = x.split(":");
+ var m = parseInt(y[0]);
+ var s = parseInt(y[1]);
+ var ml = parseInt(y[2]);
+ playhead = m * 60000 + s * 1000 + ml;
+ } else {
+ try {
+ playhead = parseInt(x);
+ } catch (e) {}
+ }
+ });
+
+ function stop() {
+ if (state.mode === "timer") {
+ cm.stop();
+ $("control-status").className = "status";
+ clearInterval(tmr);
+ tmr = -1;
+ } else {
+ $("abpVideo").pause();
+ }
+ }
+
+ function resume() {
+ if (state.mode !== "timer") {
+ $("abpVideo").play();
+ return;
+ }
+ if (tmr !== -1)
+ return;
+ $("control-status").className = "status active";
+ cm.start();
+ start = new Date().getTime() - playhead;
+ tmr = setInterval(function() {
+ playhead = new Date().getTime() - start;
+ displayTime(playhead);
+ cm.time(playhead);
+ }, 42);
+ }
+
+ /** Load **/
+ window.loadDM = function(dmf, provider) {
+ if (window._provider && window._provider instanceof CommentProvider) {
+ window._provider.destroy();
+ }
+ window._provider = new CommentProvider();
+ cm.clear();
+ dmf = "../" + dmf;
+ window._provider.addTarget(cm);
+ start = 0;
+
+ try {
+ clearTimeout(tmr);
+ } catch (e) {}
+ if (trace) {
+ trace("Loading " + dmf + " : " + provider);
+ }
+ switch (provider) {
+ case "acfun":
+ window._provider.addStaticSource(
+ CommentProvider.JSONProvider('GET', dmf),
+ CommentProvider.SOURCE_JSON).addParser(
+ new AcfunFormat.JSONParser(),
+ CommentProvider.SOURCE_JSON);
+ break;
+ case "cdf":
+ window._provider.addStaticSource(
+ CommentProvider.JSONProvider('GET', dmf),
+ CommentProvider.SOURCE_JSON).addParser(
+ new CommonDanmakuFormat.JSONParser(),
+ CommentProvider.SOURCE_JSON);
+ break;
+ case "bilibili-text":
+ window._provider.addStaticSource(
+ CommentProvider.TextProvider('GET', dmf),
+ CommentProvider.SOURCE_TEXT).addParser(
+ new BilibiliFormat.TextParser(),
+ CommentProvider.SOURCE_TEXT);
+ break;
+ case "bilibili":
+ default:
+ window._provider.addStaticSource(
+ CommentProvider.XMLProvider('GET', dmf),
+ CommentProvider.SOURCE_XML).addParser(
+ new BilibiliFormat.XMLParser(),
+ CommentProvider.SOURCE_XML);
+ break;
+ }
+ window._provider.start().then(function() {
+ cm.start();
+ $("control-status").className = "status active";
+ if (state.mode !== "timer") {
+ $("abpVideo").play();
+ return;
+ }
+ start = new Date().getTime();
+ tmr = setInterval(function() {
+ playhead = new Date().getTime() - start;
+ cm.time(playhead);
+ displayTime(playhead);
+ }, 42);
+ }).catch(function(e) {
+ alert(e);
+ });
+ };
+
+ var isWindowedFullscreen = false;
+
+ function launchFullScreen(element) {
+ cm.setBounds();
+ if (element.requestFullscreen) {
+ element.requestFullscreen();
+ } else if (element.mozRequestFullscreen) {
+ element.mozRequestFullscreen();
+ } else if (element.webkitRequestFullscreen) {
+ element.webkitRequestFullscreen();
+ }
+ }
+
+ function launchWindowFull(element, e2) {
+ if (!isWindowedFullscreen) {
+ element.style.position = "fixed";
+ element.style.top = "0";
+ element.style.bottom = "0";
+ element.style.left = "0";
+ element.style.right = "0";
+ element.style.width = "auto";
+ element.style.height = "auto";
+ e2.style.height = "100%";
+ } else {
+ element.style.position = "";
+ element.style.top = "";
+ element.style.bottom = "";
+ element.style.left = "";
+ element.style.right = "";
+ }
+ isWindowedFullscreen = !isWindowedFullscreen;
+ }
+ // Add Fullscreen Handlers
+ var fs = function() {
+ cm.setBounds();
+ };
+ document.addEventListener("fullscreenchange", fs);
+ document.addEventListener("webkitfullscreenchange", fs);
+ document.addEventListener("mozfullscreenchange", fs);
+
+ $("fs-all").addEventListener("click", function(e) {
+ if (e && e.preventDefault)
+ e.preventDefault();
+ launchFullScreen($("player-unit"));
+ });
+ $("fs-win").addEventListener("click", function(e) {
+ if (e && e.preventDefault)
+ e.preventDefault();
+ launchWindowFull($("player-unit"), $("player"));
+ });
}
-function bindWindow(){
- for(var w in windowbinds){
- $(w).addEventListener("click", function(e){
- if(state.cw === this.id)
- return;
- if(window.isDebugRunning()){
-
- }
- state.cw = this.id;
- for(var win in windowbinds){
- $(win).className = "button";
- if($(windowbinds[win].id) && !windowbinds[win].opacityOnly){
- $(windowbinds[win].id).style.display ="none";
- }else if($(windowbinds[win].id) && windowbinds[win].opacityOnly){
- $(windowbinds[win].id).style.opacity = "0";
- }
- }
- this.className = "button active";
- try{
- $(windowbinds[this.id].id).style.display = "";
- $(windowbinds[this.id].id).style.opacity = "1";
- }catch(e){
- console.log(e);
- }
- });
- }
+function bindWindow() {
+ for (var w in windowbinds) {
+ $(w).addEventListener("click", function(e) {
+ if (state.cw === this.id)
+ return;
+ if (window.isDebugRunning()) {
+
+ }
+ state.cw = this.id;
+ for (var win in windowbinds) {
+ $(win).className = "button";
+ if ($(windowbinds[win].id) && !windowbinds[win].opacityOnly) {
+ $(windowbinds[win].id).style.display = "none";
+ } else if ($(windowbinds[win].id) && windowbinds[win].opacityOnly) {
+ $(windowbinds[win].id).style.opacity = "0";
+ }
+ }
+ this.className = "button active";
+ try {
+ $(windowbinds[this.id].id).style.display = "";
+ $(windowbinds[this.id].id).style.opacity = "1";
+ } catch (e) {
+ console.log(e);
+ }
+ });
+ }
};
-function bindTests(){
- for(var test in tests){
- try{
- $(test).addEventListener("click", (function(){
- var url = tests[test];
- return function(){
- if(typeof url === "string"){
- loadDM(url);
- }else{
- loadDM(url.f, url.p);
- }
- }
- })());
- }catch(e){}
- }
- $("profiler-start").addEventListener("click", function(e){
- CCLDBG.reset();
- CCLDBG.on();
- cm.filter.setRuntimeFilter(function(cmt){
- CCLDBG.profiler();
- return cmt;
- });
- e.preventDefault();
- });
- $("video-demo").addEventListener("click", function(e){
- var x = prompt("Please give video URL");
- if(!x){
- return;
- }
- if(x == ""){
- $("abpVideo").innerHTML = '
") + "
" + output.innerHTML;
- };
- window.trace = trace;
- $("debugger-input-area").addEventListener("keydown",function(e){if(e.keyCode == 9) e.preventDefault()});
- $("debugger-input-area").addEventListener("keyup",function(e){if(e.keyCode == 9) {
- e.preventDefault();
- this.innerHTML += "\t";
- }});
- $("debugger-run").addEventListener("click", function(){
- try{
- var cm = window.cm;
- eval($("debugger-input-area").innerText);
- }catch(e){
- trace(e);
- console.log(e);
- }
- });
- for(var x in debugs){
- $(x).addEventListener('click', function(){
- $("debugger-input-area").innerHTML = debugs[this.id];
- });
- }
+function bindDebugger() {
+ var output = $("debugger-output");
+
+ function trace(msg) {
+ if (typeof msg === "object") {
+ var obj = {};
+ for (var field in msg) {
+ if (typeof msg[field] !== "function") {
+ obj[field] = msg[field].toString();
+ } else {
+ obj[field] = "[function Function]";
+ }
+ }
+ msg = JSON.stringify(obj, undefined, 2);
+ } else if (msg === undefined) {
+ msg = "[undefined]";
+ } else if (typeof msg !== "string") {
+ msg = msg.toString();
+ }
+ var lines = msg.replace(/&/g, "&").replace(//g, ">").replace(/ /g, " ").split("\n");
+ output.innerHTML = lines.join("
") + "
" + output.innerHTML;
+ };
+ window.trace = trace;
+ $("debugger-input-area").addEventListener("keydown", function(e) {
+ if (e.keyCode == 9) e.preventDefault()
+ });
+ $("debugger-input-area").addEventListener("keyup", function(e) {
+ if (e.keyCode == 9) {
+ e.preventDefault();
+ this.innerHTML += "\t";
+ }
+ });
+ $("debugger-run").addEventListener("click", function() {
+ try {
+ var cm = window.cm;
+ eval($("debugger-input-area").innerText);
+ } catch (e) {
+ trace(e);
+ console.log(e);
+ }
+ });
+ for (var x in debugs) {
+ $(x).addEventListener('click', function() {
+ $("debugger-input-area").innerHTML = debugs[this.id];
+ });
+ }
};
-function bindVideo(video, cm){
- video.addEventListener("timeupdate", function(){
- if(cm.display === false) return;
- if(video.hasStalled){
- cm.startTimer();
- video.hasStalled = false;
- }
- cm.time(Math.floor(video.currentTime * 1000));
- displayTime(Math.floor(video.currentTime * 1000));
- });
- video.addEventListener("play", function(){
- cm.startTimer();
- });
- video.addEventListener("pause", function(){
- cm.stopTimer();
- });
- video.addEventListener("waiting", function(){
- cm.stopTimer();
- });
- video.addEventListener("playing",function(){
- cm.startTimer();
- });
+function bindVideo(video, cm) {
+ video.addEventListener("timeupdate", function() {
+ if (cm.display === false) return;
+ if (video.hasStalled) {
+ cm.start();
+ video.hasStalled = false;
+ }
+ cm.time(Math.floor(video.currentTime * 1000));
+ displayTime(Math.floor(video.currentTime * 1000));
+ });
+ video.addEventListener("play", function() {
+ cm.start();
+ });
+ video.addEventListener("pause", function() {
+ cm.stop();
+ });
+ video.addEventListener("waiting", function() {
+ cm.stop();
+ });
+ video.addEventListener("playing", function() {
+ cm.start();
+ });
};
-window.addEventListener("load", function(){
- bind();
- bindWindow();
- bindTests();
- bindResize();
- bindDebugger();
+function bindLiveTests(){
+ $('test-live-1').addEventListener('click', function(){
+ window.cm.start();
+ var comment = {
+ 'text': "common danmaku",
+ 'mode': 1,
+ 'color': 0xffffff,
+ };
+ window.cm.send(comment);
+ })
+ $('test-live-2').addEventListener('click', function(){
+ window.cm.start();
+ var comment = {
+ 'text': "blue background danmaku",
+ 'mode': 1,
+ 'color': 0xffffff,
+ 'className': 'blue-background'
+ };
+ window.cm.send(comment);
+ })
+}
+
+window.addEventListener("load", function() {
+ bind();
+ bindWindow();
+ bindTests();
+ bindLiveTests();
+ bindResize();
+ bindDebugger();
});
diff --git a/demo/default.css b/demo/default.css
index b1375e84..ba2c4d0b 100644
--- a/demo/default.css
+++ b/demo/default.css
@@ -1,194 +1,194 @@
-body{
- padding:0;
- margin:0;
- font-family: "open-sans", Verdana, sans-serif;
- color:#fff;
- background-color:#111;
+body {
+ padding:0;
+ margin:0;
+ font-family: "open-sans", Verdana, sans-serif;
+ color:#fff;
+ background-color:#111;
}
h1, h2, h3{
- padding:0;
- margin:0 0 5px 0;
+ padding:0;
+ margin:0 0 5px 0;
}
a {
- color:#f88;
- text-decoration:none;
+ color:#f88;
+ text-decoration:none;
}
a:hover{
- text-decoration:underline;
+ text-decoration:underline;
}
.button{
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
}
#debugger-head {
- color:#fff;
- height:40px;
- width:100%;
- background-color:#333;
- overflow:hidden;
+ color:#fff;
+ height:40px;
+ width:100%;
+ background-color:#333;
+ overflow:hidden;
}
#debugger-head .button{
- background-color:#555;
- float:left;
- padding:10px 15px 12px 15px;
- cursor:default;
- border-right:4px dotted #333;
+ background-color:#555;
+ float:left;
+ padding:10px 15px 12px 15px;
+ cursor: pointer;
+ border-right:4px dotted #333;
}
#debugger-head .button.active{
- background-color:#55c;
+ background-color:#55c;
}
#pf-area {
- float:right;
+ float:right;
}
#pf-area div{
- float:left;
- width:40px;
- font-size:9px;
- padding-left:3px;
- border-left:1px solid #ccc;
- height:40px;
+ float:left;
+ width:40px;
+ font-size:9px;
+ padding-left:3px;
+ border-left:1px solid #ccc;
+ height:40px;
}
.debugger-window{
- position:relative;
- background-color:#111;
- outline: none;
+ position:relative;
+ background-color:#111;
+ outline: none;
}
.sidebar{
- float:right;
- background-color:#222;
- width:20%;
- padding:10px;
- overflow:hidden;
- min-width:270px;
+ float:right;
+ background-color:#222;
+ width:20%;
+ padding:10px;
+ overflow:hidden;
+ min-width:270px;
}
.sidebar a.button{
- background-color:#111;
- float:left;
- padding:5px 5px 5px 5px;
- cursor:default;
- border:1px solid #555;
+ background-color:#111;
+ float:left;
+ padding:5px 5px 5px 5px;
+ cursor: pointer;
+ border:1px solid #555;
}
.sidebar a.button:hover{
- text-decoration:none;
- background-color:#333;
+ text-decoration:none;
+ background-color:#333;
}
.controls{
- background-color:#111;
- width:100%;
- clear:both;
+ background-color:#111;
+ width:100%;
+ clear:both;
}
.controls .status{
- background-color:#522;
- float:left;
- padding:10px 15px 12px 15px;
- width:150px;
- cursor:default;
- border-right:4px dotted #111;
+ background-color:#522;
+ float:left;
+ padding:10px 15px 12px 15px;
+ width:150px;
+ cursor:default;
+ border-right:4px dotted #111;
}
.controls .status.active{
- background-color:#252;
+ background-color:#252;
}
.controls .button{
- background-color:#222;
- float:left;
- padding:10px 15px 12px 15px;
- cursor:default;
- border-right:4px dotted #111;
+ background-color:#222;
+ float:left;
+ padding:10px 15px 12px 15px;
+ cursor:default;
+ border-right:4px dotted #111;
}
.controls a.button{
- color:#fff;
+ color:#fff;
}
.controls .button:hover{
- background-color:#555;
- text-decoration:none;
+ background-color:#555;
+ text-decoration:none;
}
#debugger-input{
- position:relative;
- height:400px;
- margin:5px;
+ position:relative;
+ height:400px;
+ margin:5px;
}
#debugger-input .input{
- height:100%;
+ height:100%;
}
#debugger-input .button{
- background-color:#111;
- position:absolute;
- bottom:0; left:10px;
- padding:10px 15px 10px 15px;
- cursor:default;
- border:1px solid #555;
+ background-color:#111;
+ position:absolute;
+ bottom:0; left:10px;
+ padding:10px 15px 10px 15px;
+ cursor:default;
+ border:1px solid #555;
}
.iw .button{
- background-color:#111;
- padding:10px 15px 10px 15px;
- cursor:default;
- border:1px solid #555;
- float:left;
+ background-color:#111;
+ padding:10px 15px 10px 15px;
+ cursor:default;
+ border:1px solid #555;
+ float:left;
}
#debugger-input .button:hover, .iw .button:hover{
- background-color:#522;
- cursor:pointer;
+ background-color:#522;
+ cursor:pointer;
}
#debugger-input-area, #debugger-output {
- text-wrap:pre;
+ text-wrap:pre;
}
#debugger-output{
- background-color:#555;
- height:80%;
- font-family: Consolas, monospace;
- font-size:20px;
- overflow:auto;
+ background-color:#555;
+ height:80%;
+ font-family: Consolas, monospace;
+ font-size:20px;
+ overflow:auto;
}
.input {
- background-color:#555;
- min-width:100px;
- min-height:20px;
- padding:5px;
- font-family: Consolas, monospace;
- font-size:20px;
+ background-color:#555;
+ min-width:100px;
+ min-height:20px;
+ padding:5px;
+ font-family: Consolas, monospace;
+ font-size:20px;
}
#c-region{
- position:absolute;
- bottom:0;
- right:0;
+ position:absolute;
+ bottom:0;
+ right:0;
}
#player-unit{
- position:absolute;
- top:0;
- left:0;
- width:640px;
+ position:absolute;
+ top:0;
+ left:0;
+ width:640px;
}
#player{
- position:relative;
- margin:0;
- padding:0;
- height:480px;
- width:100%;
- background:#000;
+ position:relative;
+ margin:0;
+ padding:0;
+ height:480px;
+ width:100%;
+ background:#000;
}
#player:full-screen{ margin:10px 0 0 0; width:100%; height:100%;}
diff --git a/demo/index.htm b/demo/index.htm
index c359b722..4ff1377e 100644
--- a/demo/index.htm
+++ b/demo/index.htm
@@ -7,13 +7,17 @@
-
-
+
+
+
-
-
AcFun (Experimental)
Run Test 2
Live Danmaku
+
Tag Soup 1,
Tag Soup 2,
XSS
- Apply Center-Transparency
- Apply Center-Speedup
Profiler
Clear Runtime Filters
AcFun (Experimental)
Fullscreen
Windowed Fullscreen
-
Links:
Demo with video
Load Custom URL
diff --git a/demo/libxml.js b/demo/libxml.js
deleted file mode 100644
index 52e56cb8..00000000
--- a/demo/libxml.js
+++ /dev/null
@@ -1,38 +0,0 @@
-/***********************
-* XMLParser
-* Licensed Under the MIT License
-* Copyright (c) 2012 Jim Chen ( CQZ, Jabbany )
-************************/
-function CommentLoader(url,xcm,mode){
- if(mode == null)
- mode = 'bilibili';
- if (window.XMLHttpRequest){
- xmlhttp=new XMLHttpRequest();
- }
- else{
- xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
- }
- xmlhttp.open("GET",url,true);
- xmlhttp.send();
- var cm = xcm;
- xmlhttp.onreadystatechange = function(){
- if (xmlhttp.readyState==4 && xmlhttp.status==200){
- if(mode == 'bilibili'){
- if(navigator.appName == 'Microsoft Internet Explorer'){
- var f = new ActiveXObject("Microsoft.XMLDOM");
- f.async = false;
- f.loadXML(xmlhttp.responseText);
- cm.load(BilibiliParser(f, xmlhttp.responseText));
- }else{
- cm.load(BilibiliParser(xmlhttp.responseXML, xmlhttp.responseText));
- }
- }else if(mode == 'acfun'){
- cm.load(AcfunParser(xmlhttp.responseText));
- }
- }
- }
-}
-/*************************
-* Tiny Shorthand
-**************************/
-$ = function(a){return document.getElementById(a);};
diff --git a/demo/player-demo.htm b/demo/player-demo.htm
index 1655ced7..009b85d9 100644
--- a/demo/player-demo.htm
+++ b/demo/player-demo.htm
@@ -1,65 +1,70 @@