{"id":35192417,"url":"https://github.com/terotests/evg_c","last_synced_at":"2026-05-20T06:41:59.220Z","repository":{"id":327941983,"uuid":"73485800","full_name":"terotests/evg_c","owner":"terotests","description":"Video Encoder and XML based Layout engine test with Embedded JS Intepreter","archived":false,"fork":false,"pushed_at":"2025-12-10T12:07:39.000Z","size":8380,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-12-10T14:20:14.840Z","etag":null,"topics":["c","javascript-framework","layout-engine","video-processing"],"latest_commit_sha":null,"homepage":"","language":"C","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/terotests.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2016-11-11T14:48:28.000Z","updated_at":"2025-12-10T10:48:05.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/terotests/evg_c","commit_stats":null,"previous_names":["terotests/evg_c"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/terotests/evg_c","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/terotests%2Fevg_c","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/terotests%2Fevg_c/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/terotests%2Fevg_c/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/terotests%2Fevg_c/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/terotests","download_url":"https://codeload.github.com/terotests/evg_c/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/terotests%2Fevg_c/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28111428,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-12-29T02:00:07.021Z","response_time":58,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["c","javascript-framework","layout-engine","video-processing"],"created_at":"2025-12-29T06:03:22.436Z","updated_at":"2025-12-29T06:04:15.302Z","avatar_url":"https://github.com/terotests.png","language":"C","funding_links":[],"categories":[],"sub_categories":[],"readme":"# evg - Experimental Video Generator\r\n\r\n\u003e ⚠️ **EXPERIMENTAL PROJECT** - This is an experimental project and is not intended for production use. The API and functionality may change without notice.\r\n\r\n![Santa Claus Animation](santa.gif)\r\n\r\n_Example: Santa's sleigh flying across a winter night sky - generated entirely from JavaScript code_\r\n\r\n## Overview\r\n\r\nEVG (Experimental Video Generator) is a C-based video encoding system that generates video frames programmatically using JavaScript and XML-based UI definitions. The system renders UI components to video frames using Cairo graphics library and encodes them using FFmpeg/libav libraries.\r\n\r\n## Quick Example\r\n\r\nCreate a simple bouncing ball animation in just a few lines of JavaScript:\r\n\r\n```javascript\r\nfunction processLine(time) {\r\n  if (time \u003e 3.0) return \"\"; // Stop after 3 seconds\r\n\r\n  var y = 200 + Math.abs(Math.sin(time * 4)) * 150; // Bouncing motion\r\n\r\n  return `\r\n    \u003cView width=\"100%\" height=\"100%\" background-color=\"#87CEEB\"\u003e\r\n        \u003cView left=\"100\" top=\"${y}\" width=\"50\" height=\"50\" \r\n              background-color=\"#ff0000\" border-radius=\"50%\"/\u003e\r\n    \u003c/View\u003e`;\r\n}\r\n```\r\n\r\nThen generate the video:\r\n\r\n```bash\r\n./encoder -j bounce.js -o bounce.mp4 -r 30 -w 800 -h 400\r\n```\r\n\r\n## How It Works\r\n\r\nThe algorithm works in the following way:\r\n\r\n1. **JavaScript Frame Generation**: A JavaScript file (powered by Duktape engine) defines a `processLine(frameNumber)` function that returns XML markup for each video frame\r\n2. **XML Parsing**: The XML markup is parsed using libxml2 to create a UI structure tree\r\n3. **Layout Calculation**: The system calculates layout positions for UI elements (similar to CSS flexbox concepts)\r\n4. **Cairo Rendering**: UI elements are rendered to a Cairo surface with support for:\r\n   - Text rendering with custom fonts (via FreeType)\r\n   - Images\r\n   - SVG paths\r\n   - Gradients (linear and radial)\r\n   - Rounded rectangles\r\n   - Opacity and transformations\r\n5. **Video Encoding**: Frames are encoded to video using FFmpeg/libav libraries\r\n\r\n## Command Line Usage\r\n\r\n```bash\r\n# Video encoding (JavaScript to video)\r\n./encoder -j \u003cjs_file\u003e -o \u003coutput\u003e [options]\r\n\r\n# XML to PDF conversion\r\n./encoder -i \u003cinput_xml\u003e -o \u003coutput_pdf\u003e\r\n```\r\n\r\n### Options\r\n\r\n| Option | Description                                      |\r\n| ------ | ------------------------------------------------ |\r\n| `-j`   | JavaScript file for video frame generation       |\r\n| `-o`   | Output file (video or PDF)                       |\r\n| `-i`   | Input XML file (for PDF mode)                    |\r\n| `-r`   | Framerate in fps (default: 25, range: 1-120)     |\r\n| `-w`   | Video width in pixels (default: 800, max: 7680)  |\r\n| `-h`   | Video height in pixels (default: 600, max: 4320) |\r\n| `-b`   | Bitrate in kbps (default: 800, range: 100-50000) |\r\n\r\n### Examples\r\n\r\n```bash\r\n# Generate video with default settings (800x600, 25fps, 800kbps)\r\n./encoder -j myFile.js -o output.mp4\r\n\r\n# Generate HD video at 30fps\r\n./encoder -j myFile.js -o output.mp4 -w 1280 -h 720 -r 30\r\n\r\n# Generate Full HD video with high quality\r\n./encoder -j myFile.js -o output.mp4 -w 1920 -h 1080 -r 30 -b 4000\r\n\r\n# Generate 4K video at 60fps\r\n./encoder -j myFile.js -o output.mp4 -w 3840 -h 2160 -r 60 -b 20000\r\n\r\n# Generate animated GIF\r\n./encoder -j myFile.js -o output.gif -w 400 -h 300 -r 15\r\n```\r\n\r\n### JavaScript API\r\n\r\nThe `processLine(time)` function receives time in seconds as a floating-point number:\r\n\r\n- At 25fps: `0.0, 0.04, 0.08, 0.12, ...`\r\n- At 30fps: `0.0, 0.033, 0.067, 0.1, ...`\r\n- At 60fps: `0.0, 0.0167, 0.033, 0.05, ...`\r\n\r\nReturn an empty string `\"\"`, `false`, or `undefined` to stop video generation.\r\n\r\n```javascript\r\nfunction processLine(time) {\r\n  // Stop after 5 seconds\r\n  if (time \u003e 5.0) {\r\n    return \"\";\r\n  }\r\n\r\n  // Create animation based on time\r\n  var x = Math.sin(time * 2) * 100;\r\n  return '\u003cView left=\"' + x + '\" ...\u003e\u003c/View\u003e';\r\n}\r\n```\r\n\r\n## Technical Components\r\n\r\nThe system consists of the following main components:\r\n\r\n| Component         | File                    | Description                            |\r\n| ----------------- | ----------------------- | -------------------------------------- |\r\n| Video Encoder     | `video_encoder.c`       | Main entry point, video encoding logic |\r\n| UI Structure      | `UIStructure.c/h`       | Data structures for UI elements        |\r\n| XML Parser        | `UIXMLParser.c/h`       | Parses XML markup into UI structure    |\r\n| Layout Calculator | `UICalculateLayout.c/h` | Calculates positions and sizes         |\r\n| Text Rendering    | `UINativeText.c/h`      | Font loading and text rendering        |\r\n| Linked List       | `EVGLinkedList.c/h`     | Generic linked list implementation     |\r\n| JavaScript Engine | `duktape.c/h`           | Embedded Duktape JS engine             |\r\n\r\n### External Libraries Used\r\n\r\n- **Cairo** - 2D graphics library for rendering\r\n- **FreeType** - Font rendering\r\n- **libxml2** - XML parsing\r\n- **FFmpeg/libav** - Video encoding (libavcodec, libavformat, libavutil)\r\n- **Duktape** - Embedded JavaScript engine\r\n- **GTK3** - GUI toolkit (development headers)\r\n\r\n## Installation Requirements\r\n\r\nThe project requires the following dependencies (as specified in the Dockerfile):\r\n\r\n### System Packages (Ubuntu/Debian)\r\n\r\n```bash\r\napt-get install -y gcc\r\napt-get install -y ffmpeg\r\napt-get install -y wget\r\napt-get install -y xz-utils\r\napt-get install -y build-essential\r\napt-get install -y libcairo2-dev\r\napt-get install -y libgtk-3-dev\r\napt-get install -y libxml2-dev\r\napt-get install -y libavcodec-dev\r\napt-get install -y libavutil-dev\r\napt-get install -y libavformat-dev\r\napt-get install -y libfreetype6-dev\r\n```\r\n\r\n### Duktape JavaScript Engine\r\n\r\nDownload and extract Duktape:\r\n\r\n```bash\r\nwget https://duktape.org/duktape-2.5.0.tar.xz\r\ntar xvf duktape-2.5.0.tar.xz\r\n```\r\n\r\n## Building with Docker (Recommended)\r\n\r\nBuilding the Docker image:\r\n\r\n```bash\r\ndocker build -t evg-video docker\r\n```\r\n\r\nStarting the container:\r\n\r\n```bash\r\ndocker run -it -v $(pwd)/project:/project evg-video /bin/bash\r\n```\r\n\r\n## Building from Source\r\n\r\nInside the `project/src/c` directory:\r\n\r\n```bash\r\nmake\r\n```\r\n\r\n## Project Structure\r\n\r\n```\r\nevg_c/\r\n├── docker/\r\n│   └── Dockerfile          # Docker build configuration\r\n├── project/\r\n│   ├── bin/\r\n│   │   └── encoder         # Compiled binary\r\n│   └── src/\r\n│       ├── c/              # C source code\r\n│       ├── js/             # JavaScript files\r\n│       └── templates/      # XML template files\r\n├── build.sh\r\n└── README.md\r\n```\r\n\r\n## License\r\n\r\nThis is an experimental project. Please check individual component licenses (especially Duktape and FFmpeg) for usage terms.\r\n\r\n---\r\n\r\n## AI-Assisted Animation Experiment: Solar System Journey\r\n\r\nThis project includes an experimental animation created through AI-assisted development, demonstrating the capabilities of the EVG system for complex 3D-style animations.\r\n\r\n### The Animation\r\n\r\n`planets.js` generates a 120-second flythrough of our solar system featuring:\r\n\r\n- **3D Projection System**: Full perspective projection with camera look-at targeting\r\n- **8 Planets**: Neptune, Uranus, Saturn, Jupiter, Mars, Earth, Venus, Mercury - each with accurate relative orbital distances and elliptical orbits\r\n- **Visual Effects**:\r\n  - Jupiter's atmospheric bands and Great Red Spot\r\n  - Earth's orbiting Moon\r\n  - 1200+ asteroids and space debris\r\n  - Asteroid belt between Mars and Jupiter\r\n  - Sun with corona and glow effects\r\n  - Twinkling star field background\r\n- **Sci-Fi HUD Overlay**:\r\n  - Green \"Matrix-style\" typewriter text effects\r\n  - Targeting reticles with corner brackets around planets\r\n  - Real-time distance readouts\r\n  - Mission timer and velocity indicators\r\n\r\n### Technical Highlights\r\n\r\n**Smooth Camera System**:\r\n\r\n- Catmull-Rom spline interpolation for smooth camera paths\r\n- Time-based waypoint system for easy path editing\r\n- Automatic look-at target blending between waypoints\r\n- Eased transitions using cubic interpolation\r\n\r\n**3D Engine Features**:\r\n\r\n```javascript\r\n// Look-at based 3D projection\r\nfunction project3DWithLookAt(x, y, z, cameraX, cameraY, cameraZ,\r\n                              lookAtX, lookAtY, lookAtZ, width, height)\r\n\r\n// Elliptical orbit calculation with inclination\r\nfunction getOrbitPosition(planet, time)\r\n\r\n// Smooth path interpolation\r\nfunction catmullRom(p0, p1, p2, p3, t)\r\n```\r\n\r\n**Sci-Fi UI Components**:\r\n\r\n```javascript\r\n// Typewriter text with blinking cursor\r\nscifiTypewriter(text, x, y, startTime, currentTime, options);\r\n\r\n// HUD targeting brackets with pointer lines\r\nscifiTargetReticle(targetX, targetY, label, options);\r\n```\r\n\r\n### Running the Animation\r\n\r\n```bash\r\ncd project/src/c\r\n./encoder planets.js planets.mp4\r\n```\r\n\r\n### Development Notes\r\n\r\nThis animation was developed iteratively with AI assistance, exploring:\r\n\r\n- Camera projection mathematics and coordinate systems\r\n- Spline-based smooth camera movement\r\n- Efficient rendering of many objects (depth sorting)\r\n- Creating compelling sci-fi visual aesthetics purely through code\r\n\r\nThe entire animation is generated procedurally - no pre-rendered assets, just mathematical formulas producing each frame in real-time.\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fterotests%2Fevg_c","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fterotests%2Fevg_c","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fterotests%2Fevg_c/lists"}