Skip to main content

django-asset-definitions allows to define collections of static files (JavaScript, CSS) in Python code and (re)use them in Django views and templates.

Project description

django-asset-definitions

Build Status Code Coverage

Asset definitions are collections of static files (JavaScript, CSS) defined in Python code and (re)used in Django views and templates.

An example of asset definition is Media class that you can define in Django forms.

django-asset-definitions aim to extend the application of asset definitions beyond forms and use them as the main way to describe and organize JavaScript and CSS files.

Installation

pip install django-asset-definitions

Usage

Define:

import asset_definitions

my_media = asset_definitions.Media(
    js=(
        "media.js",
        """<script>window.addEventListener("load", function() {console.log("Loaded!");});</script>""",
    ),
    css={
        "all": (
            "media.css",
        ),
    }
)

Combine:

extended_media = my_media + asset_definitions.Media(
    js=("extension.js", )
)

Define in views:

import asset_definitions

class MyView(asset_definitions.MediaDefiningView, ...):

    class Media:
        js=(
            "media.js",
        ),
        css={
            "all": (
                "media.css",
            ),
        }

    ...

Form media is added to view media automatically:

import asset_definitions
from django.views.generic import FormView

class MyFormView(asset_definitions.MediaDefiningView, FormView):
    ...

Use in templates:

{{ view.media.render }}

Or:

{{ view.media.js.render }}
{{ view.media.css.render }}

See an extended example below.

asset_definitions.Media and django.forms.Media

  1. asset_definitions.Media provides the same API as django.forms.Media. In fact, it is inherited from django.forms.Media.

  2. It is safe to combine asset_definitions.Media with django.forms.Media.

  3. asset_definitions.Media objects are lazy. If two or more instances of asset_definitions.Media are combined together the result is computed only when media is rendered. It is safe to use reverse_lazy() with asset_definitions.Media. It is important if you define your assets on module level.

  4. Media class in MediaDefiningView does not support extend option. To add to the media defined in parent view class you should override get_media method and use super(MyView, self).get_media().

Example:

myapp/urls.py:

urlpatterns = (
    url("/", MyView.as_view()),
    url("/global-variables.js", global_js_variables, name="global_js_variables"),
)

myapp/views.py:

import asset_definitions
from . import assets


class MyView(assets_definition.MediaDefiningView, TemplateView):

    template_name = "template.html"

    class Media:
        js = ("media.js", )
        css = {"all": ("media.css", media)

    def get_media():
        return (
          assets.global_js_variables +
          assets.jquery +
          super(MyView, self).get_media()
        )

def global_js_variables(request):
    js_content = 'const CURRENT_USER="{}";'.format(request.user)
    return HttpResponse(js_content, content_type="application/javascript")

myapp/assets.py:

import asset_definitions
from django.core import urlresolvers


global_js_variables = asset_definition.Media(
    js=urlresolvers.reverse_lazy("global_js_variables"),
)


jquery = asset_definitions.Media(
    js="jquery.js"
)

myapp/templates/template.html:

<html>
  <head>
    {{ view.media.css.render }}
  </head>
  <body>
    ...
    {{ view.media.js.render }}
  </body>
</html>

Changes

0.3

  • Add Django 2.0 compatibility

  • Extract MediaDefiningClass base class from MediaDefiningView

0.2

  • Specify different requirements in setup.py based on the current Python version

  • Allow to use inline JavaScript in media definitions (wrap with <script> tag)

0.1

  • Initial release

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

django-asset-definitions-0.3.tar.gz (5.7 kB view hashes)

Uploaded Source

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page