Source

Modified ago
include mixins/head.pug include mixins/menu.pug include mixins/scroller.pug - const info = require(__dirname + '/public/data/ayaya.json'); const sizeOf = require('image-size'); +head('Ayaya - Old') body.body.body_hidden.body_page_old(data-start='#dae4ff', data-end='#dae4ff') +menu('old') //- Menu button .menu__button.menu__button_old .hamburger.menu__hamburger.hamburger_old .menu__button.menu__button_bottom.menu__button_hidden.menu__button_old //- Hamburger just to keep the button the same size as the main one .hamburger.menu__hamburger.hamburger_hidden //- Main play button .play-button.play-button_main.play-button_main_old#play-button //- Horizontal slide .slider.slider_type_horizontal .slider__wrapper .slider__slide .columns .columns__column.columns__column_md_3 .columns__column.columns__column_md_6.columns__column_centered-content h2.old-title Status +scroller('old') #status .slider__slide .columns .columns__column.columns__column_md_4 img.old-about-us__image(src='/public/images/site/old/aboutus.png') .columns__column.columns__column_md_8 h2.old-title About Us p.old-text #{info.old_description_us} .slider__slide .columns .columns__column.columns__column_md_8 h2.old-title About .old-about__page.old-about__page_active p.old-text #{info.old_description} each page in info.old_characteristics .old-about__page table.old-about__table each chars, name in page tr td(rowspan=chars.length) #{name} td #{chars[0]} if chars[1] tr td #{chars[1]} .old-about__link.old-about__link_hidden.old-about__link_dir_left#about-less | Previous... .old-about__link.old-about__link_dir_right#about-more | ...More .columns__column.columns__column_md_4 img.old-about__image(src='/public/images/site/ayaya_twintail.png') img.old-about__image(src='/public/images/site/ayaya.png') //- Main slide .slider__slide //- Vertical slider .slider.slider_type_vertical .slider__wrapper //- Intro slide .slider__slide .old-welcome h1.old-letter img.old-letter__char(alt="Ayaya", src=`/public/images/site/old/letter_w.png`) each l in 'elcome' .old-letter img.old-letter__char(src=`/public/images/site/old/letter_${l}.png`) img.old-corner.old-corner_lt(src='/public/images/site/old/fancy_corner.png') img.old-corner.old-corner_rt(src='/public/images/site/old/fancy_corner.png') img.old-corner.old-corner_lb(src='/public/images/site/old/fancy_corner.png') img.old-corner.old-corner_rb(src='/public/images/site/old/fancy_corner.png') .slider__slide .marquees .marquee.marquee_left Ayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayaya .marquee.marquee_right Ayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayaya .marquee.marquee_left Ayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayaya .marquee.marquee_right Ayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayaya .marquee.marquee_left Ayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayayaya .slider__slide h2.old-title Songs #music.old-songs //- Divide pages into with 21 songs each //- TODO: Make this more responsive - songsPerPage = 21 each _, i in Array(Math.ceil(info.music.length / songsPerPage)) .old-songs__page(class= !i ? 'old-songs__page_active' : '') each _, j in Array(Math.min(info.music.length - i * songsPerPage, songsPerPage)) - const song = info.music[i * songsPerPage + j] .old-song.song(data-url!=`${song.url}`) .old-song__info .old-song__player.old-song__player_paused .play-button.play-button_old svg.old-icon(viewbox="0 0 32 32") path(stroke-miterlimit="10" d="M12,9l12,7l-12,7V9z") h3.old-song_title each char, k in song.title //- If the title is in japanese then double the spacing - let space = song.title.split('').find(c => c.charCodeAt() >= 0x3000 && c.charCodeAt() <= 0x30ff) ? 30 : 15 span(style=`transform: translateX(-50%) rotateZ(${k * space}deg)`) #{char} .old-songs__link.old-songs__link_hidden.old-songs__link_dir_left#songs-less | Previous Songs .old-songs__link.old-songs__link_dir_right#songs-more | More Songs audio#player canvas.old-songs__visualizer#old-visualizer .slider__slide#mousearea #board.old-board .old-board__board img.old-board__img(src='/public/images/site/old/board.png') .old-board__text img.old-board__img(src='/public/images/site/old/do-it-for-her.png') .old-board__layer(data-cat='kisekae') img.old-board__img(src='/public/images/galleries/kisekae-aya-7.jpg') .old-board__link | Kisekae .old-board__layer(data-cat='minecraft') img.old-board__img(src='/public/images/galleries/minecraft-aya-1.jpg') .old-board__link | Minecraft .old-board__layer(data-cat='commissions') img.old-board__img(src='/public/images/galleries/commission-aya-7.jpg') .old-board__link | Commissions .old-board__layer(data-cat='official') img.old-board__img(src='/public/images/galleries/official-aya-5.jpg') .old-board__link | Official Art .old-board__layer(data-cat='oc') img.old-board__img(src='/public/images/galleries/oc-aya-1.png') .old-board__link | OC .old-board__layer(data-cat='video') video.old-board__img(muted="true", src='https://aya.volk.pt/video/video-aya-7.webm') .old-board__link | Videos .old-board__layer(data-cat='other') img.old-board__img(src='/public/images/galleries/other-aya-1.jpg') .old-board__link | Other .old-board__layer(data-cat='manga') img.old-board__img(src='/public/images/galleries/manga-aya-4.jpg') .old-board__link | Manga .old-board__layer(data-cat='3d') img.old-board__img(src='/public/images/galleries/3d-aya-5.jpg') .old-board__link | 3D .old-board__layer(data-cat='screenshots') img.old-board__img(src='/public/images/galleries/screenshot-aya-3.jpg') .old-board__link | Screenshots .old-board__layer(data-cat='fanart') img.old-board__img(src='/public/images/galleries/fanart-aya-2.jpg') .old-board__link | Fanart .slider__slide .columns .columns__column.columns__column_md_8 h2.old-title.old-title_small Comments form.old-form#comment-form(action='https://aya.volk.pt/comments', method='POST') label.old-form__label(for='comments-name') Name: | | input.old-form__input.old-form__input_single#comment-name(name='name', type='text', placeholder='(optional)') textarea.old-form__input.old-form__input_multi#comment-text(name="text", placeholder='Comment') .old-form__controls .old-form__reply#replying-to .old-form__submit#submit | Submit svg.old-form__icon.old-icon(viewbox="0 0 32 32") path.old-form__path(stroke-miterlimit="10" d="m30.76 25.49c-1.5812 1.5681-3.101 2.9516-4.5596 4.5197-0.60059 0.64567-0.91928 0.4612-1.4586 0-2.6965-2.7672-5.4789-5.5343-8.1754-8.3015-0.57608-0.55343-0.89476-0.55343-1.4341 0-2.672 2.7672-5.4299 5.4421-8.0896 8.2092-0.72316 0.73791-1.1154 0.64567-1.7773-0.092241-1.0909-1.1991-2.2063-2.306-3.4442-3.4128-0.89476-0.73791-0.66188-1.1991 0.061285-1.937 2.672-2.5827 5.2583-5.2576 7.9548-7.8403 0.66188-0.64567 0.68639-1.0146 0.02451-1.6603-2.672-2.5827-5.2583-5.2576-7.9548-7.8403-0.85799-0.83015-0.74768-1.2913 0.061285-2.0293 1.1522-1.0146 2.243-2.0293 3.2481-3.2284 0.68639-0.75636 1.1154-0.90394 1.9489-0.092239 2.5862 2.7672 5.2828 5.3498 7.869 8.0248 0.66188 0.64567 1.0051 0.64567 1.667 0 2.5862-2.6749 5.3073-5.2576 7.869-8.0248 0.80896-0.8117 1.2625-0.70101 1.9856 0.092239 1.0909 1.1991 2.243 2.3982 3.4442 3.4128 0.74768 0.73791 0.57608 1.1069-0.06129 1.7525-2.6965 2.5827-5.3441 5.2576-8.0406 7.9325-0.66188 0.64567-0.72316 1.0146-0.02451 1.6603z") .columns__column.columns__column_md_4 +scroller('old') .old-comments#comments //- Anchors .anchors.anchors_hidden#anchors img.anchor.anchor_bottom.anchor_left-3(src='/public/images/site/old/status.png') img.anchor.anchor_middle.anchor_left-2(src='/public/images/site/old/us.png') img.anchor.anchor_top.anchor_left-1(src='/public/images/site/old/about.png') img.anchor.anchor_main(src='/public/images/site/old/main.png') img.anchor.anchor_top.anchor_right-3(src='/public/images/site/old/songs.png') img.anchor.anchor_middle.anchor_right-2(src='/public/images/site/old/gallery.png') img.anchor.anchor_bottom.anchor_right-1(src='/public/images/site/old/comments.png') .anchors__tooltip#tooltip .old-gallery__screen#gallery-screen .old-gallery__link#gallery-back | Back each images, name in info.gallery .old-gallery__list(id=`gallery-${name}`) .slider.slider_type_horizontal-list.old-gallery__slider .slider__wrapper each filename in images - dimensions = sizeOf(`${__dirname}/public/images/galleries/${filename}`) .slider__slide.old-gallery__frame(data-src=filename, style=`height: 15vh; width: ${15 * dimensions.width / dimensions.height}vh`) .old-gallery__list(id='gallery-video') .slider.slider_type_horizontal-list.old-gallery__slider .slider__wrapper each filename in info.old_videos .slider__slide.old-gallery__frame(data-src=filename, style=`height: 15vh; width: ${15 * 16 / 9}vh`) script(src='/public/scripts/main.min.js')