diff --git a/bedrock/mozorg/templatetags/misc.py b/bedrock/mozorg/templatetags/misc.py index c88a9cc4e50..e3b0d2100b0 100644 --- a/bedrock/mozorg/templatetags/misc.py +++ b/bedrock/mozorg/templatetags/misc.py @@ -155,47 +155,6 @@ def field_with_attrs(bfield, **kwargs): return bfield -@library.global_function -@jinja2.pass_context -def platform_img(ctx, url, optional_attributes=None): - optional_attributes = optional_attributes or {} - img_urls = {} - platforms = optional_attributes.pop("platforms", ALL_FX_PLATFORMS) - add_high_res = optional_attributes.pop("high-res", False) - is_l10n = optional_attributes.pop("l10n", False) - - for platform in platforms: - img_urls[platform] = add_string_to_image_url(url, platform) - if add_high_res: - img_urls[platform + "-high-res"] = convert_to_high_res(img_urls[platform]) - - img_attrs = {} - for platform, image in img_urls.items(): - if is_l10n: - image = l10n_img_file_name(ctx, _strip_img_prefix(image)) - - if find_static(image): - key = "data-src-" + platform - img_attrs[key] = static(image) - - if add_high_res: - img_attrs["data-high-res"] = "true" - - img_attrs.update(optional_attributes) - attrs = " ".join(f'{attr}="{val}"' for attr, val in img_attrs.items()) - - # Don't download any image until the javascript sets it based on - # data-src so we can do platform detection. If no js, show the - # windows version. - markup = ( - '' - '" - ).format(attrs=attrs, win_src=img_attrs["data-src-windows"]) - - return Markup(markup) - - @library.global_function @jinja2.pass_context def high_res_img(ctx, url, optional_attributes=None): diff --git a/bedrock/mozorg/tests/test_helper_misc.py b/bedrock/mozorg/tests/test_helper_misc.py index 93d85fc34d9..2f5854aeeea 100644 --- a/bedrock/mozorg/tests/test_helper_misc.py +++ b/bedrock/mozorg/tests/test_helper_misc.py @@ -196,84 +196,6 @@ def test_fileformats(self): assert extensions == [".webm", ".ogv"] -@override_settings(STATIC_URL="/media/") -@patch("bedrock.mozorg.templatetags.misc.find_static", return_value=True) -class TestPlatformImg(TestCase): - rf = RequestFactory() - - def _render(self, url, optional_attributes=None): - req = self.rf.get("/") - req.locale = "en-US" - return render(f"{{{{ platform_img('{url}', {optional_attributes}) }}}}", {"request": req}) - - def _render_l10n(self, url): - req = self.rf.get("/") - req.locale = "en-US" - return render(f"{{{{ l10n_img('{url}') }}}}", {"request": req}) - - def test_platform_img_no_optional_attributes(self, find_static): - """Should return expected markup without optional attributes""" - markup = self._render("test.png") - self.assertIn('data-src-windows="/media/test-windows.png"', markup) - self.assertIn('data-src-mac="/media/test-mac.png"', markup) - markup = self._render("img/test.png") - self.assertIn('data-src-windows="/media/img/test-windows.png"', markup) - self.assertIn('data-src-mac="/media/img/test-mac.png"', markup) - - def test_platform_img_with_optional_attributes(self, find_static): - """Should return expected markup with optional attributes""" - markup = self._render("test.png", {"data-test-attr": "test"}) - self.assertIn('data-test-attr="test"', markup) - - def test_platform_img_with_high_res(self, find_static): - """Should return expected markup with high resolution image attrs""" - markup = self._render("test.png", {"high-res": True}) - self.assertIn('data-src-windows-high-res="/media/test-windows-high-res.png"', markup) - self.assertIn('data-src-mac-high-res="/media/test-mac-high-res.png"', markup) - self.assertIn('data-high-res="true"', markup) - markup = self._render("img/test.png", {"high-res": True}) - self.assertIn('data-src-windows-high-res="/media/img/test-windows-high-res.png"', markup) - self.assertIn('data-src-mac-high-res="/media/img/test-mac-high-res.png"', markup) - self.assertIn('data-high-res="true"', markup) - - def test_platform_img_with_l10n(self, find_static): - """Should return expected markup with l10n image path""" - l10n_url_win = self._render_l10n("test-windows.png") - l10n_url_mac = self._render_l10n("test-mac.png") - markup = self._render("test.png", {"l10n": True}) - self.assertIn('data-src-windows="' + l10n_url_win + '"', markup) - self.assertIn('data-src-mac="' + l10n_url_mac + '"', markup) - markup = self._render("/img/test.png", {"l10n": True}) - self.assertIn('data-src-windows="' + l10n_url_win + '"', markup) - self.assertIn('data-src-mac="' + l10n_url_mac + '"', markup) - - def test_platform_img_with_l10n_and_optional_attributes(self, find_static): - """ - Should return expected markup with l10n image path and optional - attributes - """ - l10n_url_win = self._render_l10n("test-windows.png") - l10n_url_mac = self._render_l10n("test-mac.png") - markup = self._render("test.png", {"l10n": True, "data-test-attr": "test"}) - self.assertIn('data-src-windows="' + l10n_url_win + '"', markup) - self.assertIn('data-src-mac="' + l10n_url_mac + '"', markup) - self.assertIn('data-test-attr="test"', markup) - - def test_platform_img_with_l10n_and_high_res(self, find_static): - """ - Should return expected markup with l10n image path and high resolution - attributes - """ - l10n_url_win = self._render_l10n("test-windows.png") - l10n_hr_url_win = misc.convert_to_high_res(l10n_url_win) - l10n_url_mac = self._render_l10n("test-mac.png") - l10n_hr_url_mac = misc.convert_to_high_res(l10n_url_mac) - markup = self._render("test.png", {"l10n": True, "high-res": True}) - self.assertIn('data-src-windows-high-res="' + l10n_hr_url_win + '"', markup) - self.assertIn('data-src-mac-high-res="' + l10n_hr_url_mac + '"', markup) - self.assertIn('data-high-res="true"', markup) - - class TestPressBlogUrl(TestCase): rf = RequestFactory() diff --git a/docs/coding.rst b/docs/coding.rst index 384a584f733..544a0e7d23a 100644 --- a/docs/coding.rst +++ b/docs/coding.rst @@ -675,25 +675,6 @@ Images that have translatable text can be handled with ``l10n_img()``: The images referenced by ``l10n_img()`` must exist in ``media/img/l10n/``, so for above example, the images could include ``media/img/l10n/en-US/firefox/os/have-it-all/messages.jpg`` and ``media/img/l10n/es-ES/firefox/os/have-it-all/messages.jpg``. -platform_img() -^^^^^^^^^^^^^^ - -Finally, for outputting an image that differs depending on the platform being used, the ``platform_img()`` function will automatically display the image for the user's browser: - -.. code-block:: python - - platform_img("img/firefox/new/browser.png", {"alt": "Firefox screenshot"}) - -``platform_img()`` will automatically look for the images ``browser-mac.png``, ``browser-win.png``, ``browser-linux.png``, etc. Platform image also supports hi-res images by adding ``'high-res': True`` to the list of optional attributes. - -``platform_img()`` supports localized images by setting the ``'l10n'`` parameter to ``True``: - -.. code-block:: python - - platform_img("img/firefox/new/firefox-logo.png", {"l10n": True, "alt": "Firefox screenshot"}) - -When using localization, ``platform_img()`` will look for images in the appropriate locale folder. In the above example, for the ``es-ES`` locale, all platform versions of the image should be located at ``media/img/l10n/es-ES/firefox/new/``. - qrcode() ^^^^^^^^