commit fca2e8a6efecc660429ed90ce1ad42063f24cb76 Author: Lukáš Hozda Date: Sun Feb 2 23:30:40 2020 +0100 initial commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..8ad7421 --- /dev/null +++ b/README.md @@ -0,0 +1,52 @@ +[Bodoni*](http://indestructibletype.com/Bodoni.html) +======== +![Bodoni* Picture](https://indestructibletype.com/assets/BodoniAbout.svg) +Bodoni* is an original font created by [indestructible type*](https://indestructibletype.com/Home.html). It is inspired by +the designs of Giambattista Bodoni. This is version 2.0. + +Bodoni* is designed and maintained by [Owen Earl](https://ewonrael.github.io/), who is the creator of the font foundry [indestructible type*](http://indestructible-type.github.io). + +About +----- +Despite the tremendous popularity of Bodoni typefaces, there is currently no digital family without compromises. +Bodoni* hopes to change that by being the first ever no-compromises Bodoni family, built for the digital age. +This font family includes a full range of weights, italics, an extended character set, OpenType features, and optical sizes, +totalling 64 font files. It was made with love and will continue to improve with your support. +[Visit the website for more information!](http://indestructibletype.com/Bodoni) + +![Bodoni* weights Picture](https://indestructibletype.com/Bodoni/weight.svg) +![Bodoni* points Picture](https://indestructibletype.com/Bodoni/points.svg) + +Changelog +--------- +1.0 +First Release.
+1.1 +Fixed italic fl and ffi ligatures
+1.2 +Corrected metadata to include better style links and include ligatures in .ttf files.
+2.0 +Created 6 pt. size and variable font versions. + +Web Use +------- +To use on your webpage, simply put the following line of code into the `` of the webpage you'd like to display Bodoni* and use `font-family: 'Bodoni* 11';` in your css. Make sure to replace 11 with the optical size of your choosing.
+`` + +Building +-------- +I use fontmake to build the finished font files. If for some reason you want to build this font yourself, follow these steps: + +Download the complete source code, either by cloning this repository or downloading the .zip file. + +Download and install fontmake which can be found [here](https://github.com/googlei18n/fontmake). + +Run the `fontmake.sh` script found in the "scripts" folder. + +This should output two folders, an otf and ttf folder. + +Run the `hinting.sh` script found in the "scripts" folder to make hinted versions of the ttf files. + +Contact +------- +If you have questions or want to help out, send me and email at indestructibletype@gmail.com diff --git a/app.riot b/app.riot new file mode 100644 index 0000000..b782339 --- /dev/null +++ b/app.riot @@ -0,0 +1,17 @@ + + + index + + + predseda + + + prebiram_spolek + + + zapojit_se + + + zalozit + + diff --git a/css/carousel.css b/css/carousel.css new file mode 100644 index 0000000..8def41d --- /dev/null +++ b/css/carousel.css @@ -0,0 +1,104 @@ + +* {box-sizing:border-box} + +/* Slideshow container */ +.slideshow-container { + max-width: 1000px; + position: relative; + margin: auto; +} + +/* Hide the images by default */ +.mySlides { + display: none; +} + +/* Next & previous buttons */ +.prev, .next { + cursor: pointer; + position: absolute; + top: 40%; + width: auto; + margin-top: -22px; + padding: 16px; + color: var(--color-primary); + font-weight: bold; + font-size: calc(var(--font-size) * 2); + transition: 0.6s ease; + border-radius: 0 3px 3px 0; + user-select: none; +} + +/* Position the "next button" to the right */ +.next { + right: -9vw; + border-radius: 3px 0 0 3px; +} + +.prev { + left: -9vw +} + +/* On hover, add a black background color with a little bit see-through */ +.prev:hover, .next:hover { + filter: brightness(50%); +} + +/* Caption text */ +.text { + color: #f2f2f2; + font-size: 15px; + padding: 8px 12px; + position: absolute; + bottom: 8px; + width: 100%; + text-align: center; +} + +/* Number text (1/3 etc) */ +.numbertext { + color: #f2f2f2; + font-size: 12px; + padding: 8px 12px; + position: absolute; + top: 0; +} + +/* The dots/bullets/indicators */ +.dot { + cursor: pointer; + height: 1.5vw; + width: 1.5vw; + margin: 0 2px; + background-color: #fff; + border-radius: 50%; + border-size: 0.05vw; + border: solid; + border-color: var(--color-primary); + display: inline-block; + transition: background-color 0.6s ease; +} + +.carousel-active, .dot:hover { + background-color: var(--color-primary); +} + +/* Fading animation */ +.fade { + -webkit-animation-name: fade; + -webkit-animation-duration: 1.5s; + animation-name: fade; + animation-duration: 1.5s; +} + +@-webkit-keyframes fade { + from {opacity: .4} + to {opacity: 1} +} + +@keyframes fade { + from {opacity: .4} + to {opacity: 1} +} + + diff --git a/css/chota-master.zip b/css/chota-master.zip new file mode 100644 index 0000000..8864a35 Binary files /dev/null and b/css/chota-master.zip differ diff --git a/css/fonts.css b/css/fonts.css new file mode 100644 index 0000000..69b1211 --- /dev/null +++ b/css/fonts.css @@ -0,0 +1,4 @@ +@font-face { + font-family: 'Gill Sans MT'; + src: url("/fonts/gill-sans-mt.ttf"); +} diff --git a/css/fonts.styl b/css/fonts.styl new file mode 100644 index 0000000..4ee4559 --- /dev/null +++ b/css/fonts.styl @@ -0,0 +1,4 @@ +@font-face + font-family: 'Gill Sans MT' + src: url("/fonts/gill-sans-mt.ttf") + diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..40eb32b --- /dev/null +++ b/css/main.css @@ -0,0 +1,243 @@ +@import "/css/fonts.css"; +html, +body, +.navigation-overlay { + min-height: 100vh; + min-width: 100vw; +} +body > canvas { + position: fixed; + height: 100vh; + width: 100vw; + left: 0; + top: 0; + z-index: -2; +} +.navigation-overlay { + position: absolute; + transition: 0.7s; + opacity: 0; + z-index: -1000; +} +.open-nav { + opacity: 1; + z-index: 1000; +} +.cross { + cursor: pointer; + position: absolute; + left: 2vh; + top: 2vh; +} +.cross .idle { + opacity: 1; + position: absolute; + left: 0; + transition: 0.5s; +} +.cross .active { + opacity: 0; + position: absolute; + left: 0; + transition: 0.5s; +} +.cross img { + max-width: inherit; +} +.cross:hover .active { + opacity: 1; +} +.cross:hover .idle { + opacity: 0; +} +.menu-btn { + left: 3vh; + top: 3vh; +} +.logo { + position: absolute; + right: 3vh; + top: 3vh; + cursor: pointer; + transition: 0.2s; +} +.logo:hover { + transform: scale(1.15); +} +.menu { + position: absolute; + left: 40vh; + top: 20vh; +} +.menu ul { + list-style: none; +} +.menu ul li { + font-family: "Gill Sans MT"; + font-size: 5vh; + margin-bottom: 5vh; +} +.menu ul li a { + cursor: pointer; + color: #d73648; + transition: 0.3s; + text-decoration: none; +} +.menu ul li a:hover { + text-decoration: underline; + color: #7c242e; +} +#root { + transition: 0.6s; + min-height: 100vh; + min-width: 100vw; +} +#root canvas { + position: absolute; + left: 0; + top: 0; + width: 100vw; + height: 100vh; + z-index: -1; +} +:root { + --color-primary: #d73648; + --color-lightGrey: #d2d6dd; + --color-grey: #747681; + --color-darkGrey: #3f4144; + --color-error: #d43939; + --color-success: #28bd14; + --grid-maxWidth: 120rem; + --grid-gutter: 2rem; + --font-size: 2.5vw; + --font-family: "Gill Sans MT", sans-serif; +} +.darken { + opacity: 0; + z-index: -1; +} +.fullheight { + width: 100vw; + height: 100vh; +} +.cool-button { + padding: 3rem 9rem; + font-size: calc(var(--font-size) * 0.7); +} +.horizontal-menu { + font-size: calc(var(--font-size) / 2); + position: absolute; + display: flex; + bottom: 5vh; + left: 0; + padding-left: 8vw; + padding-right: 8vw; + width: 100%; + box-sizing: border-box; + justify-content: space-between; + flex-direction: row; + align-items: baseline; +} +.horizontal-menu a { + text-decoration: underline; + color: #000; + font-size: calc(var(--font-size) / 2.4); + cursor: pointer; + transition: 0.2s; +} +.horizontal-menu a:hover { + color: var(--color-primary); +} +.up-arrow { + position: fixed; + top: 80vh; + right: 5vw; + cursor: pointer; +} +.gay-hr { + width: 10vw; + height: 0.6vh; + background-color: var(--color-primary); + border-radius: 0.3vh; +} +.bg-circle { + background-image: url("/svg/bg-circle.svg"); + background-size: contain; + background-repeat: no-repeat; + background-position: center center; +} +.bg-square { + background-image: url("/svg/bg-square.svg"); + background-repeat: no-repeat; + background-position: top right; +} +.smol-video { + width: 42vw; +} +.flexy-boi { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + line-height: 1; +} +.side-line { + display: flex; + flex-direction: row; +} +.side-line::before { + content: ""; + display: inline; + margin-right: 1vw; + box-sizing: border-box; + border: solid 0.125vw var(--color-primary); + border-radius: 0.125vw; +} +.number-gay { + display: flex; + flex-direction: row; + align-items: center; + line-height: 1; + margin-bottom: 4vh; + margin-right: 2vw; + margin-left: 2vw; + margin-top: 8vh; +} +.number-gay span { + color: var(--color-primary); + font-size: calc(var(--font-size) * 2.2); +} +.number-gay p { + font-size: calc(var(--font-size) / 2.3); + margin-bottom: 0; +} +.number-gay li { + font-size: calc(var(--font-size) / 2.6); +} +.number-gay ol { + margin-top: 0; + margin-left: 2vw; +} +.number-gay ol li { + counter-increment: list; + list-style-type: none; + position: relative; +} +.number-gay ol li:before { + font-size: 110%; + font-weight: 900; + color: var(--color-primary); + content: counter(list, lower-alpha) ") "; +} +.row { + width: 100vw; +} +.down { + display: flex; + flex-direction: column; +} +.right { + align-items: center; + display: flex; + flex-direction: row; +} diff --git a/css/main.styl b/css/main.styl new file mode 100644 index 0000000..9e92230 --- /dev/null +++ b/css/main.styl @@ -0,0 +1,224 @@ +@import "/css/fonts.css"; + +html, body, .navigation-overlay + min-height: 100vh + min-width: 100vw + +body > canvas + position: fixed + height: 100vh + width: 100vw + left: 0 + top: 0 + z-index -2 + +.navigation-overlay + position absolute + transition: .7s; + opacity 0 + z-index -1000 + +.open-nav + opacity 1 + z-index 1000 + +.cross + cursor pointer + position absolute + + left 2vh + top 2vh + .idle + opacity: 1 + position: absolute + left: 0 + transition: .5s + .active + opacity: 0 + position: absolute + left: 0 + transition: .5s + img + max-width: inherit + &:hover .active + opacity: 1 + &:hover .idle + opacity: 0 + +.menu-btn + left 3vh + top 3vh + +.logo + position absolute + right: 3vh + top: 3vh + cursor: pointer + transition: .2s + &:hover + transform: scale(1.15) + +.menu + position absolute + left: 40vh + top: 20vh + ul + list-style none + li + font-family "Gill Sans MT" + font-size 5vh + margin-bottom: 5vh; + a + cursor pointer + color #D73648 + transition .3s + text-decoration none + &:hover + text-decoration underline + color #7C242E + +#root + transition .6s + min-height 100vh + min-width 100vw + & canvas + position: absolute + left: 0 + top: 0 + width: 100vw + height: 100vh + z-index -1 + + +:root + --color-primary: #D73648 + --color-lightGrey: #d2d6dd + --color-grey: #747681 + --color-darkGrey: #3f4144 + --color-error: #d43939 + --color-success: #28bd14 + --grid-maxWidth: 120rem + --grid-gutter: 2rem + --font-size: 2.5vw + --font-family: "Gill Sans MT", sans-serif + +.darken + opacity: 0 + z-index: -1 + +.fullheight + width: 100vw + height: 100vh + +.cool-button + padding: 3rem 9rem + font-size: calc(var(--font-size) * 0.7) + +.horizontal-menu + font-size calc(var(--font-size) / 2) + position: absolute + display: flex + bottom: 5vh + left: 0 + padding-left: 8vw + padding-right: 8vw + width: 100% + box-sizing: border-box + justify-content space-between + flex-direction row + align-items baseline + & a + text-decoration underline + color: #000 + font-size calc(var(--font-size) / 2.4) + cursor pointer + transition .2s + &:hover + color: var(--color-primary) + +.up-arrow + position: fixed + top: 80vh + right: 5vw + cursor: pointer + +.gay-hr + width: 10vw; + height: 0.6vh; + background-color: var(--color-primary); + border-radius: 0.3vh + +.bg-circle + background-image: url("/svg/bg-circle.svg") + background-size: contain + background-repeat: no-repeat + background-position: center center + +.bg-square + background-image: url("/svg/bg-square.svg") + background-repeat: no-repeat + background-position: top right + +.smol-video + width: 42vw + +.flexy-boi + display: flex + align-items: center + justify-content: center + flex-direction column + line-height 1 + +.side-line + display flex + flex-direction row + +.side-line::before + content: "" + display: inline + margin-right 1vw + box-sizing: border-box + border: solid 0.125vw var(--color-primary) + border-radius: 0.125vw + +.number-gay + display flex + flex-direction row + align-items center + line-height 1 + margin-bottom: 4vh + margin-right: 2vw + margin-left: 2vw + margin-top: 8vh + & span + color var(--color-primary) + font-size calc(var(--font-size) * 2.2) + & p + font-size calc(var(--font-size) / 2.3) + margin-bottom 0 + & li + font-size calc(var(--font-size) / 2.6) + & ol + margin-top 0 + margin-left 2vw + & li + counter-increment: list + list-style-type: none; + position: relative; + &:before + font-size 110% + font-weight 900 + color: var(--color-primary); + content: counter(list, lower-alpha) ") "; + +.row + width: 100vw + +.down + display flex + flex-direction column + +.right + align-items center + display flex + flex-direction row diff --git a/css/normalize.css b/css/normalize.css new file mode 100644 index 0000000..192eb9c --- /dev/null +++ b/css/normalize.css @@ -0,0 +1,349 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers. + */ + +body { + margin: 0; +} + +/** + * Render the `main` element consistently in IE. + */ + +main { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Remove the gray background on active links in IE 10. + */ + +a { + background-color: transparent; +} + +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove the border on images inside links in IE 10. + */ + +img { + border-style: none; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ + text-transform: none; +} + +/** + * Correct the inability to style clickable types in iOS and Safari. + */ + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + vertical-align: baseline; +} + +/** + * Remove the default vertical scrollbar in IE 10+. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ + +details { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Misc + ========================================================================== */ + +/** + * Add the correct display in IE 10+. + */ + +template { + display: none; +} + +/** + * Add the correct display in IE 10. + */ + +[hidden] { + display: none; +} diff --git a/fonts/Bodoni* variare Italic.ttf b/fonts/Bodoni* variare Italic.ttf new file mode 100644 index 0000000..ea8eaa2 Binary files /dev/null and b/fonts/Bodoni* variare Italic.ttf differ diff --git a/fonts/Bodoni* variare.ttf b/fonts/Bodoni* variare.ttf new file mode 100644 index 0000000..4261479 Binary files /dev/null and b/fonts/Bodoni* variare.ttf differ diff --git a/fonts/Helvetica Neu Bold.ttf b/fonts/Helvetica Neu Bold.ttf new file mode 100644 index 0000000..9aa746a Binary files /dev/null and b/fonts/Helvetica Neu Bold.ttf differ diff --git a/fonts/HelveticaNeue BlackCond.ttf b/fonts/HelveticaNeue BlackCond.ttf new file mode 100644 index 0000000..5c55810 Binary files /dev/null and b/fonts/HelveticaNeue BlackCond.ttf differ diff --git a/fonts/HelveticaNeue Light.ttf b/fonts/HelveticaNeue Light.ttf new file mode 100644 index 0000000..7e9b412 Binary files /dev/null and b/fonts/HelveticaNeue Light.ttf differ diff --git a/fonts/HelveticaNeue Medium.ttf b/fonts/HelveticaNeue Medium.ttf new file mode 100644 index 0000000..373e545 Binary files /dev/null and b/fonts/HelveticaNeue Medium.ttf differ diff --git a/fonts/HelveticaNeue Thin.ttf b/fonts/HelveticaNeue Thin.ttf new file mode 100644 index 0000000..5250b69 Binary files /dev/null and b/fonts/HelveticaNeue Thin.ttf differ diff --git a/fonts/HelveticaNeue.ttf b/fonts/HelveticaNeue.ttf new file mode 100644 index 0000000..db3ad30 Binary files /dev/null and b/fonts/HelveticaNeue.ttf differ diff --git a/fonts/HelveticaNeueBd.ttf b/fonts/HelveticaNeueBd.ttf new file mode 100644 index 0000000..772ab3d Binary files /dev/null and b/fonts/HelveticaNeueBd.ttf differ diff --git a/fonts/HelveticaNeueHv.ttf b/fonts/HelveticaNeueHv.ttf new file mode 100644 index 0000000..28b1ffc Binary files /dev/null and b/fonts/HelveticaNeueHv.ttf differ diff --git a/fonts/HelveticaNeueIt.ttf b/fonts/HelveticaNeueIt.ttf new file mode 100644 index 0000000..f0de745 Binary files /dev/null and b/fonts/HelveticaNeueIt.ttf differ diff --git a/fonts/HelveticaNeueLt.ttf b/fonts/HelveticaNeueLt.ttf new file mode 100644 index 0000000..b3f384d Binary files /dev/null and b/fonts/HelveticaNeueLt.ttf differ diff --git a/fonts/HelveticaNeueMed.ttf b/fonts/HelveticaNeueMed.ttf new file mode 100644 index 0000000..4afb920 Binary files /dev/null and b/fonts/HelveticaNeueMed.ttf differ diff --git a/fonts/gill-sans-mt.ttf b/fonts/gill-sans-mt.ttf new file mode 100644 index 0000000..bb58254 Binary files /dev/null and b/fonts/gill-sans-mt.ttf differ diff --git a/img/1566501668807.webm b/img/1566501668807.webm new file mode 100644 index 0000000..0ac57da Binary files /dev/null and b/img/1566501668807.webm differ diff --git a/img/logo.png b/img/logo.png new file mode 100644 index 0000000..5e43ca3 Binary files /dev/null and b/img/logo.png differ diff --git a/img/trump.jpg b/img/trump.jpg new file mode 100644 index 0000000..02f7aaf Binary files /dev/null and b/img/trump.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..125db02 --- /dev/null +++ b/index.html @@ -0,0 +1,81 @@ + + + + + + + + + + + + + + + + + + +
+
+ +
+ +
+ + + clicking on ".cross-og" removes class "open-nav" on ".navigation-overlay" + clicking on ".cross-og" removes class "darken" on "#root" + clicking on ".menu-link" removes class "open-nav" on ".navigation-overlay" no-prevent + clicking on ".menu-btn" adds class "open-nav" on ".navigation-overlay" + clicking on ".menu-btn" adds class "darken" on "#root" + + + + + + + + + + + + + + + + diff --git a/js/carousel.js b/js/carousel.js new file mode 100644 index 0000000..83d6ac0 --- /dev/null +++ b/js/carousel.js @@ -0,0 +1,49 @@ +function rafAsync() { + return new Promise(resolve => { + requestAnimationFrame(resolve); //faster than set time out + }); +} + + +function checkElement(selector) { + if (document.querySelector(selector) === null) { + return rafAsync().then(() => checkElement(selector)); + } else { + return Promise.resolve(true); + } +} + +var slideIndex = 1; + + +// Next/previous controls +function plusSlides(n) { + showSlides(slideIndex += n); +} + +// Thumbnail image controls +function currentSlide(n) { + showSlides(slideIndex = n); +} + +function showSlides(n) { + var i; + var slides = document.getElementsByClassName("mySlides"); + var dots = document.getElementsByClassName("dot"); + if (n > slides.length) {slideIndex = 1} + if (n < 1) {slideIndex = slides.length} + for (i = 0; i < slides.length; i++) { + slides[i].style.display = "none"; + } + for (i = 0; i < dots.length; i++) { + dots[i].className = dots[i].className.replace(" carousel-active", ""); + } + slides[slideIndex-1].style.display = "block"; + dots[slideIndex-1].className += " carousel-active"; +} + +checkElement('.mySlides') //use whichever selector you want +.then((element) => { + console.log("sldaldsaldsa"); + showSlides(slideIndex); +}); diff --git a/js/particles.js b/js/particles.js new file mode 100644 index 0000000..4b51c10 --- /dev/null +++ b/js/particles.js @@ -0,0 +1,1551 @@ +/* ----------------------------------------------- +/* Author : Vincent Garreau - vincentgarreau.com +/* MIT license: http://opensource.org/licenses/MIT +/* Demo / Generator : vincentgarreau.com/particles.js +/* GitHub : github.com/VincentGarreau/particles.js +/* How to use? : Check the GitHub README +/* v2.0.0 +/* ----------------------------------------------- */ + +var pJS = function(tag_id, params){ + + var canvas_el = document.querySelector('#'+tag_id+' > .particles-js-canvas-el'); + + /* particles.js variables with default values */ + this.pJS = { + canvas: { + el: canvas_el, + w: canvas_el.offsetWidth, + h: canvas_el.offsetHeight + }, + particles: { + number: { + value: 400, + density: { + enable: true, + value_area: 800 + } + }, + color: { + value: '#fff' + }, + shape: { + type: 'circle', + stroke: { + width: 0, + color: '#ff0000' + }, + polygon: { + nb_sides: 5 + }, + image: { + src: '', + width: 100, + height: 100, + replace_color: true + } + }, + opacity: { + value: 1, + random: false, + anim: { + enable: false, + speed: 2, + opacity_min: 0, + sync: false + } + }, + size: { + value: 20, + random: false, + anim: { + enable: false, + speed: 20, + size_min: 0, + sync: false + } + }, + line_linked: { + enable: true, + distance: 100, + color: '#fff', + opacity: 1, + width: 1 + }, + move: { + enable: true, + speed: 2, + direction: 'none', + random: false, + straight: false, + out_mode: 'out', + bounce: false, + attract: { + enable: false, + rotateX: 3000, + rotateY: 3000 + } + }, + array: [] + }, + interactivity: { + detect_on: 'canvas', + events: { + onhover: { + enable: true, + mode: 'grab' + }, + onclick: { + enable: true, + mode: 'push' + }, + resize: true + }, + modes: { + grab:{ + distance: 100, + line_linked:{ + opacity: 1 + } + }, + bubble:{ + distance: 200, + size: 80, + duration: 0.4 + }, + repulse:{ + distance: 200, + duration: 0.4 + }, + push:{ + particles_nb: 4 + }, + remove:{ + particles_nb: 2 + } + }, + mouse:{} + }, + retina_detect: false, + fn: { + interact: {}, + modes: {}, + vendors:{} + }, + tmp: {} + }; + + var pJS = this.pJS; + + /* params settings */ + if(params){ + Object.deepExtend(pJS, params); + } + + pJS.tmp.obj = { + size_value: pJS.particles.size.value, + size_anim_speed: pJS.particles.size.anim.speed, + move_speed: pJS.particles.move.speed, + line_linked_distance: pJS.particles.line_linked.distance, + line_linked_width: pJS.particles.line_linked.width, + mode_grab_distance: pJS.interactivity.modes.grab.distance, + mode_bubble_distance: pJS.interactivity.modes.bubble.distance, + mode_bubble_size: pJS.interactivity.modes.bubble.size, + mode_repulse_distance: pJS.interactivity.modes.repulse.distance + }; + + + pJS.fn.retinaInit = function(){ + + if(pJS.retina_detect && window.devicePixelRatio > 1){ + pJS.canvas.pxratio = window.devicePixelRatio; + pJS.tmp.retina = true; + } + else{ + pJS.canvas.pxratio = 1; + pJS.tmp.retina = false; + } + + pJS.canvas.w = pJS.canvas.el.offsetWidth * pJS.canvas.pxratio; + pJS.canvas.h = pJS.canvas.el.offsetHeight * pJS.canvas.pxratio; + + pJS.particles.size.value = pJS.tmp.obj.size_value * pJS.canvas.pxratio; + pJS.particles.size.anim.speed = pJS.tmp.obj.size_anim_speed * pJS.canvas.pxratio; + pJS.particles.move.speed = pJS.tmp.obj.move_speed * pJS.canvas.pxratio; + pJS.particles.line_linked.distance = pJS.tmp.obj.line_linked_distance * pJS.canvas.pxratio; + pJS.interactivity.modes.grab.distance = pJS.tmp.obj.mode_grab_distance * pJS.canvas.pxratio; + pJS.interactivity.modes.bubble.distance = pJS.tmp.obj.mode_bubble_distance * pJS.canvas.pxratio; + pJS.particles.line_linked.width = pJS.tmp.obj.line_linked_width * pJS.canvas.pxratio; + pJS.interactivity.modes.bubble.size = pJS.tmp.obj.mode_bubble_size * pJS.canvas.pxratio; + pJS.interactivity.modes.repulse.distance = pJS.tmp.obj.mode_repulse_distance * pJS.canvas.pxratio; + + }; + + + + /* ---------- pJS functions - canvas ------------ */ + + pJS.fn.canvasInit = function(){ + pJS.canvas.ctx = pJS.canvas.el.getContext('2d'); + }; + + pJS.fn.canvasSize = function(){ + + pJS.canvas.el.width = pJS.canvas.w; + pJS.canvas.el.height = pJS.canvas.h; + + if(pJS && pJS.interactivity.events.resize){ + + window.addEventListener('resize', function(){ + + pJS.canvas.w = pJS.canvas.el.offsetWidth; + pJS.canvas.h = pJS.canvas.el.offsetHeight; + + /* resize canvas */ + if(pJS.tmp.retina){ + pJS.canvas.w *= pJS.canvas.pxratio; + pJS.canvas.h *= pJS.canvas.pxratio; + } + + pJS.canvas.el.width = pJS.canvas.w; + pJS.canvas.el.height = pJS.canvas.h; + + /* repaint canvas on anim disabled */ + if(!pJS.particles.move.enable){ + pJS.fn.particlesEmpty(); + pJS.fn.particlesCreate(); + pJS.fn.particlesDraw(); + pJS.fn.vendors.densityAutoParticles(); + } + + /* density particles enabled */ + pJS.fn.vendors.densityAutoParticles(); + + }); + + } + + }; + + + pJS.fn.canvasPaint = function(){ + pJS.canvas.ctx.fillRect(0, 0, pJS.canvas.w, pJS.canvas.h); + }; + + pJS.fn.canvasClear = function(){ + pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h); + }; + + + /* --------- pJS functions - particles ----------- */ + + pJS.fn.particle = function(color, opacity, position){ + + /* size */ + this.radius = (pJS.particles.size.random ? Math.random() : 1) * pJS.particles.size.value; + if(pJS.particles.size.anim.enable){ + this.size_status = false; + this.vs = pJS.particles.size.anim.speed / 100; + if(!pJS.particles.size.anim.sync){ + this.vs = this.vs * Math.random(); + } + } + + /* position */ + this.x = position ? position.x : Math.random() * pJS.canvas.w; + this.y = position ? position.y : Math.random() * pJS.canvas.h; + + /* check position - into the canvas */ + if(this.x > pJS.canvas.w - this.radius*2) this.x = this.x - this.radius; + else if(this.x < this.radius*2) this.x = this.x + this.radius; + if(this.y > pJS.canvas.h - this.radius*2) this.y = this.y - this.radius; + else if(this.y < this.radius*2) this.y = this.y + this.radius; + + /* check position - avoid overlap */ + if(pJS.particles.move.bounce){ + pJS.fn.vendors.checkOverlap(this, position); + } + + /* color */ + this.color = {}; + if(typeof(color.value) == 'object'){ + + if(color.value instanceof Array){ + var color_selected = color.value[Math.floor(Math.random() * pJS.particles.color.value.length)]; + this.color.rgb = hexToRgb(color_selected); + }else{ + if(color.value.r != undefined && color.value.g != undefined && color.value.b != undefined){ + this.color.rgb = { + r: color.value.r, + g: color.value.g, + b: color.value.b + } + } + if(color.value.h != undefined && color.value.s != undefined && color.value.l != undefined){ + this.color.hsl = { + h: color.value.h, + s: color.value.s, + l: color.value.l + } + } + } + + } + else if(color.value == 'random'){ + this.color.rgb = { + r: (Math.floor(Math.random() * (255 - 0 + 1)) + 0), + g: (Math.floor(Math.random() * (255 - 0 + 1)) + 0), + b: (Math.floor(Math.random() * (255 - 0 + 1)) + 0) + } + } + else if(typeof(color.value) == 'string'){ + this.color = color; + this.color.rgb = hexToRgb(this.color.value); + } + + /* opacity */ + this.opacity = (pJS.particles.opacity.random ? Math.random() : 1) * pJS.particles.opacity.value; + if(pJS.particles.opacity.anim.enable){ + this.opacity_status = false; + this.vo = pJS.particles.opacity.anim.speed / 100; + if(!pJS.particles.opacity.anim.sync){ + this.vo = this.vo * Math.random(); + } + } + + /* animation - velocity for speed */ + var velbase = {} + switch(pJS.particles.move.direction){ + case 'top': + velbase = { x:0, y:-1 }; + break; + case 'top-right': + velbase = { x:0.5, y:-0.5 }; + break; + case 'right': + velbase = { x:1, y:-0 }; + break; + case 'bottom-right': + velbase = { x:0.5, y:0.5 }; + break; + case 'bottom': + velbase = { x:0, y:1 }; + break; + case 'bottom-left': + velbase = { x:-0.5, y:1 }; + break; + case 'left': + velbase = { x:-1, y:0 }; + break; + case 'top-left': + velbase = { x:-0.5, y:-0.5 }; + break; + default: + velbase = { x:0, y:0 }; + break; + } + + if(pJS.particles.move.straight){ + this.vx = velbase.x; + this.vy = velbase.y; + if(pJS.particles.move.random){ + this.vx = this.vx * (Math.random()); + this.vy = this.vy * (Math.random()); + } + }else{ + this.vx = velbase.x + Math.random()-0.5; + this.vy = velbase.y + Math.random()-0.5; + } + + // var theta = 2.0 * Math.PI * Math.random(); + // this.vx = Math.cos(theta); + // this.vy = Math.sin(theta); + + this.vx_i = this.vx; + this.vy_i = this.vy; + + + + /* if shape is image */ + + var shape_type = pJS.particles.shape.type; + if(typeof(shape_type) == 'object'){ + if(shape_type instanceof Array){ + var shape_selected = shape_type[Math.floor(Math.random() * shape_type.length)]; + this.shape = shape_selected; + } + }else{ + this.shape = shape_type; + } + + if(this.shape == 'image'){ + var sh = pJS.particles.shape; + this.img = { + src: sh.image.src, + ratio: sh.image.width / sh.image.height, + replace_color: sh.image.replace_color + } + if(!this.img.ratio) this.img.ratio = 1; + if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg != undefined){ + pJS.fn.vendors.createSvgImg(this); + if(pJS.tmp.pushing){ + this.img.loaded = false; + } + } + } + + + + }; + + + pJS.fn.particle.prototype.draw = function() { + + var p = this; + + if(p.radius_bubble != undefined){ + var radius = p.radius_bubble; + }else{ + var radius = p.radius; + } + + if(p.opacity_bubble != undefined){ + var opacity = p.opacity_bubble; + }else{ + var opacity = p.opacity; + } + + if(p.color.rgb){ + var color_value = 'rgb('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+')'; + }else{ + var color_value = 'hsl('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%)'; + } + + pJS.canvas.ctx.fillStyle = color_value; + pJS.canvas.ctx.beginPath(); + + switch(p.shape){ + + case 'circle': + pJS.canvas.ctx.arc(p.x, p.y, radius, 0, Math.PI * 2, false); + break; + + case 'edge': + pJS.canvas.ctx.rect(p.x-radius, p.y-radius, radius*2, radius*2); + break; + + case 'triangle': + pJS.fn.vendors.drawShape(pJS.canvas.ctx, p.x-radius, p.y+radius / 1.66, radius*2, 3, 2); + break; + + case 'polygon': + pJS.fn.vendors.drawShape( + pJS.canvas.ctx, + p.x - radius / (pJS.particles.shape.polygon.nb_sides/3.5), // startX + p.y - radius / (2.66/3.5), // startY + radius*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength + pJS.particles.shape.polygon.nb_sides, // sideCountNumerator + 1 // sideCountDenominator + ); + break; + + case 'star': + pJS.fn.vendors.drawShape( + pJS.canvas.ctx, + p.x - radius*2 / (pJS.particles.shape.polygon.nb_sides/4), // startX + p.y - radius / (2*2.66/3.5), // startY + radius*2*2.66 / (pJS.particles.shape.polygon.nb_sides/3), // sideLength + pJS.particles.shape.polygon.nb_sides, // sideCountNumerator + 2 // sideCountDenominator + ); + break; + + case 'image': + + function draw(){ + pJS.canvas.ctx.drawImage( + img_obj, + p.x-radius, + p.y-radius, + radius*2, + radius*2 / p.img.ratio + ); + } + + if(pJS.tmp.img_type == 'svg'){ + var img_obj = p.img.obj; + }else{ + var img_obj = pJS.tmp.img_obj; + } + + if(img_obj){ + pJS.canvas.ctx.globalAlpha = opacity; + draw(); + pJS.canvas.ctx.globalAlpha = 1; + } + + break; + + } + + pJS.canvas.ctx.closePath(); + + if(pJS.particles.shape.stroke.width > 0){ + pJS.canvas.ctx.strokeStyle = pJS.particles.shape.stroke.color; + pJS.canvas.ctx.lineWidth = pJS.particles.shape.stroke.width; + pJS.canvas.ctx.stroke(); + } + + pJS.canvas.ctx.fill(); + + }; + + + pJS.fn.particlesCreate = function(){ + for(var i = 0; i < pJS.particles.number.value; i++) { + pJS.particles.array.push(new pJS.fn.particle(pJS.particles.color, pJS.particles.opacity.value)); + } + }; + + pJS.fn.particlesUpdate = function(){ + + for(var i = 0; i < pJS.particles.array.length; i++){ + + /* the particle */ + var p = pJS.particles.array[i]; + + // var d = ( dx = pJS.interactivity.mouse.click_pos_x - p.x ) * dx + ( dy = pJS.interactivity.mouse.click_pos_y - p.y ) * dy; + // var f = -BANG_SIZE / d; + // if ( d < BANG_SIZE ) { + // var t = Math.atan2( dy, dx ); + // p.vx = f * Math.cos(t); + // p.vy = f * Math.sin(t); + // } + + /* move the particle */ + if(pJS.particles.move.enable){ + var ms = pJS.particles.move.speed/2; + p.x += p.vx * ms; + p.y += p.vy * ms; + } + + /* change opacity status */ + if(pJS.particles.opacity.anim.enable) { + if(p.opacity_status == true) { + if(p.opacity >= pJS.particles.opacity.value) p.opacity_status = false; + p.opacity += p.vo; + }else { + if(p.opacity <= pJS.particles.opacity.anim.opacity_min) p.opacity_status = true; + p.opacity -= p.vo; + } + if(p.opacity < 0) p.opacity = 0; + } + + /* change size */ + if(pJS.particles.size.anim.enable){ + if(p.size_status == true){ + if(p.radius >= pJS.particles.size.value) p.size_status = false; + p.radius += p.vs; + }else{ + if(p.radius <= pJS.particles.size.anim.size_min) p.size_status = true; + p.radius -= p.vs; + } + if(p.radius < 0) p.radius = 0; + } + + /* change particle position if it is out of canvas */ + if(pJS.particles.move.out_mode == 'bounce'){ + var new_pos = { + x_left: p.radius, + x_right: pJS.canvas.w, + y_top: p.radius, + y_bottom: pJS.canvas.h + } + }else{ + var new_pos = { + x_left: -p.radius, + x_right: pJS.canvas.w + p.radius, + y_top: -p.radius, + y_bottom: pJS.canvas.h + p.radius + } + } + + if(p.x - p.radius > pJS.canvas.w){ + p.x = new_pos.x_left; + p.y = Math.random() * pJS.canvas.h; + } + else if(p.x + p.radius < 0){ + p.x = new_pos.x_right; + p.y = Math.random() * pJS.canvas.h; + } + if(p.y - p.radius > pJS.canvas.h){ + p.y = new_pos.y_top; + p.x = Math.random() * pJS.canvas.w; + } + else if(p.y + p.radius < 0){ + p.y = new_pos.y_bottom; + p.x = Math.random() * pJS.canvas.w; + } + + /* out of canvas modes */ + switch(pJS.particles.move.out_mode){ + case 'bounce': + if (p.x + p.radius > pJS.canvas.w) p.vx = -p.vx; + else if (p.x - p.radius < 0) p.vx = -p.vx; + if (p.y + p.radius > pJS.canvas.h) p.vy = -p.vy; + else if (p.y - p.radius < 0) p.vy = -p.vy; + break; + } + + /* events */ + if(isInArray('grab', pJS.interactivity.events.onhover.mode)){ + pJS.fn.modes.grabParticle(p); + } + + if(isInArray('bubble', pJS.interactivity.events.onhover.mode) || isInArray('bubble', pJS.interactivity.events.onclick.mode)){ + pJS.fn.modes.bubbleParticle(p); + } + + if(isInArray('repulse', pJS.interactivity.events.onhover.mode) || isInArray('repulse', pJS.interactivity.events.onclick.mode)){ + pJS.fn.modes.repulseParticle(p); + } + + /* interaction auto between particles */ + if(pJS.particles.line_linked.enable || pJS.particles.move.attract.enable){ + for(var j = i + 1; j < pJS.particles.array.length; j++){ + var p2 = pJS.particles.array[j]; + + /* link particles */ + if(pJS.particles.line_linked.enable){ + pJS.fn.interact.linkParticles(p,p2); + } + + /* attract particles */ + if(pJS.particles.move.attract.enable){ + pJS.fn.interact.attractParticles(p,p2); + } + + /* bounce particles */ + if(pJS.particles.move.bounce){ + pJS.fn.interact.bounceParticles(p,p2); + } + + } + } + + + } + + }; + + pJS.fn.particlesDraw = function(){ + + /* clear canvas */ + pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h); + + /* update each particles param */ + pJS.fn.particlesUpdate(); + + /* draw each particle */ + for(var i = 0; i < pJS.particles.array.length; i++){ + var p = pJS.particles.array[i]; + p.draw(); + } + + }; + + pJS.fn.particlesEmpty = function(){ + pJS.particles.array = []; + }; + + pJS.fn.particlesRefresh = function(){ + + /* init all */ + cancelRequestAnimFrame(pJS.fn.checkAnimFrame); + cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + pJS.tmp.source_svg = undefined; + pJS.tmp.img_obj = undefined; + pJS.tmp.count_svg = 0; + pJS.fn.particlesEmpty(); + pJS.fn.canvasClear(); + + /* restart */ + pJS.fn.vendors.start(); + + }; + + + /* ---------- pJS functions - particles interaction ------------ */ + + pJS.fn.interact.linkParticles = function(p1, p2){ + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx*dx + dy*dy); + + /* draw a line between p1 and p2 if the distance between them is under the config distance */ + if(dist <= pJS.particles.line_linked.distance){ + + var opacity_line = pJS.particles.line_linked.opacity - (dist / (1/pJS.particles.line_linked.opacity)) / pJS.particles.line_linked.distance; + + if(opacity_line > 0){ + + /* style */ + var color_line = pJS.particles.line_linked.color_rgb_line; + pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')'; + pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width; + //pJS.canvas.ctx.lineCap = 'round'; /* performance issue */ + + /* path */ + pJS.canvas.ctx.beginPath(); + pJS.canvas.ctx.moveTo(p1.x, p1.y); + pJS.canvas.ctx.lineTo(p2.x, p2.y); + pJS.canvas.ctx.stroke(); + pJS.canvas.ctx.closePath(); + + } + + } + + }; + + + pJS.fn.interact.attractParticles = function(p1, p2){ + + /* condensed particles */ + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx*dx + dy*dy); + + if(dist <= pJS.particles.line_linked.distance){ + + var ax = dx/(pJS.particles.move.attract.rotateX*1000), + ay = dy/(pJS.particles.move.attract.rotateY*1000); + + p1.vx -= ax; + p1.vy -= ay; + + p2.vx += ax; + p2.vy += ay; + + } + + + } + + + pJS.fn.interact.bounceParticles = function(p1, p2){ + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx*dx + dy*dy), + dist_p = p1.radius+p2.radius; + + if(dist <= dist_p){ + p1.vx = -p1.vx; + p1.vy = -p1.vy; + + p2.vx = -p2.vx; + p2.vy = -p2.vy; + } + + } + + + /* ---------- pJS functions - modes events ------------ */ + + pJS.fn.modes.pushParticles = function(nb, pos){ + + pJS.tmp.pushing = true; + + for(var i = 0; i < nb; i++){ + pJS.particles.array.push( + new pJS.fn.particle( + pJS.particles.color, + pJS.particles.opacity.value, + { + 'x': pos ? pos.pos_x : Math.random() * pJS.canvas.w, + 'y': pos ? pos.pos_y : Math.random() * pJS.canvas.h + } + ) + ) + if(i == nb-1){ + if(!pJS.particles.move.enable){ + pJS.fn.particlesDraw(); + } + pJS.tmp.pushing = false; + } + } + + }; + + + pJS.fn.modes.removeParticles = function(nb){ + + pJS.particles.array.splice(0, nb); + if(!pJS.particles.move.enable){ + pJS.fn.particlesDraw(); + } + + }; + + + pJS.fn.modes.bubbleParticle = function(p){ + + /* on hover event */ + if(pJS.interactivity.events.onhover.enable && isInArray('bubble', pJS.interactivity.events.onhover.mode)){ + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse), + ratio = 1 - dist_mouse / pJS.interactivity.modes.bubble.distance; + + function init(){ + p.opacity_bubble = p.opacity; + p.radius_bubble = p.radius; + } + + /* mousemove - check ratio */ + if(dist_mouse <= pJS.interactivity.modes.bubble.distance){ + + if(ratio >= 0 && pJS.interactivity.status == 'mousemove'){ + + /* size */ + if(pJS.interactivity.modes.bubble.size != pJS.particles.size.value){ + + if(pJS.interactivity.modes.bubble.size > pJS.particles.size.value){ + var size = p.radius + (pJS.interactivity.modes.bubble.size*ratio); + if(size >= 0){ + p.radius_bubble = size; + } + }else{ + var dif = p.radius - pJS.interactivity.modes.bubble.size, + size = p.radius - (dif*ratio); + if(size > 0){ + p.radius_bubble = size; + }else{ + p.radius_bubble = 0; + } + } + + } + + /* opacity */ + if(pJS.interactivity.modes.bubble.opacity != pJS.particles.opacity.value){ + + if(pJS.interactivity.modes.bubble.opacity > pJS.particles.opacity.value){ + var opacity = pJS.interactivity.modes.bubble.opacity*ratio; + if(opacity > p.opacity && opacity <= pJS.interactivity.modes.bubble.opacity){ + p.opacity_bubble = opacity; + } + }else{ + var opacity = p.opacity - (pJS.particles.opacity.value-pJS.interactivity.modes.bubble.opacity)*ratio; + if(opacity < p.opacity && opacity >= pJS.interactivity.modes.bubble.opacity){ + p.opacity_bubble = opacity; + } + } + + } + + } + + }else{ + init(); + } + + + /* mouseleave */ + if(pJS.interactivity.status == 'mouseleave'){ + init(); + } + + } + + /* on click event */ + else if(pJS.interactivity.events.onclick.enable && isInArray('bubble', pJS.interactivity.events.onclick.mode)){ + + + if(pJS.tmp.bubble_clicking){ + var dx_mouse = p.x - pJS.interactivity.mouse.click_pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.click_pos_y, + dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse), + time_spent = (new Date().getTime() - pJS.interactivity.mouse.click_time)/1000; + + if(time_spent > pJS.interactivity.modes.bubble.duration){ + pJS.tmp.bubble_duration_end = true; + } + + if(time_spent > pJS.interactivity.modes.bubble.duration*2){ + pJS.tmp.bubble_clicking = false; + pJS.tmp.bubble_duration_end = false; + } + } + + + function process(bubble_param, particles_param, p_obj_bubble, p_obj, id){ + + if(bubble_param != particles_param){ + + if(!pJS.tmp.bubble_duration_end){ + if(dist_mouse <= pJS.interactivity.modes.bubble.distance){ + if(p_obj_bubble != undefined) var obj = p_obj_bubble; + else var obj = p_obj; + if(obj != bubble_param){ + var value = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration); + if(id == 'size') p.radius_bubble = value; + if(id == 'opacity') p.opacity_bubble = value; + } + }else{ + if(id == 'size') p.radius_bubble = undefined; + if(id == 'opacity') p.opacity_bubble = undefined; + } + }else{ + if(p_obj_bubble != undefined){ + var value_tmp = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration), + dif = bubble_param - value_tmp; + value = bubble_param + dif; + if(id == 'size') p.radius_bubble = value; + if(id == 'opacity') p.opacity_bubble = value; + } + } + + } + + } + + if(pJS.tmp.bubble_clicking){ + /* size */ + process(pJS.interactivity.modes.bubble.size, pJS.particles.size.value, p.radius_bubble, p.radius, 'size'); + /* opacity */ + process(pJS.interactivity.modes.bubble.opacity, pJS.particles.opacity.value, p.opacity_bubble, p.opacity, 'opacity'); + } + + } + + }; + + + pJS.fn.modes.repulseParticle = function(p){ + + if(pJS.interactivity.events.onhover.enable && isInArray('repulse', pJS.interactivity.events.onhover.mode) && pJS.interactivity.status == 'mousemove') { + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse); + + var normVec = {x: dx_mouse/dist_mouse, y: dy_mouse/dist_mouse}, + repulseRadius = pJS.interactivity.modes.repulse.distance, + velocity = 100, + repulseFactor = clamp((1/repulseRadius)*(-1*Math.pow(dist_mouse/repulseRadius,2)+1)*repulseRadius*velocity, 0, 50); + + var pos = { + x: p.x + normVec.x * repulseFactor, + y: p.y + normVec.y * repulseFactor + } + + if(pJS.particles.move.out_mode == 'bounce'){ + if(pos.x - p.radius > 0 && pos.x + p.radius < pJS.canvas.w) p.x = pos.x; + if(pos.y - p.radius > 0 && pos.y + p.radius < pJS.canvas.h) p.y = pos.y; + }else{ + p.x = pos.x; + p.y = pos.y; + } + + } + + + else if(pJS.interactivity.events.onclick.enable && isInArray('repulse', pJS.interactivity.events.onclick.mode)) { + + if(!pJS.tmp.repulse_finish){ + pJS.tmp.repulse_count++; + if(pJS.tmp.repulse_count == pJS.particles.array.length){ + pJS.tmp.repulse_finish = true; + } + } + + if(pJS.tmp.repulse_clicking){ + + var repulseRadius = Math.pow(pJS.interactivity.modes.repulse.distance/6, 3); + + var dx = pJS.interactivity.mouse.click_pos_x - p.x, + dy = pJS.interactivity.mouse.click_pos_y - p.y, + d = dx*dx + dy*dy; + + var force = -repulseRadius / d * 1; + + function process(){ + + var f = Math.atan2(dy,dx); + p.vx = force * Math.cos(f); + p.vy = force * Math.sin(f); + + if(pJS.particles.move.out_mode == 'bounce'){ + var pos = { + x: p.x + p.vx, + y: p.y + p.vy + } + if (pos.x + p.radius > pJS.canvas.w) p.vx = -p.vx; + else if (pos.x - p.radius < 0) p.vx = -p.vx; + if (pos.y + p.radius > pJS.canvas.h) p.vy = -p.vy; + else if (pos.y - p.radius < 0) p.vy = -p.vy; + } + + } + + // default + if(d <= repulseRadius){ + process(); + } + + // bang - slow motion mode + // if(!pJS.tmp.repulse_finish){ + // if(d <= repulseRadius){ + // process(); + // } + // }else{ + // process(); + // } + + + }else{ + + if(pJS.tmp.repulse_clicking == false){ + + p.vx = p.vx_i; + p.vy = p.vy_i; + + } + + } + + } + + } + + + pJS.fn.modes.grabParticle = function(p){ + + if(pJS.interactivity.events.onhover.enable && pJS.interactivity.status == 'mousemove'){ + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse*dx_mouse + dy_mouse*dy_mouse); + + /* draw a line between the cursor and the particle if the distance between them is under the config distance */ + if(dist_mouse <= pJS.interactivity.modes.grab.distance){ + + var opacity_line = pJS.interactivity.modes.grab.line_linked.opacity - (dist_mouse / (1/pJS.interactivity.modes.grab.line_linked.opacity)) / pJS.interactivity.modes.grab.distance; + + if(opacity_line > 0){ + + /* style */ + var color_line = pJS.particles.line_linked.color_rgb_line; + pJS.canvas.ctx.strokeStyle = 'rgba('+color_line.r+','+color_line.g+','+color_line.b+','+opacity_line+')'; + pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width; + //pJS.canvas.ctx.lineCap = 'round'; /* performance issue */ + + /* path */ + pJS.canvas.ctx.beginPath(); + pJS.canvas.ctx.moveTo(p.x, p.y); + pJS.canvas.ctx.lineTo(pJS.interactivity.mouse.pos_x, pJS.interactivity.mouse.pos_y); + pJS.canvas.ctx.stroke(); + pJS.canvas.ctx.closePath(); + + } + + } + + } + + }; + + + + /* ---------- pJS functions - vendors ------------ */ + + pJS.fn.vendors.eventsListeners = function(){ + + /* events target element */ + if(pJS.interactivity.detect_on == 'window'){ + pJS.interactivity.el = window; + }else{ + pJS.interactivity.el = pJS.canvas.el; + } + + + /* detect mouse pos - on hover / click event */ + if(pJS.interactivity.events.onhover.enable || pJS.interactivity.events.onclick.enable){ + + /* el on mousemove */ + pJS.interactivity.el.addEventListener('mousemove', function(e){ + + if(pJS.interactivity.el == window){ + var pos_x = e.clientX, + pos_y = e.clientY; + } + else{ + var pos_x = e.offsetX || e.clientX, + pos_y = e.offsetY || e.clientY; + } + + pJS.interactivity.mouse.pos_x = pos_x; + pJS.interactivity.mouse.pos_y = pos_y; + + if(pJS.tmp.retina){ + pJS.interactivity.mouse.pos_x *= pJS.canvas.pxratio; + pJS.interactivity.mouse.pos_y *= pJS.canvas.pxratio; + } + + pJS.interactivity.status = 'mousemove'; + + }); + + /* el on onmouseleave */ + pJS.interactivity.el.addEventListener('mouseleave', function(e){ + + pJS.interactivity.mouse.pos_x = null; + pJS.interactivity.mouse.pos_y = null; + pJS.interactivity.status = 'mouseleave'; + + }); + + } + + /* on click event */ + if(pJS.interactivity.events.onclick.enable){ + + pJS.interactivity.el.addEventListener('click', function(){ + + pJS.interactivity.mouse.click_pos_x = pJS.interactivity.mouse.pos_x; + pJS.interactivity.mouse.click_pos_y = pJS.interactivity.mouse.pos_y; + pJS.interactivity.mouse.click_time = new Date().getTime(); + + if(pJS.interactivity.events.onclick.enable){ + + switch(pJS.interactivity.events.onclick.mode){ + + case 'push': + if(pJS.particles.move.enable){ + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse); + }else{ + if(pJS.interactivity.modes.push.particles_nb == 1){ + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse); + } + else if(pJS.interactivity.modes.push.particles_nb > 1){ + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb); + } + } + break; + + case 'remove': + pJS.fn.modes.removeParticles(pJS.interactivity.modes.remove.particles_nb); + break; + + case 'bubble': + pJS.tmp.bubble_clicking = true; + break; + + case 'repulse': + pJS.tmp.repulse_clicking = true; + pJS.tmp.repulse_count = 0; + pJS.tmp.repulse_finish = false; + setTimeout(function(){ + pJS.tmp.repulse_clicking = false; + }, pJS.interactivity.modes.repulse.duration*1000) + break; + + } + + } + + }); + + } + + + }; + + pJS.fn.vendors.densityAutoParticles = function(){ + + if(pJS.particles.number.density.enable){ + + /* calc area */ + var area = pJS.canvas.el.width * pJS.canvas.el.height / 1000; + if(pJS.tmp.retina){ + area = area/(pJS.canvas.pxratio*2); + } + + /* calc number of particles based on density area */ + var nb_particles = area * pJS.particles.number.value / pJS.particles.number.density.value_area; + + /* add or remove X particles */ + var missing_particles = pJS.particles.array.length - nb_particles; + if(missing_particles < 0) pJS.fn.modes.pushParticles(Math.abs(missing_particles)); + else pJS.fn.modes.removeParticles(missing_particles); + + } + + }; + + + pJS.fn.vendors.checkOverlap = function(p1, position){ + for(var i = 0; i < pJS.particles.array.length; i++){ + var p2 = pJS.particles.array[i]; + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx*dx + dy*dy); + + if(dist <= p1.radius + p2.radius){ + p1.x = position ? position.x : Math.random() * pJS.canvas.w; + p1.y = position ? position.y : Math.random() * pJS.canvas.h; + pJS.fn.vendors.checkOverlap(p1); + } + } + }; + + + pJS.fn.vendors.createSvgImg = function(p){ + + /* set color to svg element */ + var svgXml = pJS.tmp.source_svg, + url; + if (p.img.replace_color) { + var rgbHex = /#([0-9A-F]{3,6})/gi, + coloredSvgXml = svgXml.replace(rgbHex, function (m, r, g, b) { + if(p.color.rgb){ + var color_value = 'rgba('+p.color.rgb.r+','+p.color.rgb.g+','+p.color.rgb.b+','+p.opacity+')'; + }else{ + var color_value = 'hsla('+p.color.hsl.h+','+p.color.hsl.s+'%,'+p.color.hsl.l+'%,'+p.opacity+')'; + } + return color_value; + }); + url = 'data:image/svg+xml;utf8,' + coloredSvgXml; + } else { + url = 'data:image/svg+xml;utf8,' + svgXml; + } + + /* prepare to create img with colored svg */ + // var svg = new Blob([coloredSvgXml], {type: 'image/svg+xml;charset=utf-8'}), + // DOMURL = window.URL || window.webkitURL || window, + // url = DOMURL.createObjectURL(svg); + + /* create particle img obj */ + var img = new Image(); + img.addEventListener('load', function(){ + p.img.obj = img; + p.img.loaded = true; + // DOMURL.revokeObjectURL(url); + pJS.tmp.count_svg = (pJS.tmp.count_svg || 0) + 1; + }); + img.src = url; + + }; + + + pJS.fn.vendors.destroypJS = function(){ + cancelAnimationFrame(pJS.fn.drawAnimFrame); + canvas_el.remove(); + pJSDom = null; + }; + + + pJS.fn.vendors.drawShape = function(c, startX, startY, sideLength, sideCountNumerator, sideCountDenominator){ + + // By Programming Thomas - https://programmingthomas.wordpress.com/2013/04/03/n-sided-shapes/ + var sideCount = sideCountNumerator * sideCountDenominator; + var decimalSides = sideCountNumerator / sideCountDenominator; + var interiorAngleDegrees = (180 * (decimalSides - 2)) / decimalSides; + var interiorAngle = Math.PI - Math.PI * interiorAngleDegrees / 180; // convert to radians + c.save(); + c.beginPath(); + c.translate(startX, startY); + c.moveTo(0,0); + for (var i = 0; i < sideCount; i++) { + c.lineTo(sideLength,0); + c.translate(sideLength,0); + c.rotate(interiorAngle); + } + //c.stroke(); + c.fill(); + c.restore(); + + }; + + pJS.fn.vendors.exportImg = function(){ + window.open(pJS.canvas.el.toDataURL('image/png'), '_blank'); + }; + + + pJS.fn.vendors.loadImg = function(type){ + + pJS.tmp.img_error = undefined; + + if(pJS.particles.shape.image.src != ''){ + + if(type == 'svg'){ + + var xhr = new XMLHttpRequest(); + xhr.open('GET', pJS.particles.shape.image.src); + xhr.onreadystatechange = function (data) { + if(xhr.readyState == 4){ + if(xhr.status == 200){ + pJS.tmp.source_svg = data.currentTarget.response; + pJS.fn.vendors.checkBeforeDraw(); + }else{ + console.log('Error pJS - Image not found'); + pJS.tmp.img_error = true; + } + } + } + xhr.send(); + + }else{ + + var img = new Image(); + img.addEventListener('load', function(){ + pJS.tmp.img_obj = img; + pJS.fn.vendors.checkBeforeDraw(); + }); + img.src = pJS.particles.shape.image.src; + + } + + }else{ + console.log('Error pJS - No image.src'); + pJS.tmp.img_error = true; + } + + }; + + + pJS.fn.vendors.draw = function(){ + + if(pJS.particles.shape.type == 'image'){ + + if(pJS.tmp.img_type == 'svg'){ + + if(pJS.tmp.count_svg >= pJS.particles.number.value){ + pJS.fn.particlesDraw(); + if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + }else{ + //console.log('still loading...'); + if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + }else{ + + if(pJS.tmp.img_obj != undefined){ + pJS.fn.particlesDraw(); + if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + }else{ + if(!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + } + + }else{ + pJS.fn.particlesDraw(); + if(!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + }; + + + pJS.fn.vendors.checkBeforeDraw = function(){ + + // if shape is image + if(pJS.particles.shape.type == 'image'){ + + if(pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg == undefined){ + pJS.tmp.checkAnimFrame = requestAnimFrame(check); + }else{ + //console.log('images loaded! cancel check'); + cancelRequestAnimFrame(pJS.tmp.checkAnimFrame); + if(!pJS.tmp.img_error){ + pJS.fn.vendors.init(); + pJS.fn.vendors.draw(); + } + + } + + }else{ + pJS.fn.vendors.init(); + pJS.fn.vendors.draw(); + } + + }; + + + pJS.fn.vendors.init = function(){ + + /* init canvas + particles */ + pJS.fn.retinaInit(); + pJS.fn.canvasInit(); + pJS.fn.canvasSize(); + pJS.fn.canvasPaint(); + pJS.fn.particlesCreate(); + pJS.fn.vendors.densityAutoParticles(); + + /* particles.line_linked - convert hex colors to rgb */ + pJS.particles.line_linked.color_rgb_line = hexToRgb(pJS.particles.line_linked.color); + + }; + + + pJS.fn.vendors.start = function(){ + + if(isInArray('image', pJS.particles.shape.type)){ + pJS.tmp.img_type = pJS.particles.shape.image.src.substr(pJS.particles.shape.image.src.length - 3); + pJS.fn.vendors.loadImg(pJS.tmp.img_type); + }else{ + pJS.fn.vendors.checkBeforeDraw(); + } + + }; + + + + + /* ---------- pJS - start ------------ */ + + + pJS.fn.vendors.eventsListeners(); + + pJS.fn.vendors.start(); + + + +}; + +/* ---------- global functions - vendors ------------ */ + +Object.deepExtend = function(destination, source) { + for (var property in source) { + if (source[property] && source[property].constructor && + source[property].constructor === Object) { + destination[property] = destination[property] || {}; + arguments.callee(destination[property], source[property]); + } else { + destination[property] = source[property]; + } + } + return destination; +}; + +window.requestAnimFrame = (function(){ + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function(callback){ + window.setTimeout(callback, 1000 / 60); + }; +})(); + +window.cancelRequestAnimFrame = ( function() { + return window.cancelAnimationFrame || + window.webkitCancelRequestAnimationFrame || + window.mozCancelRequestAnimationFrame || + window.oCancelRequestAnimationFrame || + window.msCancelRequestAnimationFrame || + clearTimeout +} )(); + +function hexToRgb(hex){ + // By Tim Down - http://stackoverflow.com/a/5624139/3493650 + // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF") + var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i; + hex = hex.replace(shorthandRegex, function(m, r, g, b) { + return r + r + g + g + b + b; + }); + var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); + return result ? { + r: parseInt(result[1], 16), + g: parseInt(result[2], 16), + b: parseInt(result[3], 16) + } : null; +}; + +function clamp(number, min, max) { + return Math.min(Math.max(number, min), max); +}; + +function isInArray(value, array) { + return array.indexOf(value) > -1; +} + + +/* ---------- particles.js functions - start ------------ */ + +window.pJSDom = []; + +window.particlesJS = function(tag_id, params){ + + //console.log(params); + + /* no string id? so it's object params, and set the id with default id */ + if(typeof(tag_id) != 'string'){ + params = tag_id; + tag_id = 'particles-js'; + } + + /* no id? set the id to default id */ + if(!tag_id){ + tag_id = 'particles-js'; + } + + /* pJS elements */ + var pJS_tag = document.getElementById(tag_id), + pJS_canvas_class = 'particles-js-canvas-el', + exist_canvas = pJS_tag.getElementsByClassName(pJS_canvas_class); + + /* remove canvas if exists into the pJS target tag */ + if(exist_canvas.length){ + while(exist_canvas.length > 0){ + pJS_tag.removeChild(exist_canvas[0]); + } + } + + /* create canvas element */ + var canvas_el = document.createElement('canvas'); + canvas_el.className = pJS_canvas_class; + + /* set size canvas */ + canvas_el.style.width = "100%"; + canvas_el.style.height = "100%"; + + /* append canvas */ + var canvas = document.getElementById(tag_id).appendChild(canvas_el); + + /* launch particle.js */ + if(canvas != null){ + pJSDom.push(new pJS(tag_id, params)); + } + +}; + +window.particlesJS.load = function(tag_id, path_config_json, callback){ + + /* load json config */ + var xhr = new XMLHttpRequest(); + xhr.open('GET', path_config_json); + xhr.onreadystatechange = function (data) { + if(xhr.readyState == 4){ + if(xhr.status == 200){ + var params = JSON.parse(data.currentTarget.response); + window.particlesJS(tag_id, params); + if(callback) callback(); + }else{ + console.log('Error pJS - XMLHttpRequest status: '+xhr.status); + console.log('Error pJS - File config not found'); + } + } + }; + xhr.send(); + +}; diff --git a/js/particlesjs-config.json b/js/particlesjs-config.json new file mode 100644 index 0000000..f94b816 --- /dev/null +++ b/js/particlesjs-config.json @@ -0,0 +1,110 @@ +{ + "particles": { + "number": { + "value": 33, + "density": { + "enable": true, + "value_area": 800 + } + }, + "color": { + "value": "#b3b3b3" + }, + "shape": { + "type": "image", + "stroke": { + "width": 0, + "color": "#000000" + }, + "polygon": { + "nb_sides": 2 + }, + "image": { + "src": "/svg/zobacek.svg", + "width": 40, + "height": 40 + } + }, + "opacity": { + "value": 0.5, + "random": false, + "anim": { + "enable": false, + "speed": 1, + "opacity_min": 0.1, + "sync": false + } + }, + "size": { + "value": 15, + "random": true, + "anim": { + "enable": false, + "speed": 40, + "size_min": 0.1, + "sync": false + } + }, + "line_linked": { + "enable": false, + "distance": 150, + "color": "#ffffff", + "opacity": 0.4, + "width": 1 + }, + "move": { + "enable": true, + "speed": 6, + "direction": "none", + "random": false, + "straight": false, + "out_mode": "out", + "bounce": false, + "attract": { + "enable": false, + "rotateX": 600, + "rotateY": 1200 + } + } + }, + "interactivity": { + "detect_on": "canvas", + "events": { + "onhover": { + "enable": false, + "mode": "repulse" + }, + "onclick": { + "enable": true, + "mode": "push" + }, + "resize": true + }, + "modes": { + "grab": { + "distance": 400, + "line_linked": { + "opacity": 1 + } + }, + "bubble": { + "distance": 400, + "size": 40, + "duration": 2, + "opacity": 8, + "speed": 3 + }, + "repulse": { + "distance": 1, + "duration": 0.4 + }, + "push": { + "particles_nb": 4 + }, + "remove": { + "particles_nb": 2 + } + } + }, + "retina_detect": true +} diff --git a/js/router.js b/js/router.js new file mode 100644 index 0000000..989f99a --- /dev/null +++ b/js/router.js @@ -0,0 +1,613 @@ +/* Generated by the Nim Compiler v1.0.4 */ +/* (c) 2019 Andreas Rumpf */ + +var framePtr = null; +var excHandler = 0; +var lastJSError = null; +if (typeof Int8Array === 'undefined') Int8Array = Array; +if (typeof Int16Array === 'undefined') Int16Array = Array; +if (typeof Int32Array === 'undefined') Int32Array = Array; +if (typeof Uint8Array === 'undefined') Uint8Array = Array; +if (typeof Uint16Array === 'undefined') Uint16Array = Array; +if (typeof Uint32Array === 'undefined') Uint32Array = Array; +if (typeof Float32Array === 'undefined') Float32Array = Array; +if (typeof Float64Array === 'undefined') Float64Array = Array; +var NTI47442 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NTI47446 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NTI44006 = {size: 0,kind: 31,base: null,node: null,finalizer: null}; +var NTI65156 = {size: 0, kind: 18, base: null, node: null, finalizer: null}; +var NTI47408 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NTI47514 = {size: 0,kind: 22,base: null,node: null,finalizer: null}; +var NTI44016 = {size: 0,kind: 40,base: null,node: null,finalizer: null}; +var NTI44040 = {size: 0,kind: 28,base: null,node: null,finalizer: null}; +var NTI44042 = {size: 0,kind: 29,base: null,node: null,finalizer: null}; +var NTI47508 = {size: 0,kind: 22,base: null,node: null,finalizer: null}; +var NTI47426 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NTI47428 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NTI47458 = {size: 0, kind: 17, base: null, node: null, finalizer: null}; +var NNI47458 = {kind: 2, len: 0, offset: 0, typ: null, name: null, sons: []}; +NTI47458.node = NNI47458; +var NNI47428 = {kind: 2, len: 0, offset: 0, typ: null, name: null, sons: []}; +NTI47428.node = NNI47428; +NTI47508.base = NTI47426; +NTI47514.base = NTI47426; +var NNI47426 = {kind: 2, len: 6, offset: 0, typ: null, name: null, sons: [{kind: 1, offset: "parent", len: 0, typ: NTI47508, name: "parent", sons: null}, +{kind: 1, offset: "name", len: 0, typ: NTI44042, name: "name", sons: null}, +{kind: 1, offset: "message", len: 0, typ: NTI44040, name: "msg", sons: null}, +{kind: 1, offset: "trace", len: 0, typ: NTI44040, name: "trace", sons: null}, +{kind: 1, offset: "raiseId", len: 0, typ: NTI44016, name: "raiseId", sons: null}, +{kind: 1, offset: "up", len: 0, typ: NTI47514, name: "up", sons: null}]}; +NTI47426.node = NNI47426; +var NNI47408 = {kind: 2, len: 0, offset: 0, typ: null, name: null, sons: []}; +NTI47408.node = NNI47408; +NTI47426.base = NTI47408; +NTI47428.base = NTI47426; +NTI47458.base = NTI47428; +var NNI65156 = {kind: 2, len: 2, offset: 0, typ: null, name: null, sons: [{kind: 1, offset: "Field0", len: 0, typ: NTI44042, name: "Field0", sons: null}, +{kind: 1, offset: "Field1", len: 0, typ: NTI44006, name: "Field1", sons: null}]}; +NTI65156.node = NNI65156; +var NNI47446 = {kind: 2, len: 0, offset: 0, typ: null, name: null, sons: []}; +NTI47446.node = NNI47446; +var NNI47442 = {kind: 2, len: 0, offset: 0, typ: null, name: null, sons: []}; +NTI47442.node = NNI47442; +NTI47442.base = NTI47428; +NTI47446.base = NTI47442; + +function makeNimstrLit(c_67270) { + var ln = c_67270.length; + var result = new Array(ln); + for (var i = 0; i < ln; ++i) { + result[i] = c_67270.charCodeAt(i); + } + return result; + + + +} + +function cstrToNimstr(c_67287) { + var ln = c_67287.length; + var result = new Array(ln); + var r = 0; + for (var i = 0; i < ln; ++i) { + var ch = c_67287.charCodeAt(i); + + if (ch < 128) { + result[r] = ch; + } + else { + if (ch < 2048) { + result[r] = (ch >> 6) | 192; + } + else { + if (ch < 55296 || ch >= 57344) { + result[r] = (ch >> 12) | 224; + } + else { + ++i; + ch = 65536 + (((ch & 1023) << 10) | (c_67287.charCodeAt(i) & 1023)); + result[r] = (ch >> 18) | 240; + ++r; + result[r] = ((ch >> 12) & 63) | 128; + } + ++r; + result[r] = ((ch >> 6) & 63) | 128; + } + ++r; + result[r] = (ch & 63) | 128; + } + ++r; + } + return result; + + + +} + +function setConstr() { + var result = {}; + for (var i = 0; i < arguments.length; ++i) { + var x = arguments[i]; + if (typeof(x) == "object") { + for (var j = x[0]; j <= x[1]; ++j) { + result[j] = true; + } + } else { + result[x] = true; + } + } + return result; + + + +} +var ConstSet1 = setConstr(17, 16, 4, 18, 27, 19, 23, 22, 21); + +function nimCopy(dest_68827, src_68828, ti_68829) { + var result_69019 = null; + + switch (ti_68829.kind) { + case 21: + case 22: + case 23: + case 5: + if (!(is_fat_pointer_68801(ti_68829))) { + result_69019 = src_68828; + } + else { + result_69019 = [src_68828[0], src_68828[1]]; + } + + break; + case 19: + if (dest_68827 === null || dest_68827 === undefined) { + dest_68827 = {}; + } + else { + for (var key in dest_68827) { delete dest_68827[key]; } + } + for (var key in src_68828) { dest_68827[key] = src_68828[key]; } + result_69019 = dest_68827; + + break; + case 18: + case 17: + if (!((ti_68829.base == null))) { + result_69019 = nimCopy(dest_68827, src_68828, ti_68829.base); + } + else { + if ((ti_68829.kind == 17)) { + result_69019 = (dest_68827 === null || dest_68827 === undefined) ? {m_type: ti_68829} : dest_68827; + } + else { + result_69019 = (dest_68827 === null || dest_68827 === undefined) ? {} : dest_68827; + } + } + nimCopyAux(result_69019, src_68828, ti_68829.node); + break; + case 24: + case 4: + case 27: + case 16: + if (src_68828 === null) { + result_69019 = null; + } + else { + if (dest_68827 === null || dest_68827 === undefined) { + dest_68827 = new Array(src_68828.length); + } + else { + dest_68827.length = src_68828.length; + } + result_69019 = dest_68827; + for (var i = 0; i < src_68828.length; ++i) { + result_69019[i] = nimCopy(result_69019[i], src_68828[i], ti_68829.base); + } + } + + break; + case 28: + if (src_68828 !== null) { + result_69019 = src_68828.slice(0); + } + + break; + default: + result_69019 = src_68828; + break; + } + + return result_69019; + +} + +function arrayConstr(len_69086, value_69087, typ_69088) { + var result = new Array(len_69086); + for (var i = 0; i < len_69086; ++i) result[i] = nimCopy(null, value_69087, typ_69088); + return result; + + + +} + +function toJSStr(s_67304) { + var Tmp5; + var Tmp7; + + var result_67305 = null; + + var res_67363 = new_seq_67336((s_67304 != null ? s_67304.length : 0)); + var i_67365 = 0; + var j_67367 = 0; + L1: do { + L2: while (true) { + if (!(i_67365 < (s_67304 != null ? s_67304.length : 0))) break L2; + var c_67368 = s_67304[i_67365]; + if ((c_67368 < 128)) { + res_67363[j_67367] = String.fromCharCode(c_67368); + i_67365 += 1; + } + else { + var helper_67391 = new_seq_67336(0); + L3: do { + L4: while (true) { + if (!true) break L4; + var code_67392 = c_67368.toString(16); + if (((code_67392 != null ? code_67392.length : 0) == 1)) { + if (helper_67391 != null) { helper_67391.push("%0"); } else { helper_67391 = ["%0"]; }; + } + else { + if (helper_67391 != null) { helper_67391.push("%"); } else { helper_67391 = ["%"]; }; + } + + if (helper_67391 != null) { helper_67391.push(code_67392); } else { helper_67391 = [code_67392]; }; + i_67365 += 1; + if (((s_67304 != null ? s_67304.length : 0) <= i_67365)) Tmp5 = true; else { Tmp5 = (s_67304[i_67365] < 128); } if (Tmp5) { + break L3; + } + + c_67368 = s_67304[i_67365]; + } + } while(false); +++excHandler; + Tmp7 = framePtr; + try { + res_67363[j_67367] = decodeURIComponent(helper_67391.join("")); +--excHandler; +} catch (EXC) { + var prevJSError = lastJSError; + lastJSError = EXC; + --excHandler; + framePtr = Tmp7; + res_67363[j_67367] = helper_67391.join(""); + lastJSError = prevJSError; + } finally { + framePtr = Tmp7; + } + } + + j_67367 += 1; + } + } while(false); + if (res_67363 === null) res_67363 = []; + if (res_67363.length < j_67367) { for (var i=res_67363.length;i 2147483647 || result < -2147483648) raiseOverflow(); + return result; + + + +} +var nim_program_result = 0; +var global_raise_hook_62618 = [null]; +var local_raise_hook_62623 = [null]; +var out_of_mem_hook_62626 = [null]; + if (!Math.trunc) { + Math.trunc = function(v) { + v = +v; + if (!isFinite(v)) return v; + + return (v - v % 1) || (v < 0 ? -0 : v === 0 ? v : 0); + }; + } + +function is_fat_pointer_68801(ti_68803) { + var result_68804 = false; + + BeforeRet: do { + result_68804 = !((ConstSet1[ti_68803.base.kind] != undefined)); + break BeforeRet; + } while (false); + + return result_68804; + +} + +function nimCopyAux(dest_68832, src_68833, n_68835) { + switch (n_68835.kind) { + case 0: + break; + case 1: + dest_68832[n_68835.offset] = nimCopy(dest_68832[n_68835.offset], src_68833[n_68835.offset], n_68835.typ); + + break; + case 2: + for (var i = 0; i < n_68835.sons.length; i++) { + nimCopyAux(dest_68832, src_68833, n_68835.sons[i]); + } + + break; + case 3: + dest_68832[n_68835.offset] = nimCopy(dest_68832[n_68835.offset], src_68833[n_68835.offset], n_68835.typ); + for (var i = 0; i < n_68835.sons.length; ++i) { + nimCopyAux(dest_68832, src_68833, n_68835.sons[i][1]); + } + + break; + } + + +} + +function add_62638(x_62641, x_62641_Idx, y_62642) { + if (x_62641[x_62641_Idx] === null) { x_62641[x_62641_Idx] = []; } + var off = x_62641[x_62641_Idx].length; + x_62641[x_62641_Idx].length += y_62642.length; + for (var i = 0; i < y_62642.length; ++i) { + x_62641[x_62641_Idx][off+i] = y_62642.charCodeAt(i); + } + + + +} + +function aux_write_stack_trace_65151(f_65153) { + var Tmp3; + + var result_65154 = [null]; + + var it_65162 = f_65153; + var i_65164 = 0; + var total_65166 = 0; + var temp_frames_65173 = arrayConstr(64, {Field0: null, Field1: 0}, NTI65156); + L1: do { + L2: while (true) { + if (!!((it_65162 == null))) Tmp3 = false; else { Tmp3 = (i_65164 <= 63); } if (!Tmp3) break L2; + temp_frames_65173[i_65164].Field0 = it_65162.procname; + temp_frames_65173[i_65164].Field1 = it_65162.line; + i_65164 += 1; + total_65166 += 1; + it_65162 = it_65162.prev; + } + } while(false); + L4: do { + L5: while (true) { + if (!!((it_65162 == null))) break L5; + total_65166 += 1; + it_65162 = it_65162.prev; + } + } while(false); + result_65154[0] = nimCopy(null, [], NTI44040); + if (!((total_65166 == i_65164))) { + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(makeNimstrLit("(")); } else { result_65154[0] = makeNimstrLit("("); }; + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(cstrToNimstr(((total_65166 - i_65164))+"")); } else { result_65154[0] = cstrToNimstr(((total_65166 - i_65164))+"").slice(); }; + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(makeNimstrLit(" calls omitted) ...\x0A")); } else { result_65154[0] = makeNimstrLit(" calls omitted) ...\x0A"); }; + } + + L6: do { + var j_65421 = 0; + var colontmp__89086 = 0; + colontmp__89086 = (i_65164 - 1); + var res_89091 = colontmp__89086; + L7: do { + L8: while (true) { + if (!(0 <= res_89091)) break L8; + j_65421 = res_89091; + add_62638(result_65154, 0, temp_frames_65173[j_65421].Field0); + if ((0 < temp_frames_65173[j_65421].Field1)) { + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(makeNimstrLit(", line: ")); } else { result_65154[0] = makeNimstrLit(", line: "); }; + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(cstrToNimstr((temp_frames_65173[j_65421].Field1)+"")); } else { result_65154[0] = cstrToNimstr((temp_frames_65173[j_65421].Field1)+"").slice(); }; + } + + if (result_65154[0] != null) { result_65154[0] = (result_65154[0]).concat(makeNimstrLit("\x0A")); } else { result_65154[0] = makeNimstrLit("\x0A"); }; + res_89091 -= 1; + } + } while(false); + } while(false); + + return result_65154[0]; + +} + +function raw_write_stack_trace_65468() { + var result_65470 = null; + + if (!((framePtr == null))) { + result_65470 = nimCopy(null, (makeNimstrLit("Traceback (most recent call last)\x0A") || []).concat(aux_write_stack_trace_65151(framePtr) || []), NTI44040); + } + else { + result_65470 = nimCopy(null, makeNimstrLit("No stack traceback available\x0A"), NTI44040); + } + + + return result_65470; + +} + +function new_seq_67336(len_67339) { + var result_67341 = null; + + var F={procname:"newSeq.newSeq",prev:framePtr,filename:"system.nim",line:0}; + framePtr = F; + F.line = 997; + result_67341 = new Array(len_67339); for (var i=0;i\x0A\x09
\x0A\x09\x09\x0A\x09\x09\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A\x09
\x0A\x09\x09Povinnosti:\x0A\x09\x09V\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1va\x0A\x09\x09Spolkov\xC3\xA1 m\xC3\xADstnost\x0A\x09\x09Akce a nahla\xC5\xA1ov\xC3\xA1n\xC3\xAD akc\xC3\xAD\x0A\x09\x09Odkazy a inspirace\x0A\x09\x09Dal\xC5\xA1\xC3\xAD spolky\x0A\x09\x09P\xC5\x99edpisy a pravidla\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09\x09

P\xC5\x99edseda spolku

\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09\x09Provedeme t\xC4\x9B v\xC5\xA1emi povinnostmi a mo\xC5\xBEnostmi, kter\xC3\xA9 jako p\xC5\x99edseda m\xC3\xA1\xC5\xA1.\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09\x0A\x09\x09\x09
\x0A\x09\x09
\x0A\x09
\x0A\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

V\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1va

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Ka\xC5\xBEd\xC3\xBD form\xC3\xA1ln\xC3\xAD spolek m\xC3\xA1 povinnost odevzd\xC3\xA1vat ka\xC5\xBEd\xC3\xBD rok 30.4 v\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1vu v\xC4\x8Detn\xC4\x9B zpr\xC3\xA1vy o hospoda\xC5\x99en\xC3\xAD\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x09A jak na n\xC3\xAD?\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09To ti \xC5\x99ekne Ver\xC4\x8Da\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
Hlavn\xC3\xAD body,
\x0A\x09\x09

kter\xC3\xA9 tam nesm\xC3\xAD chyb\xC4\x9Bt jsou:

\x0A\x09\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x091.\x0A\x09\x09\x09

Po\xC4\x8Det \xC4\x8Dlen\xC5\xAF

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x094.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09\x097.\x0A\x09\x09\x09\x09

Hospoda\xC5\x99en\xC3\xAD (v\xC3\xBDdaje rozd\xC4\x9Bleny na tyto \xC4\x8D\xC3\xA1sti)

\x0A\x09\x09\x09
\x0A\x09\x09\x09\x09
    \x0A\x09\x09\x09\x09\x09
  1. Projekty a program
    2. \x0A\x09\x09\x09\x09\x09
  2. Marketing a PR
    3. \x0A\x09\x09\x09\x09\x09
  3. Provoz spolku
    4. \x0A\x09\x09\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x092.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x095.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x093.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x096.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Spolkov\xC3\xA1 m\xC3\xADstnost

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Ka\xC5\xBEd\xC3\xBD form\xC3\xA1ln\xC3\xAD spolek m\xC3\xA1 n\xC3\xA1rok na p\xC5\x99\xC3\xADstup do spolkov\xC3\xA9 m\xC3\xADstnosti, kter\xC3\xA1 m\xC3\xA1 ozna\xC4\x8Den\xC3\xAD S104 tzv. spolkovka\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x09

\x0A\x09\x09\x09\x09Pravidla spolkovky jsou n\xC3\xA1sleduj\xC3\xADc\xC3\xAD:\x0A\x09\x09\x09

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Akce a nahla\xC5\xA1ov\xC3\xA1n\xC3\xAD akc\xC3\xAD

\x0A\x09\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

\x0A\x09\x09\x09Pokud chce\xC5\xA1 po\xC5\x99\xC3\xA1dat akci na fakult\xC4\x9B, je zapot\xC5\x99eb\xC3\xAD to nejprve nahl\xC3\xA1sit p\xC5\x99es formul\xC3\xA1\xC5\x99 na\x0A\x09\x09\x09akce.pedf.cuni.cz. Pokud se jedn\xC3\xA1 o malou akci vy\xC5\xBEaduj\xC3\xADc\xC3\xAD pouze mal\xC3\xBD po\xC4\x8Det u\xC4\x8Deben\x0A\x09\x09\x09nebo spole\xC4\x8Dn\xC3\xBD prostor pouze po kr\xC3\xA1tkou dobu, tak sta\xC4\x8D\xC3\xAD akci nahl\xC3\xA1sit o 10 dn\xC5\xAF p\xC5\x99edem (v\xC3\xADce u organizov\xC3\xA1n\xC3\xAD akc\xC3\xAD)\x0A\x09\x09

\x0A\x09\x09

\x0A\x09\x09\x09Je mo\xC5\xBEnost po\xC5\xBE\xC3\xA1dat o stoly, \xC5\xBEidle, podporu aj\xC5\xA5\xC3\xA1k\xC5\xAF nebo m\xC3\xADsto na webovk\xC3\xA1ch. V\xC5\xA1echny n\xC3\xA1jmy pro form\xC3\xA1ln\xC3\xAD spolky jsou bezplatn\xC3\xA9.\x0A\x09\x09

\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Odkazy a inspirace

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Tady najde\xC5\xA1 spolky, kter\xC3\xA9 p\xC5\xAFsob\xC3\xAD na UK:
\x0A\x09\x09\x09https://cuni.cz/UK-8518.html\x0A\x09\x09\x09

\x0A\x09\x09\x09Kurzy na r\xC5\xAFzn\xC3\xA9 dovednosti m\xC5\xAF\xC5\xBEe\xC5\xA1 naj\xC3\xADt zde:
\x0A\x09\x09\x09www.naucmese.cz nebo na\x0A\x09\x09\x09https://www.acsa.cz\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09\x09\x0A\x09\x09 \x0A\x09\x09
\x0A\x0A\x09\x09 \x0A\x09\x09
\x0A\x09\x09
1 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Text
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
2 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Two
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
3 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Three
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
3 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Three
\x0A\x09\x09
\x0A\x0A\x09\x09 \x0A\x09\x09 ❮\x0A\x09\x09 ❯\x0A\x09\x09
\x0A\x09\x09
\x0A\x0A\x09\x09\x0A\x09\x09
\x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09
\x0A\x09
\x0A\x09\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

P\xC5\x99edpisy a pravidla

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Z\xC3\xA1kladn\xC3\xAD p\xC5\x99edpisy, kter\xC3\xBDmi se spolky \xC5\x99id\xC3\xAD jsou:
\x0A\x09\x09

\x0A\x09\x09
    \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09
\x0A\x09
\x0A
\x0A"); + break; + case "#/prebiram": + Tmp4 = makeNimstrLit("
\x0A\x09
\x0A\x09\x09\x0A\x09\x09\x0A\x09
\x0A
\x0A"); + break; + case "#/zapojit-se": + Tmp4 = makeNimstrLit("
\x0A\x09
\x0A\x09\x09\x0A\x09\x09\x0A\x09
\x0A
\x0A"); + break; + case "#/zalozit-spolek": + Tmp4 = makeNimstrLit("
\x0A\x09
\x0A\x09\x09\x0A\x09\x09\x0A\x09
\x0A
\x0A"); + break; + default: + Tmp4 = makeNimstrLit("
\x0A\x09
\x0A\x09\x09\x0A\x09\x09\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A\x09
\x0A\x09\x09Povinnosti:\x0A\x09\x09V\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1va\x0A\x09\x09Spolkov\xC3\xA1 m\xC3\xADstnost\x0A\x09\x09Akce a nahla\xC5\xA1ov\xC3\xA1n\xC3\xAD akc\xC3\xAD\x0A\x09\x09Odkazy a inspirace\x0A\x09\x09Dal\xC5\xA1\xC3\xAD spolky\x0A\x09\x09P\xC5\x99edpisy a pravidla\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09\x09

P\xC5\x99edseda spolku

\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09\x09Provedeme t\xC4\x9B v\xC5\xA1emi povinnostmi a mo\xC5\xBEnostmi, kter\xC3\xA9 jako p\xC5\x99edseda m\xC3\xA1\xC5\xA1.\x0A\x09\x09\x09\x09
\x0A\x09\x09\x09\x09\x0A\x09\x09\x09
\x0A\x09\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

V\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1va

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Ka\xC5\xBEd\xC3\xBD form\xC3\xA1ln\xC3\xAD spolek m\xC3\xA1 povinnost odevzd\xC3\xA1vat ka\xC5\xBEd\xC3\xBD rok 30.4 v\xC3\xBDro\xC4\x8Dn\xC3\xAD zpr\xC3\xA1vu v\xC4\x8Detn\xC4\x9B zpr\xC3\xA1vy o hospoda\xC5\x99en\xC3\xAD\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x09A jak na n\xC3\xAD?\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09To ti \xC5\x99ekne Ver\xC4\x8Da\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
Hlavn\xC3\xAD body,
\x0A\x09\x09

kter\xC3\xA9 tam nesm\xC3\xAD chyb\xC4\x9Bt jsou:

\x0A\x09\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x091.\x0A\x09\x09\x09

Po\xC4\x8Det \xC4\x8Dlen\xC5\xAF

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x094.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09\x09\x097.\x0A\x09\x09\x09\x09

Hospoda\xC5\x99en\xC3\xAD (v\xC3\xBDdaje rozd\xC4\x9Bleny na tyto \xC4\x8D\xC3\xA1sti)

\x0A\x09\x09\x09
\x0A\x09\x09\x09\x09
    \x0A\x09\x09\x09\x09\x09
  1. Projekty a program
    2. \x0A\x09\x09\x09\x09\x09
  2. Marketing a PR
    3. \x0A\x09\x09\x09\x09\x09
  3. Provoz spolku
    4. \x0A\x09\x09\x09\x09
\x0A\x09\x09\x09
\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x092.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x095.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x093.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09\x09
\x0A\x09\x09\x096.\x0A\x09\x09\x09

Souhrn \xC4\x8Dinnosti za minul\xC3\xBD kalend\xC3\xA1\xC5\x99n\xC3\xAD rok

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Spolkov\xC3\xA1 m\xC3\xADstnost

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Ka\xC5\xBEd\xC3\xBD form\xC3\xA1ln\xC3\xAD spolek m\xC3\xA1 n\xC3\xA1rok na p\xC5\x99\xC3\xADstup do spolkov\xC3\xA9 m\xC3\xADstnosti, kter\xC3\xA1 m\xC3\xA1 ozna\xC4\x8Den\xC3\xAD S104 tzv. spolkovka\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09
\x0A\x09\x09\x09

\x0A\x09\x09\x09\x09Pravidla spolkovky jsou n\xC3\xA1sleduj\xC3\xADc\xC3\xAD:\x0A\x09\x09\x09

\x0A\x09\x09
\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Akce a nahla\xC5\xA1ov\xC3\xA1n\xC3\xAD akc\xC3\xAD

\x0A\x09\x09
\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

\x0A\x09\x09\x09Pokud chce\xC5\xA1 po\xC5\x99\xC3\xA1dat akci na fakult\xC4\x9B, je zapot\xC5\x99eb\xC3\xAD to nejprve nahl\xC3\xA1sit p\xC5\x99es formul\xC3\xA1\xC5\x99 na\x0A\x09\x09\x09akce.pedf.cuni.cz. Pokud se jedn\xC3\xA1 o malou akci vy\xC5\xBEaduj\xC3\xADc\xC3\xAD pouze mal\xC3\xBD po\xC4\x8Det u\xC4\x8Deben\x0A\x09\x09\x09nebo spole\xC4\x8Dn\xC3\xBD prostor pouze po kr\xC3\xA1tkou dobu, tak sta\xC4\x8D\xC3\xAD akci nahl\xC3\xA1sit o 10 dn\xC5\xAF p\xC5\x99edem (v\xC3\xADce u organizov\xC3\xA1n\xC3\xAD akc\xC3\xAD)\x0A\x09\x09

\x0A\x09\x09

\x0A\x09\x09\x09Je mo\xC5\xBEnost po\xC5\xBE\xC3\xA1dat o stoly, \xC5\xBEidle, podporu aj\xC5\xA5\xC3\xA1k\xC5\xAF nebo m\xC3\xADsto na webovk\xC3\xA1ch. V\xC5\xA1echny n\xC3\xA1jmy pro form\xC3\xA1ln\xC3\xAD spolky jsou bezplatn\xC3\xA9.\x0A\x09\x09

\x0A\x09
\x0A\x09
\x0A\x09\x09\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

Odkazy a inspirace

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Tady najde\xC5\xA1 spolky, kter\xC3\xA9 p\xC5\xAFsob\xC3\xAD na UK:
\x0A\x09\x09\x09https://cuni.cz/UK-8518.html\x0A\x09\x09\x09

\x0A\x09\x09\x09Kurzy na r\xC5\xAFzn\xC3\xA9 dovednosti m\xC5\xAF\xC5\xBEe\xC5\xA1 naj\xC3\xADt zde:
\x0A\x09\x09\x09www.naucmese.cz nebo na\x0A\x09\x09\x09https://www.acsa.cz\x0A\x09\x09

\x0A\x09
\x0A
\x0A
\x0A\x09
\x0A\x09\x09\x0A\x09\x09 \x0A\x09\x09
\x0A\x0A\x09\x09 \x0A\x09\x09
\x0A\x09\x09
1 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Text
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
2 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Two
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
3 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Three
\x0A\x09\x09
\x0A\x0A\x09\x09
\x0A\x09\x09
3 / 3
\x0A\x09\x09 \x0A\x09\x09
Caption Three
\x0A\x09\x09
\x0A\x0A\x09\x09 \x0A\x09\x09 ❮\x0A\x09\x09 ❯\x0A\x09\x09
\x0A\x09\x09
\x0A\x0A\x09\x09\x0A\x09\x09
\x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09 \x0A\x09\x09
\x0A\x09
\x0A\x09\x0A
\x0A
\x0A\x09
\x0A\x09
\x0A\x09\x09

P\xC5\x99edpisy a pravidla

\x0A\x09\x09
\x0A\x09\x09

\x0A\x09\x09\x09Z\xC3\xA1kladn\xC3\xAD p\xC5\x99edpisy, kter\xC3\xBDmi se spolky \xC5\x99id\xC3\xAD jsou:
\x0A\x09\x09

\x0A\x09\x09
    \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09\x09
  • Tento p\xC5\x99edpis
    • \x0A\x09\x09
\x0A\x09
\x0A
\x0A"); + break; + } + document.querySelector("#root").innerHTML = toJSStr(Tmp4); + framePtr = F.prev; + + +} diff --git a/js/router.nim b/js/router.nim new file mode 100644 index 0000000..d6d1a34 --- /dev/null +++ b/js/router.nim @@ -0,0 +1,26 @@ +#? replace(sub = "\t", by = " ") +import dom + +const index = staticRead("../page/home.html") +const predseda = staticRead("../page/predseda.html") +const prebiram = staticRead("../page/prebiram.html") +const zapojit_se = staticRead("../page/zapojit_se.html") +const zalozit_spolek = staticRead("../page/zalozit_spolek.html") + +proc get_routes(url: cstring) {.export_c.} = + var new_url = "" + + for c in url: + echo c + new_url.add(c) + + echo new_url + + document.querySelector("#root").innerHTML = case new_url + of "#/predseda": predseda + of "#/prebiram": prebiram + of "#/zapojit-se": zapojit_se + of "#/zalozit-spolek": zalozit_spolek + else: predseda + + diff --git a/js/script.js b/js/script.js new file mode 100644 index 0000000..4ba1524 --- /dev/null +++ b/js/script.js @@ -0,0 +1,11 @@ +// particlesJS.load('particles-js', '/js/particlesjs-config.json', function() { +// console.log('callback - particles.js config loaded'); +// }); +// +// particlesJS.load('root', '/js/particlesjs-config.json', function() { +// console.log('callback - particles.js config loaded'); +// }); + +particlesJS.load('body', '/js/particlesjs-config.json', function() { + console.log('callback - particles.js config loaded'); +}); diff --git a/js/uilang.js b/js/uilang.js new file mode 100644 index 0000000..90b878a --- /dev/null +++ b/js/uilang.js @@ -0,0 +1,104 @@ +/* + * uilang v1.0.1 + * http://uilang.com + */ + +document.addEventListener("DOMContentLoaded", function() { + "use strict" + + var codeElements = document.getElementsByTagName("code") + var i = codeElements.length + var delimiter = "clicking on" + var codeBlock + var codeBlockContent + + while (i--) { + var code = codeElements[i] + var content = code.textContent.trim() + if (content.lastIndexOf(delimiter, 0) === 0) { + codeBlock = code + codeBlockContent = content + break + } + } + + if (!codeBlock) return + codeBlock.parentNode.removeChild(codeBlock) + + function InstructionParsing(instruction) { + var separator = instruction.charAt(0) + var instructionSplit = instruction.split(separator) + + this.clickSelector = instructionSplit[1] + this.classBehavior = instructionSplit[2].trim().split(" ")[0] + this.classValue = instructionSplit[3] + this.targetSelector = instructionSplit[5] + + if (instructionSplit.length >= 7 && instructionSplit[6] == "no-prevent") + this.prevent = false; + else this.prevent = true + } + + function UIElement(clickSelector, classBehavior, classValue, targetSelector) { + this.clickSelector = clickSelector + this.classBehavior = classBehavior.charAt(classBehavior.length-1) == "s" + ? classBehavior.substring(0, classBehavior.length-1) + : classBehavior + this.classValue = classValue.charAt(0) == "." + ? classValue.substring(1, classValue.length) + : classValue + this.targetSelector = targetSelector + this.createEventListener() + } + + UIElement.prototype.createEventListener = function() { + var self = this + var clicked = document.querySelectorAll(self.clickSelector) + var i = clicked.length + + if (i < 1) { + throw new Error("There's no element matching your \"" + self.clickSelector + "\" CSS selector.") + } + + while (i--) { + clicked.item(i).addEventListener("click", clickCallback) + } + + function updateClass(el) { + el.classList[self.classBehavior](self.classValue) + } + + function clickCallback(e) { + switch (self.targetSelector) { + case "target" : + case "this" : + case "it" : + case "itself" : + case undefined: + updateClass(e.target) + break + default: + var target = document.querySelectorAll(self.targetSelector) + var i = target.length + while (i--) { + updateClass(target.item(i)) + } + } + if (e.target.nodeName.toLowerCase() == "a") { + if (self.prevent) + e.preventDefault() + } + } + } + + codeBlockContent.split(delimiter).forEach(function(data) { + if (!data) return + var params = new InstructionParsing(data.trim()) + new UIElement( + params.clickSelector, + params.classBehavior, + params.classValue, + params.targetSelector + ) + }) +}) diff --git a/nav.html b/nav.html new file mode 100644 index 0000000..1041598 --- /dev/null +++ b/nav.html @@ -0,0 +1,23 @@ +
+
+ + +
+ + + + + + + +
diff --git a/page/home.html b/page/home.html new file mode 100644 index 0000000..bbf050b --- /dev/null +++ b/page/home.html @@ -0,0 +1,14 @@ +
+i +sa +da +d +da +sd +ads +sd + +sad +sad +sa +
diff --git a/page/prebiram.html b/page/prebiram.html new file mode 100644 index 0000000..1dbfdf2 --- /dev/null +++ b/page/prebiram.html @@ -0,0 +1,6 @@ +
+
+ + +
+
diff --git a/page/predseda.html b/page/predseda.html new file mode 100644 index 0000000..b3cad2b --- /dev/null +++ b/page/predseda.html @@ -0,0 +1,241 @@ +
+
+ + +
+ +
+ Povinnosti: + Výroční zpráva + Spolková místnost + Akce a nahlašování akcí + Odkazy a inspirace + Další spolky + Předpisy a pravidla +
+
+
+
+
+

Předseda spolku

+
+
+ Provedeme tě všemi povinnostmi a možnostmi, které jako předseda máš. +
+ +
+
+
+
+
+
+
+

Výroční zpráva

+
+

+ Každý formální spolek má povinnost odevzdávat každý rok 30.4 výroční zprávu včetně zprávy o hospodaření +

+
+
+
+
+
+
+ A jak na ní? +
+
+ To ti řekne Verča +
+
+
+ +
+
+
+
+
+
+
Hlavní body,
+

které tam nesmí chybět jsou:

+
+
+
+
+
+
+
+ 1. +

Počet členů

+
+
+ 4. +

Souhrn činnosti za minulý kalendářní rok

+
+
+
+
+ 7. +

Hospodaření (výdaje rozděleny na tyto části)

+
+
    +
  1. Projekty a program
    2. +
  2. Marketing a PR
    3. +
  3. Provoz spolku
    4. +
+
+
+
+
+
+
+ 2. +

Souhrn činnosti za minulý kalendářní rok

+
+
+ 5. +

Souhrn činnosti za minulý kalendářní rok

+
+
+
+
+
+ 3. +

Souhrn činnosti za minulý kalendářní rok

+
+
+ 6. +

Souhrn činnosti za minulý kalendářní rok

+
+
+
+
+
+
+
+

Spolková místnost

+
+

+ Každý formální spolek má nárok na přístup do spolkové místnosti, která má označení S104 tzv. spolkovka +

+
+
+
+
+
+
+

+ Pravidla spolkovky jsou následující: +

+
+
+
+ +
+
+
+
+
+

Akce a nahlašování akcí

+
+
+
+
+
+
+

+ Pokud chceš pořádat akci na fakultě, je zapotřebí to nejprve nahlásit přes formulář na + akce.pedf.cuni.cz. Pokud se jedná o malou akci vyžadující pouze malý počet učeben + nebo společný prostor pouze po krátkou dobu, tak stačí akci nahlásit o 10 dnů předem (více u organizování akcí) +

+

+ Je možnost požádat o stoly, židle, podporu ajťáků nebo místo na webovkách. Všechny nájmy pro formální spolky jsou bezplatné. +

+
+
+ +
+
+
+
+
+

Odkazy a inspirace

+
+

+ Tady najdeš spolky, které působí na UK:
+ https://cuni.cz/UK-8518.html +

+ Kurzy na různé dovednosti můžeš najít zde:
+ www.naucmese.cz nebo na + https://www.acsa.cz +

+
+
+
+
+ + +
+ + +
+
1 / 3
+ +
Caption Text
+
+ +
+
2 / 3
+ +
Caption Two
+
+ +
+
3 / 3
+ +
Caption Three
+
+ +
+
3 / 3
+ +
Caption Three
+
+ + + + +
+
+ + +
+ + + + +
+
+ +
+
+
+
+

Předpisy a pravidla

+
+

+ Základní předpisy, kterými se spolky řidí jsou:
+

+
    +
  • Tento předpis
    • +
  • Tento předpis
    • +
  • Tento předpis
    • +
+
+
diff --git a/page/zalozit_spolek.html b/page/zalozit_spolek.html new file mode 100644 index 0000000..1dbfdf2 --- /dev/null +++ b/page/zalozit_spolek.html @@ -0,0 +1,6 @@ +
+
+ + +
+
diff --git a/page/zapojit_se.html b/page/zapojit_se.html new file mode 100644 index 0000000..1dbfdf2 --- /dev/null +++ b/page/zapojit_se.html @@ -0,0 +1,6 @@ +
+
+ + +
+
diff --git a/run.sh b/run.sh new file mode 100755 index 0000000..aeafb99 --- /dev/null +++ b/run.sh @@ -0,0 +1,6 @@ +#!/bin/sh + +stylus -w css -o css & +browser-sync . -f . & +cd js; wendy -m 264 -f router.nim -f ../page -e nim js -o:router.js router.nim + diff --git a/svg/bg-circle.svg b/svg/bg-circle.svg new file mode 100644 index 0000000..9add9bf --- /dev/null +++ b/svg/bg-circle.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/svg/bg-square.svg b/svg/bg-square.svg new file mode 100644 index 0000000..b04de97 --- /dev/null +++ b/svg/bg-square.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/svg/cross1.svg b/svg/cross1.svg new file mode 100644 index 0000000..4c313fd --- /dev/null +++ b/svg/cross1.svg @@ -0,0 +1,21 @@ + + + + + + + + + diff --git a/svg/cross2.svg b/svg/cross2.svg new file mode 100644 index 0000000..a755fe7 --- /dev/null +++ b/svg/cross2.svg @@ -0,0 +1,17 @@ + + + + + + + + + diff --git a/svg/menu1.svg b/svg/menu1.svg new file mode 100644 index 0000000..c3b601b --- /dev/null +++ b/svg/menu1.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + diff --git a/svg/menu2.svg b/svg/menu2.svg new file mode 100644 index 0000000..9ce8f3b --- /dev/null +++ b/svg/menu2.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + diff --git a/svg/up-arrow.svg b/svg/up-arrow.svg new file mode 100644 index 0000000..3902e38 --- /dev/null +++ b/svg/up-arrow.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + diff --git a/svg/zobacek.svg b/svg/zobacek.svg new file mode 100644 index 0000000..93fb667 --- /dev/null +++ b/svg/zobacek.svg @@ -0,0 +1,17 @@ + + + + + + + + + +