Geekly Articles each Day
📜 ⬆️ ⬇️

Some interesting and useful things for web developer # 28

Good day, dear habravchane. Recently, I saw some interesting and useful tools / libraries / events that I want to share with Habr.

roBrowser



roBrowser is an open source client clone of the fairly popular MMORPG game Ragnarok Online in the browser. The project is being developed according to the latest W3C standards - WebGL, HTML5, File API, Javascript, Threads ... A small video with the game demonstration:



Perfect slider



The easiest to use slider, but with the correct HTML5 semantics (there is even support for W3C ARIA), SEO friendliness, CSS3 animations, adaptive layout and reaction to touching events. And there is an API with events, methods and options.
<html> <head> <link rel="stylesheet" href="ideal-image-slider.css"> <link rel="stylesheet" href="themes/default/default.css"> </head> <body> <div id="slider"> <img src="" alt=""> <img data-src="img/2.jpg" src="" alt=""> <img data-src="img/3.jpg" src="" alt=""> </div> <script src="ideal-image-slider.js"></script> <script> new IdealImageSlider.Slider('#slider'); </script> </body> </html>

')

Hello.js


Javascript RESTFUL API for authentication with OAuth2 / OAuth1 services, such as Google+ API, Facebook Graph, Windows Live Connect. On the project page there are many demos that allow you to save time on getting to know the library. And the repository collected more than 2000 stars on GitHub.
 hello.on('auth.login', function(r){ // Get Profile hello( r.network ).api( '/me' ).then( function(p){ var label = document.getElementById(r.network) label.innerHTML = "<img src='' width=24/>Connected to "+ r.network+" as " + p.name; }); }); hello.init({ google : CLIENT_IDS.google, windows : CLIENT_IDS.windows, facebook : CLIENT_IDS.facebook },{ redirect_uri:'../redirect.html' });


KaTeX



JavaScript library for drawing math formulas on the web from the Khan Academy online education platform development team. KaTeX is currently inferior in functionality to its well-known analog MathJax, but is ten times ahead of its performance. Works in all the latest browsers Chrome, Safari, Firefox, Opera, and IE 8 - IE 11.

Accessible HTML5 Video Player



PayPal experts, who have already noted a product like the Bootstrap Accessibility Plugin, decided this time to tackle the problem of video content availability and solve it exclusively within HTML5 without any additional dependencies or third-party plug-ins. The following objectives were set for the project:
  • Use the latest HTML5 technology in embedding videos, controls and subtitles;
  • Minimize the weight of the code (5 kB CSS and 18 kB JS);
  • Provide full keyboard control and accessibility for non-visual screen access programs;
  • Provide subtitle support (used by WebVTT).


"Ready-made solution for an accessible video player on HTML5" Tseikovets

iOS 8 Illustrator Vector UI Kit Update



Direct link to the archive.


SVG Circus - a tool for creating SVG animations




Western thoughts or what would translate to Habré:




Says and shows Habr:




Finally:




Previous selection (Release 27)

I apologize for any typos. If you notice a problem - please write in a personal.

Thank you all for your attention.

Source: https://habr.com/ru/post/236683/

More articles:


All Articles