Formating date

Details
Written by: Stanko Milosev
Category: Moment
Hits: 4458

I was playing little with jQuery UI datePicker, and Moment.js library, and here you can see result of it. Also, that source can be used for jQuery UI development, since I extracted only necessary files.

In my example most important are these two lines of code: 

var $myDate = $( "#datepicker" ).datepicker( "getDate" );
var $formatedMyDate = moment($myDate).format('YYYY-MM-DD hh:mm');

As you can see with line:

moment($myDate).format('YYYY-MM-DD hh:mm');

Date $myDate, I am formating to format YYYY-MM-DD hh:mm

Stylelint

Details
Written by: Stanko Milosev
Category: node.js
Hits: 4593

Today I discovered stylelint, and here is my example how to use it on windows, since I was struggling with CLI in windows.

First to install stylelint I was using this command:

npm install stylelint

After that I installed standard configuration:

npm install stylelint-config-standard

After that step in folder ..\node_modules\stylelint-config-standard you can find file index.js, which I copy / pasted to folder ..\node_modules\.bin and renamed to stylelint.config.js

Then I went to folder ..\node_modules\.bin in command prompt, and wrote on CSS with empty rule, something like:

a {}

In command prompt executed:

stylelint *.css

And voilà:

There is also possibility to use stylelint against less files, as explained here, but I didn't test it.

Video streaming

Details
Written by: Stanko Milosev
Category: node.js
Hits: 4439

One example of streaming videos using VidStreamer.js.

Server:

/*global require*/

var http = require("http");
var vidStreamer = require("vid-streamer");

var newSettings = {
    rootFolder: "C:/videoStreaming/videos/",
    rootPath: "videos/",
    forceDownload: false
};

var app = http.createServer(vidStreamer.settings(newSettings));
app.listen(3000);

Client:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <video autoplay>
        <source src="http://localhost:3000/videos/a.mp4" type="video/mp4">
    </video>
</body>
</html>

Installing Karma runner

Details
Written by: Stanko Milosev
Category: node.js
Hits: 6289

Karma is test runner, that means that it can execute our tests which we wrote in Jasmine, for example.

First to install it, we need to install node.js. Installing is trivial, so I will not explain it, except that I needed to restart my computer, otherwise npm is not recognized...

Open command prompt and go to folder where your source is located, in my case that is C:\myProjects\js\myPhotoAlbum, you can see the project on my GitHub. Then Install karma:

npm install -g karma --save-dev

In my case I also installed karma command line interface:

 npm install -g karma-cli --save-dev

Then, in root folder of my project I added karma config file (karma.config.js):

/*global module*/
module.exports = function(config) {
    "use strict";
    config.set({
        plugins: ['karma-chrome-launcher', 'karma-coverage', 'karma-jasmine'],
        frameworks: ['jasmine'],
        files: [
            'js/sm.namespaces.js',
            'js/sm.googleMaps.js',
            'js/sm.readEXIFdata.js',
            'js/sm.visualize.js',
            'js/start.js'
        ],

        // coverage reporter generates the coverage
        reporters: ['progress', 'coverage'],
        browsers: ['Chrome'],
        singleRun: true,

        preprocessors: {
            // source files, that you wanna generate coverage for
            // do not include tests or libraries
            // (these files will be instrumented by Istanbul)
            'js/**/*.js': ['coverage']
        },

        // optionally, configure the reporter
        coverageReporter: {
            type : 'html',
            dir : 'coverage/'
        }
    });
};

Here notice line:

plugins: ['karma-chrome-launcher', 'karma-coverage', 'karma-jasmine']

this means that we have to install:

karma-chrome-launcher

npm install karma-chrome-launcher --save-dev

karma-coverage:

npm install karma-coverage --save-dev

and karma-jasmine:

npm install karma-jasmine --save-dev

Also, if we add package file (package.json):

{
  "name": "myPhotoAlbum-Karma",
  "version": "0.0.1",
  "devDependencies": {
    "karma": "^0.12.31",
    "karma-chrome-launcher": "^0.1.7",
    "karma-coverage": "^0.2.7",
    "karma-jasmine": "^0.3.5",
    "karma-cli": "^0.0.4"
  }
}

Then all we have to do is:

npm install

and all our packages which we defined in our package.json will be added. More about package.json you can read here.

Then notice line:

singleRun: true

with that line we said that we want our test to be executed only once. Now we can execute Karma:

karma start karma.conf.js

After executing Karma you can see folder:

C:\myProjects\js\myPhotoAlbum\coverage\Chrome 40.0.2214 (Windows 8.1)

and if you open index.html you should see something like:

  1. Function like message handler
  2. node.js "Hello World" example
  3. WSS
  4. Program refinement

Subcategories

C#

Azure

ASP.NET

JavaScript

Software Development Philosophy

MS SQL

IBM WebSphere MQ

MySQL

Joomla

Delphi

PHP

Windows

Life

Lazarus

Downloads

Android

CSS

Chrome

HTML

Linux

Eclipse

Page 75 of 164