Formatting of dates and times in Flask templates using moment.js.

Overview

Flask-Moment

Build Status

This extension enhances Jinja2 templates with formatting of dates and times using moment.js.

Quick Start

Step 1: Initialize the extension:

from flask_moment import Moment
moment = Moment(app)

Step 2: In your <head> section of your base template add the following code:

<head>
    {{ moment.include_jquery() }}
    {{ moment.include_moment() }}
</head>

This extension also supports the Flask application factory pattern by allowing you to create a Moment object and then separately initialize it for an app:

    moment = Moment()

    def create_app(config):
        app = Flask(__name__)
        app.config.from_object(config)
        # initialize moment on the app within create_app()
        moment.init_app(app)

    app = create_app(prod_config)

Note that jQuery is required. If you are already including it on your own then you can remove the include_jquery() line. Secure HTTP is always used to request the external js files..

The include_jquery() and include_moment() methods take some optional arguments. If you pass a version argument to any of these two calls, then the requested version will be loaded from the default CDN. If you pass local_js, then the given local path will be used to load the library. The include_moment() argument takes a third argument no_js that when set to True will assume that the Moment JavaScript library is already loaded and will only add the JavaScript code that supports this extension.

Step 3: Render timestamps in your template. For example:

<p>The current date and time is: {{ moment().format('MMMM Do YYYY, h:mm:ss a') }}.</p>
<p>Something happened {{ moment(then).fromTime(now) }}.</p>
<p>{{ moment(then).calendar() }}.</p>

In the second and third examples template variables then and now are used. These must be instances of Python's datetime class, and must be "naive" objects. See the documentation for a discussion of naive date and time objects. As an example, now can be set as follows:

now = datetime.utcnow()

By default the timestamps will be converted from UTC to the local time in each client's machine before rendering. To disable the conversion to local time pass local=True.

Note that even though the timestamps are provided in UTC the rendered dates and times will be in the local time of the client computer, so each users will always see their local time regardless of where they are located.

Function Reference

The supported list of display functions is shown below:

  • moment(timestamp=None, local=False).format(format_string=None)
  • moment(timestamp=None, local=False).fromNow(no_suffix=False)
  • moment(timestamp=None, local=False).fromTime(another_timesatmp, no_suffix=False)
  • moment(timestamp=None, local=False).toNow(no_suffix=False)
  • moment(timestamp=None, local=False).toTime(another_timesatmp, no_suffix=False)
  • moment(timestamp=None, local=False).calendar()
  • moment(timestamp=None, local=False).valueOf()
  • moment(timestamp=None, local=False).unix()

Consult the moment.js documentation for details on these functions.

Auto-Refresh

All the display functions take an optional refresh argument that when set to True will re-render timestamps every minute. This can be useful for relative time formats such as the one returned by the fromNow() or fromTime() functions. By default refreshing is disabled.

Default Format

The format() function can be invoked without arguments, in which case a default format of ISO8601 defined by the moment.js library is used. If you want to set a different default, you can set the MOMENT_DEFAULT_FORMAT variable in the Flask configuration. Consult the moment.js format documentation for a list of accepted tokens.

Internationalization

By default dates and times are rendered in English. To change to a different language add the following line in the <head> section after the include_moment() line:

{{ moment.locale("es") }}

The above example sets the language to Spanish. Moment.js supports a large number of languages, consult the documentation for the list of languages and their two letter codes.

The extension also supports auto-detection of the client's browser language:

{{ moment.locale(auto_detect=True) }}

Custom locales can also be included as a dictionary:

{{ moment.locale(customizations={ ... }) }}

See the Moment.js locale customizations documentation for details on how to define a custom locale.

Ajax Support

It is also possible to create Flask-Moment timestamps in Python code, for cases where a template is not used. This is the syntax:

timestamp = moment.create(datetime.utcnow()).calendar()

The moment variable is the Moment instance that was created at initialization time.

A timestamp created in this way is an HTML string that can be returned as part of a response. For example, here is how a timestamp can be returned in a JSON object:

return jsonify({ 'timestamp': moment.create(datetime.utcnow()).format('L') })

The Ajax callback in the browser needs to call flask_moment_render_all() each time an element containing a timestamp is added to the DOM. The included application demonstrates how this is done.

Subresource Integrity(SRI)

SRI is a security feature that enables browsers to verify that resources they fetch are not maliciously manipulated. To do so a cryptographic hash is provided that proves integrity.

SRI is enabled by default. If you wish to use another version or want to host your own javascript, a separate hash can be provided. Just add sri=<YOUR-HASH> when calling either moment.include_moment() or moment.include_jquery(). If no sri hash is provided and you choose to use a non default version of javascript, no sri hash will be added.

You can always choose to disable sri. To do so just set sri=False.

Development

Currently the tests are written using pytest.

pip install pytest

To run the tests from the root directory use: py.test.

Reports on coverage with missing line numbers can be generated using pytest-cov:

pip install pytest-cov

And then running: py-test --cov-report term-missing --cov=flask_moment

Owner
Miguel Grinberg
Miguel Grinberg
A Flask app template with integrated SQLAlchemy, authentication, and Bootstrap frontend

Flask-Bootstrap Flask-Bootstrap is an Flask app template for users to clone and customize as desired, as opposed to a Flask extension that you can ins

Eric S. Bullington 204 Dec 26, 2022
A simple Task todo application built with Flask

Task TODO Table An application built with Flask a Python framework and hosted on Heroku. Important notes GuniCorn (Green Unicorn): is a Python WSGI HT

DCN (Dubem Celestine Nwabuisi) 1 Dec 15, 2021
A web application that consists of a collection of board games

PyBoardGame About This website contains a collection of board games for users to enjoy, as well as various guides for the games. The web app is built

Larry Shi 0 Aug 11, 2021
An Instagram Clone using Flask, Python, Redux, Thunk, React

An Instagram Clone using Flask, Python, Redux, Thunk, React

1 Dec 09, 2021
Example Flask application illustrating some of my common practices

Overholt Overholt is an example Flask application illustrating some of my common practices Development Environment At the bare minimum you'll need the

Matt Wright 1.6k Dec 15, 2022
YAML-formatted plain-text file based models for Flask backed by Flask-SQLAlchemy

Flask-FileAlchemy Flask-FileAlchemy is a Flask extension that lets you use Markdown or YAML formatted plain-text files as the main data store for your

Siddhant Goel 20 Dec 14, 2022
Getting Started with Docker and Flask

Getting-Started-with-Docker-and-Flask Introduction Docker makes it easier, simpler and safer to build, deploy and manage applications in a docker cont

Phylis Jepchumba 1 Oct 08, 2021
Burp-UI is a web-ui for burp backup written in python with Flask and jQuery/Bootstrap

Burp-UI Contents Introduction Screenshots Demo What's that? Who are you? Documentation FAQ Community Notes See also Licenses Thanks Introduction Scree

Benjamin 84 Dec 20, 2022
Flask 文档中文翻译

Flask 中文文档 这里是 Flask 文档中文翻译项目,欢迎参与! 在开始翻译之前,请务必阅读下面的 Contributing Guide 了解贡献流程,然后阅读这个 Issue 了解翻译要求,在这个 Discussion 投票选出你认为合适的翻译词汇,在这个 Discussion 投票选出你喜

Grey Li 93 Nov 28, 2022
Flask + marshmallow for beautiful APIs

Flask-Marshmallow Flask + marshmallow for beautiful APIs Flask-Marshmallow is a thin integration layer for Flask (a Python web framework) and marshmal

marshmallow-code 770 Jan 05, 2023
Full-Stack application that visualizes amusement park safety.

Amusement Park Ride Safety Analysis Project Proposal We have chosen to look into amusement park data to explore ride safety relationships visually, in

Michael Absher 0 Jul 11, 2021
A flask extension using pyexcel to read, manipulate and write data in different excel formats: csv, ods, xls, xlsx and xlsm.

Flask-Excel - Let you focus on data, instead of file formats Support the project If your company has embedded pyexcel and its components into a revenu

247 Dec 27, 2022
Flask webassets integration.

Integrates the webassets library with Flask, adding support for merging, minifying and compiling CSS and Javascript files. Documentation: https://flas

Michael Elsdörfer 433 Dec 29, 2022
Live Corona statistics and information site with flask.

Flask Live Corona Info Live Corona statistics and information site with flask. Tools Flask Scrapy Matplotlib How to Run Project Download Codes git clo

Mohammad Dori 5 Jul 15, 2022
A template for Flask APIs.

FlaskAPITempate A template for a Flask API. Why tho? I just wanted an easy way to create a Flask API. How to setup First, use the template. You can do

TechStudent10 1 Dec 28, 2021
Rate Limiting extension for Flask

Flask-Limiter Flask-Limiter provides rate limiting features to flask routes. It has support for a configurable backend for storage with current implem

Ali-Akber Saifee 922 Jan 08, 2023
Harmony, a discord clone, allows users to chat with other users in real time via servers, channels, and direct messages

Harmony, a discord clone, allows users to chat with other users in real time via servers, channels, and direct messages

Seth Holland 3 Feb 03, 2022
A nice anonymous messaging api (Uses Flask's restful api)

anonymous-message-api A nice anonymous message api (Uses Flask's restful api) How it works: 1. The user send a put request to your api server: Require

6 Nov 07, 2021
A simple way to demo Flask apps from your machine.

flask-ngrok A simple way to demo Flask apps from your machine. Makes your Flask apps running on localhost available over the internet via the excellen

117 Dec 27, 2022
Learn REST API with Flask, Mysql and Docker

Learn REST API with Flask, Mysql and Docker A project for you to learn to work a flask REST api with docker and the mysql database manager! Table of C

Aldo Matus 0 Jul 31, 2021