Compare commits

...

5 Commits

  1. 7
      .browserslistrc
  2. 1
      .gitignore
  3. 2
      Gemfile
  4. 6
      Gemfile.lock
  5. 4
      _config.yml
  6. 3
      _includes/contact.html
  7. 1
      _includes/footer.html
  8. 10
      _layouts/compress.html
  9. 20
      _layouts/default.html
  10. 9
      _plugins/uglify.rb
  11. 2
      archive.html
  12. 7
      assets/css/components/footer.scss
  13. 9
      assets/css/components/header.scss
  14. 5
      assets/css/pages/home.scss
  15. 4
      assets/css/pages/projects.scss
  16. BIN
      assets/images/992-704-max.webp
  17. BIN
      assets/images/cdrom.webp
  18. 97
      assets/images/codec-bg-2.svg
  19. 2202
      assets/images/codec-bg.svg
  20. BIN
      assets/images/developer.webp
  21. 2233
      assets/images/generic-bg.svg
  22. BIN
      assets/images/icons/email.webp
  23. BIN
      assets/images/icons/github.png
  24. BIN
      assets/images/icons/github.webp
  25. BIN
      assets/images/icons/mastodon.webp
  26. BIN
      assets/images/icons/telegram.webp
  27. BIN
      assets/images/icons/twitter.webp
  28. BIN
      assets/images/icons/webpage.png
  29. BIN
      assets/images/icons/webpage.webp
  30. BIN
      assets/images/landing.gif
  31. BIN
      assets/images/learning.webp
  32. BIN
      assets/images/logo-codec.webp
  33. BIN
      assets/images/logos/jekyll.webp
  34. BIN
      assets/images/logos/programari a mida.png
  35. BIN
      assets/images/logos/programari a mida.webp
  36. BIN
      assets/images/logos/strapi.png
  37. BIN
      assets/images/logos/strapi.webp
  38. BIN
      assets/images/logos/wordpress.webp
  39. BIN
      assets/images/lucas-sticker.png
  40. BIN
      assets/images/lucas.jpg
  41. BIN
      assets/images/lucas.png
  42. 95
      assets/images/nosaltres-bg.svg
  43. BIN
      assets/images/nosaltres-r.jpg
  44. BIN
      assets/images/nosaltres.jpg
  45. BIN
      assets/images/nosaltres.webp
  46. BIN
      assets/images/nosaltres2.jpg
  47. BIN
      assets/images/path1241.png
  48. BIN
      assets/images/pau-sticker.jpg
  49. BIN
      assets/images/pau-sticker.png
  50. BIN
      assets/images/pau.jpg
  51. BIN
      assets/images/products.webp
  52. BIN
      assets/images/projects/equinox.webp
  53. BIN
      assets/images/projects/kilometrezero.webp
  54. BIN
      assets/images/projects/silviagenoves.webp
  55. BIN
      assets/images/projects/toetsav.webp
  56. BIN
      assets/images/projects/vh3d.webp
  57. BIN
      assets/images/wip.webp
  58. BIN
      assets/images/workshops.webp
  59. BIN
      assets/images/yunohost-logo.webp
  60. 440
      assets/js/components/contact.js
  61. 9
      assets/js/components/footer.js
  62. 199
      assets/js/components/header.js
  63. 21
      assets/js/index.js
  64. 10
      assets/js/main.js
  65. 77
      assets/js/pages/products.js
  66. 11
      assets/js/pages/projects.js
  67. 11
      assets/js/pages/workshops.js
  68. 801
      assets/js/utils/SectionScroller.js
  69. 6
      assets/js/utils/easees.js
  70. 4
      assets/js/utils/loader.js
  71. 8
      index.html
  72. 1007
      package-lock.json
  73. 27
      package.json
  74. 9
      postcss.config.js
  75. 4
      products.html
  76. 6
      workshops.html

@ -0,0 +1,7 @@
defaults
maintained node versions
not ie < 11
last 2 versions
> 1%
iOS 7
last 3 iOS versions

1
.gitignore vendored

@ -4,4 +4,5 @@ _site/
.jekyll-cache/
.jekyll-metadata
dist.zip
node_modules/

@ -12,4 +12,6 @@ group :jekyll_plugins do
gem 'jekyll-feed'
gem 'jekyll-seo-tag'
gem 'jekyll-paginate'
gem 'jekyll-postcss'
gem "uglifier"
end

@ -9,6 +9,7 @@ GEM
eventmachine (>= 0.12.9)
http_parser.rb (~> 0)
eventmachine (1.2.7)
execjs (2.8.1)
ffi (1.15.5)
forwardable-extended (2.6.0)
http_parser.rb (0.8.0)
@ -32,6 +33,7 @@ GEM
jekyll-feed (0.16.0)
jekyll (>= 3.7, < 5.0)
jekyll-paginate (1.1.0)
jekyll-postcss (0.5.0)
jekyll-sass-converter (2.1.0)
sassc (> 2.0.1, < 3.0)
jekyll-seo-tag (2.7.1)
@ -62,6 +64,8 @@ GEM
ffi (~> 1.9)
terminal-table (2.0.0)
unicode-display_width (~> 1.1, >= 1.1.1)
uglifier (4.2.0)
execjs (>= 0.3.0, < 3)
unicode-display_width (1.8.0)
webrick (1.7.0)
@ -72,8 +76,10 @@ DEPENDENCIES
jekyll
jekyll-feed
jekyll-paginate
jekyll-postcss
jekyll-seo-tag
jekyll-sitemap
uglifier
webrick
BUNDLED WITH

@ -39,8 +39,10 @@ plugins:
- jekyll-sitemap
- jekyll-seo-tag
- jekyll-paginate
- jekyll-postcss
- uglifier
sass:
sourcemap: never
style: compressed

@ -58,9 +58,8 @@
</div>
<div id="contactSubmit" class="contact__submit-field field">
<div class="control">
<button class="button is-danger">Enviar</button>
<button class="button">Enviar</button>
</div>
</div>
</form>
</div>
<script src="{{ base.url | prepend: site.url }}/assets/js/components/contact.js"></script>

@ -4,4 +4,3 @@
<div class="footer__contact">
{% include contact.html %}
</div>
<script src="{{ base.url | prepend: site.url }}/assets/js/components/footer.js"></script>

@ -0,0 +1,10 @@
---
# Jekyll layout that compresses HTML
# v3.1.0
# http://jch.penibelst.de/
# © 2014–2015 Anatol Broder
# MIT License
---
{% capture _LINE_FEED %}
{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment or site.compress_html.ignore.envs == "all" %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}</{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "<!-- -->" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "<pre" %}{% assign _content = "" %}{% for _pre_before in _pre_befores %}{% assign _pres = _pre_before | split: "</pre>" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "</pre>" %}<pre{{ _pres.first }}</pre>{% endif %}{% unless _pre_before contains "</pre>" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " <e;<e; </e>;</e>;</e> ;</e>" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} <table id="compress_html_profile_{{ site.time | date: "%Y%m%d" }}" class="compress_html_profile"> <thead> <tr> <td>Step <td>Bytes <tbody> <tr> <td>raw <td>{{ content | size }}{% if _profile_endings %} <tr> <td>endings <td>{{ _profile_endings }}{% endif %}{% if _profile_startings %} <tr> <td>startings <td>{{ _profile_startings }}{% endif %}{% if _profile_comments %} <tr> <td>comments <td>{{ _profile_comments }}{% endif %}{% if _profile_collapse %} <tr> <td>collapse <td>{{ _profile_collapse }}{% endif %}{% if _profile_clippings %} <tr> <td>clippings <td>{{ _profile_clippings }}{% endif %} </table>{% endif %}{% endif %}

@ -1,3 +1,7 @@
---
layout: compress
---
<!DOCTYPE html>
<html>
<head>
@ -26,11 +30,7 @@
<script src="my-analytics-script.js"></script>
{% endif %}
<script src="{{ base.url | prepend: site.url }}/assets/js/utils/device-detect.js"></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/utils/background-patterns.js"></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/utils/viewport.js"></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/utils/easees.js"></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/utils/SectionScroller.js"></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/index.js"></script>
<style>
#loader {
@ -57,15 +57,5 @@
<footer id="pageFooter">{% include footer.html %}</footer>
{% endif %}
<div id="loader"></div>
<script src="{{ base.url | prepend: site.url }}/assets/js/main.js" ></script>
<script src="{{ base.url | prepend: site.url }}/assets/js/components/header.js" ></script>
<script>
document.addEventListener("DOMContentLoaded", function () {
document.getElementById("loader").style.opacity = 0;
setTimeout(function () {
document.getElementById("loader").style.display = "none";
}, 500);
});
</script>
</body>
</html>

@ -0,0 +1,9 @@
module Jekyll
module Uglify
def uglify(input)
Uglifier.new(harmony: true).compile(input)
end
end
end
Liquid::Template.register_filter(Jekyll::Uglify)

@ -13,7 +13,7 @@ page: archive
{% for project in site.data.projects %}
<article name="{{project.name}}" class="projects__product">
<a href="{{ project.url }}" target="_blank">
<img src="{{ base.url | prepend: site.url }}/assets/images/projects/{{project.imagename}}.png">
<img src="{{ base.url | prepend: site.url }}/assets/images/projects/{{project.imagename}}.webp" alt="Poster del projecte {{ project.name }}">
</a>
<div class="projects__product-body">
<a href="{{project.url}}" target="_blank">

@ -2,6 +2,7 @@
---
@import "reset";
@import "colors";
@import "breakpoints";
#pageFooter,
@ -66,5 +67,11 @@
}
}
}
.contact__submit-field .button {
color: white;
background-color: $orange-peel;
border-color: $orange-peel;
}
}
}

@ -17,11 +17,11 @@ header {
.navbar {
background-color: transparent;
padding: 0 #{$site-paddings};
padding: 0 $site-paddings;
@media screen and (max-width: 1024px) {
.navbar-menu {
width: calc(100% + 20vw);
width: calc(100% + 20vw);
margin-left: -10vw;
.navbar-item {
@ -36,8 +36,7 @@ header {
font-weight: bold;
text-decoration: none !important;
width: 90px;
@include m-background-image('/assets/images/logo-codec.png');
@include m-background-image("/assets/images/logo-codec.webp");
}
.navbar-item.is-active,
@ -82,7 +81,7 @@ header {
$icons: email, mastodon, twitter, telegram, github;
@each $icon in $icons {
&[data-link="#{$icon}"] {
background-image: url("/assets/images/icons/#{$icon}.png");
background-image: url("/assets/images/icons/#{$icon}.webp");
}
}

@ -99,7 +99,6 @@
display: flex;
flex-direction: column;
background-color: #43437a;
// background-color: $deep-cove;
padding: 0 $site-paddings;
margin: 0 calc(#{$site-paddings} * -1);
border-bottom: 10px solid $orange-peel;
@ -401,7 +400,7 @@
width: 100%;
border-radius: 5px;
transition: height 400ms ease-in-out;
@include m-background-image("/assets/images/nosaltres-r.jpg", cover);
@include m-background-image("/assets/images/nosaltres.webp", cover);
@include m-height-breakpoints();
}
@ -457,7 +456,7 @@
.scroll-span {
width: 100%;
margin-top: -#{$header-height};
margin-top: calc(#{$header-height} * -1);
background: transparent;
}

@ -1,8 +1,8 @@
---
---
@import 'reset';
@import 'breakpoints';
@import "reset";
@import "breakpoints";
main.archive {
padding: $header-height $site-paddings 175px;

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

@ -1,97 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="1860"
height="980"
viewBox="0 0 492.12501 259.29166"
version="1.1"
id="svg8"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="drawing.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.35"
inkscape:cx="785.23973"
inkscape:cy="445.67408"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
showguides="true"
inkscape:guide-bbox="true"
inkscape:window-width="1868"
inkscape:window-height="1016"
inkscape:window-x="52"
inkscape:window-y="27"
inkscape:window-maximized="1"
units="px" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-37.708343)">
<path
style="fill:#40a1df;fill-opacity:1;stroke:none;stroke-width:2.6341176;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="M -11.45901,31.334098 H 36.649499 V 408.71867 L -11.45901,325.15163 Z"
id="rect815"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<path
style="fill:#df0094;fill-opacity:1;stroke:none;stroke-width:2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="M 140.30452,537.52875 H 92.196002 V 319.97136 l 48.108518,48.17534 z"
id="rect815-6"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<rect
style="fill:#df0094;fill-opacity:1;stroke:none;stroke-width:3.21675134;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect889"
width="358.14117"
height="61.471989"
x="-439.20023"
y="-45.422646" />
<path
style="fill:#8edf00;fill-opacity:1;stroke:none;stroke-width:2.95813155;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="M -140.35948,443.67592 V -32.26031 h 48.108507 v 380.69043 z"
id="rect815-3"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<path
style="fill:#40a1df;fill-opacity:1;stroke:none;stroke-width:4.41462994;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="m 499.38873,211.71362 v 85.15017 H -99.489909 L 33.124169,211.71362 Z"
id="rect815-7"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<path
style="fill:#40a1df;fill-opacity:1;stroke:none;stroke-width:4.86352921;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="M 189.65881,296.86379 V 151.23743 H 614.6684 l -94.11299,145.62636 z"
id="rect815-7-5"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.8 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 248 KiB

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 41 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 175 KiB

After

Width:  |  Height:  |  Size: 130 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 163 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 MiB

@ -1,95 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg8"
version="1.1"
viewBox="0 0 492.12501 259.29166"
height="980"
width="1860"
sodipodi:docname="nosaltres-bg.svg"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1868"
inkscape:window-height="1016"
id="namedview871"
showgrid="false"
inkscape:zoom="1.0066768"
inkscape:cx="166.86779"
inkscape:cy="142.05353"
inkscape:window-x="52"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="layer1"
showguides="true"
inkscape:guide-bbox="true">
<sodipodi:guide
position="110.95114,4.0886518"
orientation="0,1"
id="guide2387"
inkscape:locked="false" />
</sodipodi:namedview>
<defs
id="defs2" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
transform="translate(0,-37.708343)"
id="layer1">
<path
id="rect815"
d="M 445.13863,269.65543 V 293.3209 H 12.114121 l 46.523826,-23.66547 z"
style="fill:#40a1df;fill-opacity:1;stroke:none;stroke-width:1.90506768;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<path
id="rect815-6"
d="m 10.529424,477.21129 h 48.1085 V 269.70807 l -48.1085,23.21158 z"
style="fill:#df0094;fill-opacity:1;stroke:none;stroke-width:2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<rect
y="751.36859"
x="160.19502"
height="32.663315"
width="166.77618"
id="rect889"
style="fill:#df0094;fill-opacity:1;stroke:none;stroke-width:1.60010636;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
transform="rotate(-90)" />
<path
style="fill:#8edf00;fill-opacity:1;stroke:none;stroke-width:2.16944337;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="m 444.41441,-363.9529 0.14884,36.98168 h 339.46866 l -33.59964,-36.98168 z"
id="rect815-35"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
<path
style="fill:#8edf00;fill-opacity:1;stroke:none;stroke-width:2.16944385;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="m 482.12029,-46.296601 -36.98167,0.14884 10e-6,339.468661 36.98166,-23.64404 z"
id="rect815-35-3"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccc" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 335 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.5 MiB

After

Width:  |  Height:  |  Size: 335 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.6 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 144 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 135 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 218 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 288 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 KiB

@ -1,232 +1,250 @@
function ContactForm($el) {
var self = this;
this.fields = Array.apply(null, $el.getElementsByClassName("contact__field"));
this.fields.forEach(function(el) {
Object.defineProperty(el, "warn", {
set: function(message) {
var input = el.getElementsByTagName("input")[0] || el.getElementsByTagName("textarea")[0];
var help = el.getElementsByClassName("help")[0];
if (!message) {
input.classList.remove("is-warning");
help.classList.remove("is-warning");
help.innerText = "";
} else {
input.classList.add("is-warning");
help.classList.add("is-warning");
input.classList.remove("is-success");
help.classList.remove("is-success");
help.innerText = message;
}
}
});
Object.defineProperty(el, "success", {
set: function(message) {
var input = el.getElementsByTagName("input")[0] || el.getElementsByTagName("textarea")[0];
var help = el.getElementsByClassName("help")[0];
if (!message) {
help.classList.remove("is-success");
help.innerText = "";
} else {
input.classList.add("is-success");
help.classList.add("is-success");
input.classList.remove("is-warning");
help.classList.remove("is-warning");
help.innerText = message;
}
}
});
});
this.inputs = this.fields.map(function(el) {
return Array.apply(null, el.getElementsByTagName("input"))
.concat(Array.apply(null, el.getElementsByTagName("textarea")));
});
this.submitBtn = $el.getElementsByClassName("contact__submit-field")[0]
.getElementsByTagName("button")[0];
this.submit = this.submit.bind(this);
this.onSent = this.onSent.bind(this);
this.submitBtn.addEventListener("click", function(ev) {
ev.stopPropagation();
ev.preventDefault();
self.submit(ev)
.then(self.onSent)
.catch(function(err) {
console.error(err);
});
});
for (var i = 0; i < this.inputs.length; i++) {
for (var j = 0; j < this.inputs[i].length; j++) {
var input = this.inputs[i][j];
switch (input.type) {
case "text":
this.bindText(input, i);
break;
case "email":
this.bindEmail(input, i);
break;
case "radio":
this.bindRadio(input, i);
break;
case "checkbox":
this.bindCheckbox(input, i);
break;
default:
this.bindText(input, i);
}
var self = this;
this.fields = Array.apply(null, $el.getElementsByClassName("contact__field"));
this.fields.forEach(function (el) {
Object.defineProperty(el, "warn", {
set: function (message) {
var input =
el.getElementsByTagName("input")[0] ||
el.getElementsByTagName("textarea")[0];
var help = el.getElementsByClassName("help")[0];
if (!message) {
input.classList.remove("is-warning");
help.classList.remove("is-warning");
help.innerText = "";
} else {
input.classList.add("is-warning");
help.classList.add("is-warning");
input.classList.remove("is-success");
help.classList.remove("is-success");
help.innerText = message;
}
}
Object.defineProperty(this, "values", {
get: function() {
return self.fields.reduce(function(acum, el, i) {
acum[el.id.replace(/^contact/, "").toLowerCase()] = {
value: el._value,
required: el.hasAttribute("required")
};
return acum;
}, {});
},
});
Object.defineProperty(el, "success", {
set: function (message) {
var input =
el.getElementsByTagName("input")[0] ||
el.getElementsByTagName("textarea")[0];
var help = el.getElementsByClassName("help")[0];
if (!message) {
help.classList.remove("is-success");
help.innerText = "";
} else {
input.classList.add("is-success");
help.classList.add("is-success");
input.classList.remove("is-warning");
help.classList.remove("is-warning");
help.innerText = message;
}
},
});
});
this.notification = $el.getElementsByClassName("contact__notification")[0];
this.notification.getElementsByClassName("delete")[0].addEventListener("click", function() {
self.notification.classList.add("is-hidden");
});
}
this.inputs = this.fields.map(function (el) {
return Array.apply(null, el.getElementsByTagName("input")).concat(
Array.apply(null, el.getElementsByTagName("textarea"))
);
});
ContactForm.prototype.bindInput = function(input, fieldIdx, callback) {
var self = this;
this.submitBtn = $el
.getElementsByClassName("contact__submit-field")[0]
.getElementsByTagName("button")[0];
function onInput(ev) {
var field = self.fields[fieldIdx];
try {
field.warn = null;
field._value = callback(ev);
} catch (err) {
field.warn = err.message;
}
this.submit = this.submit.bind(this);
this.onSent = this.onSent.bind(this);
this.submitBtn.addEventListener("click", function (ev) {
ev.stopPropagation();
ev.preventDefault();
self
.submit(ev)
.then(self.onSent)
.catch(function (err) {
console.error(err);
});
});
for (var i = 0; i < this.inputs.length; i++) {
for (var j = 0; j < this.inputs[i].length; j++) {
var input = this.inputs[i][j];
switch (input.type) {
case "text":
this.bindText(input, i);
break;
case "email":
this.bindEmail(input, i);
break;
case "radio":
this.bindRadio(input, i);
break;
case "checkbox":
this.bindCheckbox(input, i);
break;
default:
this.bindText(input, i);
}
}
input.addEventListener("input", onInput);
}
ContactForm.prototype.bindText = function(input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function() {
if (input.value === "" && self.fields[fieldIdx].hasAttribute("required")) {
throw new Error("Aquest camp és obligatori");
}
return input.value
}
Object.defineProperty(this, "values", {
get: function () {
return self.fields.reduce(function (acum, el, i) {
acum[el.id.replace(/^contact/, "").toLowerCase()] = {
value: el._value,
required: el.hasAttribute("required"),
};
return acum;
}, {});
},
});
this.notification = $el.getElementsByClassName("contact__notification")[0];
this.notification
.getElementsByClassName("delete")[0]
.addEventListener("click", function () {
self.notification.classList.add("is-hidden");
});
}
ContactForm.prototype.bindEmail = function(input, fieldIdx) {
var self = this;
var validationRe = /^[a-zA-Z0-9\.]+@[a-zA-Z0-9_\.]+?\.(?=[a-zA-Z]+)[a-zA-Z]{2,}$/;
this.bindInput(input, fieldIdx, function() {
var field = self.fields[fieldIdx];
if (!input.value.match(validationRe)) {
field.success = null;
throw new Error("Correu electrònic no vàlid");
} else if (input.value === "") {
field.success = null;
throw new Error("Aquest camp és obligatori");
}
field.success = "Correu electrònic validat";
return input.value;
});
}
ContactForm.prototype.bindInput = function (input, fieldIdx, callback) {
var self = this;
ContactForm.prototype.bindCheckbox = function(input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function() {
var field = self.fields[fieldIdx]
if (field._value && !input.checked && field.hasAttribute("required")) {
throw new Error("Aquest camp és obligatori");
}
function onInput(ev) {
var field = self.fields[fieldIdx];
try {
field.warn = null;
field._value = callback(ev);
} catch (err) {
field.warn = err.message;
}
}
return input.checked;
});
}
input.addEventListener("input", onInput);
};
ContactForm.prototype.bindRadio = function(input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function() {
return input.value === "true" || input.value === "1";
});
}
ContactForm.prototype.bindText = function (input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function () {
if (input.value === "" && self.fields[fieldIdx].hasAttribute("required")) {
throw new Error("Aquest camp és obligatori");
}
return input.value;
});
};
ContactForm.prototype.bindEmail = function (input, fieldIdx) {
var self = this;
var validationRe =
/^[a-zA-Z0-9\.]+@[a-zA-Z0-9_\.]+?\.(?=[a-zA-Z]+)[a-zA-Z]{2,}$/;
this.bindInput(input, fieldIdx, function () {
var field = self.fields[fieldIdx];
if (!input.value.match(validationRe)) {
field.success = null;
throw new Error("Correu electrònic no vàlid");
} else if (input.value === "") {
field.success = null;
throw new Error("Aquest camp és obligatori");
}
ContactForm.prototype.submit = function(ev) {
ev.preventDefault();
ev.stopPropagation();
field.success = "Correu electrònic validat";
return input.value;
});
};
ContactForm.prototype.bindCheckbox = function (input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function () {
var field = self.fields[fieldIdx];
if (field._value && !input.checked && field.hasAttribute("required")) {
throw new Error("Aquest camp és obligatori");
}
var self = this;
var values = this.values;
return new Promise(function(res, rej) {
var isFullfilled = Object.keys(values).reduce(function(isFullfilled, key) {
var isValid = (values[key].value !== void 0 && values[key].value !== "") || values[key].required !== true;
if (!isValid) {
var field = self.fields.find(function(el) {
return el.id === "contact" + key[0].toUpperCase() + key.slice(1);
});
field.warn = "Aquest camp és obligatori";
}
return isFullfilled && isValid;
}, true);
if (isFullfilled) {
var form = Object.keys(values).map(function(key) {
var value = values[key].value === true ? 1 : values[key].value === false ? 0 : values[key].value;
return encodeURIComponent(key) + "=" + encodeURIComponent(value);
}).join("&");
var req = new XMLHttpRequest();
req.onreadystatechange = function() {
if (this.readyState === 4) {
if (this.status === 200) {
res(JSON.parse(this.responseText));
} else {
rej({
status: this.status,
text: this.responseText
});
}
}
}
req.onerror = function() {
rej({
status: this.status,
text: this.responseText
});
}
req.open("POST", "https://codeccoop.org/api/email_form.php");
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
req.setRequestHeader("Accept", "application/json");
req.send(form);
} else {
rej("Not fullfilled");
return input.checked;
});
};
ContactForm.prototype.bindRadio = function (input, fieldIdx) {
var self = this;
this.bindInput(input, fieldIdx, function () {
return input.value === "true" || input.value === "1";
});
};
ContactForm.prototype.submit = function (ev) {
ev.preventDefault();
ev.stopPropagation();
var self = this;
var values = this.values;
return new Promise(function (res, rej) {
var isFullfilled = Object.keys(values).reduce(function (isFullfilled, key) {
var isValid =
(values[key].value !== void 0 && values[key].value !== "") ||
values[key].required !== true;
if (!isValid) {
var field = self.fields.find(function (el) {
return el.id === "contact" + key[0].toUpperCase() + key.slice(1);
});
field.warn = "Aquest camp és obligatori";
}
return isFullfilled && isValid;
}, true);
if (isFullfilled) {
var form = Object.keys(values)
.map(function (key) {
var value =
values[key].value === true
? 1
: values[key].value === false
? 0
: values[key].value;
return encodeURIComponent(key) + "=" + encodeURIComponent(value);
})
.join("&");
var req = new XMLHttpRequest();
req.onreadystatechange = function () {
if (this.readyState === 4) {
if (this.status === 200) {
res(JSON.parse(this.responseText));
} else {
rej({
status: this.status,
text: this.responseText,
});
}
}
});
}
};
ContactForm.prototype.onSent = function(res) {
if (res.success) {
this.inputs.forEach(function(inputs) {
inputs.forEach(function(input) {
input.value = "";
input.checked = false;
});
req.onerror = function () {
rej({
status: this.status,
text: this.responseText,
});
this.notification.classList.remove("is-hidden");
};
req.open("POST", "https://codeccoop.org/api/email_form.php");
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
req.setRequestHeader("Accept", "application/json");
req.send(form);
} else {
rej("Not fullfilled");
}
}
});
};
ContactForm.prototype.onSent = function (res) {
if (res.success) {
this.inputs.forEach(function (inputs) {
inputs.forEach(function (input) {
input.value = "";
input.checked = false;
});
});
this.notification.classList.remove("is-hidden");
}
};

@ -1,5 +1,6 @@
document.addEventListener("DOMContentLoaded", function() {
var $el = document.getElementById("pageFooter") || document.getElementById("contact");
(function () {
var $el =
document.getElementById("pageFooter") || document.getElementById("contact");
var contactForm = new ContactForm($el);
});
var contactForm = new ContactForm($el);
})();

@ -1,116 +1,121 @@
document.addEventListener("DOMContentLoaded", function() {
var $el = document.getElementById("pageHeader");
var burger = document.querySelectorAll(".navbar-burger")[0];
(function () {
var $el = document.getElementById("pageHeader");
var burger = document.querySelectorAll(".navbar-burger")[0];
burger.addEventListener("click", function() {
if (!burger.classList.contains("is-active")) {
var targetId = burger.dataset.target;
var targetEl = document.getElementById(targetId);
burger.addEventListener("click", function () {
if (!burger.classList.contains("is-active")) {
var targetId = burger.dataset.target;
var targetEl = document.getElementById(targetId);
burger.classList.add("is-active");
targetEl.classList.add("is-active");
document.addEventListener("click", onClickOut, true);
}
});
burger.classList.add("is-active");
targetEl.classList.add("is-active");
document.addEventListener("click", onClickOut, true);
}
});
function onClickOut(ev) {
if (!$el.contains(ev.target)) {
ev.preventDefault();
}
function onClickOut(ev) {
if (!$el.contains(ev.target)) {
ev.preventDefault();
}
ev.stopPropagation();
burger.classList.remove("is-active");
document
.getElementById(burger.dataset.target)
.classList.remove("is-active");
document.removeEventListener("click", onClickOut, true);
ev.stopPropagation();
burger.classList.remove("is-active");
document
.getElementById(burger.dataset.target)
.classList.remove("is-active");
document.removeEventListener("click", onClickOut, true);
if (!isMobile()) {
scrollNavHandler(ev);
}