Skip to content

Commit 9f1d269

Browse files
pilgreenpilgreen
authored
Merge pull request #22 from mcclatchy/rc-v2
New config structure
2 parents afbb90f + 38f12de commit 9f1d269

File tree

13 files changed

+1283
-1077
lines changed

13 files changed

+1283
-1077
lines changed

‎config/homepage.json‎

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,46 @@
11
{
22
"zones": [
3+
{
4+
"id": "zone-el-9",
5+
"vip": "#secondary-story-6",
6+
"type": "ad"
7+
},
8+
{
9+
"id": "zone-el-11",
10+
"vip": "#secondary-story-10",
11+
"type": "ad"
12+
},
313
{
414
"id": "zone-community-events",
5-
"type": "editorial",
6-
"filters": [
7-
{
8-
"type": "config",
9-
"name": "zone.communityEvents",
10-
"value": true
11-
}
12-
],
15+
"vip": "#secondary-story-9",
16+
"filters": {
17+
"zone.communityEvents": true
18+
},
1319
"zephr": {
1420
"feature": "zone-community-events",
15-
"dataset": [
16-
{
17-
"type": "config",
18-
"name": "market",
19-
"value": "marketInfo.domain"
20-
}
21-
]
22-
},
23-
"placement": {
24-
"type": "query",
25-
"value": "#secondary-story-9"
21+
"dataset": ["marketInfo.domain"]
2622
}
2723
},
2824
{
29-
"id": "zone-el-9",
30-
"placement": {
31-
"type": "query",
32-
"value": "#secondary-story-6"
25+
"id": "zone-events-calendar",
26+
"vip": "#secondary-story-7",
27+
"classList": ["package", "paper", "two-columns", "two-rows"],
28+
"filters": {
29+
"zone-events-calendar": true
30+
},
31+
"zephr": {
32+
"feature": "zone-events-calendar",
33+
"dataset": ["marketInfo.domain"]
3334
}
3435
},
3536
{
36-
"id": "zone-el-11",
37-
"placement": {
38-
"type": "query",
39-
"value": "#secondary-story-10"
37+
"id": "zone-editor-picks",
38+
"vip": "#secondary-story-3",
39+
"cue": 280305494,
40+
"classList": ["three-columns"],
41+
"filters": {
42+
"subscriber": true,
43+
"zone.editorPicks": true
4044
}
4145
},
4246
{

‎config/section.json‎

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,10 @@
22
"zones": [
33
{
44
"id": "zone-el-9",
5-
"filters": [
6-
{
7-
"type": "subscriber",
8-
"value": false
9-
}
10-
],
11-
"placement": {
12-
"type": "query",
13-
"value": ".grid > :nth-child(14)"
5+
"vip": ".grid > :nth-child(14)",
6+
"type": "ad",
7+
"filters": {
8+
"subscriber": false
149
}
1510
}
1611
]

‎config/story.json‎

Lines changed: 22 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"base": ".story-body [id^=zone-el]",
2+
"wps": ".story-body [id^=zone-el]",
33
"ignore": ["zone-el-16"],
44
"cadence": {
55
"subscriber": 4,
@@ -9,117 +9,47 @@
99
"zones": [
1010
{
1111
"id": "zone-taboola-recommendations",
12-
"filters": [
13-
{
14-
"type": "config",
15-
"name": "zone.taboolaRecommendations",
16-
"value": true
17-
}
18-
],
12+
"after": "zone-el-101",
13+
"tracking": true,
14+
"filters": {
15+
"zone.taboolaRecommendations": true
16+
},
1917
"zephr": {
2018
"feature": "zone-taboola-recommendations",
21-
"dataset": [
22-
{
23-
"type": "dma",
24-
"name": "dma"
25-
}
26-
]
27-
},
28-
"placement": {
29-
"type": "after",
30-
"value": "zone-el-101"
31-
},
32-
"tracking": true
19+
"dataset": ["dma"]
20+
}
3321
},
3422
{
3523
"id": "zone-si-tickets",
24+
"after": "zone-el-101",
3625
"cue": 278143207,
37-
"filters": [
38-
{
39-
"type": "config",
40-
"name": "zone.siTickets",
41-
"value": true
42-
}
43-
],
44-
"placement": {
45-
"type": "after",
46-
"value": "zone-el-101"
26+
"filters": {
27+
"zone.siTickets": true
4728
}
4829
},
4930
{
5031
"id": "zone-gamecocks-nav",
32+
"vip": ".story-body",
5133
"cue": 278142507,
52-
"filters": [
53-
{
54-
"type": "config",
55-
"name": "zone.gamecocksNav",
56-
"value": true
57-
}
58-
],
59-
"placement": {
60-
"type": "query",
61-
"value": ".story-body"
34+
"filters": {
35+
"zone.gamecocksNav": true
6236
}
6337
},
6438
{
6539
"id": "zone-sponsored-article",
40+
"vip": ".story-body > .header",
6641
"cue": 277282728,
67-
"filters": [
68-
{
69-
"type": "config",
70-
"name": "zone.sponsoredArticle",
71-
"value": true
72-
}
73-
],
74-
"placement": {
75-
"type": "query",
76-
"value": ".story-body > .header"
77-
},
78-
"classList": ["hidden"]
79-
},
80-
{
81-
"id": "zone-local-news-digest",
82-
"tracking": true,
83-
"filters": [
84-
{
85-
"type": "config",
86-
"name": "zone.localNewsDigest",
87-
"value": true
88-
},
89-
{
90-
"type": "dma",
91-
"value": true
92-
}
93-
],
94-
"zephr": {
95-
"feature": "zone-local-news-digest",
96-
"dataset": [
97-
{
98-
"type": "config",
99-
"name": "domain",
100-
"value": "marketInfo.domain"
101-
}
102-
]
103-
},
104-
"placement": {
105-
"type": "after",
106-
"value": "zone-el-101"
107-
},
108-
"classList": ["stn-player"]
42+
"classList": ["hidden"],
43+
"filters": {
44+
"zone.sponsoredArticle": true
45+
}
10946
},
11047
{
11148
"id": "zone-lexgoeat-sponsor",
49+
"vip": ".story-body",
11250
"cue": 266575046,
113-
"filters": [
114-
{
115-
"type": "config",
116-
"name": "zone.lexgoEatSponsor",
117-
"value": true
118-
}
119-
],
120-
"placement": {
121-
"type": "query",
122-
"value": ".story-body"
51+
"filters": {
52+
"zone.lexgoEatSponsor": true
12353
}
12454
}
12555
]

‎demo/ads.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
/*
2+
* Proposed ads API
3+
*/
4+
5+
export function createAdTag(targeting) {
6+
let tag = document.createElement("div");
7+
8+
tag.classList.add("ad");
9+
tag.setAttribute("targeting", JSON.stringify(targeting));
10+
11+
return tag;
12+
}

‎demo/demo.css‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@
66
min-height: 300px;
77
}
88

9+
.digest {
10+
min-height: 600px;
11+
}
12+
913
.lead-item {
1014
min-height: 600px;
1115
}
@@ -40,6 +44,10 @@
4044
font: bold 1rem var(--sans);
4145
}
4246

47+
[data-type="ad"]:before {
48+
padding: 0 15px;
49+
}
50+
4351
/*
4452
* Story stuff
4553
*/

‎demo/homepage/index.html‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
<!doctype html>
2+
<html lang="en" data-pagetype="homepage">
3+
<head>
4+
<title>Zones homepage demo</title>
5+
<link rel="icon" type="image/x-icon" href="https://www.kansascity.com/favicon.ico">
6+
7+
<meta charset="UTF-8">
8+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
9+
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
10+
11+
<meta name="apple-mobile-web-app-capable" content="yes">
12+
<meta name="mobile-web-app-capable" content="yes">
13+
14+
<link rel="stylesheet" href="/demo/saratoga.css">
15+
<link rel="stylesheet" href="/demo/demo.css">
16+
17+
<script type="module">
18+
import locker from "../locker.js";
19+
import distributeZones from "/index.js";
20+
21+
distributeZones(locker);
22+
</script>
23+
</head>
24+
25+
<body>
26+
<div id="zone-el-1"></div>
27+
<!-- <div id="zone-el-2"></div> -->
28+
<div class="card flag"></div>
29+
30+
<section class="grid">
31+
<article class="card lead-item"></article>
32+
33+
<div id="zone-el-5" class="zone two-rows"></div>
34+
35+
<div class="digest"></div>
36+
<article id="secondary-story-2" class="card"></article>
37+
<article id="secondary-story-3" class="card"></article>
38+
<div class="digest"></div>
39+
40+
<article id="secondary-story-4" class="card"></article>
41+
<article id="secondary-story-5" class="card"></article>
42+
<article id="secondary-story-6" class="card"></article>
43+
<article id="secondary-story-7" class="card"></article>
44+
<article id="secondary-story-8" class="card"></article>
45+
<article id="secondary-story-9" class="card"></article>
46+
47+
<div id="zone-el-6" class="zone"></div>
48+
49+
<div class="digest-group">
50+
<div class="partner-label">
51+
<span>Digest group</span>
52+
</div>
53+
<div class="digest"></div>
54+
<div class="digest"></div>
55+
<div class="digest"></div>
56+
</div>
57+
58+
<article id="secondary-story-10" class="card"></article>
59+
<article id="secondary-story-11" class="card"></article>
60+
61+
<div id="zone-el-8" class="zone three-columns"></div>
62+
63+
<div class="digest-group">
64+
<div class="partner-label">
65+
<span>Digest group</span>
66+
</div>
67+
<div class="digest"></div>
68+
<div class="digest"></div>
69+
<div class="digest"></div>
70+
</div>
71+
72+
<article id="secondary-story-12" class="card"></article>
73+
<article id="secondary-story-13" class="card"></article>
74+
<article id="secondary-story-13" class="card"></article>
75+
<article id="secondary-story-14" class="card"></article>
76+
<article id="secondary-story-15" class="card"></article>
77+
<article id="secondary-story-16" class="card"></article>
78+
79+
<div id="zone-el-15" class="zone"></div>
80+
81+
<article id="secondary-story-17" class="card"></article>
82+
<article id="secondary-story-18" class="card"></article>
83+
<article id="secondary-story-19" class="card"></article>
84+
</section>
85+
</body>
86+
</html>

0 commit comments

Comments
 (0)