@openeventkit/event-site 2.0.64 → 2.0.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@openeventkit/event-site",
3
3
  "description": "Event Site",
4
- "version": "2.0.64",
4
+ "version": "2.0.66",
5
5
  "author": "Tipit LLC",
6
6
  "dependencies": {
7
7
  "@mui/base": "^5.0.0-alpha.114",
@@ -23,6 +23,7 @@ const adsQuery = graphql`
23
23
  gatsbyImageData (
24
24
  quality: 100
25
25
  placeholder: BLURRED
26
+ layout: FULL_WIDTH
26
27
  )
27
28
  }
28
29
  }
@@ -10,7 +10,7 @@ const PageHeader = ({
10
10
  <section className={styles.pageHeader}>
11
11
  <div className={styles.titles}>
12
12
  <h1>{title}</h1>
13
- <span class={styles.subtitle}>{subtitle}</span>
13
+ <span className={styles.subtitle}>{subtitle}</span>
14
14
  </div>
15
15
  {backgroundImageSrc &&
16
16
  <div className={styles.image} style={{backgroundImage: `url(${backgroundImageSrc})`}}></div>
@@ -6,217 +6,137 @@ import { getSponsorURL } from "../utils/urlFormating";
6
6
 
7
7
  import styles from "../styles/sponsor.module.scss";
8
8
 
9
+ const TierWrapper = ({title, index, wrapperExtraClass, children}) => (
10
+ <div className={`${index === 0 ? styles.firstContainer : ""} ${wrapperExtraClass}`}>
11
+ {title &&
12
+ <span><b>{title}</b></span>
13
+ }
14
+ {children}
15
+ </div>
16
+ );
17
+
9
18
  const SponsorComponent = ({ page, sponsorsState, linkButton }) => {
10
19
  let renderButton = false;
11
20
 
12
- let sponsorsByTier = sponsorsState.reduce((memo, x) => {
13
- if (!memo[x["sponsorship"].type.name]) { memo[x["sponsorship"].type.name] = []; }
14
- memo[x["sponsorship"].type.name].push(x);
15
- return memo;
16
- }, {});
21
+ const sponsorsByTier = sponsorsState.reduce((result, it) => {
22
+ let sponsorship = result.find(s => s.id === it.sponsorship.id);
23
+ if (!sponsorship) {
24
+ const idx = result.push({...it.sponsorship, sponsors: []});
25
+ sponsorship = result[idx - 1];
26
+ }
27
+ sponsorship.sponsors.push(it);
28
+ return result;
29
+ }, []).sort((a, b) => a.order - b.order);
30
+
31
+ const getSponsorImage = (sponsor, settings = {} ) => {
32
+ const {hideWrapper = false, overrideImg, overrideAlt, wrapperExtraClass = ''} = settings;
33
+ const imageUrl = overrideImg || sponsor.company.big_logo || sponsor.company.logo;
34
+ const alt = overrideAlt || sponsor.company.name;
35
+ const link = sponsor.is_published ? `/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}` : sponsor.external_link;
36
+
37
+ if (!imageUrl) return null;
38
+
39
+ let imageTag = <img src={imageUrl} alt={alt} />;
40
+
41
+ if (link) {
42
+ imageTag = (
43
+ <Link to={link}>
44
+ {imageTag}
45
+ </Link>
46
+ );
47
+ }
17
48
 
18
- Object.keys(sponsorsByTier).forEach((s) => {
19
- sponsorsByTier[s] = { ...sponsorsByTier[s][0].sponsorship, sponsors: sponsorsByTier[s] }
20
- });
49
+ if (!hideWrapper) {
50
+ imageTag = (
51
+ <div className={`${styles.imageBox} ${wrapperExtraClass}`}>
52
+ {imageTag}
53
+ </div>
54
+ );
55
+ }
56
+
57
+ return React.cloneElement(imageTag, { key: `${sponsor.id}-image` });
58
+ };
21
59
 
22
60
  return (
23
- <React.Fragment>
24
- {Object.values(sponsorsByTier).sort((a, b) => a.order - b.order).map((tier, tierIndex) => {
61
+ <>
62
+ {sponsorsByTier.map((tier, tierIndex) => {
25
63
  const sponsors = tier.sponsors.sort((a, b) => a.order - b.order);
26
- if (!tier) return null;
27
- const template = page === "lobby" ? tier.lobby_template : page === "event" ? tier.event_page_template : "expo-hall";
28
- if (sponsors?.length > 0) {
29
- renderButton = true;
30
- switch (template) {
31
- case "big-images": {
32
- if (page === "lobby" && !tier.should_display_on_lobby_page) {
33
- return null
34
- } else {
35
- return (
36
- <div className={`${tierIndex === 0 ? styles.firstContainer : ""} ${styles.bigImageContainer}`} key={tierIndex}>
37
- {tier.widget_title &&
38
- <span><b>{tier.widget_title}</b></span>
39
- }
40
- {sponsors.map((sponsor, index) => {
41
- return (
42
- (!sponsor.company.big_logo && !sponsor.company.logo) ?
43
- null
44
- :
45
- sponsor.is_published ?
46
- <Link to={`/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}`} key={`${tier.type.label}-${index}`}>
47
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
48
- </Link>
49
- :
50
- sponsor.external_link ?
51
- <Link to={sponsor.external_link} key={`${tier.type.label}-${index}`}>
52
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
53
- </Link>
54
- :
55
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
56
- )
57
- })}
58
- </div>
59
- )
60
- }
61
- }
62
- case "small-images": {
63
- if (page === "lobby" && !tier.should_display_on_lobby_page) {
64
- return null
65
- } else {
66
- return (
67
- <div className={`${tierIndex === 0 ? styles.firstContainer : ""} ${styles.smallImageContainer}`} key={tierIndex}>
68
- {tier.widget_title &&
69
- <span><b>{tier.widget_title}</b></span>
70
- }
71
- {sponsors.map((sponsor, index) => {
72
- if (page === "event" && !sponsor.showLogoInEventPage) return null
73
- return (
74
- (!sponsor.company.big_logo && !sponsor.company.logo) ?
75
- null
76
- :
77
- sponsor.is_published ?
78
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
79
- <Link to={`/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}`}>
80
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
81
- </Link>
82
- </div>
83
- : sponsor.external_link ?
84
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
85
- <Link to={sponsor.external_link}>
86
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
87
- </Link>
88
- </div>
89
- :
90
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
91
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
92
- </div>
93
- )
94
- })}
95
- </div>
96
- )
97
- }
98
- }
99
- case "horizontal-images": {
100
- return (
101
- <div className={`${tierIndex === 0 ? styles.firstContainer : ""} ${styles.horizontalContainer} px-6`} key={tierIndex}>
102
- {sponsors.map((sponsor, index) => {
103
- return (
104
- (!sponsor.company.big_logo && !sponsor.company.logo) ?
105
- null
106
- :
107
- sponsor.is_published ?
108
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
109
- <Link to={`/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}`}>
110
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
111
- </Link>
112
- </div>
113
- : sponsor.external_link ?
114
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
115
- <Link to={sponsor.external_link}>
116
- <img src={sponsor.logo} alt={sponsor.company.name} />
117
- </Link>
118
- </div>
119
- :
120
- <div className={styles.imageBox} key={`${tier.type.label}-${index}`}>
121
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
122
- </div>
123
- )
124
- })}
125
- </div>
126
- )
127
- }
128
- case "expo-hall": {
129
- return tier.should_display_on_expo_hall_page === true && (
130
- <div className={`${styles.expoContainer} px-6`} key={tierIndex}>
64
+
65
+ const template = ['lobby', 'event'].includes(page) ? tier[`${page}_template`] : 'expo-hall';
66
+ const hideTier = (page === "lobby" && !tier.should_display_on_lobby_page) || (template === "expo-hall" && !tier.should_display_on_expo_hall_page)
67
+
68
+ if (!sponsors?.length > 0 || hideTier) return null;
69
+
70
+ renderButton = true;
71
+
72
+
73
+ switch (template) {
74
+ case "big-images": {
75
+ return (
76
+ <TierWrapper title={tier.widget_title} index={tierIndex} wrapperExtraClass={styles.bigImageContainer} key={`tier-${tierIndex}`}>
77
+ {sponsors.map(sponsor => getSponsorImage(sponsor,{hideWrapper: true}))}
78
+ </TierWrapper>
79
+ )
80
+ }
81
+ case "small-images": {
82
+ return (
83
+ <TierWrapper title={tier.widget_title} index={tierIndex} wrapperExtraClass={styles.smallImageContainer} key={`tier-${tierIndex}`}>
84
+ {sponsors.map((sponsor, index) => {
85
+ if (page === "event" && !sponsor.showLogoInEventPage) return null
86
+ return getSponsorImage(sponsor);
87
+ })}
88
+ </TierWrapper>
89
+ )
90
+ }
91
+ case "horizontal-images": {
92
+ return (
93
+ <TierWrapper index={tierIndex} wrapperExtraClass={styles.horizontalContainer} key={`tier-${tierIndex}`}>
94
+ {sponsors.map(getSponsorImage)}
95
+ </TierWrapper>
96
+ )
97
+ }
98
+ case "expo-hall": {
99
+ return (
100
+ <div className={`${styles.expoContainer} px-6`} key={`tier-${tierIndex}`}>
101
+ {sponsors.map(sponsor => {
102
+ const wrapperExtraClass = tier.expo_hall_template === "big-images" ? styles.large : tier.expo_hall_template === "medium-images" ? styles.medium : styles.small;
103
+ return getSponsorImage(sponsor, {wrapperExtraClass});
104
+ })}
105
+ </div>
106
+ )
107
+ }
108
+ case "carousel": {
109
+ const sliderSettings = {
110
+ autoplay: true,
111
+ autoplaySpeed: 5000,
112
+ infinite: true,
113
+ className: "sponsor-carousel",
114
+ dots: false,
115
+ slidesToShow: 1,
116
+ slidesToScroll: 1
117
+ };
118
+ return (
119
+ <TierWrapper
120
+ title={tier.widget_title}
121
+ index={tierIndex}
122
+ wrapperExtraClass={styles.carouselContainer}
123
+ key={`tier-${tierIndex}`}
124
+ >
125
+ <Slider {...sliderSettings}>
131
126
  {sponsors.map((sponsor, index) => {
132
- return (
133
- (!sponsor.company.big_logo && !sponsor.company.logo) ?
134
- null
135
- :
136
- sponsor.is_published ?
137
- <div className={`
138
- ${styles.imageBox}
139
- ${tier.expo_hall_template === "big-images" ? styles.large : tier.expo_hall_template === "medium-images" ? styles.medium : styles.small}`}
140
- key={`${tier.type.label}-${index}`}
141
- >
142
- <Link to={`/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}`}>
143
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
144
- </Link>
145
- </div>
146
- : sponsor.external_link ?
147
- <div className={`
148
- ${styles.imageBox}
149
- ${tier.expo_hall_template === "big-images" ? styles.large : tier.expo_hall_template === "medium-images" ? styles.medium : styles.small}`}
150
- key={`${tier.type.label}-${index}`}
151
- >
152
- <Link to={sponsor.external_link}>
153
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
154
- </Link>
155
- </div>
156
- :
157
- <div className={`
158
- ${styles.imageBox}
159
- ${tier.expo_hall_template === "big-images" ? styles.large : tier.expo_hall_template === "medium-images" ? styles.medium : styles.small}`}
160
- key={`${tier.type.label}-${index}`}
161
- >
162
- <img src={sponsor.company.big_logo ? sponsor.company.big_logo : sponsor.company.logo} alt={sponsor.company.name} />
163
- </div>
164
- )
165
- })}
166
- </div>
167
- )
168
- }
169
- case "carousel": {
170
- if (page === "lobby" && !tier.should_display_on_lobby_page) {
171
- return null
172
- } else {
173
- const sliderSettings = {
174
- autoplay: true,
175
- autoplaySpeed: 5000,
176
- infinite: true,
177
- className: "sponsor-carousel",
178
- dots: false,
179
- slidesToShow: 1,
180
- slidesToScroll: 1
181
- };
182
- return (
183
- <div className={`${tierIndex === 0 ? styles.firstContainer : ""} ${styles.carouselContainer}`} key={tierIndex}>
184
- {tier.widget_title &&
185
- <span style={{ marginBottom: "0" }}><b>{tier.widget_title}</b></span>
127
+ const settings = {
128
+ hideWrapper: true,
129
+ overrideImg: sponsor.carousel_advertise_image,
130
+ overrideAlt: sponsor.carousel_advertise_image_alt_text
186
131
  }
187
- <Slider {...sliderSettings}>
188
- {sponsors.map((sponsor, index) => {
189
- const img = sponsor.carousel_advertise_image ? sponsor.carousel_advertise_image : sponsor.logo;
190
- return (
191
- (!sponsor.company.big_logo && !sponsor.company.logo) ?
192
- null
193
- :
194
- sponsor.is_published ?
195
- <Link to={`/a/sponsor/${getSponsorURL(sponsor.id, sponsor.company.name)}`} key={`${tier.type.label}-${index}`}>
196
- <img src={sponsor.carousel_advertise_image} alt={sponsor.carousel_advertise_image_alt_text} />
197
- </Link>
198
- :
199
- sponsor.external_link ?
200
- <Link to={sponsor.external_link} key={`${tier.type.label}-${index}`}>
201
- <img src={sponsor.carousel_advertise_image} alt={sponsor.carousel_advertise_image_alt_text} />
202
- </Link>
203
- :
204
- <Link key={`${tier.type.label}-${index}`}>
205
- <img src={sponsor.carousel_advertise_image} alt={sponsor.carousel_advertise_image_alt_text} />
206
- </Link>
207
- )
208
- })}
209
- </Slider>
210
- </div>
211
-
212
- )
213
- }
214
- }
215
- default:
216
- return null;
132
+ return getSponsorImage(sponsor, settings);
133
+ })}
134
+ </Slider>
135
+ </TierWrapper>
136
+ )
217
137
  }
218
- } else {
219
- return null;
138
+ default:
139
+ return null;
220
140
  }
221
141
  })}
222
142
  {linkButton?.text && linkButton?.link && renderButton &&
@@ -226,7 +146,7 @@ const SponsorComponent = ({ page, sponsorsState, linkButton }) => {
226
146
  </button>
227
147
  </Link>
228
148
  }
229
- </React.Fragment>
149
+ </>
230
150
  )
231
151
  };
232
152
 
@@ -18,12 +18,12 @@
18
18
 
19
19
  &:hover {
20
20
 
21
- background-color: var(--color-gray-lightest);
21
+ background-color: var(--color_gray_lightest);
22
22
  }
23
23
 
24
24
  &--active {
25
25
  color: var(--color_text_med);
26
- background-color: var(--color-gray-lighter) !important;
26
+ background-color: var(--color_gray_lighter) !important;
27
27
  }
28
28
 
29
29
  * {
@@ -280,7 +280,7 @@
280
280
 
281
281
  &--edit {
282
282
  .ticket-popup-footer {
283
- border-top: 1px solid var(--color-gray-lighter);
283
+ border-top: 1px solid var(--color_gray_lighter);
284
284
  left: 0;
285
285
  bottom: 0;
286
286
  height: 60px;
@@ -1 +1 @@
1
- {"widgets":{"chat":{"enabled": true, "showQA":false,"showHelp":false,"defaultScope":"page"},"schedule":{"allowClick":true}},"favicons":{"favicon180":"/img/favicon.png","favicon32":"/img/favicon.png","favicon16":"/img/favicon.png"},"staticJsonFilesBuildTime":[{"file":"src/data/summit.json","build_time":1692386447666},{"file":"src/data/events.json","build_time":1692386451064},{"file":"src/data/events.idx.json","build_time":1692386451066},{"file":"src/data/speakers.json","build_time":1692386451884},{"file":"src/data/speakers.idx.json","build_time":1692386451884},{"file":"src/content/sponsors.json","build_time":1692386455106},{"file":"src/data/voteable-presentations.json","build_time":1692386457214}],"lastBuild":1692386457215}
1
+ {"widgets":{"chat":{"enabled":true,"showQA":false,"showHelp":false,"defaultScope":"page"},"schedule":{"allowClick":true}},"favicons":{"favicon180":"/img/favicon.png","favicon32":"/img/favicon.png","favicon16":"/img/favicon.png"},"staticJsonFilesBuildTime":[{"file":"src/data/summit.json","build_time":1694806430635},{"file":"src/data/events.json","build_time":1694806433537},{"file":"src/data/events.idx.json","build_time":1694806433545},{"file":"src/data/speakers.json","build_time":1694806434055},{"file":"src/data/speakers.idx.json","build_time":1694806434057},{"file":"src/content/sponsors.json","build_time":1694806434308},{"file":"src/data/voteable-presentations.json","build_time":1694806434574}],"lastBuild":1694806434576}
@@ -1 +1 @@
1
- [{"id":228,"created":1691602669,"last_edited":1691602669,"order":1,"summit_id":49,"is_published":false,"side_image":null,"header_image":null,"header_image_mobile":null,"carousel_advertise_image":null,"marquee":"","intro":"","external_link":"","video_link":"","chat_link":"","featured_event_id":0,"header_image_alt_text":"","side_image_alt_text":"","header_image_mobile_alt_text":"","carousel_advertise_image_alt_text":"","show_logo_in_event_page":true,"members":[90654],"company":{"id":3,"created":1580138376,"last_edited":1580138376,"name":"Tipit , LLC","url":null,"display_on_site":false,"featured":false,"city":null,"state":null,"country":null,"description":null,"industry":null,"contributions":null,"contact_email":null,"member_level":"None","admin_email":null,"overview":null,"products":null,"commitment":null,"commitment_author":null,"logo":null,"big_logo":null,"color":"#f0f0ee","sponsorships":[616],"project_sponsorships":[]},"sponsorship":{"id":2048,"widget_title":"","lobby_template":null,"expo_hall_template":null,"sponsor_page_template":null,"event_page_template":null,"sponsor_page_use_disqus_widget":false,"sponsor_page_use_live_event_widget":false,"sponsor_page_use_schedule_widget":false,"sponsor_page_use_banner_widget":false,"badge_image":null,"badge_image_alt_text":"","summit_id":49,"order":1,"should_display_on_expo_hall_page":false,"should_display_on_lobby_page":false,"type":{"id":3,"created":1579890943,"last_edited":1579890943,"name":"Gold","label":"not sure??","order":3,"size":"Medium"}},"ads":[],"materials":[],"social_networks":[]}]
1
+ []
@@ -21,6 +21,7 @@ export const marketingPageQuery = graphql`
21
21
  gatsbyImageData (
22
22
  quality: 100
23
23
  placeholder: BLURRED
24
+ layout: FULL_WIDTH
24
25
  )
25
26
  }
26
27
  }
@@ -32,6 +33,7 @@ export const marketingPageQuery = graphql`
32
33
  gatsbyImageData (
33
34
  quality: 100
34
35
  placeholder: BLURRED
36
+ layout: FULL_WIDTH
35
37
  )
36
38
  }
37
39
  }
@@ -66,6 +68,7 @@ export const marketingPageQuery = graphql`
66
68
  gatsbyImageData (
67
69
  quality: 100
68
70
  placeholder: BLURRED
71
+ layout: FULL_WIDTH
69
72
  )
70
73
  }
71
74
  }
@@ -87,6 +90,7 @@ export const marketingPageQuery = graphql`
87
90
  gatsbyImageData (
88
91
  quality: 100
89
92
  placeholder: BLURRED
93
+ layout: FULL_WIDTH
90
94
  )
91
95
  }
92
96
  }
@@ -3,8 +3,8 @@
3
3
  @import 'colors.scss';
4
4
  @import "fonts";
5
5
 
6
- $footer-background-color: var(--color-primary) !important;
7
- $footer-color: var(--color-text-light) !important;
6
+ $footer-background-color: var(--color_primary) !important;
7
+ $footer-color: var(--color_text_light) !important;
8
8
  $footer-padding: 2rem !important;
9
9
 
10
10
  $font-family-base: var(--font_family);