Add crude first draft

.editorconfig

@@ -0,0 +1,26 @@
+# http://editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+trim_trailing_whitespace = true
+insert_final_newline = true
+charset = utf-8
+end_of_line = lf
+max_line_length = 88
+
+[*.{json,yml,yaml,js,jsx,vue,toml}]
+indent_size = 2
+
+[*.{html,htm,svg,xml}]
+indent_size = 2
+max_line_length = 120
+
+[LICENSE]
+insert_final_newline = false
+
+[*.{md,markdown}]
+indent_size = 2
+max_line_length = 80

.github/FUNDING.yml

@@ -0,0 +1,2 @@
+github: codingjoe
+custom: https://www.paypal.me/codingjoe

.github/dependabot.yml

@@ -0,0 +1,10 @@
+version: 2
+updates:
+- package-ecosystem: pip
+  directory: "/"
+  schedule:
+    interval: daily
+- package-ecosystem: github-actions
+  directory: "/"
+  schedule:
+    interval: daily

.github/workflows/ci.yml

@@ -0,0 +1,60 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+jobs:
+
+  dist:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/setup-python@v3
+      - uses: actions/checkout@v3
+      - run: python -m pip install --upgrade pip build wheel twine
+      - run: python -m build --sdist --wheel
+      - run: python -m twine check dist/*
+
+  lint:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        lint-command:
+          - bandit -r . -x ./tests
+          - black --check --diff .
+          - flake8 .
+          - isort --check-only --diff .
+          - pydocstyle .
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-python@v3
+        with:
+          cache: 'pip'
+          cache-dependency-path: 'linter-requirements.txt'
+      - run: python -m pip install -r linter-requirements.txt
+      - run: ${{ matrix.lint-command }}
+
+  pytest:
+    needs:
+      - lint
+      - dist
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        python-version:
+          - "3.10"
+        django-version:
+          - "3.2"
+          - "4.0"
+    steps:
+    - uses: actions/checkout@v3
+    - name: Set up Python ${{ matrix.python-version }}
+      uses: actions/setup-python@v3
+      with:
+        python-version: ${{ matrix.python-version }}
+    - run: python -m pip install .[test] codecov
+    - run: python -m pip install django~=${{ matrix.django-version }}a
+    - run: python -m pytest
+    - run: codecov

.github/workflows/release.yml

@@ -0,0 +1,19 @@
+name: Release
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  PyPi:
+
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v3
+    - uses: actions/setup-python@v3
+    - run: python -m pip install --upgrade pip build wheel twine
+    - run: python -m build --sdist --wheel
+    - run: python -m twine upload dist/*
+      env:
+        TWINE_USERNAME: __token__
+        TWINE_PASSWORD: ${{ secrets.TWINE_PASSWORD }}

.gitignore

@@ -127,3 +127,6 @@ dmypy.json
 
 # Pyre type checker
 .pyre/
+
+# flit
+pictures/_version.py

README.md

@@ -1,2 +1,98 @@
 # django-pictures
-Responsive cross-browser image library using modern codes like AVIF & WebP
+
+Responsive cross-browser image library using modern codes like AVIF & WebP.
+
+[![PyPi Version](https://img.shields.io/pypi/v/django-pictures.svg)](https://pypi.python.org/pypi/django-pictures/)
+[![Test Coverage](https://codecov.io/gh/codingjoe/django-pictures/branch/master/graph/badge.svg)](https://codecov.io/gh/codingjoe/django-pictures)
+[![GitHub License](https://img.shields.io/github/license/codingjoe/django-pictures)](https://raw.githubusercontent.com/codingjoe/django-pictures/master/LICENSE)
+
+### Usage
+
+```python
+# models.py
+from django.db import models
+from pictures.models import PictureField
+
+class Profile(models.Model):
+    title = models.CharField(max_length=255)
+    picture = PictureField(upload_to='avatars')
+```
+
+```
+<!-- template.html -->
+{% load pictures %}
+{% picture profile.picture alt="Spiderman" m=6 l=4 %}
+```
+
+The template above will render into:
+```html
+<picture>
+  <source type="image/webp"
+          srcset="/media/testapp/profile/image/800w.webp 800w, /media/testapp/profile/image/100w.webp 100w, /media/testapp/profile/image/200w.webp 200w, /media/testapp/profile/image/300w.webp 300w, /media/testapp/profile/image/400w.webp 400w, /media/testapp/profile/image/500w.webp 500w, /media/testapp/profile/image/600w.webp 600w, /media/testapp/profile/image/700w.webp 700w"
+          sizes="(min-width: 0px) and (max-width: 991px) 100vw, (min-width: 992px) and (max-width: 1199px) 33vw, 600px">
+  <img src="/media/testapp/profile/image.jpg" alt="Spiderman" width="800" height="800">
+</picture>
+```
+
+### Setup
+
+```shell
+python3 -m pip install django-pictures
+```
+
+```python
+# settings.py
+INSTALLED_APPS = [
+    # ...
+    'django_pictures',
+]
+
+# the following are defaults, but you can override them
+PICTURES = {
+    "BREAKPOINTS": {
+        "xs": 576,
+        "s": 768,
+        "m": 992,
+        "l": 1200,
+        "xl": 1400,
+    },
+    "GRID_COLUMNS": 12,
+    "CONTAINER_WIDTH": 1200,
+    "FILE_TYPES": ["WEBP"],
+    "PIXEL_DENSITIES": [1, 2],
+}
+```
+
+### Config
+
+#### Breakpoints
+
+You may define your own breakpoints, they should be identical to the ones used
+in your css library. Simply override the `PICTURES["BREAKPOINTS"]` setting.
+
+#### Grid columns
+
+Grids are so common in web design, that they even made it into CSS.
+We default to 12 columns, but you can override this setting, via the
+`PICTURES["GRID_COLUMNS"]` setting.
+
+#### Container width
+
+Containers are commonly used to limit the maximum width of layouts,
+to promote better readability on larger screens. We default to `1200px`,
+but you can override this setting, via the `PICTURES["CONTAINER_WIDTH"]` setting.
+
+You may also set it to `None`, should you not use a container.
+
+#### File types
+
+Unless you still services IE11 clients, you should be fine serving just
+[WebP](https://caniuse.com/webp). Sadly, [AVIF](https://caniuse.com/avif)
+(WebP's successor) is
+[not yet supported by Pillow](https://github.com/python-pillow/Pillow/pull/5201).
+
+#### Pixel densities
+
+Unless you really care that your images hold of if you hold your UHD phone very
+close to your eyeballs, you should be fine, serving at the default `1x` and `2x`
+densities.

linter-requirements.txt

@@ -0,0 +1,5 @@
+bandit==1.7.4
+black==22.1.0
+flake8==4.0.1
+isort==5.10.1
+pydocstyle[toml]==6.1.1

pictures/__init__.py

@@ -0,0 +1,6 @@
+"""Responsive cross-browser image library using modern codes like AVIF & WebP."""
+
+from . import _version
+
+__version__ = _version.version
+VERSION = _version.version_tuple

pictures/conf.py

@@ -0,0 +1,23 @@
+from django.conf import settings
+
+
+def get_settings():
+    return type(
+        "Settings",
+        (),
+        {
+            "BREAKPOINTS": {
+                "xs": 576,
+                "s": 768,
+                "m": 992,
+                "l": 1200,
+                "xl": 1400,
+            },
+            "GRID_COLUMNS": 12,
+            "CONTAINER_WIDTH": 1200,
+            "FILE_TYPES": ["WEBP"],
+            "PIXEL_DENSITIES": [1, 2],
+            "USE_PLACEHOLDERS": settings.DEBUG,
+        }
+        | getattr(settings, "PICTURES", {}),
+    )