zino/seatmapv2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

introduced minified css solution: css files will not be autoinjected, instead they are minified in dist directory and then injected from within bundle files

Browse Source
This commit is contained in:
zino
2021-05-23 19:29:41 +02:00
parent dc5ccfe949
commit e72fcc4a68
14 changed files with 6646 additions and 7018 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/dist/inject.css vendored Normal file
View File

@@ -0,0 +1 @@
#containerBookingBtn{display:none;margin:0}#get_flash{display:none}.ui-dialog-titlebar{margin-left:1rem;margin-right:1rem}.ui-dialog-title{text-align:center}.ui-widget-overlay{background:#fff;opacity:1;width:100vw;height:100vh}#openSeatmap img{width:64px}#openSeatmap{padding:1rem;font-weight:700;color:#ffb201;font-size:1rem;cursor:pointer}#openSeatmap span{font-size:.8rem}#foobarParent{display:none}div#dialogSeatmap{padding-top:0}.ui-widget-header{background:#fff;border:1px solid #c6c6c6;border-bottom-right-radius:0;border-bottom-left-radius:0}.ui-dialog{background:#fff;left:0!important;padding:0;top:0!important;right:0!important}.ui-dialog .ui-dialog-content{padding:0}.ui-dialog-titlebar{margin-left:0;margin-right:0;padding:0!important;display:none}#iframeSeatmap{height:100vh;background:#fff;width:100%}.ui-corner-all{border-radius:0}.ui-dialog-title{display:none}.ui-widget{border:none!important}

13185
client/dist/inject.js vendored
View File

File diff suppressed because one or more lines are too long

1
client/dist/jBox.all.min.css vendored
View File

@@ -1 +0,0 @@
/home/zino/projects/seatmapv2/staging/seatmapv2/client/node_modules/jbox/dist/jBox.all.min.css

1
client/dist/seatmap.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

54
client/dist/seatmap.js vendored
View File

File diff suppressed because one or more lines are too long

17
client/package.json
View File

@@ -7,8 +7,12 @@
"browserifyf": "func() { browserify --debug -p [ tsify ] $1 > $2; }; func",
"watchifyfdev": "func() { watchify -t [ envify --NODE_ENV development ] --debug --verbose -p [ tsify ] $1 -o $2; }; func",
"watchifyfprod": "func() { watchify -g uglifyify -t [ envify --NODE_ENV production ] --debug --verbose -p [ tsify ] $1 -o $2; }; func",
"watchifyfcssdev": "func() { watchify -t [ envify --NODE_ENV development ] -g browserify-css --debug --verbose -p [ tsify ] $1 -o $2; }; func",
"watchifyfcssprod": "func() { watchify -t [ envify --NODE_ENV production ] -g browserify-css --debug --verbose -p [ tsify ] $1 -o $2; }; func"
"watchifyfcssdev": "func() { watchify -t [ envify --NODE_ENV development ] -t [ browserify-css ] --output $1 ] --debug --verbose -p [ tsify ] $2 -o $3; }; func",
"watchifyfcssprod": "func() { watchify -t [ envify --NODE_ENV production ] -t [ browserify-css ] --debug --verbose -p [ tsify ] $1 -o $2; }; func",
"injectdev": "func() { watchify -t [ envify --NODE_ENV development ] -t [ browserify-css --output dist/inject.css ] --debug --verbose -p [ tsify ] src/inject.ts -o dist/inject.js; }; func",
"injectprod": "func() { watchify -t [ envify --NODE_ENV production ] -t [ browserify-css --output dist/inject.css ] --debug --verbose -p [ tsify ] src/inject.ts -o dist/inject.js; }; func",
"seatmapdev": "func() { watchify -t [ envify --NODE_ENV development ] -t [ browserify-css --output dist/seatmap.css ] --debug --verbose -p [ tsify ] src/seatmap.ts -o dist/seatmap.js; }; func",
"seatmapprod": "func() { watchify -t [ envify --NODE_ENV production ] -t [ browserify-css --output dist/seatmap.css ] --debug --verbose -p [ tsify ] src/seatmap.ts -o dist/seatmap.js; }; func"
},
"keywords": [],
"author": "",
@@ -34,8 +38,9 @@
"xml2js": "^0.4.23"
},
"browserify-css": {
"autoInject": true,
"minify": false,
"rootDir": "."
"autoInject": false,
"minify": true,
"rootDir": ".",
"stripComments": true
}
}
}

0
client/dist/styleParent.css → client/src/css/inject.css
View File

2
client/dist/styleChild.css → client/src/css/seatmap.css
View File

@@ -1,3 +1,5 @@
@import url("../../node_modules/jbox/dist/jBox.all.css");
div.seatCharts-cell {
height: 1vw;
display: table-cell;

291
client/src/css/styleChild.css
View File

@@ -1,291 +0,0 @@
div.seatCharts-cell {
height: 1vw;
display: table-cell;
width: 1vw;
margin: 0.1vw;
white-space: nowrap;
font-size: 0.6vw;
line-height: 1.1vw;
color: black;
font-weight: bold;
}
div.seatCharts-row {
height: 1.6vw;
display: table-row;
}
div.seatCharts-space {
background-color: transparent;
}
div.seatCharts-seat {
-webkit-border-radius: 0.2vw;
-moz-border-radius: 0.2vw;
border-radius: 0.2vw;
}
/* div.seatCharts-seat,
div.seatCharts-seat.available {
border: 0.1rem solid #5c5c5c;
} */
div.seatCharts-seat.selected,
div.seatCharts-seat.focused {
border: 0.1vw solid black;
/* filter: brightness(2); */
}
div.seatCharts-seat.selected {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjAuMjg1IDJsLTExLjI4NSAxMS41NjctNS4yODYtNS4wMTEtMy43MTQgMy43MTYgOSA4LjcyOCAxNS0xNS4yODV6Ii8+PC9zdmc+);
background-repeat: no-repeat;
background-position: center center;
background-size: 100% 100%, auto;
}
select#dropdownSeatmap {
color: #5c5c5c;
font-weight: bold;
}
/* #loftloader-wrapper .loader-inner {
top: 50%;
} */
ul.seatCharts-legendList {
list-style: none;
margin: 0;
}
li.seatCharts-legendItem {
margin: 0;
display: flex;
align-items: center;
line-height: 1.6rem;
}
#JSCLegend div.seatCharts-cell {
height: 1rem;
width: 1rem;
margin: 0 0.5rem 0 0;
}
span.seatCharts-legendDescription {
margin: 0;
}
div.seatCharts-seat.unavailable {
background-color: #ccc !important;
background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><path d='M100 0 L0 100 ' stroke='black' stroke-width='4'/><path d='M0 0 L100 100 ' stroke='black' stroke-width='4'/></svg>");
background-repeat: no-repeat;
background-position: center center;
background-size: 100% 100%, auto;
border: none;
}
#JSCLegendInner select {
color: #5c5c5c;
font-weight: bold;
}
#JSCLegendInner select option {
color: white;
}
.jBox-Notice .jBox-content {
font-size: 1rem;
padding: .1rem 2rem;
}
select#dropdownLegend, select#dropdownSeatmap, .dropdownBuyerTypes {
width: 14rem;
border-radius: 4px;
border-color: #ccc;
height: 3rem;
}
#modalCart .uabb-button {
width: 15rem;
}
.cartItemColoredSquare {
width: 1rem;
height: 1rem;
margin: .4rem 1rem 0 0;
border: 1px solid black;
float: left;
}
.cartItemCategory {
font-weight: bold;
}
.cartItem {
padding: 1rem;
border-radius: 5px;
margin: 0 0 1rem 0;
width: 20rem;
border: 1px solid #ccc;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.cartItemCategory, .cartItemSeat {
color: black;
}
#cartItemHTML {
display: flex;
justify-content: center;
align-items: center;
}
#modalCartRow {
/* max-height: 40vw; */
overflow: auto;
}
/* .cartItemCross {
text-align: right;
line-height: 0;
cursor: pointer;
} */
#modalCart-overlay .uabb-overlay {
background: white;
}
#modalCart-overlay .uabb-close-icon {
margin-top: 2.2rem;
display: none;
}
.dropdownBuyerTypes {
padding: .2rem;
margin-top: .4rem;
}
#modalCart .uabb-button:hover {
border: 1px solid #5c5c5c;
}
.trimText {
line-height: normal;
font-size: 1vw;
}
span.trimChar {
font-weight: normal;
font-size: 1vw;
}
/**
* ==============================================
* Dot Pulse
* ==============================================
*/
.dot-pulse {
position: relative;
left: -9999px;
width: 10px;
height: 10px;
border-radius: 5px;
background-color: #5c5c5c;
color: #5c5c5c;
box-shadow: 9999px 0 0 -5px #5c5c5c;
animation: dotPulse 1.5s infinite linear;
animation-delay: .25s;
}
.dot-pulse::before, .dot-pulse::after {
content: '';
display: inline-block;
position: absolute;
top: 0;
width: 10px;
height: 10px;
border-radius: 5px;
background-color: #5c5c5c;
color: #5c5c5c;
}
.dot-pulse::before {
box-shadow: 9984px 0 0 -5px #5c5c5c;
animation: dotPulseBefore 1.5s infinite linear;
animation-delay: 0s;
}
.dot-pulse::after {
box-shadow: 10014px 0 0 -5px #5c5c5c;
animation: dotPulseAfter 1.5s infinite linear;
animation-delay: .5s;
}
@keyframes dotPulseBefore {
0% {
box-shadow: 9984px 0 0 -5px #5c5c5c;
}
30% {
box-shadow: 9984px 0 0 2px #5c5c5c;
}
60%,
100% {
box-shadow: 9984px 0 0 -5px #5c5c5c;
}
}
@keyframes dotPulse {
0% {
box-shadow: 9999px 0 0 -5px #5c5c5c;
}
30% {
box-shadow: 9999px 0 0 2px #5c5c5c;
}
60%,
100% {
box-shadow: 9999px 0 0 -5px #5c5c5c;
}
}
@keyframes dotPulseAfter {
0% {
box-shadow: 10014px 0 0 -5px #5c5c5c;
}
30% {
box-shadow: 10014px 0 0 2px #5c5c5c;
}
60%,
100% {
box-shadow: 10014px 0 0 -5px #5c5c5c;
}
}
#btnCloseModal {
cursor: pointer;
}
#htmlSeatmapInner {
/* background: grey; */
height: 66vh;
}
#htmlSeatmapInner .fl-module-content, #htmlSeatmapInner .fl-html {
height: 100%;
}
#containerSeatmapInner {
border: 1px solid black;
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
#modalCart-overlay {
overflow-y: scroll;
}
#bottomHTML {
text-align: center;
}
#bottomHTML h6, #bottomHTML a {
color: #999;
}

93
client/src/css/styleParent.css
View File

@@ -1,93 +0,0 @@
#containerBookingBtn {
display: none;
margin: 0;
}
#get_flash {
display: none;
}
.ui-dialog-titlebar {
margin-left: 1rem;
margin-right: 1rem;
}
.ui-dialog-title {
text-align: center;
}
.ui-widget-overlay {
background: white;
opacity: 1;
width: 100vw;
height: 100vh;
}
#openSeatmap img {
width: 64px;
}
#openSeatmap {
padding: 1rem;
font-weight: bold;
color: #ffb201;
font-size: 1rem;
cursor: pointer;
}
#openSeatmap span {
font-size: .8rem;
/* color: #5c5c5c; */
}
#foobarParent {
display: none;
}
div#dialogSeatmap {
padding-top: 0;
}
.ui-widget-header {
background: #fff;
border: 1px solid #c6c6c6;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.ui-dialog {
background: white;
left: 0 !important;
padding: 0;
top: 0 !important;
right: 0 !important;
}
.ui-dialog .ui-dialog-content {
padding: 0;
}
.ui-dialog-titlebar {
margin-left: 0;
margin-right: 0;
padding: 0 !important;
display: none;
}
#iframeSeatmap {
height: 100vh;
background: white;
width: 100%;
}
.ui-corner-all {
border-radius: 0;
}
.ui-dialog-title {
display: none;
}
.ui-widget {
border: none !important;
}

2
client/src/inject.ts
View File

@@ -7,7 +7,7 @@ import * as Parser from './modules/parser';
import * as UI from "./modules/ui";
import * as BookingBtn from "./modules/bookingButton";
import * as Parent from "./modules/parent";
// require("../src/css/styleParent.css");
require("../src/css/inject.css");
let inputsWithValue: I.InputsWithValue;

6
client/src/modules/child.ts
View File

@@ -100,8 +100,8 @@ export function injectResources(): void {
const resources = config.resources[branch];
Utils.inject(resources.JSC, "js", "head");
Utils.inject(resources.CSSJSC, "css", "body");
Utils.inject(resources.CSSJSC, "css", "body");
Utils.inject(resources.CSSjQueryUI, "css", "body");
Utils.inject(resources.CSSChild, "css", "body");
Utils.inject(resources.CSSjQueryUI, "css", "body");
Utils.inject(resources.CSSjBox, "css", "body");
// Utils.inject(resources.CSSjBox, "css", "body");
}

8
client/src/modules/config.ts
View File

@@ -10,18 +10,18 @@ export const config: I.Config = {
master: {
seatmap: "https://tickets.zinomedia.de",
JSC: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
CSSChild: "https://tickets.zinomedia.de/dist/styleChild.css",
CSSChild: "https://tickets.zinomedia.de/dist/seatmap.css",
CSSJSC: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
CSSParent: "https://tickets.zinomedia.de/dist/styleParent.css",
CSSParent: "https://tickets.zinomedia.de/dist/inject.css",
CSSjQueryUI: "https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css",
CSSjBox: "https://tickets.zinomedia.de/dist/jBox.all.min.css"
},
staging: {
seatmap: "https://staging.tickets.zinomedia.de",
JSC: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
CSSChild: "https://staging.tickets.zinomedia.de/dist/styleChild.css",
CSSChild: "https://staging.tickets.zinomedia.de/dist/seatmap.css",
CSSJSC: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
CSSParent: "https://staging.tickets.zinomedia.de/dist/styleParent.css",
CSSParent: "https://staging.tickets.zinomedia.de/dist/inject.css",
CSSjQueryUI: "https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css",
CSSjBox: "https://staging.tickets.zinomedia.de/dist/jBox.all.min.css"
}

3
client/src/seatmap.ts
View File

@@ -8,8 +8,7 @@ import * as Cart from "./modules/cart";
import * as BookingBtn from "./modules/bookingButton";
import * as Child from './modules/child';
import * as UI from "./modules/ui";
// require("jbox/dist/jBox.all.css");
// require("../src/css/styleChild.css");
require("../src/css/seatmap.css");
window.addEventListener('load', () => {
// Inject JSC (jQuery Seat Charts)