deusx + html5   62

Web Audio Modem
Lately, I've been working with a client where my development computer is not connected to the Internet. This is a huge inconvenience, as the unavailability of Google and Stack Overflow vastly impact my productivity. Only recently have I begun to grasp how much of my time is actually spent copy/pasting between Visual Studio and the browser.

My office also features an Internet connected laptop and my development computer expose 3,5 mm jack sockets for audio devices. And thus my problems can be solved! Here's how I made a modem for closing the gap with Web Audio.
audio  fun  retro  web  html5 
october 2017 by deusx
HTML5 Drag and Drop Avatar Changer with Resizing and Cropping | CSS-Tricks
Let's create a page where a user can update their avatar with as little friction as possible: they just drop an image anywhere on the page and it's done.
html  webdev  html5  social  avatar 
november 2014 by deusx
QuakeJS is a port of ioquake3 to JavaScript with the help of Emscripten.
quake3  to:fb  gaming  html5  web 
february 2014 by deusx
Imperfect Circles – Aesthetic imperfection with fractal subdivision | Rectangle World – HTML5 Canvas and JavaScript: Tutorials and Experiments
Getting a computer to draw a shape in the way that a human would requires programming in some imperfection. The simple idea is to add in some randomization of drawing coordinates, which could be done in various ways. Below are two examples of imperfect circles drawn in an HTML5 canvas with JavaScript, where the imperfection has been added through the use of a fractal-like subdivision algorithm. The imperfection can be subtle, but it is enough to make the image appear to be human-drawn. Although the images are quite simple I find them quite nice to look at.
html5  webdev  graphics  canvas  fractals  math 
september 2013 by deusx
canvg - Javascript SVG parser and renderer on Canvas - Google Project Hosting
canvg is a SVG parser and renderer. It takes a URL to a SVG file or the text of an SVG file, parses it in JavaScript, and renders the result on a Canvas element. The rendering speed of the examples is about as fast as native SVG.
webdev  svg  graphics  canvas  html5 
september 2013 by deusx
dat-gui - A lightweight controller library for JavaScript. - Google Project Hosting
A lightweight graphical user interface for changing variables in JavaScript.
html5  webdev  gaming  gui  nifty  javascript 
september 2013 by deusx
Real-time synchronous multiplayer 3D gaming with HTML5 - The Artillery Blog
Six weeks ago we set out to see if we could build a real-time, “twitch” 3D game in the browser using HTML5. We built a few games and were pleasantly surprised with what we achieved.
gaming  html5  artillery  webdev 
september 2013 by deusx
Announcing Artillery's Project Atlas, a Hardcore RTS for the Browser - The Artillery Blog
The Artillery Platform, which Atlas is built upon, uses JavaScript and WebGL to deliver a high-quality, low-latency multiplayer gaming experience to anyone with a modern web browser. The platform is centered around 3D experiences with real-time multiplayer capability and strong community support. The JavaScript-based game engine features a component-entity design, a modern deferred rendering pipeline, and development tools designed to allow creative expression and super-fast iteration.
to:twitter  webdev  gaming  nifty  html5  webgl 
september 2013 by deusx
Interesting textures with layered fractal gradients | Rectangle World – HTML5 Canvas and JavaScript: Tutorials and Experiments
Here’s another experiment which makes use of a noisy data set defined by fractal subdivision, this time applied to create some interestingly textured gradients
webdev  html5  canvas  graphics  fractals 
september 2013 by deusx
KineticJS HTML5 Canvas Framework
KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. Try it out!
webdev  canvas  animation  html5  javascript 
august 2013 by deusx
An introduction to the Crafty game engine - Build New Games
In this tutorial, I’ll show you how Crafty makes it easy to make simple, 2D games and I’ll walk you through the process of making a very simple game from start to finish. By the end of the tutorial, you’ll know how to start making your own games from scratch using Crafty and you’ll have our example game built and running in your own development environment which will give you a great jumping-off point for future projects.
games  html5  webdev  development 
august 2013 by deusx
Case Study: Auto-Resizing HTML5 Games - HTML5 Rocks
In the summer of 2010, we created Sand Trap, a game that we entered in a competition on HTML5 games for mobile phones. But most mobile phones either displayed only part of the game or made the game too small—making it completely unplayable. So we took it upon ourselves to make the game fluidly adjust to match any resolution. After a bit of re-programming and using ideas outlined in this article, we had a game that scaled across any modern browser, whether it ran in a desktop or a mobile device.
webdev  html5  js  css  html  gaming 
august 2013 by deusx
You Don't Know Beans About CoffeeScript – Talks – Aseem Kishore
You've heard of CoffeeScript, and you've probably seen some code in it. But do you really know it? Unless you've written something substantial in it, I contend that you don't.
slides  talks  webdev  coffeescript  html5  presentations 
august 2013 by deusx
Bombermine — Massively Bomberman Online with up to 1000 players on the single map
Holy cow. MMO BOMBERMAN. The promise of HTML5 multiplayer gaming has been fulfilled. We can all go home, now.
html5  webdev  gaming  bomberman 
february 2013 by deusx
Build a Street Fighter Demo with CSS Animations and JavaScript
I recently learned a cool technique from Simurai about how to animate PNG sprites with the CSS3 animations' steps() property. The main idea in this technique is to "recreate" some kind of animated GIF but with the tiles of a PNG sprite.
streetfighter  gaming  css  webdev  html5 
february 2013 by deusx
Using WebAPIs to make the web layer more capable ✩ Mozilla Hacks – the Web developer blog
Part of making both Firefox OS and the web as a platform a stronger layer and alternative for developers, we are working on a number of WebAPIs. I’d like to introduce you them here!
webdev  mobile  firefoxos  webapis  html5  javascript 
february 2013 by deusx
HTML5 History / pushState URLs, .htaccess and You - Joss Crowcroft
So, this is basically doing for single-page apps' index.html what we have typically done for PHP apps using index.php as a single entry point for all URL paths. But, I think it's a horrible idea.
webdev  pushstate  html5  apache  javascript 
december 2012 by deusx
Building a live green screen with getUserMedia() and MediaStreams - Tim Taubert
This is an admittedly very simple example of a green screen but you can use this little template to manipulate your webcam’s live video stream and build all kinds of fancy demos with it.
html5  firefox  media  greenscreen  javascript 
october 2012 by deusx
A simple Google Authenticator app written in HTML
webdev  google  security  auth  html5  authentication 
october 2012 by deusx
How to Create a CSS3 Ajax Loading Icon Without Images - SitePoint
Fortunately, CSS3 allows us to create loading icons without images. They’re easy to create, scale, re-color, use on any background and don’t incur image downloads
webdev  css  ajax  css3  html5  loading 
september 2012 by deusx
Old school demos re-built in HTML5
demos  webdev  html5  retro  canvas  codef  to:fb 
september 2012 by deusx
javascript - Convert Data URI to File then append to FormData - Stack Overflow
I've been trying to re-implement an HTML5 image uploader like the one on the Mozilla Hacks site, but that works with WebKit browsers. Part of the task is to extract an image file from the canvas object and append it to a FormData object for upload.
webdev  canvas  formdata  html5 
may 2012 by deusx
Uploading directly from HTML5 canvas to imgur — Jonas Wagner's Blog
For an upcoming canvas project I want to give the users the ability to upload the content of the canvas to an image sharing service. When looking for a suitable API I came across the registration was trivial, and they support CORS and base64/dataurl uploads, perfect!
canvas  html5  imgur  webdev  javascript 
may 2012 by deusx
radikalFX » Blog Archive » Dynamic image collage with HTML5 and Canvas
My first demo is a simple Canvas element which can be used to make a collage of images.
canvas  html5  collage 
may 2012 by deusx
Lake.js takes an img element and inserts a canvas element displaying the image and its flipped reflection directly after the img element.
awesome  nifty  web  html5  canvas  webdev  javascript  css 
may 2012 by deusx
Why Publishers Don't Like Apps - Technology Review
Last fall, we moved all the editorial in our apps, including the magazine, into a simple RSS feed in a river of news. We dumped the digital replica. Now we're redesigning, which we made entirely free for use, and we'll follow the Financial Times in using HTML5, so that a reader will see Web pages optimized for any device, whether a desktop or laptop computer, a tablet, or a smart phone. Then we'll kill our apps, too.
publishing  apps  web  html5  business 
may 2012 by deusx
BrowserQuest – a massively multiplayer HTML5 (WebSocket + Canvas) game experiment ✩ Mozilla Hacks – the Web developer blog
BrowserQuest is a tribute to classic video-games with a multiplayer twist. You play as a young warrior driven by the thrill of adventure. No princess to save here, just a dangerous world filled with treasures to discover. And it’s all done in glorious HTML5 and JavaScript.
webdev  html5  browserquest  gaming 
march 2012 by deusx
OFF MY LAWN! – Jeffrey Zeldman Presents The Daily Report
It is publishing. It is humanity. It is the vanguard of ideas clashing against the rearguard of commerce. This is not new. This is all to be expected. We must stop raising our eyebrows and chuckling at it. We must decide to accept the world as it is, or to roll up our sleeves and help.
webdev  tech  html5  webdesign 
november 2011 by deusx
Poll: What Is Your Reaction to the Death of Mobile Flash?
The Web is singing this morning. The coming death of Flash on mobile devices has made a lot of tech pundits and developers very happy. There is a big fat "I told you so" coming from all corners the of Internet while all Adobe can do is quietly sit back and rue the day the original iPhone was announced.
adobe  flash  webdev  html5  iphone  mobile 
november 2011 by deusx
Ex-Flash Manager: Adobe Ignored Smartphones Until It Was Too Late
A former manager and engineer of Flash at Adobe said today that when the true smartphone revolution came in 2007 with the announcement of the iPhone is 2007, Adobe ignored it. Carlos Icaza co-founded Ansca Mobile, the creators of the Corona SDK, left Adobe in 2007 when his call for embracing the touchscreen smartphone evolution was ignored by Adobe executives.
adobe  mobile  html5  smartphones 
november 2011 by deusx
The mobile app is going the way of the CD-ROM: To the dustbin of history | VentureBeat
For developers, it’s technologically more manageable to build one mobile web app than a half-dozen or even just two native apps. And given the state of mobile web standards, we’re quickly approaching a point where end users can’t tell the difference between the two. All that’s really left is a business model for mobile web apps, Sullivan contends.
mobile  apps  html5  webdev 
november 2011 by deusx
TideArt - Web designers: Time to ditch Flash, Silverlight, and embrace HTML5
Yesterday, Adobe announced major job cuts and a company restructuring, and indicated that their focus on Flash may not be what it used to be, by cutting off Flash development on Android and the Playbook. Meanwhile last week, Microsoft was reluctantly admitting that Silverlight isn't a big part of their future either. The message is clear, and even if it means some relearning for long time web designers, it's time to switch to HTML5 if you haven't already.
flash  webdev  adobe  silverlight  html5 
november 2011 by deusx
LukeW | The Web OS is Already Here…
Let me restate that simply. The Web (browser) is inside of every application instead of every application being inside the Web (browser).
webdev  html5  mobile  future  webos 
november 2011 by deusx
Twitter / Ben Ward: Oh for fucks sake. We may ...
@BenWard: Oh for fucks sake. We may as well just "consider replacing all HTML tags with
ifttt  twitter  favorites  occupyhtml5  facepalm  derp  html5 
november 2011 by deusx
DZSlides is a one-page-template to build your presentation in HTML5 and CSS3.
css3  html5  slides 
may 2011 by deusx
Pixel Editor, free online pixel editor - Pixie
"On Pixie you can create amazing pixel art for free, from anywhere, and share it with the world."
pixie  html5  pixel  art  from delicious
august 2010 by deusx
Jon Combe | Experiments | Thrust: A classic computer game remake using <canvas>
"Thrust was just awesome and it is that game which I have attempted to recreate here using just JavaScript and the HTML <canvas> tag. I have 'cheated' a little in that I use Scott Schiller's excellent SoundManager 2 Javascript audio manager (which in turn uses Flash) to play the sounds, but I think that is fair game in the spirit of what I am trying to do."
gaming  html5  canvas  thrust  oldschool  classic  from delicious
july 2010 by deusx
W3C FileAPI in Firefox 3.6 at
"Often, web applications will prompt the user to select a file, typically to upload to a server. Unless the web application makes use of a plugin, file selection occurs through an HTML input element, of the sort <input type="file"/>. Firefox 3.6 now supports much of the W3C File API, which specifies the ability to asynchronously read the selected file into memory, and perform operations on the file data within the web application (for example, to display a thumbnail preview of an image, before it is uploaded, or to look for ID3 tags within an MP3 file, or to look for EXIF data in JPEG files, all on the client side). This is a new API, and replaces the file API that was introduced in Firefox 3."
w3c  webdev  firefox  mozilla  file  api  javascript  html5  from delicious
december 2009 by deusx
Aral Balkan · Maximizing your DROIT, or: why you should learn HTML5, CSS3, and JavaScript for mobile development.
"While Microsoft drifts aimlessly with Windows Mobile trying to play a fruitless game of cat and mouse with Apple, and while Google – the defender of all things open and web – invests in Java with Android, one company has come out of left field with a solid vision to embrace open web technologies for its mobile platform. That company is Palm and its platform is called WebOS. And you should stand up and take notice because it is one of the most important developments in the mobile world today."
palm  webdev  open  webos  html5  from delicious
november 2009 by deusx
HTML5 のセクションアウトラインを生成してみよう! - IT戦記
It's the HTML 5 outline algorithm in JavaScript. "javascript:(function(s){ s.src = ''; document.body.appendChild(s) })(document.createElement('script')) "
html5  webdev  outliners  bookmarklet  coding  markup  js  tools  from delicious
september 2009 by deusx
HTML 5 Outliner
Need to remember that this algorithm exists, for when I start working on an outliner again.
html5  outliner  outlines  webdev  markup 
august 2009 by deusx
Web Database - W3C HTML5
"This specification defines an API for storing data in databases that can be queried using a variant of SQL."
html5  sql  databases  webdev  w3c  standards 
july 2009 by deusx
camen design · Video for Everybody!
"Video For Everybody is very simply a chunk of HTML code that embeds a video into a website using the HTML5 <video> element which offers native playback in Firefox 3.5 and Safari 3 & 4 ... In other browsers that do not support <video>, it falls back to Adobe Flash ... If Flash is not installed, QuickTime is used (which allows playback on the iPhone) ... If QuickTime is not installed then Windows Media Player is used in Internet Explorer for Windows Vista and above. ... Finally, if all else fails, a warning is issued that provides links to download the video, and links to software relevant to getting the video to play within the browser itself. ... This is all done without JavaScript and requires only two video encodes, one OGG file for Firefox 3.5, and one MP4 file for everything else (Flash / Safari / iPhone)."
video  html  webdev  html5  flash 
june 2009 by deusx
Chromium Blog: Extensions at Google I/O
"Today I gave a presentation at Google I/O explaining some of the cool ideas that lie at the heart of our upcoming extension system. For those who didn't get a chance to attend the conference, you can check out the slides"
chromium  google  chrome  addons  extensions  html5  webdev 
may 2009 by deusx
Digital Web Magazine - HTML5, XHTML2, and the Future of the Web
"HTML5 will be the future of the web, so my advice would be to pay close attention to it."
webdev  html5  whatwg  xhtml  html 
april 2007 by deusx

related tags

addons  adobe  ajax  alpha  animation  apache  api  appcache  apps  art  artillery  atari  audio  auth  authentication  avatar  awesome  bomberman  bookmarklet  browserquest  business  canvas  chip  chrome  chromium  classic  cloud  codef  coding  coffeescript  collage  cors  createjs  css  css3  database  databases  demos  derp  development  diy  editors  extensions  facepalm  favorites  file  firefox  firefoxos  flash  formdata  fractals  fun  future  games  gaming  google  graphics  greenscreen  gui  html  html4  html5  ifttt  images  imgur  iphone  javascript  jpeg  js  json  loading  markdown  markup  math  media  mobile  mozilla  network  nifty  occupyhtml5  oldschool  on2  open  opensource  outliner  outliners  outlines  palm  pixel  pixie  png  presentations  programming  publishing  pushstate  quake3  retro  security  silverlight  sketchpad  slides  smartphones  social  sql  standards  streetfighter  svg  talks  tech  thrust  to:fb  to:twitter  tools  tracker  twitter  vendors  video  vnc  vp8  w3c  web  webapis  webdesign  webdev  webgl  webos  websockets  whatwg  wiki  xhtml 

Copy this bookmark: