background preloader

Getting Started with WebRTC

Getting Started with WebRTC
WebRTC is a new front in the long war for an open and unencumbered web. Brendan Eich, inventor of JavaScript Real-time communication without plugins Imagine a world where your phone, TV and computer could all communicate on a common platform. Want to try it out? Open in Chrome, Opera or Firefox. There is a walkthrough of this application later in this article. Quick start Haven't got time to read this article, or just want code? Get an overview of WebRTC from the Google I/O presentation (the slides are here): If you haven't used getUserMedia, take a look at the HTML5 Rocks article on the subject, and view the source for the simple example at Alternatively, jump straight into our WebRTC codelab: a step-by-step guide that explains how to build a complete video chat app, including a simple signaling server. A very short history of WebRTC WebRTC has now implemented open standards for real-time, plugin-free video, audio and data communication. Where are we now? Related:  javascript

Infographic: The Entire JavaScript Language in One Single Image Chinese-based developer Yusheng, has created a nice graphic that assembles the entire JavaScript programming syntax into one single all-encompassing image. Regardless of what the TIOBE Index says, JavaScript, and not Java, is the hottest programming language right now. This popularity was won very hard, having to fight through a period where the language seemed to have stood still with no new features being released for a period of four years. Despite this, developers rushed to the language, mainly due to the technologies being developed on top of it, and more specifically Node.js. If today some of you want to delve into JavaScript in the upcoming future, there are many tutorials you can find online, all great resources for learning the language's fundamentals from the ground up in a matter of days. But if things are constantly escaping your memory, Chinese-based developer Yusheng has assembled a nice mind map of the entire JavaScript language syntax, complete with code examples.

List of TCP and UDP port numbers /etc/services, a service name database file on Unix-like operating systems.[1][2][3][4] This is a list of notable port numbers used by protocols of the transport layer of the Internet protocol suite for the establishment of host-to-host connectivity. Originally, port numbers were used by the Network Control Program (NCP) in the ARPANET for which two ports were required for half-duplex transmission. Later, the Transmission Control Protocol (TCP) and the User Datagram Protocol (UDP) needed only one port for full-duplex, bidirectional traffic. The even-numbered ports were not used, and this resulted in some even numbers in the well-known port number range being unassigned. The Internet Assigned Numbers Authority (IANA) is responsible for maintaining the official assignments of port numbers for specific uses.[5] However, many unofficial uses of both well-known and registered port numbers occur in practice. Table legend[edit] Official: Port is registered with IANA for the application.[5]

javascript-society/javascript-path Wireshark · Go Deep. 11 Free jQuery CSS3 Navigation Menu Plugins These days, jQuery Navigation menus are more than plain texts with links on it. With the command of jQuery, it can transform the menu of a web site into a dynamic menu. Despite the fact that CSS3 can now be utilized to make dynamic menu, still, the query includes more functionality to the menus. Aside from the element functionalities, the design should likewise be considered. Because of audience your site would perhaps see it for the first time they visit your website. If it is not well designed any having worst UI experience so it will not give you value add to your site. You Might be interested on : Free jQuery Sliders and jQuery autocomplete Tutorials. Mmenu Demo || Download The best jQuery plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp. Sidr Demo || Download The best jQuery plugin for creating side menus and the easiest way for doing your menu responsive. slimMenu Demo || Download HorizontalNav Demo || Download Pushy Demo || Download Slinky.js

Voxel Builder Getting Started Guide NativeScript Getting Started Guide Welcome to the NativeScript Getting Started Guide. In this tutorial you'll use NativeScript, a cross-platform JavaScript framework for building native mobile apps, to build an iOS and Android app from scratch. What is NativeScript? NativeScript is a free and open source framework for building native iOS and Android apps using JavaScript and CSS. NativeScript provides a best-of-both-worlds development experience. What you're building This guide will walk you through building Groceries, a groceries management app that does the following things: Connects to an existing RESTful service.Provides user registration and login.Lets authenticated users add and delete groceries from a list.Runs cross-platform (iOS and Android). If you follow along to the end, here's what the finished app will look like on iOS: And here's what the app will look like on Android: Prerequisites With that out of the way, let’s get started! Getting up and running Start your app Running your app

Recline.js - Recline Data Explorer and Library | Open Web Stuff A simple but powerful library for building data applications in pure Javascript and HTML. Features: Open-source (and heavy reuser of existing open-source libraries)Pure javascript (no Flash) and designed for integration — so it is easy to embed in other sites and applicationsView and edit your data in clean grid interfaceBulk update/clean your data using an easy scripting UIVisualize your dataAnd more …

Coder's Block Blog / Motion Detection with JavaScript I recently gave a talk at RevolutionConf about writing a motion detecting web app with JavaScript. This is basically that talk, but in blog form. Live demos and all the source code are available at the end of this article. The Premise I wanted to see what my pets do when I’m away. Just for kicks, I decided to do this as a web app, all in JavaScript. Accessing the Webcam The first step is to access the webcam. Anyway, to grab a stream from a webcam, start with a <video> element in your HTML. Then add a bit of JavaScript. This will attempt to grab a 640px by 480px stream from an attached webcam. Grabbing Still Frames We need to capture still frames from the streaming video so that we can do motion detection (more on this later) and potentially upload them as images to Twitter. We start by grabbing the <video> element with the stream on it from the page. A simple setInterval() allows us to capture a new still frame every 100ms. Diffing So, what exactly is “motion”? Scoring Post-Processing the Diff

Bubble Sort Algorithm in JavaScript This is a follow up to Big O Search Algorithm Examples in JavaScript. The JavaScript examples in the post all made the same assumption, that the list was already sorted. So, how do we sort? The Theory Before we dive into code examples lets first look at a simple example using the below blocks. We want to sort these blocks numerically. Once sorted, the blocks would be in the following order: Take a few moments to look at the blocks in the first illustration and visualise how we could sort these? We would compare the Yellow block, with the White and ask if: It is! We continue this process until we reach the Black block on the far right. 8 > 6: Yes, swap 8 > 5: Yes, swap 8 > 4: Yes, swap 8 > 3: Yes, swap 8 > 2: Yes, swap 8 > 1: Yes, swap Now we've reached the end of the list. We now have a list that looks as: This is still not yet a sorted list, but we are getting there. We iterated over the entire list of items once and along the way compared each block with the block to its right. O(n -1) O(n) O(n2)

Beginner's Guide to HTML5 & CSS3 - Coding Canvas Download - 5.5 KB Introduction Traditional HTML was created with text in mind. While the insertion of images can be done through the <img> tag, the inclusion of animation will require third-party plug-ins. In this respect, traditional HTML is vastly lacking in its capability to meet the multimedia needs of modern web pages. Fret not! The <canvas> acts as a bitmap-based drawing board Canvas on a web page. If you are interested in finding out how the "Bouncing on Canvas" and "Merry-Go-Round on Canvas" were created, you have certainly come to the right place. Preparing the Canvas Every artist needs a canvas to draw upon. Nothing except the heading as shown on the lower part of Figure 1. You can have multiple <canvas> elements on the same page. Let's add some inline CSS style to it so that you can verify its existence. Now you should be able to see a rectangular area displayed on the browser as shown on the lower part of Figure 2. That's it? Getting Your Feet Wet Drawing It Out

CRUD operation using Backbone.js Download - 5.2 MB Introduction Learning backbone.js for basic create, read, update and delete operations. What is Backbone.js When ever we are working with javascript application we tend to put huge effort structuring the code and putting the right peice at right place. It's all too easy to create JavaScript applications that end up as tangled piles of jQuery selectors and callbacks, all trying frantically to keep data in sync between the HTML UI, your JavaScript logic, and the database on your server. Now there comes Backbone.js. Example The very first example which strikes me of is Gmail. Note I will be ignoring the backed code as of now. In this tutorial, I have used ASP.NET MVC API for the CRUD operations and toastr for notification's. What we will do We will try to create an application that will allow Creation of user, Displaying list of users, Editing specific user and Deleting specific user. Setting up the environment Lets start: Create a new ASP.NET MVC project.

OOP In JavaScript: What You NEED to Know (Object Oriented JavaScript: Only Two Techniques Matter) Prerequisite:JavaScript Objects in DetailJavaScript Prototype Object Oriented Programming (OOP) refers to using self-contained pieces of code to develop applications. We call these self-contained pieces of code objects, better known as Classes in most OOP programming languages and Functions in JavaScript. We use objects as building blocks for our applications. Building applications with objects allows us to adopt some valuable techniques, namely, Inheritance (objects can inherit features from other objects), Polymorphism (objects can share the same interface—how they are accessed and used—while their underlying implementation of the interface may differ), and Encapsulation (each object is responsible for specific tasks). Our Career Paths and Courses Website Is Now Live New UPDATE: June 8, 2015 Enrollment for our Career Paths is well underway. The second cohort for Career Path 5: Modern Fullstack Developer is also full. Lets Code.