MahdiBagheri71 / jalali-moment

Display, parse, manipulate, validate and convert jalali (Persian, Khorshidi, Shamsi) or Gregorian (Miladi) dates and times.

Jalali Moment

Display, parse, manipulate and validate jalali (Persian, Khorshidi, Shamsi) or Gregorian (Miladi) dates and times and also convert Jalali (Persian, Khorshidi, Shamsi) date to Gregorian (Miladi) or vice versa in javascript or typescript. DEMO

Read this in other languages: فارسی

How to

• Install

• Use jalali moment in

  • Node.js
  • Typescript
  • Angular
  • Aurelia
  • Vue
  • Es5
  • Plunker

• Use API

  This plugin provides using jalali and gregorian calendar system together on momentjs api.

  .locale('fa'); it will use jalali calendar system

  .locale('any other locale'); it will use gregorian calendar system

Usage

• Parse

  moment.locale('fa'); // set fa locale for all new moment instances
  var m1 = moment("1367/11/04");

• Display

   m1.format("YYYY/MM/DD"); // 1367/11/04

• Manipulate

  m1.add(1, "day").format("YYYY/MM/DD"); // 1367/11/05

• Validate

  m1.isSame(m1.clone()); // true

• Convert

  moment.locale('fa');
  moment('1367/11/04').locale('en').format('YYYY/MM/DD'); // 1989/01/24
  moment.locale('en');
  moment('1989/01/24').locale('fa').format('YYYY/MM/DD'); // 1367/11/04
  //set en locale just for this instance

Introduction

jalali(Persian) calendar is a solar calendar system. It gains approximately 1 day on the Julian calendar every 128 years. Read more on Wikipedia.

Calendar conversion is based on the algorithm provided by Kazimierz M. Borkowski and has a very good performance.

This plugin adds Jalali (Persian, Khorshidi, Shamsi) calendar system to moment.js library.

Install

Install via npm

npm install jalali-moment -S

Install via yarn

yarn add jalali-moment

Install via bower

bower install jalali-moment --save

Using in Node.js

Install it via npm or yarn then use it as the following code

var moment = require('jalali-moment');
moment().locale('fa').format('YYYY/M/D');

Using in browser

ES5

<!--<script src="bower_components/jalali-moment/dist/jalali-moment.browser.js"></script>-->
<!--<script src="node_modules/jalali-moment/dist/jalali-moment.browser.js"></script>-->
<script src="thisRepositoryPath/dist/jalali-moment.browser.js"></script>
<script>
  moment().locale('fa').format('YYYY/M/D');
</script>

Typescript

import * as moment from 'jalali-moment';
let todayJalali = moment().locale('fa').format('YYYY/M/D');

Angular 2 or 4

import * as moment from 'jalali-moment';

Add a pipe

@Pipe({
  name: 'jalali'
})
export class JalaliPipe implements PipeTransform {
  transform(value: any, args?: any): any {
    let MomentDate = moment(value);
    return MomentDate.locale('fa').format("YYYY/M/D");
  }
}

and use it in component template

 <div>{{ loadedData.date | jalali }}</div>

Aurelia

You can create a value converters like following:

import { valueConverter } from 'aurelia-framework';
var moment = require('jalali-moment');


@valueConverter("date")
export class DateValueConverter {
  toView(value: string, format: string = "YYYY/MM/DD", locale: string = "en") {
    if (!value) return null;
    return moment(value).locale(locale).format(format);
  }
}

then use this value converter in your html files:

<require from="path_to_your_date_value_converter"></require>

<h1 style="direction:ltr">
    <span>
        ${myDate|date:myFormat:options.locale}
    </span>
</h1>

also, for aurelia developers, there is a plugin, aurelia-time, in which there are value converters for jalali-moment and other time and date libraries.

Vue

Use vue-jalali-moment library

<span>{{ someDate | moment("dddd, MMMM Do YYYY") }}</span>

API

This plugin tries to mimic moment.js api. Basically, when you want to format or parse a string, just add a j to the format token like 'jYYYY' or 'jM'. For example:

now = moment(); //get the current date and time,

Parse

Create a instance of moment from a Jalali (Persian) or Miladi date and time as string.more

m = moment('1367/11/4', 'jYYYY/jM/jD');// parse a jalali (persian) date
m = moment('1989/1/24', 'YYYY/M/D');// parse a gregorian (miladi) date

m = moment('1989/1/24');// parse a gregorian date
moment.locale('fa');
m = moment('1367/11/04');// parse a jalali (persian) date

Display jalali or miladi date

Display moment instance as a string.more

moment.locale('en'); // default locale is en
m = moment('1989/1/24');
m.locale('fa'); // change locale for this moment instance
m.format('YYYY/M/D');// 1367/11/4
m.format('MM'); // 11 display jalali month
m.format('MMMM'); // Bahman
m.format('DD'); // 04 display day by two digit
m.format('DDD'); // 310 display day of year
m.format('w'); // 45 display week of year
m.locale('en');
m.format('M'); // 1 display miladi month
m.format('MM'); // 01 display month by two digit
m.format('MMMM'); // January
m.format('jYYYY/jM/jD [is] YYYY/M/D'); // 1367/11/4 is 1989/1/24

Manipulate

There are a number of methods to modify date and time.more

m.jYear(1368); // set jalali year
//  If the range is exceeded, it will bubble up to the year.
m.jMonth(3); // month will be 4 and m.format("M")=='4' , jMonth Accepts numbers from 0 to 11.
m.jDate(10); // set a date
m.format("jYYYY/jMM/jD"); // 1368/4/10
m.subtract(1, "jyear"); // add a Jalali Year
m.format("jYYYY/jMM/jD"); // 1367/4/10
m.add(2, "jmonth"); // add Jalali Month
m.format("jYYYY/jMM/jD"); // 1367/6/10
m.endOf('jMonth').format("jYYYY/jMM/jD"); // 1367/6/31
m.startOf('jYear').format("jYYYY/jMM/jD"); // 1367/1/1

Validate

Check a date and time.more

m = moment('1367/11/4', 'jYYYY/jM/jD');
m.jIsLeapYear(); // false
m.isLeapYear(); // false
m.isSame(moment('1989-01-01','YYYY-MM-DD'), 'year'); // true
m.isSame(moment('1367-01-01','jYYYY-jMM-jDD'), 'year'); // true
m.isBefore(moment('1367-01-01','jYYYY-jMM-jDD'), 'month'); // false
m.isAfter(moment('1367-01-01','jYYYY-jMM-jDD'), 'jyear'); // false
m.isValid(); // true
moment('1396/7/31','jYYYY/jM/jD').isValid(); // false

validation demo in plunker

Convert persian(Jalali , Shamsi, khorshidi) to gregorian (miladi) calendar system

moment('1392/6/3 16:40', 'jYYYY/jM/jD HH:mm')
    .format('YYYY-M-D HH:mm:ss'); // 2013-8-25 16:40:00

Convert gregorian (miladi) to jalali (Shamsi, persian)

moment('2013-8-25 16:40:00', 'YYYY-M-D HH:mm:ss')
    .format('jYYYY/jM/jD HH:mm:ss'); // 1392/6/31 23:59:59

Change calendar system on changing its locale

moment.bindCalendarSystemAndLocale();

An example usage:

To make a datePicker work with jalali(shamsi) calendar system you could use this ability.

Using in Plunker

ES5

<script src='https://unpkg.com/jalali-moment/dist/jalali-moment.browser.js'></script>
<script>
  moment().format('jYYYY/jM/jD');
</script>

es5 demo in plunker

Typescript or es6

You could use systemjs to import this library into your project like this

Related Projects

jalali-angular-datepicker ( angular2 or more)

A highly configurable date picker built for Angular 4 or Angular 2 applications using jalali-moment is fingerpich/jalali-angular-datepicker created by @Fingerpich.

jalaali-moment

A Jalaali calendar system plugin for moment.js is jalaali-moment.

aurelia-time

aurelia-time Contains a set of value converters for Aurelia, one which uses jalali-moment.