The elara from hlhielkema

Elara enables creating a Windows/MacOS like window manager experience inside a web browser. This JavaScript library is written with performances and compatibility in mind. No third-party libraries or frameworks are needed to use Elara.

🌈 Live demo

Open the LIVE DEMO to try Elara yourself.

Scroll down for some screenshots.

The demo site is hosted using GitHub pages. Running Elara requires no back-end code besides static file hosting.

View more

✨ Features

Move windows around the screen.
Resize windows from all sides.
Maximize/Minimize/Close windows.
Dock windows on the sides or in the corners of the screen.
Double click the top of the window to maximize it.
Select windows with the taskbar on the bottom of the screen.
Switch between unlimited workspaces, each with their own set of active windows.
Grab windows to bring them to the top level.
Animations and smooth movement.
Split windows, cascade windows, maximize/minimize/show all.

🖥 Environment Support

Supports all major web browsers.
Can run directly on Electron, CEF and other Web standards-based environments.
Technically works, but it is not very useful in mobile web browsers.

IE / Edge	Firefox	Chrome	Safari	Opera
IE11, Edge	last 2 versions	last 2 versions	last 2 versions	last 2 versions

📦 Build

Bundling the Elara code into a single Javascript and CSS file with Webpack requires Node.js. Install Node.js and run the command below to bundle Elara. The files that can be used for distribution will be placed in the /dist directory.

npm run build

Grab the files from the /dist directory if you want only to use Elara without modifying it.

✔️ Linting

This project uses ESLint to ensure a consistent coding style. The rules are a minor extension on the Airbnb rules. Use this command to run ESLint:

npm run lint

Use eslint --fix ./src/ for automated fixing (where possible).

❓ Community Support

Please create a new issue if you encounter any issues with this project.

🤝 Contributing

Contributing to the project is welcome and appreciated. If you would like to contribute, feel free to create a pull request or bug report. Code contributors will be listed in the README.

💻 Screenshots

⚙️ Run local demo server

The Elara library itself does not require any backend to work. However, just opening index.html on your local system will not work properly. This repository contains 3 implementations of simple servers to try or test Elara. Each server is written in a different programming language. Please use the server implementation you prefer. Use the online live demo described earlier in this document if you just want to try the last stable version of Elara. The server implementations are written in:

Node.js
ASP.NET Core
Go

Node.js demo server

Command:

node demo\nodejs\server.js

Output:

Routes:
"/"       ->: D:\GitHub Workspace\elara\demo\shared\index.html
"/dist/*" ->: D:\GitHub Workspace\elara\dist
"/*"      ->: D:\GitHub Workspace\elara\demo\shared

Elara demo server running at http://127.0.0.1:3000/

TIP: Press Ctrl+C to shut down.

ASP.NET Core demo server

Command:

dotnet run --project .\demo\aspnetcore\ElaraDemo

Output:

info: Microsoft.Hosting.Lifetime[0]
      Now listening on: https://localhost:5001
info: Microsoft.Hosting.Lifetime[0]
      Now listening on: http://localhost:5000 
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: D:\GitHub Workspace\elara\demo\aspnetcore\ElaraDemo

TIP: Press Ctrl+C to shut down.

Go demo server

Command:

cd demo/go
go build server.go
.\server.exe

Output:

2020/03/07 13:50:14 Listening on :3500..

TIP: Press Ctrl+C to shut down.

🔗 Third-party resources

Feather

Some of the icons used in the demo are from the Feather icon pack. Feather is licensed under the MIT License.

Website: feathericons.com
GitHub: feathericons/feather

Browsers support badges

An useful tool to generate browser support tables in markdown format. This project is licensed under the MIT License.

Website: godban.github.io/browsers-support-badges/
GitHub: godban/browsers-support-badges

Webpack is not recognized as an internal or external command, operable program or batch file.

Hi, nice project you have and wanting to use in a classroom student project.

Have hit an issue never experienced before. As the title says, that is is my issue:

xxxx@ThinkCentre MINGW64 /c/Users/Public/Documents/elara (master)
$ npm run build

> [email protected] build C:\Users\Public\Documents\elara
> webpack

'webpack' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `webpack`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\xxxx\AppData\Roaming\npm-cache\_logs\2020-09-24T19_15_08_452Z-debug.log

The debug log:

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'build'
1 verbose cli ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle [email protected]~prebuild: [email protected]
6 info lifecycle [email protected]~build: [email protected]
7 verbose lifecycle [email protected]~build: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~build: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\Public\Documents\elara\node_modules\.bin;C:\Users\xxxx\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\local\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Users\xxxx\bin;C:\Program Files\Docker\Docker\Resources\bin;C:\Perl64\site\bin;C:\Perl64\bin;C:\Program Files (x86)\Embarcadero\Studio\18.0\bin;C:\Users\Public\Documents\Embarcadero\Studio\18.0\Bpl;C:\Program Files (x86)\Embarcadero\Studio\18.0\bin64;C:\Users\Public\Documents\Embarcadero\Studio\18.0\Bpl\Win64;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\WinSCP;C:\FPC\3.0.2\bin\i386-Win32;C:\Program Files\InstallAware\InstallAware 12;C:\Program Files (x86)\Yarn\bin;C:\WINDOWS\System32\OpenSSH;C:\Program Files\Git\cmd;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Program Files (x86)\Intel\Platform Flash Tool Lite;C:\Program Files\nodejs;C:\Users\xxxx\.windows-build-tools\python27;C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\xxxx\AppData\Roaming\npm\node_modules\windows-build-tools\node_modules\.bin;C:\Users\xxxx\AppData\Roaming\npm\node_modules\.bin;C:\Program Files\Docker\Docker\Resources\bin;C:\Perl64\site\bin;C:\Perl64\bin;C:\Program Files (x86)\Embarcadero\Studio\18.0\bin;C:\Users\Public\Documents\Embarcadero\Studio\18.0\Bpl;C:\Program Files (x86)\Embarcadero\Studio\18.0\bin64;C:\Users\Public\Documents\Embarcadero\Studio\18.0\Bpl\Win64;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\WinSCP;C:\FPC\3.0.2\bin\i386-Win32;C:\Program Files\InstallAware\InstallAware 12;C:\Program Files (x86)\Yarn\bin;C:\WINDOWS\System32\OpenSSH;C:\Program Files\Git\cmd;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Program Files\nodejs;C:\Ruby23\bin;C:\Users\xxxx\AppData\Local\Microsoft\WindowsApps;C:\Users\xxxx\AppData\Local\Yarn\.bin;C:\Users\xxxx\AppData\Local\atom\bin;C:\Users\xxxx\AppData\Local\GitHubDesktop\bin;C:\Users\xxxx\AppData\Local\Microsoft\WindowsApps;C:\Users\xxxx\AppData\Roaming\npm;C:\Program Files\Git\usr\bin\vendor_perl;C:\Program Files\Git\usr\bin\core_perl
9 verbose lifecycle [email protected]~build: CWD: C:\Users\Public\Documents\elara
10 silly lifecycle [email protected]~build: Args: [ '/d /s /c', 'webpack' ]
11 silly lifecycle [email protected]~build: Returned: code: 1  signal: null
12 info lifecycle [email protected]~build: Failed to exec build script
13 verbose stack Error: [email protected] build: `webpack`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:314:20)
13 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:314:20)
13 verbose stack     at maybeClose (internal/child_process.js:1047:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:287:5)
14 verbose pkgid [email protected]
15 verbose cwd C:\Users\Public\Documents\elara
16 verbose Windows_NT 10.0.18363
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
18 verbose node v14.12.0
19 verbose npm  v6.14.8
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] build: `webpack`
22 error Exit status 1
23 error Failed at the [email protected] build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

Any ideas to help me out?

Thanks!

hlhielkema / elara Goto Github PK

elara's Introduction

🌈 Live demo

✨ Features

🖥 Environment Support

📦 Build

✔️ Linting

❓ Community Support

🤝 Contributing

💻 Screenshots

⚙️ Run local demo server

Node.js demo server

ASP.NET Core demo server

Go demo server

🔗 Third-party resources

Feather

Browsers support badges

elara's People

Contributors

Stargazers

Watchers

Forkers

elara's Issues

Recommend Projects

Recommend Topics

Recommend Org