diff --git a/_assets/index.js b/_assets/index.js index 898405a..e69de29 100644 --- a/_assets/index.js +++ b/_assets/index.js @@ -1,20 +0,0 @@ -import { init as init_lens } from './js/lens.js' -import { init as init_cartridge } from './js/cartridge'; -import { init as init_pong } from './js/pong'; - - -// Test import of an asset -// import webpackLogo from '@/images/webpack-logo.svg' - -// Test import of styles -import './index.scss'; - - -// let main = document.getElementsByTagName(main); -// console.log('name', main[0].getAttribute('name')) -// if (main[0].getAttribute('name') === "home"){ - init_lens(); - console.log('init lens'); - init_cartridge(); - init_pong(); -// } diff --git a/_assets/index.scss b/_assets/index.scss deleted file mode 100644 index 5ab2a50..0000000 --- a/_assets/index.scss +++ /dev/null @@ -1 +0,0 @@ -@import '../src/_scss/index'; diff --git a/_assets/js/cartridge.js b/_assets/js/cartridge.js deleted file mode 100644 index 05d4653..0000000 --- a/_assets/js/cartridge.js +++ /dev/null @@ -1,85 +0,0 @@ -const CART_SIZE = { - x: 300, - y: 200 -} - -function slot_position(){ - let slot = document.querySelector('#slot'); - return slot.getBoundingClientRect() -} - -function list_carts(){ - let carts= document.querySelectorAll('.cartridge-metadata'); - return carts; - -} - - -function showPopups(){ - let carts = list_carts(); - - let cartPopups = carts.forEach((cart) => { - console.log('cart', cart); - let popup = window.open( - cart.getAttribute('url'), - cart.getAttribute('title'), - `popup=true,width=${CART_SIZE.x+10},height=${CART_SIZE.y+10}` - ) - popup.screen - }) -} - - - -// function store_slot_position(){ -// let slot_pos = slot_position(); -// console.log(slot_pos); -// window.setTimeout(poll_position, 1000); -// } - -function store_position(){ - let name = document.querySelector('.cartridge .label').textContent; - let position = { - x: window.screenX, - y: window.screenY, - width: window.outerWidth, - height: window.outerHeight - }; - - localStorage.setItem(name, JSON.stringify(position)); - window.setTimeout(store_position, 100); - console.log('store position', position); -} - -function console_message(msg){ - // console.log('console message', msg); - let cart_position = JSON.parse(msg.newValue); - cart_position['name'] = String(msg.key).trim(); - console.log(cart_position) -} - -function init_console(){ - showPopups(); - // store_slot_position(); - - // window.addEventListener('resize', () => { - // store_slot_position(); - // }) - - window.addEventListener('storage', (event) => {console_message(event)}) -} - -function init_cartridge(){ - console.log('init cartridge') - store_position(); -} - -export function init(){ - window.showPopups = showPopups; - let page_type = document.querySelector('main').getAttribute('page'); - if (page_type === 'console'){ - init_console(); - } else if (page_type === "cartridge"){ - init_cartridge(); - } -} diff --git a/_assets/js/lens.js b/_assets/js/lens.js deleted file mode 100644 index 70dd90e..0000000 --- a/_assets/js/lens.js +++ /dev/null @@ -1,87 +0,0 @@ -// OK so the next thing to do is make it so it's blurry when the screen is too -// big or too small, and thne prompt someone to make their screen bigger or smaller -// to be a lens and then you have to move the window around to be able to see the different -// links on the page - -const FOCUS_SIZE = 400; - -function _init(){ - let root = document.querySelector(':root'); - let lens = document.getElementsByClassName('lens')[0]; - let filter = document.getElementById('filter'); - let hid_hint = false; - - if (!lens){ - console.log('not doing lens') - return - } - - // let FOCUS_SIZE = root.style.getPropertyValue('--lens-size') - - root.style.setProperty( - '--screen-width', - `${window.screen.availWidth}px` - ); - root.style.setProperty( - '--screen-height', - `${window.screen.availHeight}px` - ); - function set_position(){ - lens.style.transform = `translate(-${window.screenX}px, -${window.screenY}px)` - setTimeout(set_position, 10); - } - - function get_blur(){ - return Math.max( - Math.sqrt( - ( - Math.abs(window.innerHeight-FOCUS_SIZE) + - Math.abs(window.innerWidth-FOCUS_SIZE) - ) / 4)-5, - 0) - } - - function set_blur(){ - let blur_radius = get_blur() - filter.style.setProperty( - '--blur-radius', - `${blur_radius}px` - ) - setTimeout(set_blur, 50); - } - - function show_hint(){ - if (get_blur() > 3) { - let hint = document.getElementById('hint'); - hint.classList.remove('hidden') - - setTimeout(check_hint, 2000); - } - } - - function check_hint(){ - if (get_blur() < 3){ - let hint = document.getElementById('hint'); - hint.classList.add('rehidden'); - hid_hint = true; - - } - if (hid_hint === false){ - setTimeout(check_hint, 100); - } - } - - set_position(); - set_blur(); - setTimeout(show_hint, 2000); - // setTimeout(set_size,100); - // set_size() -} - -export function init(){ - - // document.addEventListener('load', () => { - // _init(); - // }) - _init(); -} diff --git a/_assets/js/pong.js b/_assets/js/pong.js deleted file mode 100644 index 9da2ccb..0000000 --- a/_assets/js/pong.js +++ /dev/null @@ -1,248 +0,0 @@ -const PADDING = 50; - -const PADDLE_SIZE = { - width: 500, - height: 30, -} -const BALL_SIZE = { - width: 50, - height: 30 -} - -const PADDLE_POSITION = { - x: (window.screen.availWidth / 2) - (PADDLE_SIZE.width/2), - y: window.screen.availHeight - PADDLE_SIZE.height - PADDING -} - -const TARGET_SIZE = { - width: 300, - height: 100 -} - -const TARGET_GRID = { - x: 4, - y: 3 -} - - -const PADDLE_MOVE = 30; - - -function shuffleArray(array) { - return array.map(value => ({ value, sort: Math.random() })) - .sort((a, b) => a.sort - b.sort) - .map(({ value }) => value) -} - - -function plan_grid(){ - let n_targets = TARGET_GRID.x * TARGET_GRID.y; - let pages, page_objects; -// get pages that are real pages - pages = document.querySelectorAll('.page-metadata'); - page_objects = Array.from(pages).map((page) => { - return { - url: page.getAttribute('url') - } - }) - // pad end with blanks - page_objects = Object.assign(new Array(n_targets).fill({url:'blank.html'}), page_objects); - // shuffle array order - page_objects = shuffleArray(page_objects) - - // arrange on a grid! - page_objects = page_objects.map((page, idx) => { - let col = idx % TARGET_GRID.x; - let row = Math.floor(idx / TARGET_GRID.x); - let col_grid_width = (window.screen.availWidth-(PADDING*2)) / TARGET_GRID.x - - return { - ...page, - x: (col_grid_width * col) + PADDING, - y: (PADDING*2 + TARGET_SIZE.height) * row - } - }) - - return page_objects -} - -function popupPosition(popup){ - let pos = { - left: popup.screenLeft, - right: popup.screenLeft + popup.outerWidth, - top: popup.screenTop, - bottom: popup.screenTop + popup.outerHeight - } - pos.centerX = (pos.left + pos.right) / 2 - pos.centerY = (pos.top + pos.bottom) / 2 - return pos -} - -function checkIntersect(a, b){ - let pos_a = popupPosition(a); - let pos_b = popupPosition(b); - // console.log(pos_a,pos_b) - // check if intersect - let overlap = !( - pos_a.right < pos_b.left || - pos_a.left > pos_b.right || - pos_a.bottom < pos_b.top || - pos_a.top > pos_b.bottom - ) - - if (overlap === false){ - return false - } - - // if overlap, check what side we are on - if (Math.abs(pos_a.centerX-pos_b.centerX) > Math.abs(pos_a.centerY-pos_b.centerY)){ - // more X difference than y difference, we are left or right - if (pos_a.centerX > pos_b.centerX){ - // a is to the right of b - return('right') - } else { - return('left') - } - } else { - if (pos_a.centerY > pos_b.centerY){ - // a is below b - return('bottom') - } else { - return('top') - } - } -} - -function endGame(popups, ball, paddle){ -for (let popup of popups){ - popup.popup.close() -} -ball.popup.close(); -paddle.close(); -} - -function handleIntersect(popup, popups){ - if (popup.url === "blank.html"){ - popup.popup.close() - let index = popups.indexOf(popup); - if (index > -1){ - popups.splice(index, 1); - } - console.log('closing popup') - return false - } else { - window.location = popup.url - console.log('going to new page!') - return true; - } -} - -function updateBall(ball, popups, paddle){ - let end_game = false; - ball.position = popupPosition(ball.popup) - // console.log(ball.position, popups.popup) - // check bounce - if (ball.position.right === window.screen.availWidth || ball.position.left === 0){ - ball.velocity.x *= -1 - } - if (ball.position.top === screen.availTop){ - ball.velocity.y *= -1 - } - - // check intersections with other windows - for (let popup of popups){ - // console.log(popup.popup) - let intersected = checkIntersect(ball.popup, popup.popup) - if (intersected === 'top' || intersected === 'bottom'){ - ball.velocity.y *= -1; - } else if (intersected === 'left' || intersected === 'right'){ - ball.velocity.x *= -1; - } - if (intersected){ - console.log(intersected); - end_game = handleIntersect(popup, popups); - break - } - - } - - if (checkIntersect(ball.popup, paddle) && ball.velocity.y < 0){ - ball.velocity.y *= -1; - } - - if (ball.position.bottom === window.screen.availHeight && ball.velocity.y < 0){ - // ball died :( - // end_game = true; - ball.popup.close(); - ball = init_ball(); - } - - if (end_game){ - endGame(popups, ball, paddle) - } else { - ball.popup.moveBy(ball.velocity.x, -ball.velocity.y) - window.setTimeout(() => {updateBall(ball, popups, paddle)}, 100) -} -} - -function init_ball(){ - let ball_popup = window.open('ball.html', 'ball', `popup=true,width=${BALL_SIZE.width},height=${BALL_SIZE.height},screenX=${PADDLE_POSITION.x},screenY=${PADDLE_POSITION.y-BALL_SIZE.height}`) - ball_popup.moveTo(PADDLE_POSITION.x,PADDLE_POSITION.y) - - let ball = { - popup: ball_popup, - velocity: {x: 20, y: 20} - }; - return ball -} - - -function init_controller(){ - let grid = plan_grid(); - console.log(grid); - let popups = grid.map((page, idx) => { - return{ ...page, - popup: window.open(page.url, `target-${idx}`, `popup=true,width=${TARGET_SIZE.width},height=${TARGET_SIZE.height},left=${page.x},top=${page.y}`) - } - }) - let paddle = window.open('paddle.html', 'paddle', `popup=true,width=${PADDLE_SIZE.width},height=${PADDLE_SIZE.height},screenX=${PADDLE_POSITION.x},screenY=${PADDLE_POSITION.y}`) - - let ball = init_ball(); - updateBall(ball, popups, paddle); -} - -function init_paddle(){ - window.resizeTo(PADDLE_SIZE.width, PADDLE_SIZE.height); - window.moveTo( - PADDLE_POSITION.x, - PADDLE_POSITION.y - ) - - document.addEventListener('keydown', (event) => { - if (event.key == "ArrowLeft"){ - if (window.screenX > PADDLE_MOVE) { - window.moveBy(-PADDLE_MOVE, 0) - } else { - window.moveBy(-window.screenX, 0); - } - } else if (event.key == "ArrowRight"){ - let right_edge = window.screenX + window.outerWidth; - if (right_edge < window.screen.availWidth - PADDLE_MOVE){ - window.moveBy(PADDLE_MOVE, 0) - } else { - window.moveBy(window.screen.availWidth - right_edge, 0) - } - } - }) -} - - - -export function init(){ - let page_type = document.querySelector('main').getAttribute('page'); - if (page_type === 'pong'){ - init_controller(); - } else if (page_type === "paddle"){ - init_paddle(); - } -} diff --git a/_assets/template.html b/_assets/template.html deleted file mode 100644 index 71b5460..0000000 --- a/_assets/template.html +++ /dev/null @@ -1,22 +0,0 @@ - - - -{% include head.html %} - - - -{% if page.navigation %} -{% include navigation.html %} -{% endif %} - -
- - {{ content }} - -
- - - -{% include footer.html %} - - diff --git a/src/Gemfile b/src/Gemfile deleted file mode 100644 index ff2c342..0000000 --- a/src/Gemfile +++ /dev/null @@ -1,33 +0,0 @@ -source "https://rubygems.org" -# Hello! This is where you manage which Jekyll version is used to run. -# When you want to use a different version, change it below, save the -# file and run `bundle install`. Run Jekyll with `bundle exec`, like so: -# -# bundle exec jekyll serve -# -# This will help ensure the proper Jekyll version is running. -# Happy Jekylling! -gem "jekyll", "~> 4.3.2" -# This is the default theme for new Jekyll sites. You may change this to anything you like. -gem "minima", "~> 2.5" -# If you want to use GitHub Pages, remove the "gem "jekyll"" above and -# uncomment the line below. To upgrade, run `bundle update github-pages`. -# gem "github-pages", group: :jekyll_plugins -# If you have any plugins, put them here! -group :jekyll_plugins do - gem "jekyll-feed", "~> 0.12" -end - -# Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem -# and associated library. -platforms :mingw, :x64_mingw, :mswin, :jruby do - gem "tzinfo", ">= 1", "< 3" - gem "tzinfo-data" -end - -# Performance-booster for watching directories on Windows -gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin] - -# Lock `http_parser.rb` gem to `v0.6.x` on JRuby builds since newer versions of the gem -# do not have a Java counterpart. -gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby] diff --git a/src/_layouts/cartridge.html b/src/_layouts/cartridge.html deleted file mode 100644 index 8ab28b2..0000000 --- a/src/_layouts/cartridge.html +++ /dev/null @@ -1,11 +0,0 @@ ---- -layout: default ---- -
-
- -
-
- {{ page.title }} -
-
diff --git a/src/_layouts/console.html b/src/_layouts/console.html deleted file mode 100644 index fc9281f..0000000 --- a/src/_layouts/console.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -layout: default ---- - -
- -
- -
- -
-
- -
-
- I AM A SLOT PUT THINGS IN ME -
-
- - {% for cartridge in site.pages %} - {% if cartridge.layout == "cartridge" %} - - {% endif %} - {% endfor %} -
diff --git a/src/_layouts/pong.html b/src/_layouts/pong.html deleted file mode 100644 index 7aaf17d..0000000 --- a/src/_layouts/pong.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -layout: default ---- - -
- -
{{ content }}
- - -
- - diff --git a/src/_scss/pages/console.scss b/src/_scss/pages/console.scss deleted file mode 100644 index edca7aa..0000000 --- a/src/_scss/pages/console.scss +++ /dev/null @@ -1,60 +0,0 @@ -.cartridge-list { - //display: none; -} - -#console { - - #container { - position: absolute; - bottom: 20px; - right: 20px; - height: 200px; - width: 50%; - border: 2px solid black; - - - #slot{ - border: 3px solid black; - width: 300px; - height: 50px; - - } - #slot-label { - font-family: monospace; - top: 3.5em; - position:relative; - } - - } - - #popups { - position:absolute; - top: 20%; - left: 20%; - } - - & * { - position: absolute; - } -} - -.cartridge { - position:absolute; - top:0; - left:0; - width: 300px; - height: 200px; - border: 2px solid black; - - box-shadow: 5px 5px black; - - .label { - position: absolute; - top: 20px; - left: 20px; - font-family: monospace; - } - - - -} diff --git a/src/_scss/pages/home.scss b/src/_scss/pages/home.scss deleted file mode 100644 index 4324009..0000000 --- a/src/_scss/pages/home.scss +++ /dev/null @@ -1,76 +0,0 @@ -:root { - --screen-width: 100vw; - --screen-height: 100vh; - --blur-radius: 100px; - --lens-size: 400px; - --hint-color: deeppink; -} - -.lens { - - //--screen-left: 0; - //--screen-top: 0; - position: absolute; - width: var(--screen-width); - height: var(--screen-height); - //top: var(--screen-top); - //left: var(--screen-left); - top: 0; - left: 0; - - transition: transform ease 100ms; -} - -#filter { - z-index: 999; - width: 100%; - height: 100%; - left:0; - top:0; - position:absolute; - backdrop-filter: blur(var(--blur-radius)); - //background-color: #ffffffff; -} - -#hint { - width: var(--lens-size); - height: var(--lens-size); - position: absolute; - border: 3px solid var(--hint-color); - top: calc(50% - var(--lens-size)/2); - left: calc(50% - var(--lens-size)/2); - border-radius: calc(var(--lens-size)); - transition: opacity 1000ms; - opacity: 100%; - z-index: 10000; - - text-align: center; - backdrop-filter: blur(10px); - - p { - font-family: Times, "Times New Roman", serif; - background-color: deeppink; - font-weight: bold; - font-style: italic; - width: 50%; - color: white; - margin: auto; - font-size: 2em; - top: 40%; - position: relative; - //left: 50%; - } - - &.hidden, &.rehidden { - border-color: #ff000000; - opacity: 0%; - //transition: all 1000ms; - - } - - &.hidden { - transition: all 0ms; - } -} - - diff --git a/src/_scss/pages/pong.scss b/src/_scss/pages/pong.scss deleted file mode 100644 index d38a9f2..0000000 --- a/src/_scss/pages/pong.scss +++ /dev/null @@ -1,28 +0,0 @@ -#pong { - width: 100%; - height: 100%; - position: absolute; - left: 0; - top: 0; - - .content { - text-align: center; - font: { - family: monospace; - size: 3em; - } - - } - - .page-list { - display: none; - } -} - -.pong-ball { - width: 50px; - height: 50px; - left: 0; - top: 0; - position: absolute; -} diff --git a/src/cartridge/blog.md b/src/cartridge/blog.md deleted file mode 100644 index 93be6d7..0000000 --- a/src/cartridge/blog.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -layout: cartridge -title: blog -page_name: cartridge ---- diff --git a/src/cartridge/index.md b/src/cartridge/index.md deleted file mode 100644 index 7b35029..0000000 --- a/src/cartridge/index.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -layout: console -page_name: console ---- diff --git a/src/img/ball.png b/src/img/ball.png deleted file mode 100644 index 8b11187..0000000 Binary files a/src/img/ball.png and /dev/null differ diff --git a/src/pong/about.md b/src/pong/about.md deleted file mode 100644 index b3447a0..0000000 --- a/src/pong/about.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -title: about -page_name: target -layout: pong -color: blue ---- - -ABOUT diff --git a/src/pong/ball.md b/src/pong/ball.md deleted file mode 100644 index 5ce6404..0000000 --- a/src/pong/ball.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -layout: pong -title: ball -page_name: ball ---- - - diff --git a/src/pong/blank.md b/src/pong/blank.md deleted file mode 100644 index 3b418f3..0000000 --- a/src/pong/blank.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: target -page_name: blank_target -layout: pong ---- diff --git a/src/pong/blog.md b/src/pong/blog.md deleted file mode 100644 index a97040a..0000000 --- a/src/pong/blog.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: blog -page_name: target -layout: pong -color: pink ---- -BLOG diff --git a/src/pong/index.md b/src/pong/index.md deleted file mode 100644 index fe2213d..0000000 --- a/src/pong/index.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -layout: pong -page_name: pong - ---- - diff --git a/src/pong/paddle.md b/src/pong/paddle.md deleted file mode 100644 index 2020959..0000000 --- a/src/pong/paddle.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -layout: pong -page_name: paddle -title: paddle ----