[vlc-devel] [PATCH 03/15] http: add assets
Marvin Scholz
epirat07 at gmail.com
Tue Jun 23 15:55:35 CEST 2020
Whats the benefit of using these JS assets instead of plain
old SVGs?
On 23 Jun 2020, at 14:42, David Loiret wrote:
> From: Gautam Chitnis <chitnis.gautam1 at gmail.com>
>
> ---
> share/lua/http/src/assets/compiled-icons/delete.js | 10
> ++++++++++
> .../src/assets/compiled-icons/format-list-bulleted.js | 10
> ++++++++++
> share/lua/http/src/assets/compiled-icons/menu.js | 10
> ++++++++++
> .../src/assets/compiled-icons/play-circle-outline.js | 10
> ++++++++++
> share/lua/http/src/assets/compiled-icons/plus.js | 10
> ++++++++++
> share/lua/http/src/assets/compiled-icons/poll.js | 10
> ++++++++++
> share/lua/http/src/assets/compiled-icons/replay.js | 10
> ++++++++++
> .../http/src/assets/compiled-icons/shuffle-variant.js | 10
> ++++++++++
> share/lua/http/src/assets/icon-template.txt | 10
> ++++++++++
> share/lua/http/src/assets/svg-icons/delete.svg | 5 +++++
> .../http/src/assets/svg-icons/format-list-bulleted.svg | 5 +++++
> share/lua/http/src/assets/svg-icons/menu.svg | 5 +++++
> .../http/src/assets/svg-icons/play-circle-outline.svg | 5 +++++
> share/lua/http/src/assets/svg-icons/plus.svg | 5 +++++
> share/lua/http/src/assets/svg-icons/poll.svg | 5 +++++
> share/lua/http/src/assets/svg-icons/replay.svg | 5 +++++
> .../lua/http/src/assets/svg-icons/shuffle-variant.svg | 5 +++++
> 17 files changed, 130 insertions(+)
> create mode 100644 share/lua/http/src/assets/compiled-icons/delete.js
> create mode 100644
> share/lua/http/src/assets/compiled-icons/format-list-bulleted.js
> create mode 100644 share/lua/http/src/assets/compiled-icons/menu.js
> create mode 100644
> share/lua/http/src/assets/compiled-icons/play-circle-outline.js
> create mode 100644 share/lua/http/src/assets/compiled-icons/plus.js
> create mode 100644 share/lua/http/src/assets/compiled-icons/poll.js
> create mode 100644 share/lua/http/src/assets/compiled-icons/replay.js
> create mode 100644
> share/lua/http/src/assets/compiled-icons/shuffle-variant.js
> create mode 100644 share/lua/http/src/assets/icon-template.txt
> create mode 100755 share/lua/http/src/assets/svg-icons/delete.svg
> create mode 100755
> share/lua/http/src/assets/svg-icons/format-list-bulleted.svg
> create mode 100755 share/lua/http/src/assets/svg-icons/menu.svg
> create mode 100755
> share/lua/http/src/assets/svg-icons/play-circle-outline.svg
> create mode 100755 share/lua/http/src/assets/svg-icons/plus.svg
> create mode 100755 share/lua/http/src/assets/svg-icons/poll.svg
> create mode 100755 share/lua/http/src/assets/svg-icons/replay.svg
> create mode 100755
> share/lua/http/src/assets/svg-icons/shuffle-variant.svg
>
> diff --git a/share/lua/http/src/assets/compiled-icons/delete.js
> b/share/lua/http/src/assets/compiled-icons/delete.js
> new file mode 100644
> index 0000000000..9397c5b377
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/delete.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'delete': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M19 4h-3.5l-1-1h-5l-1 1H5v2h14M6 19c0
> 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12z"/>`
> + }
> +})
> diff --git
> a/share/lua/http/src/assets/compiled-icons/format-list-bulleted.js
> b/share/lua/http/src/assets/compiled-icons/format-list-bulleted.js
> new file mode 100644
> index 0000000000..17d2963263
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/format-list-bulleted.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'format-list-bulleted': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M7 5h14v2H7V5zm0 8v-2h14v2H7zM4 4.5c.83 0
> 1.5.67 1.5 1.5S4.83 7.5 4 7.5 2.5 6.83 2.5 6 3.17 4.5 4 4.5zm0 6c.83 0
> 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zM7
> 19v-2h14v2H7zm-3-2.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5
> 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z"/>`
> + }
> +})
> diff --git a/share/lua/http/src/assets/compiled-icons/menu.js
> b/share/lua/http/src/assets/compiled-icons/menu.js
> new file mode 100644
> index 0000000000..a23bc36907
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/menu.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'menu': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M3 6h18v2H3V6zm0 5h18v2H3v-2zm0
> 5h18v2H3v-2z"/>`
> + }
> +})
> diff --git
> a/share/lua/http/src/assets/compiled-icons/play-circle-outline.js
> b/share/lua/http/src/assets/compiled-icons/play-circle-outline.js
> new file mode 100644
> index 0000000000..2a11c2e189
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/play-circle-outline.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'play-circle-outline': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M12 20c-4.411 0-8-3.589-8-8s3.589-8 8-8 8
> 3.589 8 8-3.589 8-8 8zm0-18C6.477 2 2 6.477 2 12s4.477 10 10 10
> 10-4.477 10-10S17.523 2 12 2zm-2 14.5l6-4.5-6-4.5v9z"/>`
> + }
> +})
> diff --git a/share/lua/http/src/assets/compiled-icons/plus.js
> b/share/lua/http/src/assets/compiled-icons/plus.js
> new file mode 100644
> index 0000000000..3292a53ad2
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/plus.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'plus': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M19
> 12.998h-6v6h-2v-6H5v-2h6v-6h2v6h6v2z"/>`
> + }
> +})
> diff --git a/share/lua/http/src/assets/compiled-icons/poll.js
> b/share/lua/http/src/assets/compiled-icons/poll.js
> new file mode 100644
> index 0000000000..32dd4904bd
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/poll.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'poll': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M3 22V8h4v14H3zm7 0V2h4v20h-4zm7
> 0v-8h4v8h-4z"/>`
> + }
> +})
> diff --git a/share/lua/http/src/assets/compiled-icons/replay.js
> b/share/lua/http/src/assets/compiled-icons/replay.js
> new file mode 100644
> index 0000000000..de2f695e9a
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/replay.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'replay': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69
> 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z"/>`
> + }
> +})
> diff --git
> a/share/lua/http/src/assets/compiled-icons/shuffle-variant.js
> b/share/lua/http/src/assets/compiled-icons/shuffle-variant.js
> new file mode 100644
> index 0000000000..b162e0de1e
> --- /dev/null
> +++ b/share/lua/http/src/assets/compiled-icons/shuffle-variant.js
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + 'shuffle-variant': {
> + width: 24,
> + height: 24,
> + viewBox: '0 0 24.00 24.00',
> + data: `<path pid="0" d="M17 3l5.25 4.5L17 12l5.25 4.5L17
> 21v-3h-2.743l-2.818-2.818 2.122-2.121L15.5 15H17V9h-1.5l-9
> 9H2v-3h3.257l9-9H17V3zM2 6h4.5l2.818 2.818-2.121 2.121L5.257
> 9H2V6z"/>`
> + }
> +})
> diff --git a/share/lua/http/src/assets/icon-template.txt
> b/share/lua/http/src/assets/icon-template.txt
> new file mode 100644
> index 0000000000..51c9f4080b
> --- /dev/null
> +++ b/share/lua/http/src/assets/icon-template.txt
> @@ -0,0 +1,10 @@
> +import { svgIcon } from
> '../../components/svg-icon/svg-icon.component.js';
> +
> +svgIcon.register({
> + '${name}': {
> + width: ${width},
> + height: ${height},
> + viewBox: ${viewBox},
> + data: `${data}`
> + }
> +})
> diff --git a/share/lua/http/src/assets/svg-icons/delete.svg
> b/share/lua/http/src/assets/svg-icons/delete.svg
> new file mode 100755
> index 0000000000..7cf0664b83
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/delete.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M
> 19,4L 15.5,4L 14.5,3L 9.5,3L 8.5,4L 5,4L 5,6L 19,6M 6,19C 6,20.1
> 6.9,21 8,21L 16,21C 17.1,21 18,20.1 18,19L 18,7L 6,7L 6,19 Z "/>
> +</svg>
> diff --git
> a/share/lua/http/src/assets/svg-icons/format-list-bulleted.svg
> b/share/lua/http/src/assets/svg-icons/format-list-bulleted.svg
> new file mode 100755
> index 0000000000..b729edfb54
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/format-list-bulleted.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-width="0.2"
> stroke-linejoin="round" d="M 7,5L 21,5L 21,7L 7,7L 7,5 Z M 7,13L 7,11L
> 21,11L 21,13L 7,13 Z M 4,4.50001C 4.83,4.50001 5.5,5.16993
> 5.5,6.00001C 5.5,6.83008 4.83,7.50001 4,7.50001C 3.17,7.50001
> 2.5,6.83008 2.5,6.00001C 2.5,5.16993 3.17,4.50001 4,4.50001 Z M
> 4,10.5C 4.83,10.5 5.5,11.17 5.5,12C 5.5,12.83 4.83,13.5 4,13.5C
> 3.17,13.5 2.5,12.83 2.5,12C 2.5,11.17 3.17,10.5 4,10.5 Z M 7,19L 7,17L
> 21,17L 21,19L 7,19 Z M 4,16.5C 4.83,16.5 5.5,17.17 5.5,18C 5.5,18.83
> 4.83,19.5 4,19.5C 3.17,19.5 2.5,18.83 2.5,18C 2.5,17.17 3.17,16.5
> 4,16.5 Z "/>
> +</svg>
> diff --git a/share/lua/http/src/assets/svg-icons/menu.svg
> b/share/lua/http/src/assets/svg-icons/menu.svg
> new file mode 100755
> index 0000000000..ee1963955b
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/menu.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-width="0.2"
> stroke-linejoin="round" d="M 3,6L 21,6L 21,8L 3,8L 3,6 Z M 3,11L
> 21,11L 21,13L 3,13L 3,11 Z M 3,16L 21,16L 21,18L 3,18L 3,16 Z "/>
> +</svg>
> diff --git
> a/share/lua/http/src/assets/svg-icons/play-circle-outline.svg
> b/share/lua/http/src/assets/svg-icons/play-circle-outline.svg
> new file mode 100755
> index 0000000000..ab592415b8
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/play-circle-outline.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-width="0.2"
> stroke-linejoin="round" d="M 12,20C 7.589,20 4.00001,16.411
> 4.00001,12C 4.00001,7.589 7.589,4.00001 12,4.00001C 16.411,4.00001
> 20,7.589 20,12C 20,16.411 16.411,20 12,20 Z M 12,2.00001C
> 6.477,2.00001 2.00001,6.477 2.00001,12C 2.00001,17.523 6.477,22 12,22C
> 17.523,22 22,17.523 22,12C 22,6.477 17.523,2.00001 12,2.00001 Z M
> 10,16.5L 16,12L 10,7.50001L 10,16.5 Z "/>
> +</svg>
> diff --git a/share/lua/http/src/assets/svg-icons/plus.svg
> b/share/lua/http/src/assets/svg-icons/plus.svg
> new file mode 100755
> index 0000000000..731cc9d6d7
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/plus.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-width="0.2"
> stroke-linejoin="round" d="M 18.9994,12.998L 12.9994,12.998L
> 12.9994,18.998L 10.9994,18.998L 10.9994,12.998L 4.99936,12.998L
> 4.99936,10.998L 10.9994,10.998L 10.9994,4.99805L 12.9994,4.99805L
> 12.9994,10.998L 18.9994,10.998L 18.9994,12.998 Z "/>
> +</svg>
> diff --git a/share/lua/http/src/assets/svg-icons/poll.svg
> b/share/lua/http/src/assets/svg-icons/poll.svg
> new file mode 100755
> index 0000000000..7947df0aa8
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/poll.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-width="0.2"
> stroke-linejoin="round" d="M 3,22L 3,8L 7,8L 7,22L 3,22 Z M
> 9.99999,22L 9.99999,2.00001L 14,2.00001L 14,22L 9.99999,22 Z M 17,22L
> 17,14L 21,14L 21,22L 17,22 Z "/>
> +</svg>
> diff --git a/share/lua/http/src/assets/svg-icons/replay.svg
> b/share/lua/http/src/assets/svg-icons/replay.svg
> new file mode 100755
> index 0000000000..9dc06a177a
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/replay.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M
> 12,5L 12,1L 7,6L 12,11L 12,7C 15.31,7 18,9.69 18,13C 18,16.31 15.31,19
> 12,19C 8.69,19 6,16.31 6,13L 4,13C 4,17.42 7.58,21 12,21C 16.42,21
> 20,17.42 20,13C 20,8.58 16.42,5 12,5 Z "/>
> +</svg>
> diff --git a/share/lua/http/src/assets/svg-icons/shuffle-variant.svg
> b/share/lua/http/src/assets/svg-icons/shuffle-variant.svg
> new file mode 100755
> index 0000000000..4edc225df3
> --- /dev/null
> +++ b/share/lua/http/src/assets/svg-icons/shuffle-variant.svg
> @@ -0,0 +1,5 @@
> +<?xml version="1.0" encoding="utf-8"?>
> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
> "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
> +<svg xmlns="http://www.w3.org/2000/svg"
> xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
> baseProfile="full" width="24" height="24" viewBox="0 0 24.00 24.00"
> enable-background="new 0 0 24.00 24.00" xml:space="preserve">
> + <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M
> 17,3L 22.25,7.50002L 17,12L 22.25,16.5L 17,21L 17,18L 14.2574,18L
> 11.4393,15.182L 13.5607,13.0607L 15.5,15L 17,15L 17,12L 17,9L 15.5,9L
> 6.49999,18L 2,18L 2,15L 5.25736,15L 14.2574,6L 17,6L 17,3 Z M
> 2,6.00001L 6.5,6.00001L 9.31802,8.81803L 7.1967,10.9393L
> 5.25737,9.00001L 2,9.00001L 2,6.00001 Z "/>
> +</svg>
> --
> 2.18.0
>
> _______________________________________________
> vlc-devel mailing list
> To unsubscribe or modify your subscription options:
> https://mailman.videolan.org/listinfo/vlc-devel
More information about the vlc-devel
mailing list