Tag Archives: javascript

Create a starfield with Three.js .

You need to create two files into your folder and use this filenames : index.html and starfield.js .
First file index.html come this source code:

The next file is a java script and come with this source code:

Posted in All, HTML 5, javascript, Programming. Tagged with , , , , , .

JavaScript – Processing.js 2D library – part 003.

In this tutorial I will show you how to use images with processing.js.
You can use image from your computer or from url.
Let’s see one simple code example:

You can see same example on openprocessing web tool.
The openprocessing web tool allow you to use Processing.js and P5.js .

Posted in All, HTML 5, javascript, Programming. Tagged with , , , , , , .

JavaScript – FlipClock .

Another tutorial about javascript and HTML5 .
The FlipClock is a javascript source code and tool to let you to make a flip clock .
As you know :
A flip clock is an electromechanical, digital time keeping device with the time indicated by numbers that are sequentially revealed by a split-flap display.
This javascript come with many options and feature to set your flip clock:

  • Hourly Counter
  • Minute Counter
  • Daily Counter
  • 12hr Clock
  • 24hr Clock
  • General Counter

You need to download it and then you can try the examples from examples folder.
The next example come with the base of the css file and the flipclock.js .
I just set the clockFace setting to TwentyFourHourClock.
You can used this javascript to show: counter, countdown or interval.

Posted in All, HTML 5, javascript, Programming. Tagged with , , , , , , .

JavaScript – Thunderforest Maps API .

The Thunderforest Maps let you to use map styles in your apps and on your websites.
You can have a free account see: Hobby Project
You can also buy it:

  • Solo Developer
  • Small Business
  • Large Business

The maps come with this map layers:

  • OpenCycleMap
  • Transport
  • Landscape
  • Outdoors
  • Transport Dark
  • Spinal Map
  • Pioneer
  • Mobile Atlas
  • Neighbourhood

This is one example using the Pioneer layer map into old style , see the next image:

This is the source code to test it with your API key:

Posted in All, HTML 5, javascript, Programming. Tagged with , , , , , , .

JavaScript – start with TypeScript .

About TypeScript is an open-source language and compiler that runs both in the browser  -through SystemJS  and on NodeJS.
Is developed by Microsoft, like an open-source language and compiler that runs both in the browser through SystemJS and on NodeJS.
Now TypeScript compiles to clean, simple JavaScript code.
You can runs on any browser, in Node.js, or in any JavaScript engine that supports ECMAScript 3 (or newer).
There are two main ways to get the TypeScript tools:

  • using npm (the Node.js package manager)
  • or installing TypeScript’s Visual Studio plugins

The easiest way to get started with TypeScript is through the TypeScript playground found on the TypeScript website play.
The TypeScript version 2.4 has already introduced dynamic import expressions, safer callback parameter checking, weak types, and string enums.
About dynamic import expressions then allows users to asynchronously request a module at any arbitrary point in your program.
The string enums allows enum members to contain string initializers.
Allow to return types as inference targets can now make inferences for the return type of a call.
To get started with the latest stable version of TypeScript, you can grab it through NuGet with:

You can use the following command with npm:

Also you can download it from official website.
To compile it use this:

Now, let’s install it and try it.
First use git command to put into your computer:

Make a file named ts_es001.ts and use this command:

The result will be : ts_es001.js file.
Create your ts_es001.html file with this content:

This is most simple example of using typescript tool with node.js .

Posted in All, javascript, node.js, Programming. Tagged with , , , , , .