From 598e15a8d4a011abcb45b9422aa816fc32ca5c6a Mon Sep 17 00:00:00 2001
From: jauntyjocularjay <77408854+jauntyjocularjay@users.noreply.github.com>
Date: Fri, 17 May 2024 11:44:22 -0700
Subject: [PATCH 1/5] formatted cssobj
---
Gems.mjs | 141 +++++++++++++++++++++----------------------------------
1 file changed, 54 insertions(+), 87 deletions(-)
diff --git a/Gems.mjs b/Gems.mjs
index 80aed09..7602971 100644
--- a/Gems.mjs
+++ b/Gems.mjs
@@ -77,95 +77,62 @@ const IMG =
}
const css = {
- html: [
- 'background-color: #444',
- 'color: #fff'
- ],
- '.field': [
- 'width: 512px',
- 'margin: 0 auto'
- ],
- '.card': [
- 'background-color: #333',
- 'border-radius: 16px',
- 'box-shadow: 2px 2px 1px #000, inset 1px 1px 1px #fff'
- ],
- '.gem': [
- 'animation: fall 2s ease 0s 1 normal forwards'
- ],
- '@keyframes fall { 0%' : [
- 'animation-timing-function: ease-in',
- 'opacity: 0',
- 'transform: translateY(-800%)'
- ],
- '@keyframes fall { 38%' : [
- 'animation-timing-function: ease-out',
- 'opacity: 1',
- 'transform: translateY(0)',
- ],
- '@keyframes fall { 55%' : [
- 'animation-timing-function: ease-in',
- 'transform: translateY(-65px)'
- ],
- '@keyframes fall { 72%' : [
- 'animation-timing-function: ease-out',
- 'transform: translateY(0)'
- ],
- '@keyframes fall { 81%' : [
- 'animation-timing-function: ease-in',
- 'transform: translateY(-28px)'
- ],
- '@keyframes fall { 90%' : [
- 'animation-timing-function: ease-out',
- 'transform: translateY(0)'
- ],
- '@keyframes fall { 95%' : [
- 'animation-timing-function: ease-in',
- 'transform: translateY(-8px)'
- ],
- '@keyframes fall { 100%' : [
- 'animation-timing-function: ease-out',
- 'transform: translateY(0)'
- ],
+ html: {
+ 'background-color': '#444',
+ 'color': '#fff'
+ },
+ '.field': {
+ 'width': '512px',
+ 'margin': '0 auto'
+ },
+ '.card': {
+ 'background-color': '#333',
+ 'border-radius': '16px',
+ 'box-shadow': '2px 2px 1px #000, inset 1px 1px 1px #fff'
+ },
+ '.gem': {
+ 'animation': 'fall 2s ease 0s 1 normal forwards'
+ },
+ '@keyframes': {
+ 'fall': {
+ '0%' : {
+ 'animation-timing-function': 'ease-in',
+ opacity: '0',
+ transform: 'translateY(-800%)'
+ },
+ '38%': {
+ 'animation-timing-function': 'ease-out',
+ opacity: '1',
+ transform: 'translateY(0)',
+ },
+ '55%' : {
+ 'animation-timing-function': 'ease-in',
+ transform: 'translateY(-65px)'
+ },
+ '72%' : {
+ 'animation-timing-function': 'ease-out',
+ transform: 'translateY(0)'
+ },
+ '81%' : {
+ 'animation-timing-function': 'ease-in',
+ transform: 'translateY(-28px)'
+ },
+ '90%' : {
+ 'animation-timing-function': 'ease-out',
+ transform: 'translateY(0)'
+ },
+ '95%' : {
+ 'animation-timing-function': 'ease-in',
+ transform: 'translateY(-8px)'
+ },
+ '100%' : {
+ 'animation-timing-function': 'ease-out',
+ transform: 'translateY(0)'
+ },
+ }
+ }
}
-/*
- '@keyframes fall { 0%' : [
- 'animation-timing-function: ease-in',
- 'opacity: 0',
- 'transform: translateY(-800%)'
- ],
- '@keyframes fall { 38%' : [
- 'animation-timing-function: ease-out',
- 'opacity: 1',
- 'transform: translateY(0)',
- ],
- '@keyframes fall { 55%' : [
- 'animation-timing-function: ease-in',
- 'transform: translateY(-65px)'
- ],
- '@keyframes fall { 72%' : [
- 'animation-timing-function: ease-out',
- 'transform: translateY(0)'
- ],
- '@keyframes fall { 81%' : [
- 'animation-timing-function: ease-in',
- 'transform: translateY(-28px)'
- ],
- '@keyframes fall { 90%' : [
- 'animation-timing-function: ease-out'
- 'transform: translateY(0)'
- ],
- '@keyframes fall { 95%' : [
- 'animation-timing-function: ease-in'
- 'transform: translateY(-8px)'
- ],
- '@keyframes fall { 100%' : [
- 'animation-timing-function: ease-out',
- 'transform: translateY(0)'
- ],
-*/
-
class Gem {
constructor(img=null)
From fe88984cceb52c73faf6c869d2452bddc2c19259 Mon Sep 17 00:00:00 2001
From: jauntyjocularjay <77408854+jauntyjocularjay@users.noreply.github.com>
Date: Fri, 17 May 2024 12:14:22 -0700
Subject: [PATCH 2/5] stop editing here, perfect in vjsc
---
Gems.mjs | 34 ++++++++++++++++++----------------
vjsc | 2 +-
2 files changed, 19 insertions(+), 17 deletions(-)
diff --git a/Gems.mjs b/Gems.mjs
index 7602971..8a8f8f2 100644
--- a/Gems.mjs
+++ b/Gems.mjs
@@ -77,21 +77,23 @@ const IMG =
}
const css = {
- html: {
- 'background-color': '#444',
- 'color': '#fff'
- },
- '.field': {
- 'width': '512px',
- 'margin': '0 auto'
- },
- '.card': {
- 'background-color': '#333',
- 'border-radius': '16px',
- 'box-shadow': '2px 2px 1px #000, inset 1px 1px 1px #fff'
- },
- '.gem': {
- 'animation': 'fall 2s ease 0s 1 normal forwards'
+ tag: {
+ html: {
+ 'background-color': '#444',
+ color: '#fff'
+ },
+ '.field': {
+ width: '512px',
+ margin: '0 auto'
+ },
+ '.card': {
+ 'background-color': '#333',
+ 'border-radius': '16px',
+ 'box-shadow': '2px 2px 1px #000, inset 1px 1px 1px #fff'
+ },
+ '.gem': {
+ 'animation': 'fall 2s ease 0s 1 normal forwards'
+ },
},
'@keyframes': {
'fall': {
@@ -248,4 +250,4 @@ document.body.appendChild(play.field.container.element)
// blocka.classList.add('gem1')
// console.log(blocka)
-addAdoptedStyleSheet( parseCSSObject(css) )
+// addAdoptedStyleSheet( parseCSSObject(css) )
diff --git a/vjsc b/vjsc
index 6b7908b..8d26ca0 160000
--- a/vjsc
+++ b/vjsc
@@ -1 +1 @@
-Subproject commit 6b7908b1b4da30541ec99fc2a4d13e84b7e090a5
+Subproject commit 8d26ca0919da72ff30f7ce71f814270e3864a988
From 924da0f133effee98dc7dc9f7e4f7d38e2c7d863 Mon Sep 17 00:00:00 2001
From: GeorgeSchafer <77408854+GeorgeSchafer@users.noreply.github.com>
Date: Sat, 18 May 2024 17:49:13 -0700
Subject: [PATCH 3/5] updated modules, fixed animation for falling
---
Gems.mjs | 76 +++++-----------------------------------------------
gems.css | 57 +++++++++++++++++++++++++++++++++++++++
index.html | 1 +
package.json | 1 +
style.css | 4 ---
vjsc | 2 +-
6 files changed, 67 insertions(+), 74 deletions(-)
create mode 100644 gems.css
delete mode 100644 style.css
diff --git a/Gems.mjs b/Gems.mjs
index 8a8f8f2..50410e0 100644
--- a/Gems.mjs
+++ b/Gems.mjs
@@ -58,7 +58,7 @@ import {
// Functions
getStylesheetByFileName,
addAdoptedStyleSheet,
- parseCSSObject
+ JSONCSS,
} from './vjsc/vanilla.mjs'
import { Grid } from './grid/Grid.mjs'
@@ -76,65 +76,6 @@ const IMG =
gray: './img/gray.svg'
}
-const css = {
- tag: {
- html: {
- 'background-color': '#444',
- color: '#fff'
- },
- '.field': {
- width: '512px',
- margin: '0 auto'
- },
- '.card': {
- 'background-color': '#333',
- 'border-radius': '16px',
- 'box-shadow': '2px 2px 1px #000, inset 1px 1px 1px #fff'
- },
- '.gem': {
- 'animation': 'fall 2s ease 0s 1 normal forwards'
- },
- },
- '@keyframes': {
- 'fall': {
- '0%' : {
- 'animation-timing-function': 'ease-in',
- opacity: '0',
- transform: 'translateY(-800%)'
- },
- '38%': {
- 'animation-timing-function': 'ease-out',
- opacity: '1',
- transform: 'translateY(0)',
- },
- '55%' : {
- 'animation-timing-function': 'ease-in',
- transform: 'translateY(-65px)'
- },
- '72%' : {
- 'animation-timing-function': 'ease-out',
- transform: 'translateY(0)'
- },
- '81%' : {
- 'animation-timing-function': 'ease-in',
- transform: 'translateY(-28px)'
- },
- '90%' : {
- 'animation-timing-function': 'ease-out',
- transform: 'translateY(0)'
- },
- '95%' : {
- 'animation-timing-function': 'ease-in',
- transform: 'translateY(-8px)'
- },
- '100%' : {
- 'animation-timing-function': 'ease-out',
- transform: 'translateY(0)'
- },
- }
- }
-}
-
class Gem {
constructor(img=null)
@@ -188,8 +129,11 @@ class Line
const spot = ['a','b','c','d','e','f','g','h']
for( let i = 0; i < 8; i++)
{
- const gem = Gem.random(spot[i])
- this.flexBox.element.appendChild(gem.img.element)
+ setTimeout(() => {
+ const gem = Gem.random(spot[i])
+ this.flexBox.element.appendChild(gem.img.element)
+ }, 10000)
+
}
}
@@ -244,10 +188,4 @@ class PlayField {
const play = new PlayField(8)
-document.body.appendChild(play.field.container.element)
-
-// let blocka = document.body.querySelector('#line0').querySelector('#spot-c')
-// blocka.classList.add('gem1')
-// console.log(blocka)
-
-// addAdoptedStyleSheet( parseCSSObject(css) )
+document.body.appendChild(play.field.container.element)
\ No newline at end of file
diff --git a/gems.css b/gems.css
new file mode 100644
index 0000000..fe0770e
--- /dev/null
+++ b/gems.css
@@ -0,0 +1,57 @@
+html {
+ background-color: #444;
+ color: #fff;
+}
+
+.field {
+ width: 512px;
+ margin: 0 auto;
+}
+
+.card {
+ background-color: #333;
+ border-radius: 16px;
+ box-shadow: 2px 2px 1px #000, inset 1px 1px 1px #fff;
+}
+
+.gem {
+ animation: fall 2s ease 0s 1 normal forwards;
+}
+
+@keyframes fall {
+ 00% {
+ animation-timing-function: ease-in;
+ opacity: 0;
+ transform: translateY(-800%);
+ }
+ 38% {
+ animation-timing-function: ease-out;
+ opacity: 1;
+ transform: translateY(0);
+ }
+ 55% {
+ animation-timing-function: ease-in;
+ transform: translateY(-65px)
+ }
+ 72% {
+ animation-timing-function: ease-out;
+ transform: translateY(0)
+ }
+ 81% {
+ animation-timing-function: ease-in;
+ transform: translateY(-28px)
+ }
+ 90% {
+ animation-timing-function: ease-out;
+ transform: translateY(0)
+ }
+ 95% {
+ animation-timing-function: ease-in;
+ transform: translateY(-8px)
+ }
+ 99% {
+ animation-timing-function: ease-out;
+ transform: translateY(0)
+ }
+}
+
diff --git a/index.html b/index.html
index 44b08e1..ffbafe7 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
+
Gems
diff --git a/package.json b/package.json
index efa6b0a..d051ee9 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
"dev2beta": "bash sh/gitDev2Beta.sh",
"beta2master": "bash sh/gitBeta2Master.sh",
"dev2master": "bash sh/gitDev2Master.sh",
+ "submodule": "git submodule update --init --recursive",
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
diff --git a/style.css b/style.css
deleted file mode 100644
index cd9ec62..0000000
--- a/style.css
+++ /dev/null
@@ -1,4 +0,0 @@
-html {
- height: 100%;
- width: 100%;
-}
\ No newline at end of file
diff --git a/vjsc b/vjsc
index 8d26ca0..3295b3f 160000
--- a/vjsc
+++ b/vjsc
@@ -1 +1 @@
-Subproject commit 8d26ca0919da72ff30f7ce71f814270e3864a988
+Subproject commit 3295b3fecd0574753355ea48ef01bfa38febb10a
From 8daf6977471d5a6fc60dab883eb0db4b39520b40 Mon Sep 17 00:00:00 2001
From: GeorgeSchafer <77408854+GeorgeSchafer@users.noreply.github.com>
Date: Sat, 18 May 2024 17:50:06 -0700
Subject: [PATCH 4/5] updated and implemented JSONCSS
---
Gems.mjs | 7 ++-----
1 file changed, 2 insertions(+), 5 deletions(-)
diff --git a/Gems.mjs b/Gems.mjs
index 50410e0..f1f7521 100644
--- a/Gems.mjs
+++ b/Gems.mjs
@@ -129,11 +129,8 @@ class Line
const spot = ['a','b','c','d','e','f','g','h']
for( let i = 0; i < 8; i++)
{
- setTimeout(() => {
- const gem = Gem.random(spot[i])
- this.flexBox.element.appendChild(gem.img.element)
- }, 10000)
-
+ const gem = Gem.random(spot[i])
+ this.flexBox.element.appendChild(gem.img.element)
}
}
From a325106e03245820896e06a15bde503e7322ff8d Mon Sep 17 00:00:00 2001
From: GeorgeSchafer <77408854+GeorgeSchafer@users.noreply.github.com>
Date: Sat, 18 May 2024 17:50:26 -0700
Subject: [PATCH 5/5] preparing to release changes to dev
---
vjsc | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/vjsc b/vjsc
index 6b7908b..3295b3f 160000
--- a/vjsc
+++ b/vjsc
@@ -1 +1 @@
-Subproject commit 6b7908b1b4da30541ec99fc2a4d13e84b7e090a5
+Subproject commit 3295b3fecd0574753355ea48ef01bfa38febb10a