# zulko/eagle.js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/zulko-eagle-js).**

4,053 stars · 214 forks · JavaScript · ISC

## Links

- GitHub: https://github.com/Zulko/eagle.js
- Homepage: https://zulko.github.io/eaglejs-demo/
- awesome-repositories: https://awesome-repositories.com/repository/zulko-eagle-js.md

## Topics

`html` `presentations` `slideshow` `slideshow-framework` `slideshow-maker` `slideshows` `vuejs`

## Description

eagle.js is a component-driven presentation engine and web-based tool for building interactive digital slideshows. It functions as a Vue.js slideshow framework that uses a component architecture to manage slide hierarchies and transitions within a browser.

The system distinguishes itself through support for nested presentation hierarchies, allowing slideshows to be embedded within other slides to organize complex information. It includes a dual-window synchronization system for a dedicated presenter mode, which separates a private controller for speaker notes from the public display.

The framework provides a wide range of interactive capabilities, including a library of slide widgets, functional live demo integration, and a custom theme engine for visual styling. Navigation is handled through a combination of keyboard, mouse, and scroll inputs, with additional utility for magnifying specific slide areas via a content zoom mechanism.

## Tags

### Web Development

- [Vue.js Presentation Frameworks](https://awesome-repositories.com/f/web-development/vue-js-presentation-frameworks.md) — Functions as a Vue.js slideshow framework using a component architecture for flexible layout and styling.
- [Cross-Window State Synchronizations](https://awesome-repositories.com/f/web-development/cross-window-state-synchronizations.md) — Synchronizes state between a presenter controller window and a public display window using shared browser state.
- [Slideshow Frameworks](https://awesome-repositories.com/f/web-development/vue-js-frameworks/slideshow-frameworks.md) — Offers a component-based system for building interactive web presentations using Vue.js.
- [Presentation Interactive Widgets](https://awesome-repositories.com/f/web-development/interactive-web-component-libraries/presentation-interactive-widgets.md) — Includes a library of embeddable widgets and components for adding live demos to web presentations.

### Business & Productivity Software

- [Interactive Presentations](https://awesome-repositories.com/f/business-productivity-software/interactive-presentations.md) — Enables the creation of web-based presentations featuring embedded live demos and interactive widgets.

### Content Management & Publishing

- [Nested Presentation Hierarchies](https://awesome-repositories.com/f/content-management-publishing/content-hierarchy-management/nested-presentation-hierarchies.md) — Supports embedding slideshows within other slides to organize complex information into multi-level layers.

### User Interface & Experience

- [Browser-Based Presentation Frameworks](https://awesome-repositories.com/f/user-interface-experience/html-to-presentation-converters/browser-based-presentation-frameworks.md) — Provides a browser-based framework for authoring and delivering presentations with an integrated presenter mode.
- [Slide Navigation Adapters](https://awesome-repositories.com/f/user-interface-experience/input-handling/mobile-touch-handlers/keyboard-and-touch-adapters/slide-navigation-adapters.md) — Handles slide progression through a unified system of keyboard, mouse, and scroll event listeners. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))
- [Nested Component Hierarchies](https://awesome-repositories.com/f/user-interface-experience/nested-component-hierarchies.md) — Supports nesting slideshows within other presentations to create complex organizational structures. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))
- [Presentation Component Frameworks](https://awesome-repositories.com/f/user-interface-experience/presentation-component-frameworks.md) — Provides a component-driven engine for nesting slideshow hierarchies and managing slide transitions.
- [Slide Navigation Controls](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/navigation-flow-controllers/slide-navigation-links/slide-navigation-controls.md) — Tracks current slide and step indices to drive view updates and transition animations.
- [Presenter Controls](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/presentation-modes/presenter-controls.md) — Ships a dual-window synchronization system that separates private speaker notes from the public display. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))
- [Speaker Views](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/presentation-modes/speaker-views.md) — Provides a dedicated speaker view with synchronized notes and a preview of upcoming slides.
- [Hierarchical Slide Structures](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/slide-management-configuration/slide-content-authoring/slide-element-insertion/prebuilt-slide-components/hierarchical-slide-structures.md) — Implements a component-based architecture to organize slides and incremental steps into nested hierarchies.
- [CSS Variable Theming](https://awesome-repositories.com/f/user-interface-experience/css-variable-theming.md) — Provides a theming system that maps visual styles to native CSS variables for dynamic overrides.
- [Input Event Mappings](https://awesome-repositories.com/f/user-interface-experience/event-driven-state-managers/event-driven-state-synchronizers/ui-state-recomposition/state-to-ui-mapping/input-event-mappings.md) — Maps keyboard, mouse, and scroll events to internal navigation methods for controlling presentation flow.
- [Slide Transition Engines](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/animation-transition-engines/slide-transition-engines.md) — Implements an engine to manage custom visual transition effects between sequential slides. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))
- [Slide Transition Effects](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/animation-transition-engines/slide-transition-engines/slide-element-animations/group-enter-update-exit-animators/slide-transition-effects.md) — Provides custom enter and leave transitions to control the visual flow of the presentation.
- [Theme Customization Engines](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/slide-layout-styling/theme-customization-engines.md) — Features a flexible engine for changing appearance via configurable style properties and components. ([source](https://zulko.github.io/eaglejs-demo/))
- [Presentation Themes](https://awesome-repositories.com/f/user-interface-experience/presentation-themes.md) — Allows updating the visual style of a slideshow by importing existing CSS theme files. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))
- [Presentation Widgets](https://awesome-repositories.com/f/user-interface-experience/presentation-widgets.md) — Provides a library of functional slide elements including modals, code blocks, toggles, and radio buttons. ([source](https://cdn.jsdelivr.net/gh/zulko/eagle.js@master/README.md))

### Part of an Awesome List

- [Live Demo Embeds](https://awesome-repositories.com/f/awesome-lists/more/demo-applications/component-interactive-demos/live-demo-embeds.md) — Enables embedding functional web demos and interactive elements directly into slides for live demonstrations. ([source](https://zulko.github.io/eaglejs-demo/))
- [UI](https://awesome-repositories.com/f/awesome-lists/more/ui.md) — Listed in the “UI组件” section of the Awesome Github Vue awesome list.