init
6
.augment/rules/在线学习平台.md
Normal file
@ -0,0 +1,6 @@
|
||||
---
|
||||
type: "manual"
|
||||
---
|
||||
|
||||
1、在接下来的每一个步骤当中,请帮我实现对页面的响应式设计
|
||||
2、必须严格执行我给你的指令,一步一步执行,不得有缩减
|
5
.env
Normal file
@ -0,0 +1,5 @@
|
||||
# API配置
|
||||
VITE_API_BASE_URL=http://110.42.96.65:55510/api
|
||||
|
||||
# Mock配置 - 禁用Mock,使用真实API
|
||||
VITE_ENABLE_MOCK=false
|
11
.env.development
Normal file
@ -0,0 +1,11 @@
|
||||
# 开发环境配置
|
||||
|
||||
# API配置
|
||||
VITE_API_BASE_URL=http://110.42.96.65:55510/api
|
||||
|
||||
# Mock配置
|
||||
# 设置为 true 使用Mock数据,false 使用真实API
|
||||
VITE_ENABLE_MOCK=false
|
||||
|
||||
# 开发模式
|
||||
NODE_ENV=development
|
66
.env.example
Normal file
@ -0,0 +1,66 @@
|
||||
# 环境变量配置示例文件
|
||||
# 复制此文件为 .env.local 并填入实际的配置值
|
||||
|
||||
# 应用基础配置
|
||||
VITE_APP_TITLE=在线学习平台
|
||||
VITE_APP_DESCRIPTION=专业的在线学习平台,提供优质的编程和技术课程
|
||||
VITE_APP_VERSION=1.0.0
|
||||
|
||||
# API 配置
|
||||
VITE_API_BASE_URL=http://localhost:3000/api
|
||||
VITE_API_TIMEOUT=10000
|
||||
|
||||
# 开发环境配置
|
||||
VITE_DEV_PORT=5173
|
||||
VITE_DEV_HOST=localhost
|
||||
|
||||
# 生产环境配置
|
||||
VITE_PROD_API_BASE_URL=https://api.yourdomain.com/api
|
||||
|
||||
# 第三方服务配置
|
||||
# 文件上传服务
|
||||
VITE_UPLOAD_BASE_URL=https://upload.yourdomain.com
|
||||
VITE_CDN_BASE_URL=https://cdn.yourdomain.com
|
||||
|
||||
# 视频播放服务
|
||||
VITE_VIDEO_BASE_URL=https://video.yourdomain.com
|
||||
|
||||
# 支付服务配置
|
||||
VITE_ALIPAY_APP_ID=your_alipay_app_id
|
||||
VITE_WECHAT_APP_ID=your_wechat_app_id
|
||||
|
||||
# 第三方登录配置
|
||||
VITE_GITHUB_CLIENT_ID=your_github_client_id
|
||||
VITE_QQ_APP_ID=your_qq_app_id
|
||||
VITE_WECHAT_LOGIN_APP_ID=your_wechat_login_app_id
|
||||
|
||||
# 地图服务配置
|
||||
VITE_MAP_API_KEY=your_map_api_key
|
||||
|
||||
# 统计分析配置
|
||||
VITE_ANALYTICS_ID=your_analytics_id
|
||||
|
||||
# 错误监控配置
|
||||
VITE_SENTRY_DSN=your_sentry_dsn
|
||||
|
||||
# 功能开关
|
||||
VITE_ENABLE_MOCK=false
|
||||
VITE_ENABLE_DEBUG=true
|
||||
VITE_ENABLE_ANALYTICS=false
|
||||
VITE_ENABLE_ERROR_TRACKING=false
|
||||
|
||||
# 缓存配置
|
||||
VITE_CACHE_ENABLED=true
|
||||
VITE_CACHE_PREFIX=study_platform_
|
||||
|
||||
# 安全配置
|
||||
VITE_ENCRYPT_STORAGE=false
|
||||
VITE_ENABLE_CSRF=true
|
||||
|
||||
# 主题配置
|
||||
VITE_DEFAULT_THEME=light
|
||||
VITE_ENABLE_DARK_MODE=true
|
||||
|
||||
# 语言配置
|
||||
VITE_DEFAULT_LOCALE=zh-CN
|
||||
VITE_ENABLE_I18N=false
|
10
.env.production
Normal file
@ -0,0 +1,10 @@
|
||||
# 生产环境配置
|
||||
|
||||
# API配置
|
||||
VITE_API_BASE_URL=http://110.42.96.65:55510/api
|
||||
|
||||
# Mock配置 - 生产环境禁用Mock,使用真实API
|
||||
VITE_ENABLE_MOCK=false
|
||||
|
||||
# 生产模式
|
||||
NODE_ENV=production
|
30
.gitignore
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
*.tsbuildinfo
|
BIN
AI体验切图_8.7/AI体验-头图.png
Normal file
After Width: | Height: | Size: 880 KiB |
BIN
AI体验切图_8.7/AI体验.png
Normal file
After Width: | Height: | Size: 36 KiB |
BIN
AI体验切图_8.7/AI封面.png
Normal file
After Width: | Height: | Size: 552 KiB |
BIN
AI体验切图_8.7/互动体验1.png
Normal file
After Width: | Height: | Size: 3.9 KiB |
BIN
AI体验切图_8.7/互动体验2.png
Normal file
After Width: | Height: | Size: 4.0 KiB |
BIN
AI体验切图_8.7/内容创作1.png
Normal file
After Width: | Height: | Size: 5.0 KiB |
BIN
AI体验切图_8.7/内容创作2.png
Normal file
After Width: | Height: | Size: 5.2 KiB |
BIN
AI体验切图_8.7/原理解释1.png
Normal file
After Width: | Height: | Size: 5.0 KiB |
BIN
AI体验切图_8.7/原理解释2.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
BIN
AI体验切图_8.7/图像识别1.png
Normal file
After Width: | Height: | Size: 4.4 KiB |
BIN
AI体验切图_8.7/图像识别2.png
Normal file
After Width: | Height: | Size: 4.6 KiB |
BIN
AI体验切图_8.7/在线编程1.png
Normal file
After Width: | Height: | Size: 2.5 KiB |
BIN
AI体验切图_8.7/在线编程2.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
AI体验切图_8.7/在线训练1.png
Normal file
After Width: | Height: | Size: 3.5 KiB |
BIN
AI体验切图_8.7/在线训练2.png
Normal file
After Width: | Height: | Size: 3.6 KiB |
BIN
AI体验切图_8.7/声音识别1.png
Normal file
After Width: | Height: | Size: 4.5 KiB |
BIN
AI体验切图_8.7/声音识别2.png
Normal file
After Width: | Height: | Size: 4.5 KiB |
BIN
AI体验切图_8.7/大语言模型1.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
AI体验切图_8.7/大语言模型2.png
Normal file
After Width: | Height: | Size: 2.7 KiB |
BIN
AI体验切图_8.7/学科能力1.png
Normal file
After Width: | Height: | Size: 4.0 KiB |
BIN
AI体验切图_8.7/学科能力2.png
Normal file
After Width: | Height: | Size: 4.1 KiB |
BIN
AI体验切图_8.7/星星.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
AI体验切图_8.7/特征提取1.png
Normal file
After Width: | Height: | Size: 4.9 KiB |
BIN
AI体验切图_8.7/特征提取2.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
BIN
AI体验切图_8.7/生成式AI1.png
Normal file
After Width: | Height: | Size: 3.4 KiB |
BIN
AI体验切图_8.7/生成式AI2.png
Normal file
After Width: | Height: | Size: 3.4 KiB |
BIN
AI体验切图_8.7/神经网络1.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
BIN
AI体验切图_8.7/神经网络2.png
Normal file
After Width: | Height: | Size: 5.3 KiB |
BIN
AI体验切图_8.7/科普知识封面1.png
Normal file
After Width: | Height: | Size: 707 KiB |
BIN
AI体验切图_8.7/科普知识封面2.png
Normal file
After Width: | Height: | Size: 778 KiB |
BIN
AI体验切图_8.7/科普知识封面3.png
Normal file
After Width: | Height: | Size: 794 KiB |
BIN
AI体验切图_8.7/科普知识封面4.png
Normal file
After Width: | Height: | Size: 718 KiB |
BIN
AI体验切图_8.7/经典技术1.png
Normal file
After Width: | Height: | Size: 2.7 KiB |
BIN
AI体验切图_8.7/经典技术2.png
Normal file
After Width: | Height: | Size: 2.8 KiB |
15
Dockerfile
Normal file
@ -0,0 +1,15 @@
|
||||
# 使用 node 构建阶段
|
||||
FROM node:22 AS builder
|
||||
WORKDIR /app
|
||||
COPY . .
|
||||
RUN npm install && npm run build
|
||||
|
||||
# 使用 nginx 作为生产环境
|
||||
FROM nginx:stable-alpine
|
||||
COPY --from=builder /app/dist /usr/share/nginx/html
|
||||
|
||||
# 设置静态资源的访问权限,避免 403 Forbidden
|
||||
RUN find /usr/share/nginx/html -type f -exec chmod 644 {} \; \
|
||||
&& find /usr/share/nginx/html -type d -exec chmod 755 {} \;
|
||||
|
||||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
62
README.md
Normal file
@ -0,0 +1,62 @@
|
||||
# 在线学习平台
|
||||
|
||||
基于 Vue 3 + TypeScript + Naive UI 构建的现代化在线学习平台。
|
||||
|
||||
## 技术栈
|
||||
|
||||
- **前端框架**: Vue 3 (Composition API)
|
||||
- **开发语言**: TypeScript
|
||||
- **UI 组件库**: Naive UI
|
||||
- **状态管理**: Pinia
|
||||
- **路由管理**: Vue Router 4
|
||||
- **构建工具**: Vite
|
||||
- **图标库**: @vicons/ionicons5
|
||||
|
||||
## 功能特性
|
||||
|
||||
### 🎯 核心功能
|
||||
- 用户注册/登录系统
|
||||
- 课程浏览和搜索
|
||||
- 课程详情展示
|
||||
- 在线视频学习
|
||||
- 学习进度跟踪
|
||||
- 个人中心管理
|
||||
|
||||
### 📱 响应式设计
|
||||
- 支持桌面端和移动端
|
||||
- 自适应布局
|
||||
- 优雅的用户界面
|
||||
|
||||
### 🔧 开发特性
|
||||
- TypeScript 类型安全
|
||||
- 组件化开发
|
||||
- 模块化状态管理
|
||||
- 热重载开发体验
|
||||
|
||||
## 快速开始
|
||||
|
||||
### 环境要求
|
||||
- Node.js >= 16
|
||||
- npm >= 7
|
||||
|
||||
### 安装依赖
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
### 启动开发服务器
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
访问 http://localhost:3000 查看应用
|
||||
|
||||
### 构建生产版本
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
### 类型检查
|
||||
```bash
|
||||
npm run type-check
|
||||
```
|
107
deploy.js
Normal file
@ -0,0 +1,107 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
/**
|
||||
* 部署脚本 - 自动配置环境变量和构建项目
|
||||
*/
|
||||
|
||||
const fs = require('fs')
|
||||
const path = require('path')
|
||||
const { execSync } = require('child_process')
|
||||
|
||||
console.log('🚀 开始部署流程...')
|
||||
|
||||
// 检查是否有真实的API服务器
|
||||
async function checkApiServer(apiUrl) {
|
||||
try {
|
||||
const fetch = (await import('node-fetch')).default
|
||||
const response = await fetch(`${apiUrl}/health`, {
|
||||
timeout: 5000,
|
||||
method: 'GET'
|
||||
})
|
||||
return response.ok
|
||||
} catch (error) {
|
||||
console.log(`❌ API服务器检查失败: ${error.message}`)
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 读取环境配置
|
||||
function readEnvFile(filePath) {
|
||||
if (!fs.existsSync(filePath)) {
|
||||
return {}
|
||||
}
|
||||
|
||||
const content = fs.readFileSync(filePath, 'utf8')
|
||||
const env = {}
|
||||
|
||||
content.split('\n').forEach(line => {
|
||||
const trimmed = line.trim()
|
||||
if (trimmed && !trimmed.startsWith('#')) {
|
||||
const [key, ...valueParts] = trimmed.split('=')
|
||||
if (key && valueParts.length > 0) {
|
||||
env[key.trim()] = valueParts.join('=').trim()
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
return env
|
||||
}
|
||||
|
||||
// 写入环境配置
|
||||
function writeEnvFile(filePath, env) {
|
||||
const content = Object.entries(env)
|
||||
.map(([key, value]) => `${key}=${value}`)
|
||||
.join('\n')
|
||||
|
||||
fs.writeFileSync(filePath, content + '\n')
|
||||
}
|
||||
|
||||
async function main() {
|
||||
// 读取生产环境配置
|
||||
const prodEnv = readEnvFile('.env.production')
|
||||
const apiUrl = prodEnv.VITE_API_BASE_URL
|
||||
|
||||
if (apiUrl) {
|
||||
console.log(`🔍 检查API服务器: ${apiUrl}`)
|
||||
const isApiAvailable = await checkApiServer(apiUrl.replace('/api', ''))
|
||||
|
||||
if (isApiAvailable) {
|
||||
console.log('✅ API服务器可用,使用真实API')
|
||||
prodEnv.VITE_ENABLE_MOCK = 'false'
|
||||
} else {
|
||||
console.log('❌ API服务器不可用,启用Mock模式')
|
||||
prodEnv.VITE_ENABLE_MOCK = 'true'
|
||||
}
|
||||
} else {
|
||||
console.log('⚠️ 未配置API地址,启用Mock模式')
|
||||
prodEnv.VITE_ENABLE_MOCK = 'true'
|
||||
}
|
||||
|
||||
// 更新生产环境配置
|
||||
writeEnvFile('.env.production', prodEnv)
|
||||
console.log('📝 已更新生产环境配置')
|
||||
|
||||
// 构建项目
|
||||
console.log('🔨 开始构建项目...')
|
||||
try {
|
||||
execSync('npm run build', { stdio: 'inherit' })
|
||||
console.log('✅ 构建完成!')
|
||||
|
||||
// 显示部署信息
|
||||
console.log('\n📋 部署信息:')
|
||||
console.log(` Mock模式: ${prodEnv.VITE_ENABLE_MOCK === 'true' ? '启用' : '禁用'}`)
|
||||
if (apiUrl) {
|
||||
console.log(` API地址: ${apiUrl}`)
|
||||
}
|
||||
console.log(' 构建文件: ./dist/')
|
||||
|
||||
} catch (error) {
|
||||
console.error('❌ 构建失败:', error.message)
|
||||
process.exit(1)
|
||||
}
|
||||
}
|
||||
|
||||
main().catch(error => {
|
||||
console.error('❌ 部署失败:', error)
|
||||
process.exit(1)
|
||||
})
|
11
docker-compose.yaml
Normal file
@ -0,0 +1,11 @@
|
||||
version: '3.8'
|
||||
|
||||
services:
|
||||
vue-app:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: Dockerfile
|
||||
ports:
|
||||
- "55514:80"
|
||||
container_name: vue3-nginx
|
||||
restart: unless-stopped
|
125
docs/Activities-Page.md
Normal file
@ -0,0 +1,125 @@
|
||||
# 活动页面 (Activities Page)
|
||||
|
||||
## 📋 概述
|
||||
|
||||
活动页面是在线学习平台的重要组成部分,展示所有可用的学习活动和课程。页面设计完全按照提供的UI设计图实现,包含蓝色横幅区域和活动卡片网格布局。
|
||||
|
||||
## 🎨 页面结构
|
||||
|
||||
### 1. 蓝色横幅区域 (Hero Banner)
|
||||
- **背景**: 蓝色渐变背景 (#4A90E2 到 #357ABD)
|
||||
- **左侧内容**:
|
||||
- 分类标签: "理工/消安/药师/中经"
|
||||
- 主标题: "免费海量题库" + 橙色"小程序"标签
|
||||
- 特色说明: "优质试题 | 无需下载 | 随时刷题"
|
||||
- **右侧**: 插图占位区域(预留给后续图片)
|
||||
- **装饰元素**: 网格背景纹理
|
||||
|
||||
### 2. 活动列表区域
|
||||
- **标题**: "全部活动"
|
||||
- **布局**: 3列网格布局(响应式)
|
||||
- **活动卡片**: 6个相同样式的卡片
|
||||
|
||||
### 3. 活动卡片设计
|
||||
每个卡片包含:
|
||||
- **头部**: 蓝绿色渐变背景
|
||||
- 年份标签: "2025"
|
||||
- 课程标题: "计算机二级"
|
||||
- 课程副标题: "C语言讲练综合班"
|
||||
- **主体内容**:
|
||||
- 特色标签: "系统备考"、"考点详解"、"题考刷题"
|
||||
- 课程信息: 证书名称、开课时间、适合年级、报名人数、价格
|
||||
- **底部**: 蓝色"查看详情"按钮
|
||||
|
||||
## 🎯 功能特性
|
||||
|
||||
### 1. 响应式设计
|
||||
- **桌面端**: 3列网格布局
|
||||
- **平板端**: 2列网格布局
|
||||
- **移动端**: 1列网格布局
|
||||
|
||||
### 2. 交互效果
|
||||
- **卡片悬停**: 阴影加深 + 向上移动
|
||||
- **按钮悬停**: 颜色变化 + 轻微上移
|
||||
- **加载动画**: 骨架屏效果
|
||||
|
||||
### 3. 动画效果
|
||||
- **页面加载**: 左右滑入动画
|
||||
- **卡片显示**: 渐入上移动画(错开延迟)
|
||||
- **加载状态**: 闪烁骨架屏
|
||||
|
||||
## 🛠️ 技术实现
|
||||
|
||||
### 文件结构
|
||||
```
|
||||
src/views/Activities.vue # 活动页面主组件
|
||||
src/router/index.ts # 路由配置
|
||||
src/components/layout/AppHeader.vue # 导航栏更新
|
||||
```
|
||||
|
||||
### 核心技术
|
||||
- **Vue 3 Composition API**: 组件逻辑
|
||||
- **TypeScript**: 类型安全
|
||||
- **CSS Grid**: 响应式布局
|
||||
- **CSS Animations**: 动画效果
|
||||
- **Vue Router**: 路由导航
|
||||
|
||||
### 样式特点
|
||||
- **渐变背景**: 多层次视觉效果
|
||||
- **卡片设计**: 现代化卡片样式
|
||||
- **颜色系统**: 蓝色主题 + 橙色点缀
|
||||
- **字体层级**: 清晰的信息层次
|
||||
|
||||
## 🔗 导航集成
|
||||
|
||||
活动页面已集成到主导航栏中:
|
||||
- 导航项: "活动" (带NEW标签)
|
||||
- 路由路径: `/activities`
|
||||
- 页面标题: "全部活动 - 在线学习平台"
|
||||
|
||||
## 📱 响应式断点
|
||||
|
||||
```css
|
||||
/* 大屏幕 (>1024px) */
|
||||
.activities-grid { grid-template-columns: repeat(3, 1fr); }
|
||||
|
||||
/* 平板 (≤1024px) */
|
||||
.activities-grid { grid-template-columns: repeat(2, 1fr); }
|
||||
|
||||
/* 手机 (≤768px) */
|
||||
.activities-grid { grid-template-columns: 1fr; }
|
||||
```
|
||||
|
||||
## 🎨 设计规范
|
||||
|
||||
### 颜色规范
|
||||
- **主色调**: #4A90E2 (蓝色)
|
||||
- **辅助色**: #44A08D (蓝绿色)
|
||||
- **强调色**: #FF6B35 (橙色)
|
||||
- **文字色**: #333 (深灰)
|
||||
- **次要文字**: #666 (中灰)
|
||||
|
||||
### 间距规范
|
||||
- **容器边距**: 20px (移动端) / 30px (桌面端)
|
||||
- **卡片间距**: 20px (移动端) / 30px (桌面端)
|
||||
- **内容边距**: 16px-24px
|
||||
|
||||
### 圆角规范
|
||||
- **卡片圆角**: 12px
|
||||
- **按钮圆角**: 6px
|
||||
- **标签圆角**: 4px
|
||||
|
||||
## 🚀 使用方法
|
||||
|
||||
1. **访问页面**: 点击导航栏"活动"或直接访问 `/activities`
|
||||
2. **浏览活动**: 滚动查看所有可用活动
|
||||
3. **查看详情**: 点击"查看详情"按钮(当前为演示功能)
|
||||
4. **响应式体验**: 在不同设备上自动适配布局
|
||||
|
||||
## 📝 后续扩展
|
||||
|
||||
1. **图片集成**: 添加横幅插图和活动图片
|
||||
2. **数据接口**: 连接后端API获取真实活动数据
|
||||
3. **详情页面**: 实现活动详情页面跳转
|
||||
4. **筛选功能**: 添加活动分类和筛选功能
|
||||
5. **搜索功能**: 实现活动搜索功能
|
158
docs/Banner-Image-Setup.md
Normal file
@ -0,0 +1,158 @@
|
||||
# 活动页面横幅图片设置指南
|
||||
|
||||
## 📋 概述
|
||||
|
||||
活动页面的横幅区域已经改为支持一整张图片的形式。目前显示占位内容,您可以按照以下步骤添加横幅图片。
|
||||
|
||||
## 🖼️ 当前状态
|
||||
|
||||
- ✅ 横幅区域已改为图片容器
|
||||
- ✅ 响应式设计已适配
|
||||
- ✅ 占位内容显示中
|
||||
- ⏳ 等待提供横幅图片
|
||||
|
||||
## 📐 图片规格建议
|
||||
|
||||
### 推荐尺寸
|
||||
- **桌面端**: 1200px × 400px
|
||||
- **平板端**: 1024px × 350px
|
||||
- **移动端**: 768px × 300px
|
||||
|
||||
### 文件格式
|
||||
- **推荐**: JPG/JPEG (文件小,加载快)
|
||||
- **支持**: PNG (支持透明背景)
|
||||
- **支持**: WebP (现代浏览器,更小文件)
|
||||
|
||||
### 文件大小
|
||||
- **建议**: < 500KB
|
||||
- **最大**: < 1MB
|
||||
|
||||
## 🚀 添加图片的方法
|
||||
|
||||
### 方法一:直接替换(推荐)
|
||||
|
||||
1. **将图片文件放到项目中**:
|
||||
```
|
||||
public/images/activities-banner.jpg
|
||||
```
|
||||
|
||||
2. **修改 Activities.vue 文件**:
|
||||
```typescript
|
||||
// 在 onMounted 中取消注释并设置图片路径
|
||||
onMounted(() => {
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 800)
|
||||
|
||||
// 设置横幅图片路径
|
||||
setBannerImage('/images/activities-banner.jpg')
|
||||
})
|
||||
```
|
||||
|
||||
### 方法二:直接设置变量
|
||||
|
||||
在 `src/views/Activities.vue` 中找到这一行:
|
||||
```typescript
|
||||
const bannerImageSrc = ref('')
|
||||
```
|
||||
|
||||
改为:
|
||||
```typescript
|
||||
const bannerImageSrc = ref('/images/activities-banner.jpg')
|
||||
```
|
||||
|
||||
## 📁 推荐的文件结构
|
||||
|
||||
```
|
||||
public/
|
||||
├── images/
|
||||
│ ├── activities-banner.jpg # 横幅图片
|
||||
│ ├── activities-banner-tablet.jpg # 平板版本(可选)
|
||||
│ └── activities-banner-mobile.jpg # 移动版本(可选)
|
||||
```
|
||||
|
||||
## 🎨 图片内容建议
|
||||
|
||||
根据原设计图,横幅图片应该包含:
|
||||
- 蓝色渐变背景
|
||||
- "理工/消安/药师/中经" 分类文字
|
||||
- "免费海量题库" 主标题
|
||||
- "小程序" 橙色标签
|
||||
- "优质试题 | 无需下载 | 随时刷题" 特色说明
|
||||
- 右侧人物和手机界面插图
|
||||
|
||||
## 🔧 技术实现细节
|
||||
|
||||
### 当前代码结构
|
||||
```vue
|
||||
<template>
|
||||
<div class="hero-banner">
|
||||
<div class="banner-image-container">
|
||||
<!-- 实际图片 -->
|
||||
<img
|
||||
v-if="hasBannerImage"
|
||||
:src="bannerImageSrc"
|
||||
alt="活动横幅"
|
||||
class="banner-image"
|
||||
/>
|
||||
<!-- 占位区域 -->
|
||||
<div v-else class="banner-placeholder">
|
||||
<!-- 占位内容 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
```
|
||||
|
||||
### 响应式适配
|
||||
- 桌面端:400px 高度
|
||||
- 平板端:350px 高度
|
||||
- 移动端:300px 高度
|
||||
- 小屏手机:250px 高度
|
||||
|
||||
### CSS 样式
|
||||
```css
|
||||
.banner-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover; /* 保持比例,裁剪多余部分 */
|
||||
object-position: center; /* 居中显示 */
|
||||
}
|
||||
```
|
||||
|
||||
## ⚡ 性能优化建议
|
||||
|
||||
1. **图片压缩**: 使用工具压缩图片文件
|
||||
2. **懒加载**: 大图片可考虑懒加载
|
||||
3. **多尺寸**: 为不同设备提供不同尺寸的图片
|
||||
4. **WebP格式**: 现代浏览器使用WebP格式
|
||||
|
||||
## 🔄 更新步骤
|
||||
|
||||
当您准备好横幅图片时:
|
||||
|
||||
1. **准备图片文件**
|
||||
- 确保图片符合推荐规格
|
||||
- 压缩图片文件大小
|
||||
|
||||
2. **上传图片**
|
||||
- 将图片放到 `public/images/` 目录
|
||||
|
||||
3. **更新代码**
|
||||
- 按照上述方法一或方法二设置图片路径
|
||||
|
||||
4. **测试效果**
|
||||
- 刷新浏览器查看效果
|
||||
- 测试不同设备的显示效果
|
||||
|
||||
## 📞 需要帮助?
|
||||
|
||||
如果您在设置横幅图片时遇到任何问题,请:
|
||||
1. 检查图片路径是否正确
|
||||
2. 确认图片文件是否存在
|
||||
3. 查看浏览器控制台是否有错误信息
|
||||
4. 联系开发人员获取技术支持
|
||||
|
||||
---
|
||||
|
||||
**注意**: 当前页面显示占位内容,一旦您提供横幅图片并按照上述步骤设置,占位内容将自动被实际图片替换。
|
175
docs/Faculty-Banner-Setup.md
Normal file
@ -0,0 +1,175 @@
|
||||
# 师资力量页面横幅图片设置指南
|
||||
|
||||
## 📋 概述
|
||||
|
||||
师资力量页面的横幅区域已经改为支持一整张图片的形式。目前显示占位内容,您可以按照以下步骤添加横幅图片。
|
||||
|
||||
## 🖼️ 当前状态
|
||||
|
||||
- ✅ 横幅区域已改为图片容器
|
||||
- ✅ 响应式设计已适配
|
||||
- ✅ 占位内容显示中
|
||||
- ⏳ 等待提供横幅图片
|
||||
|
||||
## 📐 图片规格建议
|
||||
|
||||
### 推荐尺寸
|
||||
- **桌面端**: 1200px × 400px
|
||||
- **平板端**: 1024px × 350px
|
||||
- **移动端**: 768px × 300px
|
||||
- **小屏手机**: 480px × 250px
|
||||
|
||||
### 文件格式
|
||||
- **推荐**: JPG/JPEG (文件小,加载快)
|
||||
- **支持**: PNG (支持透明背景)
|
||||
- **支持**: WebP (现代浏览器,更小文件)
|
||||
|
||||
### 文件大小
|
||||
- **建议**: < 500KB
|
||||
- **最大**: < 1MB
|
||||
|
||||
## 🚀 添加图片的方法
|
||||
|
||||
### 方法一:直接替换(推荐)
|
||||
|
||||
1. **将图片文件放到项目中**:
|
||||
```
|
||||
public/images/faculty-banner.jpg
|
||||
```
|
||||
|
||||
2. **修改 Faculty.vue 文件**:
|
||||
```typescript
|
||||
// 在文件开头找到这一行
|
||||
const bannerImageSrc = ref('')
|
||||
|
||||
// 改为
|
||||
const bannerImageSrc = ref('/images/faculty-banner.jpg')
|
||||
```
|
||||
|
||||
### 方法二:使用设置方法
|
||||
|
||||
在 `src/views/Faculty.vue` 中添加初始化代码:
|
||||
```typescript
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
|
||||
// 在组件挂载时设置图片
|
||||
onMounted(() => {
|
||||
setBannerImage('/images/faculty-banner.jpg')
|
||||
})
|
||||
```
|
||||
|
||||
## 📁 推荐的文件结构
|
||||
|
||||
```
|
||||
public/
|
||||
├── images/
|
||||
│ ├── faculty-banner.jpg # 师资力量横幅图片
|
||||
│ ├── faculty-banner-tablet.jpg # 平板版本(可选)
|
||||
│ └── faculty-banner-mobile.jpg # 移动版本(可选)
|
||||
```
|
||||
|
||||
## 🎨 图片内容建议
|
||||
|
||||
根据师资力量页面的特点,横幅图片应该包含:
|
||||
- 专业的教育背景或学术氛围
|
||||
- "师资力量"相关的标题文字
|
||||
- 可能包含教师形象或教学场景
|
||||
- 体现专业性和权威性的设计元素
|
||||
- 与整体网站风格保持一致的色调
|
||||
|
||||
## 🔧 技术实现细节
|
||||
|
||||
### 当前代码结构
|
||||
```vue
|
||||
<template>
|
||||
<div class="page-header">
|
||||
<div class="banner-image-container">
|
||||
<!-- 实际图片 -->
|
||||
<img
|
||||
v-if="hasBannerImage"
|
||||
:src="bannerImageSrc"
|
||||
alt="师资力量横幅"
|
||||
class="banner-image"
|
||||
/>
|
||||
<!-- 占位区域 -->
|
||||
<div v-else class="banner-placeholder">
|
||||
<!-- 占位内容 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
```
|
||||
|
||||
### 响应式适配
|
||||
- **桌面端**: 400px 高度
|
||||
- **平板端**: 350px 高度
|
||||
- **移动端**: 300px 高度
|
||||
- **小屏手机**: 250px 高度
|
||||
|
||||
### CSS 样式特点
|
||||
```css
|
||||
.banner-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover; /* 保持比例,裁剪多余部分 */
|
||||
object-position: center; /* 居中显示 */
|
||||
}
|
||||
|
||||
.banner-placeholder {
|
||||
background: linear-gradient(135deg, #4A90E2 0%, #357ABD 100%);
|
||||
/* 蓝色渐变背景作为占位 */
|
||||
}
|
||||
```
|
||||
|
||||
## ⚡ 性能优化建议
|
||||
|
||||
1. **图片压缩**: 使用工具压缩图片文件
|
||||
2. **适当尺寸**: 避免使用过大的图片
|
||||
3. **格式选择**: 优先使用JPG格式
|
||||
4. **懒加载**: 大图片可考虑懒加载
|
||||
|
||||
## 🔄 更新步骤
|
||||
|
||||
当您准备好师资力量横幅图片时:
|
||||
|
||||
1. **准备图片文件**
|
||||
- 确保图片符合推荐规格
|
||||
- 压缩图片文件大小
|
||||
- 检查图片内容是否符合师资力量主题
|
||||
|
||||
2. **上传图片**
|
||||
- 将图片放到 `public/images/` 目录
|
||||
- 确保文件名清晰易懂
|
||||
|
||||
3. **更新代码**
|
||||
- 按照上述方法设置图片路径
|
||||
- 确保路径正确无误
|
||||
|
||||
4. **测试效果**
|
||||
- 访问 `/faculty` 页面查看效果
|
||||
- 测试不同设备的显示效果
|
||||
- 检查图片加载速度
|
||||
|
||||
## 🎯 与活动页面的区别
|
||||
|
||||
师资力量页面与活动页面的横幅设置方法相同,但内容主题不同:
|
||||
- **活动页面**: 侧重课程活动和学习资源
|
||||
- **师资力量页面**: 侧重教师团队和专业实力
|
||||
|
||||
## 📞 需要帮助?
|
||||
|
||||
如果您在设置师资力量横幅图片时遇到任何问题,请:
|
||||
1. 检查图片路径是否正确
|
||||
2. 确认图片文件是否存在于 `public/images/` 目录
|
||||
3. 查看浏览器控制台是否有错误信息
|
||||
4. 确保图片格式被浏览器支持
|
||||
5. 联系开发人员获取技术支持
|
||||
|
||||
## 🔗 相关页面
|
||||
|
||||
- [活动页面横幅设置指南](./Banner-Image-Setup.md)
|
||||
- [师资力量页面功能说明](./Faculty-Page.md)
|
||||
|
||||
---
|
||||
|
||||
**注意**: 当前页面显示占位内容,一旦您提供师资力量横幅图片并按照上述步骤设置,占位内容将自动被实际图片替换。页面访问地址:`http://localhost:3000/faculty`
|
19
index.html
Normal file
@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>在线学习平台</title>
|
||||
<meta name="description" content="专业的在线学习平台,提供优质的编程和技术课程">
|
||||
<meta name="keywords" content="在线学习,编程课程,技术培训,Vue.js,React,Node.js">
|
||||
<!-- CKPlayer CSS -->
|
||||
<link rel="stylesheet" href="/ckplayer/css/ckplayer.css">
|
||||
<!-- CKPlayer JS -->
|
||||
<script src="/ckplayer/js/ckplayer.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
11
nginx.conf
Normal file
@ -0,0 +1,11 @@
|
||||
server {
|
||||
listen 80;
|
||||
server_name localhost;
|
||||
|
||||
root /usr/share/nginx/html;
|
||||
index index.html;
|
||||
|
||||
location / {
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
3602
package-lock.json
generated
Normal file
33
package.json
Normal file
@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "study-online-platform",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vue-tsc && vite build",
|
||||
"build:prod": "node deploy.js",
|
||||
"type-check": "vue-tsc --noEmit",
|
||||
"preview": "vite preview",
|
||||
"test": "vitest",
|
||||
"test:ui": "vitest --ui"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vicons/ionicons5": "^0.13.0",
|
||||
"axios": "^1.11.0",
|
||||
"ckplayer": "^3.1.2",
|
||||
"naive-ui": "^2.42.0",
|
||||
"pinia": "^3.0.3",
|
||||
"vue": "^3.5.17",
|
||||
"vue-i18n": "^9.14.5",
|
||||
"vue-router": "^4.5.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^24.0.15",
|
||||
"@vitejs/plugin-vue": "^6.0.0",
|
||||
"typescript": "^5.8.3",
|
||||
"vite": "^7.0.0",
|
||||
"vite-plugin-vue-devtools": "^7.7.7",
|
||||
"vue-tsc": "^3.0.3"
|
||||
}
|
||||
}
|
BIN
public/banners/banner1-en.png
Normal file
After Width: | Height: | Size: 1.4 MiB |
BIN
public/banners/banner1.png
Normal file
After Width: | Height: | Size: 978 KiB |
BIN
public/banners/banner6.png
Normal file
After Width: | Height: | Size: 788 KiB |
BIN
public/banners/考前须知.png
Normal file
After Width: | Height: | Size: 112 KiB |
202
public/ckplayer/LICENSE
Normal file
@ -0,0 +1,202 @@
|
||||
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
1609
public/ckplayer/css/ckplayer.css
Normal file
1707
public/ckplayer/css/ckplayer.ixigua.css
Normal file
1609
public/ckplayer/css/ckplayer.red.css
Normal file
BIN
public/ckplayer/css/images/adclose.png
Normal file
After Width: | Height: | Size: 3.2 KiB |
BIN
public/ckplayer/css/images/buffer.png
Normal file
After Width: | Height: | Size: 3.4 KiB |
BIN
public/ckplayer/css/images/ckplayer.48.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
public/ckplayer/css/images/ckplayer.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
public/ckplayer/css/images/ckplayer_ixigua.48.png
Normal file
After Width: | Height: | Size: 9.9 KiB |
BIN
public/ckplayer/css/images/ckplayer_ixigua.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
public/ckplayer/css/images/ckplayer_red.48.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
public/ckplayer/css/images/ckplayer_red.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
public/ckplayer/css/images/loading.png
Normal file
After Width: | Height: | Size: 4.1 KiB |
BIN
public/ckplayer/css/images/logo.png
Normal file
After Width: | Height: | Size: 5.0 KiB |
BIN
public/ckplayer/css/images/play.png
Normal file
After Width: | Height: | Size: 2.4 KiB |
202
public/ckplayer/flv.js/LICENSE
Normal file
@ -0,0 +1,202 @@
|
||||
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
104
public/ckplayer/flv.js/README.md
Normal file
@ -0,0 +1,104 @@
|
||||
|
||||
flv.js [](https://www.npmjs.com/package/flv.js)
|
||||
======
|
||||
An HTML5 Flash Video (FLV) Player written in pure JavaScript without Flash. LONG LIVE FLV!
|
||||
|
||||
This project relies on [Media Source Extensions][] to work.
|
||||
|
||||
**For FLV live stream playback, please consider [mpegts.js][] which is under active development.**
|
||||
|
||||
**This project will become rarely maintained.**
|
||||
|
||||
[mpegts.js]: https://github.com/xqq/mpegts.js
|
||||
## Overview
|
||||
flv.js works by transmuxing FLV file stream into ISO BMFF (Fragmented MP4) segments, followed by feeding mp4 segments into an HTML5 `<video>` element through [Media Source Extensions][] API.
|
||||
|
||||
[Media Source Extensions]: https://w3c.github.io/media-source/
|
||||
|
||||
## Demo
|
||||
[http://bilibili.github.io/flv.js/demo/](http://bilibili.github.io/flv.js/demo/)
|
||||
|
||||
## Features
|
||||
- FLV container with H.264 + AAC / MP3 codec playback
|
||||
- Multipart segmented video playback
|
||||
- HTTP FLV low latency live stream playback
|
||||
- FLV over WebSocket live stream playback
|
||||
- Compatible with Chrome, FireFox, Safari 10, IE11 and Edge
|
||||
- Extremely low overhead, and hardware accelerated by your browser!
|
||||
|
||||
## Installation
|
||||
```bash
|
||||
npm install --save flv.js
|
||||
```
|
||||
|
||||
## Build
|
||||
```bash
|
||||
npm ci # install dependencies / dev-dependences
|
||||
npm run build:debug # debug version flv.js will be emitted to /dist
|
||||
npm run build # minimized release version flv.min.js will be emitted to /dist
|
||||
```
|
||||
|
||||
[cnpm](https://github.com/cnpm/cnpm) mirror is recommended if you are in Mainland China.
|
||||
|
||||
## CORS
|
||||
If you use standalone video server for FLV stream, `Access-Control-Allow-Origin` header must be configured correctly on video server for cross-origin resource fetching.
|
||||
|
||||
See [cors.md](docs/cors.md) for more details.
|
||||
|
||||
## Getting Started
|
||||
```html
|
||||
<script src="flv.min.js"></script>
|
||||
<video id="videoElement"></video>
|
||||
<script>
|
||||
if (flvjs.isSupported()) {
|
||||
var videoElement = document.getElementById('videoElement');
|
||||
var flvPlayer = flvjs.createPlayer({
|
||||
type: 'flv',
|
||||
url: 'http://example.com/flv/video.flv'
|
||||
});
|
||||
flvPlayer.attachMediaElement(videoElement);
|
||||
flvPlayer.load();
|
||||
flvPlayer.play();
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
## Limitations
|
||||
- MP3 audio codec is currently not working on IE11 / Edge
|
||||
- HTTP FLV live stream is not currently working on all browsers, see [livestream.md](docs/livestream.md)
|
||||
|
||||
## Multipart playback
|
||||
You only have to provide a playlist for `MediaDataSource`. See [multipart.md](docs/multipart.md)
|
||||
|
||||
## Livestream playback
|
||||
See [livestream.md](docs/livestream.md)
|
||||
|
||||
## API and Configuration
|
||||
See [api.md](docs/api.md)
|
||||
|
||||
## Debug
|
||||
```bash
|
||||
npm ci # install dependencies / dev-dependences
|
||||
npm run dev # watch file changes and build debug version on the fly
|
||||
```
|
||||
|
||||
## Design
|
||||
See [design.md](docs/design.md)
|
||||
|
||||
## License
|
||||
```
|
||||
Copyright (C) 2016 Bilibili. All Rights Reserved.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
```
|
||||
|
10585
public/ckplayer/flv.js/flv.js
Normal file
1
public/ckplayer/flv.js/flv.js.map
Normal file
10
public/ckplayer/flv.js/flv.min.js
vendored
Normal file
1
public/ckplayer/flv.js/flv.min.js.map
Normal file
28
public/ckplayer/hls.js/LICENSE
Normal file
@ -0,0 +1,28 @@
|
||||
Copyright (c) 2017 Dailymotion (http://www.dailymotion.com)
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
|
||||
src/remux/mp4-generator.js and src/demux/exp-golomb.ts implementation in this project
|
||||
are derived from the HLS library for video.js (https://github.com/videojs/videojs-contrib-hls)
|
||||
|
||||
That work is also covered by the Apache 2 License, following copyright:
|
||||
Copyright (c) 2013-2015 Brightcove
|
||||
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
442
public/ckplayer/hls.js/README.md
Normal file
@ -0,0 +1,442 @@
|
||||
[](https://npmjs.org/package/hls.js)
|
||||
[](https://www.npmjs.com/package/hls.js/v/canary)
|
||||
[](https://www.jsdelivr.com/package/npm/hls.js)
|
||||
[](https://app.saucelabs.com/u/robwalch)
|
||||
|
||||
[comment]: <> ([](https://saucelabs.com/u/robwalch))
|
||||
|
||||
# 
|
||||
|
||||
HLS.js is a JavaScript library that implements an [HTTP Live Streaming] client.
|
||||
It relies on [HTML5 video][] and [MediaSource Extensions][] for playback.
|
||||
|
||||
It works by transmuxing MPEG-2 Transport Stream and AAC/MP3 streams into ISO BMFF (MP4) fragments.
|
||||
Transmuxing is performed asynchronously using a [Web Worker] when available in the browser.
|
||||
HLS.js also supports HLS + fmp4, as announced during [WWDC2016](https://developer.apple.com/videos/play/wwdc2016/504/).
|
||||
|
||||
HLS.js works directly on top of a standard HTML`<video>` element.
|
||||
|
||||
HLS.js is written in [ECMAScript6] (`*.js`) and [TypeScript] (`*.ts`) (strongly typed superset of ES6), and transpiled in ECMAScript5 using [Babel](https://babeljs.io/) and the [TypeScript compiler].
|
||||
|
||||
[Webpack] is used to build the distro bundle and serve the local development environment.
|
||||
|
||||
[html5 video]: https://www.html5rocks.com/en/tutorials/video/basics/
|
||||
[mediasource extensions]: https://w3c.github.io/media-source/
|
||||
[http live streaming]: https://en.wikipedia.org/wiki/HTTP_Live_Streaming
|
||||
[web worker]: https://caniuse.com/#search=worker
|
||||
[ecmascript6]: https://github.com/ericdouglas/ES6-Learning#articles--tutorials
|
||||
[typescript]: https://www.typescriptlang.org/
|
||||
[typescript compiler]: https://www.typescriptlang.org/docs/handbook/compiler-options.html
|
||||
[webpack]: https://webpack.js.org/
|
||||
|
||||
## Features
|
||||
|
||||
- VOD & Live playlists
|
||||
- DVR support on Live playlists
|
||||
- Fragmented MP4 container
|
||||
- MPEG-2 TS container
|
||||
- ITU-T Rec. H.264 and ISO/IEC 14496-10 Elementary Stream
|
||||
- ISO/IEC 13818-7 ADTS AAC Elementary Stream
|
||||
- ISO/IEC 11172-3 / ISO/IEC 13818-3 (MPEG-1/2 Audio Layer III) Elementary Stream
|
||||
- Packetized metadata (ID3v2.3.0) Elementary Stream
|
||||
- AAC container (audio only streams)
|
||||
- MPEG Audio container (MPEG-1/2 Audio Layer III audio only streams)
|
||||
- Timed Metadata for HTTP Live Streaming (in ID3 format, carried in MPEG-2 TS)
|
||||
- AES-128 decryption
|
||||
- SAMPLE-AES decryption (only supported if using MPEG-2 TS container)
|
||||
- Encrypted media extensions (EME) support for DRM (digital rights management)
|
||||
- Widevine CDM (only tested with [shaka-packager](https://github.com/google/shaka-packager) test-stream on [the demo page](https://hls-js.netlify.app/demo/?src=https%3A%2F%2Fstorage.googleapis.com%2Fshaka-demo-assets%2Fangel-one-widevine-hls%2Fhls.m3u8&demoConfig=eyJlbmFibGVTdHJlYW1pbmciOnRydWUsImF1dG9SZWNvdmVyRXJyb3IiOnRydWUsInN0b3BPblN0YWxsIjpmYWxzZSwiZHVtcGZNUDQiOmZhbHNlLCJsZXZlbENhcHBpbmciOi0xLCJsaW1pdE1ldHJpY3MiOi0xfQ==))
|
||||
- CEA-608/708 captions
|
||||
- WebVTT subtitles
|
||||
- Alternate Audio Track Rendition (Master Playlist with Alternative Audio) for VoD and Live playlists
|
||||
- Adaptive streaming
|
||||
- Manual & Auto Quality Switching
|
||||
- 3 Quality Switching modes are available (controllable through API means)
|
||||
- Instant switching (immediate quality switch at current video position)
|
||||
- Smooth switching (quality switch for next loaded fragment)
|
||||
- Bandwidth conservative switching (quality switch change for next loaded fragment, without flushing the buffer)
|
||||
- In Auto-Quality mode, emergency switch down in case bandwidth is suddenly dropping to minimize buffering.
|
||||
- Accurate Seeking on VoD & Live (not limited to fragment or keyframe boundary)
|
||||
- Ability to seek in buffer and back buffer without redownloading segments
|
||||
- Built-in Analytics
|
||||
- All internal events can be monitored (Network Events, Video Events)
|
||||
- Playback session metrics are also exposed
|
||||
- Resilience to errors
|
||||
- Retry mechanism embedded in the library
|
||||
- Recovery actions can be triggered fix fatal media or network errors
|
||||
- [Redundant/Failover Playlists](https://developer.apple.com/library/ios/documentation/NetworkingInternet/Conceptual/StreamingMediaGuide/UsingHTTPLiveStreaming/UsingHTTPLiveStreaming.html#//apple_ref/doc/uid/TP40008332-CH102-SW22)
|
||||
|
||||
### Supported M3U8 tags
|
||||
|
||||
For details on the HLS format and these tags' meanings, see https://tools.ietf.org/html/draft-pantos-hls-rfc8216bis-08
|
||||
|
||||
#### Manifest tags
|
||||
|
||||
- `#EXT-X-STREAM-INF:<attribute-list>`
|
||||
`<URI>`
|
||||
- `#EXT-X-MEDIA:<attribute-list>`
|
||||
- `#EXT-X-SESSION-DATA:<attribute-list>`
|
||||
|
||||
The following properties are added to their respective variants' attribute list but are not implemented in their selection and playback.
|
||||
|
||||
- `VIDEO-RANGE` and `HDCP-LEVEL` (See [#2489](https://github.com/video-dev/hls.js/issues/2489))
|
||||
|
||||
#### Playlist tags
|
||||
|
||||
- `#EXTM3U`
|
||||
- `#EXT-X-VERSION=<n>`
|
||||
- `#EXTINF:<duration>,[<title>]`
|
||||
- `#EXT-X-ENDLIST`
|
||||
- `#EXT-X-MEDIA-SEQUENCE=<n>`
|
||||
- `#EXT-X-TARGETDURATION=<n>`
|
||||
- `#EXT-X-DISCONTINUITY`
|
||||
- `#EXT-X-DISCONTINUITY-SEQUENCE=<n>`
|
||||
- `#EXT-X-BYTERANGE=<n>[@<o>]`
|
||||
- `#EXT-X-MAP:<attribute-list>`
|
||||
- `#EXT-X-KEY:<attribute-list>` (`METHOD=SAMPLE-AES` is only supports with MPEG-2 TS segments)
|
||||
- `#EXT-X-PROGRAM-DATE-TIME:<attribute-list>`
|
||||
- `#EXT-X-START:TIME-OFFSET=<n>`
|
||||
- `#EXT-X-SERVER-CONTROL:<attribute-list>`
|
||||
- `#EXT-X-PART-INF:PART-TARGET=<n>`
|
||||
- `#EXT-X-PART:<attribute-list>`
|
||||
- `#EXT-X-PRELOAD-HINT:<attribute-list>`
|
||||
- `#EXT-X-SKIP:<attribute-list>`
|
||||
- `#EXT-X-RENDITION-REPORT:<attribute-list>`
|
||||
|
||||
The following tags are added to their respective fragment's attribute list but are not implemented in streaming and playback.
|
||||
|
||||
- `#EXT-X-DATERANGE:<attribute-list>` (Not added to metadata TextTracks. See [#2218](https://github.com/video-dev/hls.js/issues/2218))
|
||||
- `#EXT-X-BITRATE` (Not used in ABR controller)
|
||||
- `#EXT-X-GAP` (Not implemented. See [#2940](https://github.com/video-dev/hls.js/issues/2940))
|
||||
|
||||
### Not Supported
|
||||
|
||||
For a complete list of issues, see ["Top priorities" in the Release Planning and Backlog project tab](https://github.com/video-dev/hls.js/projects/6). Codec support is dependent on the runtime environment (for example, not all browsers on the same OS support HEVC).
|
||||
|
||||
- CMAF CC support [#2623](https://github.com/video-dev/hls.js/issues/2623)
|
||||
- `Emsg` Inband Timed Metadata for FMP4 (ID3 within Emsgv1) in "metadata" TextTracks [#2360](https://github.com/video-dev/hls.js/issues/2360)
|
||||
- `#EXT-X-DATERANGE` in "metadata" TextTracks [#2218](https://github.com/video-dev/hls.js/issues/2218)
|
||||
- `#EXT-X-GAP` filling [#2940](https://github.com/video-dev/hls.js/issues/2940)
|
||||
- `#EXT-X-I-FRAME-STREAM-INF` I-frame Media Playlist files
|
||||
- `SAMPLE-AES` with fmp4, aac, mp3, vtt... segments (MPEG-2 TS only)
|
||||
- PlayReady and FairPlay DRM ( See [#3779](https://github.com/video-dev/hls.js/issues/2360) and [issues labeled DRM](https://github.com/video-dev/hls.js/issues?q=is%3Aissue+is%3Aopen+label%3ADRM))
|
||||
- Advanced variant selection based on runtime media capabilities (See issues labeled [`media-capabilities`](https://github.com/video-dev/hls.js/labels/media-capabilities))
|
||||
- MP3 elementary stream audio in IE and Edge (<=18) on Windows 10 (See [#1641](https://github.com/video-dev/hls.js/issues/1641) and [Microsoft answers forum](https://answers.microsoft.com/en-us/ie/forum/all/ie11-on-windows-10-cannot-play-hls-with-mp3/2da994b5-8dec-4ae9-9201-7d138ede49d9))
|
||||
|
||||
### Server-side-rendering (SSR) and `require` from a Node.js runtime
|
||||
|
||||
You can safely require this library in Node and **absolutely nothing will happen**. A dummy object is exported so that requiring the library does not throw an error. HLS.js is not instantiable in Node.js. See [#1841](https://github.com/video-dev/hls.js/pull/1841) for more details.
|
||||
|
||||
## Getting started with development
|
||||
|
||||
First, checkout the repository and install the required dependencies
|
||||
|
||||
```sh
|
||||
git clone https://github.com/video-dev/hls.js.git
|
||||
cd hls.js
|
||||
# After cloning or pulling from the repository, make sure all dependencies are up-to-date
|
||||
npm install ci
|
||||
# Run dev-server for demo page (recompiles on file-watch, but doesn't write to actual dist fs artifacts)
|
||||
npm run dev
|
||||
# After making changes run the sanity-check task to verify all checks before committing changes
|
||||
npm run sanity-check
|
||||
```
|
||||
|
||||
The dev server will host files on port 8000. Once started, the demo can be found running at http://localhost:8000/demo/.
|
||||
|
||||
Before submitting a PR, please see our [contribution guidelines](CONTRIBUTING.md).
|
||||
Join the discussion on Slack via [video-dev.org](https://video-dev.org) in #hlsjs for updates and questions about development.
|
||||
|
||||
### Build tasks
|
||||
|
||||
Build all flavors (suitable for prod-mode/CI):
|
||||
|
||||
```
|
||||
npm install ci
|
||||
npm run build
|
||||
```
|
||||
|
||||
Only debug-mode artifacts:
|
||||
|
||||
```
|
||||
npm run build:debug
|
||||
```
|
||||
|
||||
Build and watch (customized dev setups where you'll want to host through another server than webpacks' - for example in a sub-module/project)
|
||||
|
||||
```
|
||||
npm run build:watch
|
||||
```
|
||||
|
||||
Only specific flavor (known configs are: debug, dist, light, light-dist, demo):
|
||||
|
||||
```
|
||||
npm run build -- --env dist # replace "dist" by other configuration name, see above ^
|
||||
```
|
||||
|
||||
Note: The "demo" config is always built.
|
||||
|
||||
**NOTE:** `hls.light.*.js` dist files do not include EME, subtitles, CMCD, or alternate-audio support. In addition,
|
||||
the following types are not available in the light build:
|
||||
|
||||
- `AudioStreamController`
|
||||
- `AudioTrackController`
|
||||
- `CuesInterface`
|
||||
- `EMEController`
|
||||
- `SubtitleStreamController`
|
||||
- `SubtitleTrackController`
|
||||
- `TimelineController`
|
||||
- `CmcdController`
|
||||
|
||||
### Linter (ESlint)
|
||||
|
||||
Run linter:
|
||||
|
||||
```
|
||||
npm run lint
|
||||
```
|
||||
|
||||
Run linter with auto-fix mode:
|
||||
|
||||
```
|
||||
npm run lint:fix
|
||||
```
|
||||
|
||||
Run linter with errors only (no warnings)
|
||||
|
||||
```
|
||||
npm run lint:quiet
|
||||
```
|
||||
|
||||
### Formatting Code
|
||||
|
||||
Run prettier to format code
|
||||
|
||||
```
|
||||
npm run prettier
|
||||
```
|
||||
|
||||
### Type Check
|
||||
|
||||
Run type-check to verify TypeScript types
|
||||
|
||||
```
|
||||
npm run type-check
|
||||
```
|
||||
|
||||
### Automated tests (Mocha/Karma)
|
||||
|
||||
Run all tests at once:
|
||||
|
||||
```
|
||||
npm test
|
||||
```
|
||||
|
||||
Run unit tests:
|
||||
|
||||
```
|
||||
npm run test:unit
|
||||
```
|
||||
|
||||
Run unit tests in watch mode:
|
||||
|
||||
```
|
||||
npm run test:unit:watch
|
||||
```
|
||||
|
||||
Run functional (integration) tests:
|
||||
|
||||
```
|
||||
npm run test:func
|
||||
```
|
||||
|
||||
## Design
|
||||
|
||||
An overview of this project's design, it's modules, events, and error handling can be found [here](/docs/design.md).
|
||||
|
||||
## API docs and usage guide
|
||||
|
||||
- [API and usage docs, with code examples](./docs/API.md)
|
||||
- [Auto-Generated API Docs (Latest Release)](https://hls-js.netlify.com/api-docs)
|
||||
- [Auto-Generated API Docs (Development Branch)](https://hls-js-dev.netlify.com/api-docs)
|
||||
|
||||
_Note you can access the docs for a particular version using "[https://github.com/video-dev/hls.js/tree/deployments](https://github.com/video-dev/hls.js/tree/deployments)"_
|
||||
|
||||
## Demo
|
||||
|
||||
### Latest Release
|
||||
|
||||
[https://hls-js.netlify.com/demo](https://hls-js.netlify.com/demo)
|
||||
|
||||
### Master
|
||||
|
||||
[https://hls-js-dev.netlify.com/demo](https://hls-js-dev.netlify.com/demo)
|
||||
|
||||
### Specific Version
|
||||
|
||||
Find the commit on [https://github.com/video-dev/hls.js/tree/deployments](https://github.com/video-dev/hls.js/tree/deployments).
|
||||
|
||||
[](https://www.netlify.com)
|
||||
|
||||
[](https://saucelabs.com)
|
||||
|
||||
## Compatibility
|
||||
|
||||
HLS.js is only compatible with browsers supporting MediaSource extensions (MSE) API with 'video/MP4' mime-type inputs.
|
||||
|
||||
HLS.js is supported on:
|
||||
|
||||
- Chrome 39+ for Android
|
||||
- Chrome 39+ for Desktop
|
||||
- Firefox 41+ for Android
|
||||
- Firefox 42+ for Desktop
|
||||
- IE11 for Windows 8.1+
|
||||
- Edge for Windows 10+
|
||||
- Safari 8+ for MacOS 10.10+
|
||||
- Safari for ipadOS 13+
|
||||
|
||||
A [Promise polyfill](https://github.com/taylorhakes/promise-polyfill) is required in browsers missing native promise support.
|
||||
|
||||
**Please note:** iOS Safari on iPhone does not support the MediaSource API. This includes all browsers on iOS as well as apps using UIWebView and WKWebView.
|
||||
|
||||
Safari browsers (iOS, iPadOS, and macOS) have built-in HLS support through the plain video "tag" source URL. See the example below (Using HLS.js) to run appropriate feature detection and choose between using HLS.js or natively built-in HLS support.
|
||||
|
||||
When a platform has neither MediaSource nor native HLS support, the browser cannot play HLS.
|
||||
|
||||
_Keep in mind that if the intention is to support HLS on multiple platforms, beyond those compatible with HLS.js, the HLS streams need to strictly follow the specifications of RFC8216, especially if apps, smart TVs, and set-top boxes are to be supported._
|
||||
|
||||
Find a support matrix of the MediaSource API here: https://developer.mozilla.org/en-US/docs/Web/API/MediaSource
|
||||
|
||||
## Using HLS.js
|
||||
|
||||
### Installation
|
||||
|
||||
Prepackaged builds are included [with each release](https://github.com/video-dev/hls.js/releases). Or install the hls.js as a dependency
|
||||
of your project:
|
||||
|
||||
```sh
|
||||
npm install --save hls.js
|
||||
```
|
||||
|
||||
A canary channel is also available if you prefer to work off the development branch (master):
|
||||
|
||||
```
|
||||
npm install hls.js@canary
|
||||
```
|
||||
|
||||
### Embedding HLS.js
|
||||
|
||||
Directly include dist/hls.js or dist/hls.min.js in a script tag on the page. This setup prioritizes HLS.js MSE playback over
|
||||
native browser support for HLS playback in HTMLMediaElements:
|
||||
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
|
||||
<!-- Or if you want a more recent alpha version -->
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/hls.js@alpha"></script> -->
|
||||
<video id="video"></video>
|
||||
<script>
|
||||
var video = document.getElementById('video');
|
||||
var videoSrc = 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8';
|
||||
if (Hls.isSupported()) {
|
||||
var hls = new Hls();
|
||||
hls.loadSource(videoSrc);
|
||||
hls.attachMedia(video);
|
||||
}
|
||||
// HLS.js is not supported on platforms that do not have Media Source
|
||||
// Extensions (MSE) enabled.
|
||||
//
|
||||
// When the browser has built-in HLS support (check using `canPlayType`),
|
||||
// we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video
|
||||
// element through the `src` property. This is using the built-in support
|
||||
// of the plain video element, without using HLS.js.
|
||||
//
|
||||
// Note: it would be more normal to wait on the 'canplay' event below however
|
||||
// on Safari (where you are most likely to find built-in HLS support) the
|
||||
// video.src URL must be on the user-driven white-list before a 'canplay'
|
||||
// event will be emitted; the last video event that can be reliably
|
||||
// listened-for when the URL is not on the white-list is 'loadedmetadata'.
|
||||
else if (video.canPlayType('application/vnd.apple.mpegurl')) {
|
||||
video.src = videoSrc;
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
#### Alternative setup
|
||||
|
||||
To check for native browser support first and then fallback to HLS.js, swap these conditionals. See [this comment](https://github.com/video-dev/hls.js/pull/2954#issuecomment-670021358) to understand some of the tradeoffs.
|
||||
|
||||
```html
|
||||
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
|
||||
<!-- Or if you want a more recent alpha version -->
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/hls.js@alpha"></script> -->
|
||||
<video id="video"></video>
|
||||
<script>
|
||||
var video = document.getElementById('video');
|
||||
var videoSrc = 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8';
|
||||
//
|
||||
// First check for native browser HLS support
|
||||
//
|
||||
if (video.canPlayType('application/vnd.apple.mpegurl')) {
|
||||
video.src = videoSrc;
|
||||
//
|
||||
// If no native HLS support, check if HLS.js is supported
|
||||
//
|
||||
} else if (Hls.isSupported()) {
|
||||
var hls = new Hls();
|
||||
hls.loadSource(videoSrc);
|
||||
hls.attachMedia(video);
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
For more embed and API examples see [docs/API.md](./docs/API.md).
|
||||
|
||||
## CORS
|
||||
|
||||
All HLS resources must be delivered with [CORS headers](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS) permitting `GET` requests.
|
||||
|
||||
## Video Control
|
||||
|
||||
Video is controlled through HTML `<video>` element `HTMLVideoElement` methods, events and optional UI controls (`<video controls>`).
|
||||
|
||||
## Player Integration
|
||||
|
||||
The following players integrate HLS.js for HLS playback:
|
||||
|
||||
- [JW Player](https://www.jwplayer.com)
|
||||
- [Akamai Adaptive Media Player (AMP)](https://www.akamai.com/us/en/solutions/products/media-delivery/adaptive-media-player.jsp)
|
||||
- [Clappr](https://github.com/clappr/clappr)
|
||||
- [Flowplayer](https://www.flowplayer.org) through [flowplayer-hlsjs](https://github.com/flowplayer/flowplayer-hlsjs)
|
||||
- [MediaElement.js](https://www.mediaelementjs.com)
|
||||
- [Videojs](https://videojs.com) through [Videojs-hlsjs](https://github.com/benjipott/videojs-hlsjs)
|
||||
- [Videojs](https://videojs.com) through [videojs-hls.js](https://github.com/streamroot/videojs-hls.js). hls.js is integrated as a SourceHandler -- new feature in Video.js 5.
|
||||
- [Videojs](https://videojs.com) through [videojs-contrib-hls.js](https://github.com/Peer5/videojs-contrib-hls.js). Production ready plug-in with full fallback compatibility built-in.
|
||||
- [Fluid Player](https://www.fluidplayer.com)
|
||||
- [OpenPlayerJS](https://www.openplayerjs.com), as part of the [OpenPlayer project](https://github.com/openplayerjs)
|
||||
- [CDNBye](https://github.com/cdnbye/hlsjs-p2p-engine), a p2p engine for hls.js powered by WebRTC Datachannel.
|
||||
|
||||
### They use HLS.js in production!
|
||||
|
||||
| | | | |
|
||||
| :----------------------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
|
||||
| [<img src="https://i.cdn.turner.com/adultswim/big/img/global/adultswim.jpg" width="120">](https://www.adultswim.com/streams) | [<img src="https://avatars3.githubusercontent.com/u/5497190?s=200&v=4" width="120">](https://www.akamai.com) | [<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/1a/Canal%2B.svg/2000px-Canal%2B.svg.png" width="120">](https://www.canalplus.fr) | [<img src="https://avatars2.githubusercontent.com/u/115313" width="120">](https://www.dailymotion.com) |
|
||||
| [<img src="https://user-images.githubusercontent.com/4006693/44003595-baff193c-9e8f-11e8-9848-7bb91563499f.png" width="120">](https://freshlive.tv) | [<img src="https://flowplayer.org/media/img/logo-blue.png" width="120">](https://flowplayer.com) | [<img src="https://avatars1.githubusercontent.com/u/12554082?s=240" width="120">](https://www.foxsports.com.au) | [<img src="https://cloud.githubusercontent.com/assets/244265/12556435/dfaceb48-c353-11e5-971b-2c4429725469.png" width="120">](https://www.globo.com) |
|
||||
| [<img src="https://images.gunosy.com/logo/gunosy_icon_company_logo.png" width="120">](https://gunosy.com) | [<img src="https://user-images.githubusercontent.com/1480052/35802840-f8e85b8a-0a71-11e8-8eb2-eee323e3f159.png" width="120">](https://www.gl-systemhaus.de/) | [<img src="https://cloud.githubusercontent.com/assets/6525783/20801836/700490de-b7ea-11e6-82bd-e249f91c7bae.jpg" width="120">](https://nettrek.de) | [<img src="https://cloud.githubusercontent.com/assets/244265/12556385/999aa884-c353-11e5-9102-79df54384498.png" width="120">](https://www.nytimes.com/) |
|
||||
| [<img src="https://cloud.githubusercontent.com/assets/1798553/20356424/ba158574-ac24-11e6-95e1-1ae591b11a0a.png" width="120">](https://www.peer5.com/) | [<img src="https://cloud.githubusercontent.com/assets/4909096/20925062/e26e6fc8-bbb4-11e6-99a5-d4762274a342.png" width="120">](https://www.qbrick.com) | [<img src="https://www.radiantmediaplayer.com/images/radiantmediaplayer-new-logo-640.jpg" width="120">](https://www.radiantmediaplayer.com/) | [<img src="https://www.rts.ch/hummingbird-static/images/logos/logo_marts.svg" width="120">](https://www.rts.ch) |
|
||||
| [<img src="https://cloud.githubusercontent.com/assets/12702747/19316434/0a3601de-9067-11e6-85e2-936b1cb099a0.png" width="120">](https://www.snapstream.com/) | [<img src="https://pamediagroup.com/wp-content/uploads/2019/05/StreamAMG-Logo-RGB.png" width="120">](https://www.streamamg.com/) | [<img src="https://streamsharkio.sa.metacdn.com/wp-content/uploads/2015/10/streamshark-dark.svg" width="120">](https://streamshark.io/) | [<img src="https://camo.githubusercontent.com/9580f10e9bfa8aa7fba52c5cb447bee0757e33da/68747470733a2f2f7777772e7461626c6f74762e636f6d2f7374617469632f696d616765732f7461626c6f5f6c6f676f2e706e67" width="120">](https://my.tablotv.com/) |
|
||||
| [<img src="https://user-images.githubusercontent.com/2803310/34083705-349c8fd0-e375-11e7-92a6-5c38509f4936.png" width="120">](https://www.streamroot.io/) | [<img src="https://vignette1.wikia.nocookie.net/tedtalks/images/c/c0/TED_logo.png/revision/20150915192527" width="120">](https://www.ted.com/) | [<img src="https://www.seeklogo.net/wp-content/uploads/2014/12/twitter-logo-vector-download.jpg" width="120">](https://twitter.com/) | [<img src="https://player.clevercast.com/img/clevercast.png" width="120">](https://www.clevercast.com) |
|
||||
| [<img src="https://player.mtvnservices.com/edge/hosted/Viacom_logo.svg" width="120">](https://www.viacom.com/) | [<img src="https://user-images.githubusercontent.com/1181974/29248959-efabc440-802d-11e7-8050-7c1f4ca6c607.png" width="120">](https://vk.com/) | [<img src="https://avatars0.githubusercontent.com/u/5090060?s=200&v=4" width="120">](https://www.jwplayer.com) | [<img src="https://staticftv-a.akamaihd.net/arches/francetv/default/img/og-image.jpg?20161007" width="120">](https://www.france.tv) |
|
||||
| [<img src="https://showmax.akamaized.net/e/logo/showmax_black.png" width="120">](https://tech.showmax.com) | [<img src="https://static3.1tv.ru/assets/web/logo-ac67852f1625b338f9d1fb96be089d03557d50bfc5790d5f48dc56799f59dec6.svg" width="120" height="120">](https://www.1tv.ru/) | [<img src="https://user-images.githubusercontent.com/1480052/40482633-c013ebce-5f55-11e8-96d5-b776415de0ce.png" width="120">](https://www.zdf.de) | [<img src="https://github.com/cdnbye/hlsjs-p2p-engine/blob/master/figs/cdnbye.png" width="120">](https://github.com/cdnbye/hlsjs-p2p-engine) |
|
||||
| [cdn77](https://streaming.cdn77.com/) | [<img src="https://avatars0.githubusercontent.com/u/7442371?s=200&v=4" width="120">](https://r7.com/) | [<img src="https://raw.githubusercontent.com/Novage/p2p-media-loader/gh-pages/images/p2pml-logo.png" width="120">](https://github.com/Novage/p2p-media-loader) | [<img src="https://avatars3.githubusercontent.com/u/45617200?s=400" width="120">](https://kayosports.com.au) |
|
||||
| [<img src="https://avatars1.githubusercontent.com/u/5279615?s=400&u=9771a216836c613f1edf4afe71cfc69d4c5657ed&v=4" width="120">](https://flosports.tv) | [<img src="https://www.logolynx.com/images/logolynx/c6/c67a2cb3ad33a82b5518f8ad8f124703.png" width="120">](https://global.axon.com/) | | |
|
||||
|
||||
## Chrome/Firefox integration
|
||||
|
||||
made by [gramk](https://github.com/gramk/chrome-hls), plays hls from address bar and m3u8 links
|
||||
|
||||
- Chrome [native-hls](https://chrome.google.com/webstore/detail/native-hls-playback/emnphkkblegpebimobpbekeedfgemhof)
|
||||
- Firefox [native-hls](https://addons.mozilla.org/en-US/firefox/addon/native_hls_playback/)
|
||||
|
||||
## License
|
||||
|
||||
HLS.js is released under [Apache 2.0 License](LICENSE)
|
42195
public/ckplayer/hls.js/hls-demo.js
Normal file
1
public/ckplayer/hls.js/hls-demo.js.map
Normal file
27804
public/ckplayer/hls.js/hls.js
Normal file
2837
public/ckplayer/hls.js/hls.js.d.ts
vendored
Normal file
1
public/ckplayer/hls.js/hls.js.map
Normal file
20929
public/ckplayer/hls.js/hls.light.js
Normal file
1
public/ckplayer/hls.js/hls.light.js.map
Normal file
2
public/ckplayer/hls.js/hls.light.min.js
vendored
Normal file
1
public/ckplayer/hls.js/hls.light.min.js.map
Normal file
2
public/ckplayer/hls.js/hls.min.js
vendored
Normal file
1
public/ckplayer/hls.js/hls.min.js.map
Normal file
7421
public/ckplayer/js/ckplayer.js
Normal file
7
public/ckplayer/js/ckplayer.min.js
vendored
Normal file
72
public/ckplayer/language/en.js
Normal file
@ -0,0 +1,72 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||||
typeof define === 'function' && define.amd ? define(factory) :
|
||||
(global = global || self, global.ckplayerLanguage = factory());
|
||||
}(this, function () { 'use strict';
|
||||
/*
|
||||
* 功能:包含播放器用到的全部相关语言文字
|
||||
*/
|
||||
var language={
|
||||
play:'Play',
|
||||
pause:'Pause',
|
||||
refresh:'Refresh',
|
||||
full:'Fullscreen',
|
||||
exitFull:'Non-Fullscreen',
|
||||
webFull:'Web fullscreen',
|
||||
exitWebFull:'Non-Web fullscreen',
|
||||
theatre:'Theatre',
|
||||
exitTheatre:'Non-theatre',
|
||||
volume:'Volume:',
|
||||
muted:'Mute',
|
||||
exitmuted:'Unmute',
|
||||
seek:'Seek:',
|
||||
waiting:'Waiting',
|
||||
live:'Liveing',
|
||||
backLive:'Back live',
|
||||
lookBack:'Look back:',
|
||||
next:'Next episode',
|
||||
screenshot:'Screenshot',
|
||||
smallwindows:'Small windows',
|
||||
playbackrate:'Speed',
|
||||
playbackrateSuffix:' Speed',
|
||||
track:'Subtitle',
|
||||
noTrack:'No subtitle',
|
||||
definition:'Definition',
|
||||
switchTo:'Switched from:',
|
||||
closeTime:'The advertisement can be closed in {seconds} seconds',
|
||||
closeAd:'Close ad',
|
||||
second:'seconds',
|
||||
details:'View details',
|
||||
copy:'Copy',
|
||||
copySucceeded:'Copy succeeded, can be pasted!',
|
||||
smallwindowsOpen:'The small window function is turned on',
|
||||
screenshotStart:'Screenshot, please wait...',
|
||||
smallwindowsClose:'The small window function is turned off',
|
||||
screenshotClose:'Screenshot function is turned off',
|
||||
loopOpen:'Loop open',
|
||||
loopClose:'Loop close',
|
||||
close:'Close',
|
||||
down:'Down',
|
||||
p50:'50%',
|
||||
p75:'75%',
|
||||
p100:'100%',
|
||||
timeScheduleAdjust:{
|
||||
prohibit:'No dragging',
|
||||
prohibitBackOff:'No repeat viewing',
|
||||
prohibitForward:'Fast forward prohibited',
|
||||
prohibitLookBack:'Some content is forbidden to play',
|
||||
prohibitForwardNotViewed:'Disable playback of parts not viewed'
|
||||
},
|
||||
error:{
|
||||
noMessage:'Unknown error',
|
||||
supportVideoError:'The browser version is too low. It is recommended to replace it with another browser',
|
||||
videoTypeError:'This browser does not support playing this video. It is recommended to replace it with another browser',
|
||||
loadingFailed:'Loading failed',
|
||||
emptied:'An error occurred while loading the frequency file',
|
||||
screenshot:'Screenshot failed',
|
||||
ajax:'Ajax data request error',
|
||||
noVideoContainer:'No video container'
|
||||
}
|
||||
};
|
||||
return language;
|
||||
}))
|
72
public/ckplayer/language/zh.cn.js
Normal file
@ -0,0 +1,72 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||||
typeof define === 'function' && define.amd ? define(factory) :
|
||||
(global = global || self, global.ckplayerLanguage = factory());
|
||||
}(this, function () { 'use strict';
|
||||
/*
|
||||
* 功能:包含播放器用到的全部相关语言文字
|
||||
*/
|
||||
var language={
|
||||
play:'播放',
|
||||
pause:'暂停',
|
||||
refresh:'重播',
|
||||
full:'全屏',
|
||||
exitFull:'退出全屏',
|
||||
webFull:'页面全屏',
|
||||
exitWebFull:'退出页面全屏',
|
||||
theatre:'剧场模式',
|
||||
exitTheatre:'退出剧场模式',
|
||||
volume:'音量:',
|
||||
muted:'静音',
|
||||
exitmuted:'恢复音量',
|
||||
seek:'seek:',
|
||||
waiting:'缓冲',
|
||||
live:'直播中',
|
||||
backLive:'返回直播',
|
||||
lookBack:'回看:',
|
||||
next:'下一集',
|
||||
screenshot:'视频截图',
|
||||
smallwindows:'小窗口播放功能',
|
||||
playbackrate:'倍速',
|
||||
playbackrateSuffix:'倍',
|
||||
track:'字幕',
|
||||
noTrack:'无字幕',
|
||||
definition:'清晰度',
|
||||
switchTo:'切换成:',
|
||||
closeTime:'{seconds}秒后可关闭广告',
|
||||
closeAd:'关闭广告',
|
||||
second:'秒',
|
||||
details:'查看详情',
|
||||
copy:'复制',
|
||||
copySucceeded:'复制成功,可贴粘!',
|
||||
smallwindowsOpen:'小窗口功能已开启',
|
||||
smallwindowsClose:'小窗口功能已关闭',
|
||||
screenshotStart:'截图中,请稍候...',
|
||||
screenshotClose:'截图功能已关闭',
|
||||
loopOpen:'循环播放',
|
||||
loopClose:'已关闭循环播放',
|
||||
close:'关闭',
|
||||
down:'下载',
|
||||
p50:'50%',
|
||||
p75:'75%',
|
||||
p100:'100%',
|
||||
timeScheduleAdjust:{
|
||||
prohibit:'视频禁止拖动',
|
||||
prohibitBackOff:'视频禁止重复观看',
|
||||
prohibitForward:'视频禁止快进',
|
||||
prohibitLookBack:'视频禁止播放部分内容',
|
||||
prohibitForwardNotViewed:'视频禁止播放未观看的部分'
|
||||
},
|
||||
error:{
|
||||
noMessage:'未知错误',
|
||||
supportVideoError:'该浏览器版本太低,建议更换成其它浏览器',
|
||||
videoTypeError:'该浏览器不支持播放该视频,建议更换成其它浏览器',
|
||||
loadingFailed:'加载失败',
|
||||
emptied:'视频文件加载过程中出现错误',
|
||||
screenshot:'视频截图失败',
|
||||
ajax:'Ajax数据请求错误',
|
||||
noVideoContainer:'未找到放置视频的容器'
|
||||
}
|
||||
};
|
||||
return language;
|
||||
}))
|
72
public/ckplayer/language/zh.hk.js
Normal file
@ -0,0 +1,72 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||||
typeof define === 'function' && define.amd ? define(factory) :
|
||||
(global = global || self, global.ckplayerLanguage = factory());
|
||||
}(this, function () { 'use strict';
|
||||
/*
|
||||
*功能:包含播放機用到的全部相關語言文字
|
||||
*/
|
||||
var language = {
|
||||
play: '播放',
|
||||
pause: '暫停',
|
||||
refresh: '重播',
|
||||
full: '全屏',
|
||||
exitFull: '退出全屏',
|
||||
webFull: '頁面全屏',
|
||||
exitWebFull: '退出頁面全屏',
|
||||
theatre: '劇場模式',
|
||||
exitTheatre: '退出劇場模式',
|
||||
volume: '音量:',
|
||||
muted: '靜音',
|
||||
exitmuted: '恢復音量',
|
||||
seek: 'seek:',
|
||||
waiting: '緩衝',
|
||||
live: '直播中',
|
||||
backLive: '返回直播',
|
||||
lookBack: '回看:',
|
||||
next: '下一集',
|
||||
screenshot: '視頻截圖',
|
||||
smallwindows: '小視窗播放功能',
|
||||
playbackrate: '倍速',
|
||||
playbackrateSuffix: '倍',
|
||||
track: '字幕',
|
||||
noTrack: '無字幕',
|
||||
definition: '清晰度',
|
||||
switchTo: '切換成:',
|
||||
closeTime: '{seconds}秒後可關閉廣告',
|
||||
closeAd: '關閉廣告',
|
||||
second: '秒',
|
||||
details: '查看詳情',
|
||||
copy: '複製',
|
||||
copySucceeded: '複製成功,可貼粘!',
|
||||
smallwindowsOpen: '小視窗功能已開啟',
|
||||
smallwindowsClose: '小視窗功能已關閉',
|
||||
screenshotStart: '截圖中,請稍候…',
|
||||
screenshotClose: '截圖功能已關閉',
|
||||
loopOpen: '迴圈播放',
|
||||
loopClose: '已關閉迴圈播放',
|
||||
close: '關閉',
|
||||
down: '下載',
|
||||
p50: '50%',
|
||||
p75: '75%',
|
||||
p100: '100%',
|
||||
timeScheduleAdjust: {
|
||||
prohibit: '視頻禁止拖動',
|
||||
prohibitBackOff: '視頻禁止重複觀看',
|
||||
prohibitForward: '視頻禁止快進',
|
||||
prohibitLookBack: '視頻禁止播放部分內容',
|
||||
prohibitForwardNotViewed: '視頻禁止播放未觀看的部分'
|
||||
},
|
||||
error: {
|
||||
noMessage: '未知錯誤',
|
||||
supportVideoError: '該流覽器版本太低,建議更換成其它瀏覽器',
|
||||
videoTypeError: '該瀏覽器不支持播放該視頻,建議更換成其它瀏覽器',
|
||||
loadingFailed: '加載失敗',
|
||||
emptied: '視頻檔案加載過程中出現錯誤',
|
||||
screenshot: '視頻截圖失敗',
|
||||
ajax: 'Ajax數據請求錯誤',
|
||||
noVideoContainer: '未找到放置視頻的容器'
|
||||
}
|
||||
};
|
||||
return language;
|
||||
}))
|
202
public/ckplayer/mpegts.js/LICENSE
Normal file
@ -0,0 +1,202 @@
|
||||
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
9
public/ckplayer/mpegts.js/mpegts.js
Normal file
1
public/ckplayer/mpegts.js/mpegts.js.map
Normal file
9
public/ckplayer/mpegts.js/mpegts.min.js
vendored
Normal file
BIN
public/favicon.ico
Normal file
After Width: | Height: | Size: 4.2 KiB |
BIN
public/images/Featured_resources/duration.png
Normal file
After Width: | Height: | Size: 549 B |