myetv-player 1.2.0 → 1.3.0

package/.github/workflows/codeql.yml

@@ -1,100 +0,0 @@
-# For most projects, this workflow file will not need changing; you simply need
-# to commit it to your repository.
-#
-# You may wish to alter this file to override the set of languages analyzed,
-# or to provide custom queries or build logic.
-#
-# ******** NOTE ********
-# We have attempted to detect the languages in your repository. Please check
-# the `language` matrix defined below to confirm you have the correct set of
-# supported CodeQL languages.
-#
-name: "CodeQL Advanced"
-
-on:
-  push:
-    branches: [ "main" ]
-  pull_request:
-    branches: [ "main" ]
-  schedule:
-    - cron: '29 21 * * 0'
-
-jobs:
-  analyze:
-    name: Analyze (${{ matrix.language }})
-    # Runner size impacts CodeQL analysis time. To learn more, please see:
-    #   - https://gh.io/recommended-hardware-resources-for-running-codeql
-    #   - https://gh.io/supported-runners-and-hardware-resources
-    #   - https://gh.io/using-larger-runners (GitHub.com only)
-    # Consider using larger runners or machines with greater resources for possible analysis time improvements.
-    runs-on: ${{ (matrix.language == 'swift' && 'macos-latest') || 'ubuntu-latest' }}
-    permissions:
-      # required for all workflows
-      security-events: write
-
-      # required to fetch internal or private CodeQL packs
-      packages: read
-
-      # only required for workflows in private repositories
-      actions: read
-      contents: read
-
-    strategy:
-      fail-fast: false
-      matrix:
-        include:
-        - language: actions
-          build-mode: none
-        - language: javascript-typescript
-          build-mode: none
-        # CodeQL supports the following values keywords for 'language': 'actions', 'c-cpp', 'csharp', 'go', 'java-kotlin', 'javascript-typescript', 'python', 'ruby', 'rust', 'swift'
-        # Use `c-cpp` to analyze code written in C, C++ or both
-        # Use 'java-kotlin' to analyze code written in Java, Kotlin or both
-        # Use 'javascript-typescript' to analyze code written in JavaScript, TypeScript or both
-        # To learn more about changing the languages that are analyzed or customizing the build mode for your analysis,
-        # see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/customizing-your-advanced-setup-for-code-scanning.
-        # If you are analyzing a compiled language, you can modify the 'build-mode' for that language to customize how
-        # your codebase is analyzed, see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/codeql-code-scanning-for-compiled-languages
-    steps:
-    - name: Checkout repository
-      uses: actions/checkout@v4
-
-    # Add any setup steps before running the `github/codeql-action/init` action.
-    # This includes steps like installing compilers or runtimes (`actions/setup-node`
-    # or others). This is typically only required for manual builds.
-    # - name: Setup runtime (example)
-    #   uses: actions/setup-example@v1
-
-    # Initializes the CodeQL tools for scanning.
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v3
-      with:
-        languages: ${{ matrix.language }}
-        build-mode: ${{ matrix.build-mode }}
-        # If you wish to specify custom queries, you can do so here or in a config file.
-        # By default, queries listed here will override any specified in a config file.
-        # Prefix the list here with "+" to use these queries and those in the config file.
-
-        # For more details on CodeQL's query packs, refer to: https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
-        # queries: security-extended,security-and-quality
-
-    # If the analyze step fails for one of the languages you are analyzing with
-    # "We were unable to automatically build your code", modify the matrix above
-    # to set the build mode to "manual" for that language. Then modify this step
-    # to build your code.
-    # ℹ️ Command-line programs to run using the OS shell.
-    # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
-    - if: matrix.build-mode == 'manual'
-      shell: bash
-      run: |
-        echo 'If you are using a "manual" build mode for one or more of the' \
-          'languages you are analyzing, replace this with the commands to build' \
-          'your code, for example:'
-        echo '  make bootstrap'
-        echo '  make release'
-        exit 1
-
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v3
-      with:
-        category: "/language:${{matrix.language}}"

package/.github/workflows/npm-publish.yml

@@ -1,30 +0,0 @@
-name: Node.js Package
-
-on:
-  release:
-    types: [created]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-      - run: npm ci        # 'npm ci or npm install'
-      - run: npm test
-
-  publish-npm:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-          registry-url: https://registry.npmjs.org/
-      - run: npm ci        # 'npm ci or npm install'
-      - run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{secrets.npm_token}}

package/SECURITY.md

@@ -1,50 +0,0 @@
-# Security Policy
-
-## Supported Versions
-
-Use this section to tell people about which versions of your project are
-currently being supported with security updates.
-
-| Version | Supported          |
-| ------- | ------------------ |
-| 1.x.x   | :white_check_mark: |
-
-## Reporting a Vulnerability
-
-We take the security of MYETV Video Player seriously. If you discover a security vulnerability, please report it responsibly.
-
-### How to Report
-
-**Please do not report security vulnerabilities through public GitHub issues.**
-
-Instead, please report them via one of the following methods:
-- The best way is: open a ticket here: [https://support.myetv.tv](https://support.myetv.tv)
-- Use GitHub's private vulnerability reporting feature in the Security tab of this repository
-- Email: admin@myetv.tv (This method is susceptible to email provider security like spam or otherwise)
-
-### What to Include
-
-To help us better understand and resolve the issue, please include:
-- A clear description of the vulnerability
-- Steps to reproduce the issue
-- Affected versions of MYETV Video Player
-- Potential impact and severity assessment
-- Any suggested fixes or patches (if available)
-- Your environment details (browser, OS, etc.)
-
-### Response Timeline
-
-- **Acknowledgment:** We will confirm receipt of your report within **48 hours**
-- **Initial Assessment:** We will provide an initial evaluation within **7 days**
-- **Progress Updates:** We will keep you informed about the progress of resolving the issue
-- **Resolution:** Once a fix is developed, we will coordinate the release and disclosure timeline with you
-
-### Disclosure Policy
-
-We follow responsible disclosure principles:
-- Please allow us reasonable time to investigate and fix the vulnerability before public disclosure
-- We will credit you in the security advisory (unless you prefer to remain anonymous)
-- Once the fix is released, we will publish a security advisory with details about the vulnerability
-- We appreciate your cooperation in keeping MYETV users safe
-
-Thank you for helping to keep MYETV Video Player secure!

package/build.js

@@ -1,195 +0,0 @@
-// Build script for MYETV Video Player
-const fs = require('fs');
-const path = require('path');
-const { exec } = require('child_process');
-const util = require('util');
-const execPromise = util.promisify(exec);
-
-const srcDir = './src';
-const outputFile = './dist/myetv-player.js';
-const scssDir = './scss';
-const cssOutputFile = './css/myetv-player.css';
-const cssMinOutputFile = './css/myetv-player.min.css';
-const scssMainFile = './scss/myetv-player.scss';
-
-// Module order for correct concatenation
-const moduleOrder = [
-    'core.js',
-    'events.js',
-    'controls.js',
-    'quality.js',
-    'subtitles.js',
-    'chapters.js',
-    'fullscreen.js',
-    'playlist.js',
-    'watermark.js',
-    'streaming.js',
-    'plugins.js',
-    'utils.js'
-];
-
-// ===================================
-// SCSS BUILD FUNCTION
-// ===================================
-async function buildSCSS() {
-    console.log('\n📦 Building SCSS files...');
-    if (!fs.existsSync(scssDir)) {
-        console.log('⚠️  SCSS directory not found, skipping CSS build');
-        return;
-    }
-    if (!fs.existsSync(scssMainFile)) {
-        console.log('⚠️  Main SCSS file not found, skipping CSS build');
-        return;
-    }
-    const cssDir = path.dirname(cssOutputFile);
-    if (!fs.existsSync(cssDir)) {
-        fs.mkdirSync(cssDir, { recursive: true });
-        console.log(`✓ Created directory: ${cssDir}`);
-    }
-    try {
-        console.log('Compiling SCSS to CSS (expanded)...');
-        await execPromise(`npx sass --style=expanded --no-source-map ${scssMainFile} ${cssOutputFile}`);
-        const stats1 = fs.statSync(cssOutputFile);
-        const fileSize1KB = (stats1.size / 1024).toFixed(2);
-        console.log(`✓ CSS (expanded) created: ${cssOutputFile}`);
-        console.log(`  File size: ${fileSize1KB} KB`);
-        console.log('Compiling SCSS to CSS (minified)...');
-        await execPromise(`npx sass --style=compressed --no-source-map ${scssMainFile} ${cssMinOutputFile}`);
-        const stats2 = fs.statSync(cssMinOutputFile);
-        const fileSize2KB = (stats2.size / 1024).toFixed(2);
-        const savings = ((1 - stats2.size / stats1.size) * 100).toFixed(1);
-        console.log(`✓ CSS (minified) created: ${cssMinOutputFile}`);
-        console.log(`  File size: ${fileSize2KB} KB (${savings}% smaller)`);
-        console.log('\n✓ SCSS build completed successfully!');
-    } catch (error) {
-        if (error.message.includes('sass: not found') || error.message.includes('command not found')) {
-            console.log('\n⚠️  Sass compiler not found!');
-            console.log('Install with: npm install -g sass');
-            console.log('Or add to package.json: npm install --save-dev sass');
-            console.log('\nSkipping CSS build for now...\n');
-        } else {
-            console.error('✗ SCSS build failed:', error.message);
-            throw error;
-        }
-    }
-}
-
-// ===================================
-// JAVASCRIPT BUILD FUNCTION
-// ===================================
-function buildJavaScript() {
-    console.log('\n📦 Building MYETV Video Player from modular source...');
-    let output = '// MYETV Video Player - Javascript\n';
-    output += '// Created by https://www.myetv.tv https://oskarcosimo.com\n\n';
-    const i18nPath = path.join(srcDir, 'i18n.js');
-    if (fs.existsSync(i18nPath)) {
-        console.log('Processing i18n.js...');
-        let i18nContent = fs.readFileSync(i18nPath, 'utf8');
-        i18nContent = i18nContent.replace(/^\/\/ i18n Module for MYETV Video Player[\s\S]*?Created by.*?\n\n/m, '')
-            .replace(/export default VideoPlayerI18n;\s*$/m, '').trim();
-        output += i18nContent + '\n\n';
-    }
-    let pluginsGlobalCode = '';
-    const pluginsPath = path.join(srcDir, 'plugins.js');
-    if (fs.existsSync(pluginsPath)) {
-        console.log('Extracting global plugin code...');
-        const pluginsContent = fs.readFileSync(pluginsPath, 'utf8');
-        const globalMatch = pluginsContent.match(/\/\* GLOBAL_START \*\/([\s\S]*?)\/\* GLOBAL_END \*\//);
-        if (globalMatch) {
-            pluginsGlobalCode = globalMatch[1].trim() + '\n\n';
-            console.log('✓ Global plugin code extracted');
-        }
-    }
-    if (pluginsGlobalCode) {
-        output += '// Plugin System - Global Code\n';
-        output += pluginsGlobalCode;
-    }
-    output += 'class MYETVvideoplayer {\n';
-    moduleOrder.forEach((moduleFile, index) => {
-        const filePath = path.join(srcDir, moduleFile);
-        if (fs.existsSync(filePath)) {
-            console.log(`Processing ${moduleFile}... (${index + 1}/${moduleOrder.length})`);
-            let content = fs.readFileSync(filePath, 'utf8');
-            content = content.replace(/^\/\/.*Module for MYETV Video Player[\s\S]*?Created by.*?\n\n/m, '')
-                .replace(/\/\/ .*methods for main class[\s\S]*$/m, '').trim();
-            if (moduleFile === 'plugins.js') {
-                content = content.replace(/\/\* GLOBAL_START \*\/[\s\S]*?\/\* GLOBAL_END \*\//m, '').trim();
-            }
-            if (content.length > 0) {
-                output += '\n' + content + '\n';
-            }
-        } else {
-            console.warn(`Warning: ${moduleFile} not found, skipping...`);
-        }
-    });
-    output += '\n}\n\n';
-    output += '// Export for module systems\n';
-    output += 'if (typeof module !== \"undefined\" && module.exports) {\n';
-    output += '  module.exports = MYETVvideoplayer;\n';
-    output += '}\n';
-    output += 'if (typeof define === \"function\" && define.amd) {\n';
-    output += '  define([], function() { return MYETVvideoplayer; });\n';
-    output += '}\n';
-    const distDir = path.dirname(outputFile);
-    if (!fs.existsSync(distDir)) {
-        fs.mkdirSync(distDir, { recursive: true });
-    }
-    fs.writeFileSync(outputFile, output);
-    console.log('✓ JavaScript build completed successfully!');
-    console.log(`✓ Output file: ${outputFile}`);
-    console.log(`✓ File size: ${(output.length / 1024).toFixed(2)} KB`);
-    console.log(`✓ Total lines: ${output.split('\\n').length.toLocaleString()}`);
-}
-
-// ===================================
-// NATIVE JS MINIFICATION FUNCTION
-// ===================================
-function minifyJSNative() {
-    const jsFile = './dist/myetv-player.js';
-    const minFile = './dist/myetv-player.min.js';
-    
-    try {
-        let code = fs.readFileSync(jsFile, 'utf8');
-        
-        code = code.replace(/\/\*[\s\S]*?\*\//g, '');
-        code = code.replace(/^\s*\/\/.*$/gm, '');
-        
-        code = code.replace(/\n\s*\n\s*\n/g, '\n\n');
-        
-        code = code.replace(/  +/g, ' ');
-        
-        fs.writeFileSync(minFile, code);
-        console.log(`✓ JS (minified native) created: ${minFile}`);
-        console.log(` File size: ${(code.length / 1024).toFixed(2)} KB`);
-    } catch (err) {
-        console.log('✗ Native JS minification failed:', err.message);
-    }
-}
-
-// ===================================
-// MAIN BUILD PROCESS
-// ===================================
-async function build() {
-    console.log('\\n========================================');
-    console.log('  MYETV Video Player - Build Script');
-    console.log('========================================\\n');
-    try {
-        buildJavaScript();
-        minifyJSNative();
-        await buildSCSS();
-        console.log('\\n========================================');
-        console.log('  ✨ Build completed successfully!');
-        console.log('========================================');
-        console.log('\\n📄 Generated files:');
-        console.log('   JavaScript: dist/myetv-player.js');
-        console.log('   JavaScript: dist/myetv-player.min.js');
-        console.log('   CSS (dev):  css/myetv-player.css');
-        console.log('   CSS (prod): css/myetv-player.min.css\\n');
-    } catch (error) {
-        console.error('\\n✗ Build failed:', error.message);
-        process.exit(1);
-    }
-}
-
-// Run the build
-build();

package/scss/README.md

@@ -1,161 +0,0 @@
-# MYETV Video Player - SCSS Files
-
-## 📁 File Structure
-
-```
-myetv-player/
-├── scss/
-│   ├── myetv-player.scss         # Main file
-│   ├── _variables.scss            # Variables (colors, sizes, etc.)
-│   ├── _mixins.scss               # Reusable mixins
-│   ├── _base.scss                 # Base styles
-│   ├── _video.scss                # Video element
-│   ├── _loading.scss              # Loading overlay
-│   ├── _title-overlay.scss        # Title overlay
-│   ├── _controls.scss             # Player controls
-│   ├── _progress-bar.scss         # Progress bar
-│   ├── _volume.scss               # Volume controls
-│   ├── _menus.scss                # Dropdown menus
-│   ├── _poster.scss               # Video poster
-│   ├── _watermark.scss            # Watermark
-│   ├── _tooltips.scss             # Tooltip system
-│   ├── _audio-player.scss         # Player for only audio files
-│   ├── _themes.scss               # Alternative themes
-│   ├── _resolution.scss           # Display modes
-│   └── _responsive.scss           # Media queries
-├── package.json
-└── README.md
-```
-
-## Installation
-
-### 1. Install Node.js
-Download and install Node.js from [nodejs.org](https://nodejs.org)
-
-### 2. Install Sass
-```bash
-npm install
-```
-
-Or install Sass globally:
-```bash
-npm install -g sass
-```
-
-## Compilation
-
-### Development (with watch mode)
-```bash
-npm run scss:watch
-```
-This command watches SCSS files and recompiles automatically when changed.
-
-### Production (minified)
-```bash
-npm run scss:prod
-```
-Generates a minified CSS file for production.
-
-### Single compilation
-```bash
-npm run scss
-```
-
-### Manual compilation
-```bash
-sass myetv-player.scss myetv-player.css
-```
-
-## How to Add Features
-
-### 1. Modify Variables
-Open `_variables.scss` and modify the values:
-```scss
-$player-primary-color: #4a90e2 !default;  // Change primary color
-$player-icon-size: 24px !default;          // Change icon size
-```
-
-### 2. Add New Components
-Create a new file `_component-name.scss` and import it into `myetv-player.scss`:
-```scss
-@import 'component-name';
-```
-
-### 3. Create New Themes
-Open `_themes.scss` and add:
-```scss
-.video-wrapper.theme-custom {
-  --player-primary-color: #your-color;
-  --player-primary-hover: #your-hover-color;
-}
-```
-
-### 4. Modify Responsive Breakpoints
-Open `_mixins.scss` and customize the breakpoints:
-```scss
-@mixin tablet {
-  @media (max-width: 768px) {
-    @content;
-  }
-}
-```
-
-## Best Practices
-
-1. **Do not modify compiled CSS** - Always work on SCSS files
-2. **Use variables** - For reusable values, create variables in `_variables.scss`
-3. **Create mixins** - For repeated patterns, add mixins in `_mixins.scss`
-4. **Keep files small** - Each file should handle a single component
-5. **Test on multiple browsers** - Verify cross-browser compatibility
-
-## Quick Customization
-
-### Change Primary Color
-```scss
-// In _variables.scss
-$player-primary-color: #e74c3c !default;  // Red
-```
-
-### Add New Button
-```scss
-// In _controls.scss
-.custom-button {
-  @include button-hover;
-  // Your styles
-}
-```
-
-### Create Custom Menu
-```scss
-// In _menus.scss
-.custom-menu {
-  @include menu-base;
-  // Your additional styles
-}
-```
-
-## Output
-
-After compilation you will get:
-- `myetv-player.css` - Complete CSS file
-- `myetv-player.min.css` - Minified CSS file for production
-- `myetv-player.css.map` - Source map for debugging (with --source-map)
-
-## Debug
-
-If you use watch mode with source map:
-```bash
-npm run scss:dev
-```
-
-You can see the original SCSS styles in the browser during debug.
-
-## Support
-
-For questions or issues:
-- Website: [https://www.myetv.tv](https://www.myetv.tv)
-- Developer: [https://oskarcosimo.com](https://oskarcosimo.com)
-
----
-
-**Happy Coding!**

package/scss/_audio-player.scss

@@ -1,21 +0,0 @@
-.audio-player {
-    width: 320px;
-    height: 80px;
-
-    video {
-        display: none !important;
-    }
-
-    .controls-wrapper {
-        height: 60px;
-    }
-
-    .audio-wave-canvas {
-        display: block;
-        width: 100%;
-        height: 60px;
-        background-color: #222;
-        border-radius: 4px;
-        margin-top: 5px;
-    }
-}

package/scss/_base.scss

@@ -1,116 +0,0 @@
-// ===================================
-// BASE STYLES
-// ===================================
-
-:root {
-    /* Main theme colors */
-    --player-primary-color: goldenrod;
-    --player-primary-hover: #daa520;
-    --player-primary-dark: #b8860b;
-    /* Control colors */
-    --player-button-color: white;
-    --player-button-hover: rgba(255, 255, 255, 0.1);
-    --player-button-active: rgba(255, 255, 255, 0.2);
-    /* Text colors */
-    --player-text-color: white;
-    --player-text-secondary: rgba(255, 255, 255, 0.8);
-    /* Background and overlay */
-    --player-bg-primary: #000;
-    --player-bg-controls: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.8) 100%);
-    --player-bg-title-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, transparent 100%);
-    --player-bg-menu: rgba(20, 20, 20, 0.95);
-    --player-bg-loading: rgba(0, 0, 0, 0.7);
-    /* Dimensions */
-    --player-border-radius: 12px;
-    --player-controls-padding: 20px 15px 15px;
-    --player-title-overlay-padding: 15px 20px 25px;
-    --player-button-padding: 8px;
-    --player-icon-size: 20px;
-    /* Progress and Volume bars */
-    --player-progress-height: 6px;
-    --player-progress-bg: rgba(255, 255, 255, 0.2);
-    --player-progress-buffer: rgba(255, 255, 255, 0.3);
-    --player-progress-handle-size: 16px;
-    --player-volume-height: 4px;
-    --player-volume-bg: rgba(255, 255, 255, 0.2);
-    --player-volume-handle-size: 14px;
-    --player-volume-fill: 100%;
-    /* Transitions */
-    --player-transition-fast: 0.2s ease;
-    --player-transition-normal: 0.3s ease;
-    /* Shadows */
-    --player-shadow-main: 0 8px 32px rgba(0, 0, 0, 0.3);
-    --player-shadow-menu: 0 4px 16px rgba(0, 0, 0, 0.2);
-    --player-shadow-tooltip: 0 3px 12px rgba(0, 0, 0, 0.4);
-}
-
-
-* {
-    box-sizing: border-box;
-}
-
-body {
-    margin: 0;
-    padding: 20px;
-    background: #1a1a1a;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-}
-
-.video-container {
-    max-width: 1200px;
-    margin: 0 auto;
-    background: var(--player-bg-primary);
-    border-radius: var(--player-border-radius);
-    box-shadow: var(--player-shadow-main);
-    position: relative;
-}
-
-.video-container:fullscreen,
-.video-container:-webkit-full-screen,
-.video-container:-moz-full-screen {
-    width: 100vw;
-    height: 100vh;
-    border-radius: 0;
-}
-
-.video-wrapper {
-    position: relative;
-    width: 100%;
-    background: var(--player-bg-primary);
-    overflow: visible !important;
-}
-
-.video-wrapper.player-initialized .video-player {
-    visibility: visible;
-    opacity: 1;
-    transition: opacity 0.3s ease;
-    pointer-events: auto;
-}
-
-.video-wrapper.player-initialized .initial-loading {
-    opacity: 0;
-    visibility: hidden;
-    transition: opacity 0.3s ease, visibility 0.3s ease;
-    transition-delay: 0.2s;
-    display: none;
-    transition-delay: 0.5s;
-}
-
-.video-wrapper:not(.has-controls) .video-watermark.hide-on-autohide {
-    visibility: hidden;
-    opacity: 0;
-}
-
-.hidden {
-    display: none !important;
-}
-
-
-/* DARK MODE THEME */
-
-.player-theme-dark {
-    --player-bg-primary: #1a1a1a;
-    --player-bg-controls: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.9) 100%);
-    --player-bg-title-overlay: linear-gradient(180deg, rgba(30, 30, 30, 0.9) 0%, transparent 100%);
-    --player-bg-menu: rgba(30, 30, 30, 0.95);
-}