sfc-utils 1.2.8 → 1.3.2
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/accountswap.js +31 -0
- package/css/nav.css +62 -0
- package/index.js +2 -1
- package/nav2.js +183 -0
- package/package.json +1 -1
package/accountswap.js
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
|
|
2
|
+
// Detect if there's a valid signin -- if so, swap Subscribe button to Account button
|
|
3
|
+
// Any domain + /realm/ should work for an account link
|
|
4
|
+
const accountURL = "/realm/"
|
|
5
|
+
|
|
6
|
+
const pollForAccount = function(i){
|
|
7
|
+
// Start the iterator
|
|
8
|
+
if (!i){
|
|
9
|
+
i = 0
|
|
10
|
+
}
|
|
11
|
+
// Safecheck for treg since it might not be global yet
|
|
12
|
+
if (window && window.treg && window.treg.identity && window.treg.identity.isEntitled){
|
|
13
|
+
// We got a valid entitlement! Let's see if the button exists and swap our new one in
|
|
14
|
+
const subButton = documment.querySelector('.sub-box')
|
|
15
|
+
console.log("found and swapped")
|
|
16
|
+
if (subButton){
|
|
17
|
+
subButton.setAttribute("href", accountURL)
|
|
18
|
+
subButton.innerText = "Account"
|
|
19
|
+
}
|
|
20
|
+
} else {
|
|
21
|
+
if (i > 10){
|
|
22
|
+
// If we've waited 10 seconds and there's still no entitlement, assume we aren't getting one
|
|
23
|
+
return false
|
|
24
|
+
}
|
|
25
|
+
console.log("not found, polling " + i)
|
|
26
|
+
// Check again after 1 sec
|
|
27
|
+
setTimeout(() => {pollForAccount(i+1)}, 1000)
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
module.exports = { pollForAccount }
|
package/css/nav.css
ADDED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
.nav2-container {
|
|
2
|
+
position: fixed;
|
|
3
|
+
top: 0;
|
|
4
|
+
width: 100%;
|
|
5
|
+
left: 0;
|
|
6
|
+
height: 37px;
|
|
7
|
+
display: flex;
|
|
8
|
+
justify-content: space-between;
|
|
9
|
+
align-items: center;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.nav2-container.invert {
|
|
13
|
+
background-color: #fff;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.nav2-left, .nav2-right {
|
|
17
|
+
display: flex;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.nav2-left {
|
|
21
|
+
justify-content: flex-start;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.nav2-right {
|
|
25
|
+
justify-content: flex-end;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
#nav2-sub-box {
|
|
29
|
+
border: 1px solid var(--brand-color);
|
|
30
|
+
border-radius: 3px;
|
|
31
|
+
color: var(--brand-color);
|
|
32
|
+
font-size: 14px;
|
|
33
|
+
letter-spacing: 0.05em;
|
|
34
|
+
margin-right: 10px;
|
|
35
|
+
padding: 3px 8px 2px;
|
|
36
|
+
text-decoration: none;
|
|
37
|
+
text-transform: uppercase;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.nav2-desk-logo, .nav2-mobile-logo {
|
|
41
|
+
max-height: 20px;
|
|
42
|
+
margin-left: 0.335rem;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.nav2-mobile-logo {
|
|
46
|
+
display: none;
|
|
47
|
+
}
|
|
48
|
+
@media (max-width: 490px){
|
|
49
|
+
.nav2-mobile-logo {
|
|
50
|
+
display: block;
|
|
51
|
+
}
|
|
52
|
+
.nav2-desk-logo {
|
|
53
|
+
display: none;
|
|
54
|
+
}
|
|
55
|
+
.nav2-left {
|
|
56
|
+
order: 1;
|
|
57
|
+
}
|
|
58
|
+
.nav2-right {
|
|
59
|
+
flex: 25 1;
|
|
60
|
+
order: 2;
|
|
61
|
+
}
|
|
62
|
+
}
|
package/index.js
CHANGED
|
@@ -246,9 +246,10 @@ let blendHDN = function(meta){
|
|
|
246
246
|
let { getBrands } = require('./brands')
|
|
247
247
|
let { getSettings } = require('./settings')
|
|
248
248
|
let { getNav } = require('./nav')
|
|
249
|
+
let { getNav2 } = require('./nav2')
|
|
249
250
|
let { getSpecialNav } = require('./specialnav')
|
|
250
251
|
let { getFooter } = require('./footer')
|
|
251
252
|
let { getTopper } = require('./topper')
|
|
252
253
|
let { getBlueconic } = require('./blueconic')
|
|
253
254
|
|
|
254
|
-
module.exports = { appCheck, blendHDN, getSettings, getBrands, getNav, getSpecialNav, getFooter, getTopper, getBlueconic }
|
|
255
|
+
module.exports = { appCheck, blendHDN, getSettings, getBrands, getNav, getNav2, getSpecialNav, getFooter, getTopper, getBlueconic }
|
package/nav2.js
ADDED
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
import './css/nav.css'
|
|
2
|
+
let { getBrands } = require("./brands");
|
|
3
|
+
|
|
4
|
+
// Handle nav for various markets and include nav options for other links
|
|
5
|
+
let getNav2 = function (
|
|
6
|
+
meta,
|
|
7
|
+
urlAdd,
|
|
8
|
+
forceColor,
|
|
9
|
+
navLink,
|
|
10
|
+
navArray
|
|
11
|
+
) {
|
|
12
|
+
// If we aren't passing meta in, we have to call getSettings here
|
|
13
|
+
if (!meta) {
|
|
14
|
+
let { getSettings } = require("./settings");
|
|
15
|
+
meta = getSettings();
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
// If a navArray was provided, create the subnav
|
|
19
|
+
let subnav = "";
|
|
20
|
+
let dropdownIcon = "";
|
|
21
|
+
if (navArray && navArray.length > 0) {
|
|
22
|
+
subnav = `<ul id="subnav">`;
|
|
23
|
+
for (let i = 0; i < navArray.length; i++) {
|
|
24
|
+
subnav += `<li><a class="active" href="${navArray[i].url}" target="${navArray[i].target}"><span class="arrow-bullet">▶</span> ${navArray[i].text}</a></li>`;
|
|
25
|
+
}
|
|
26
|
+
subnav += `</ul>`;
|
|
27
|
+
// Add a dropdown icon
|
|
28
|
+
dropdownIcon = `<div class="dropdown-icon">▾</div>`;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
// Extension to URL if passed in
|
|
32
|
+
if (!urlAdd) {
|
|
33
|
+
urlAdd = "";
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
let {
|
|
37
|
+
attributes: { marketPrefix, invert, subscribeLink },
|
|
38
|
+
} = getBrands(meta.PROJECT.MARKET_KEY);
|
|
39
|
+
// Handle various CT domains
|
|
40
|
+
if (typeof window !== "undefined") {
|
|
41
|
+
switch (window.location.origin) {
|
|
42
|
+
case "https://www.ctpost.com":
|
|
43
|
+
marketPrefix = "ct";
|
|
44
|
+
break;
|
|
45
|
+
case "https://www.nhregister.com":
|
|
46
|
+
marketPrefix = "nh";
|
|
47
|
+
break;
|
|
48
|
+
case "https://www.greenwichtime.com":
|
|
49
|
+
marketPrefix = "gt";
|
|
50
|
+
break;
|
|
51
|
+
case "https://www.stamfordadvocate.com":
|
|
52
|
+
marketPrefix = "st";
|
|
53
|
+
break;
|
|
54
|
+
case "https://www.thehour.com":
|
|
55
|
+
marketPrefix = "th";
|
|
56
|
+
break;
|
|
57
|
+
case "https://www.newstimes.com":
|
|
58
|
+
marketPrefix = "nt";
|
|
59
|
+
break;
|
|
60
|
+
case "https://www.middletownpress.com":
|
|
61
|
+
marketPrefix = "mp";
|
|
62
|
+
break;
|
|
63
|
+
case "https://www.ctinsider.com":
|
|
64
|
+
marketPrefix = "in";
|
|
65
|
+
break;
|
|
66
|
+
|
|
67
|
+
case "https://www.beaumontenterprise.com":
|
|
68
|
+
marketPrefix = "texcom/beau";
|
|
69
|
+
break;
|
|
70
|
+
case "https://www.lmtonline.com":
|
|
71
|
+
marketPrefix = "texcom/laredo";
|
|
72
|
+
break;
|
|
73
|
+
case "https://www.mrt.com":
|
|
74
|
+
marketPrefix = "texcom/mrt";
|
|
75
|
+
break;
|
|
76
|
+
case "https://www.myplainview.com":
|
|
77
|
+
marketPrefix = "texcom/plain";
|
|
78
|
+
break;
|
|
79
|
+
|
|
80
|
+
case "https://www.bigrapidsnews.com":
|
|
81
|
+
marketPrefix = "midcom/big";
|
|
82
|
+
break;
|
|
83
|
+
case "https://www.manisteenews.com":
|
|
84
|
+
marketPrefix = "midcom/mani";
|
|
85
|
+
break;
|
|
86
|
+
case "https://www.ourmidland.com":
|
|
87
|
+
marketPrefix = "midcom/mid";
|
|
88
|
+
break;
|
|
89
|
+
case "https://www.michigansthumb.com":
|
|
90
|
+
marketPrefix = "midcom/huron";
|
|
91
|
+
break;
|
|
92
|
+
case "https://www.recordpatriot.com":
|
|
93
|
+
marketPrefix = "midcom/benzie";
|
|
94
|
+
break;
|
|
95
|
+
case "https://www.theheraldreview.com":
|
|
96
|
+
marketPrefix = "midcom/hr";
|
|
97
|
+
break;
|
|
98
|
+
case "https://www.lakecountystar.com":
|
|
99
|
+
marketPrefix = "midcom/lc";
|
|
100
|
+
break;
|
|
101
|
+
case "https://www.thetelegraph.com":
|
|
102
|
+
marketPrefix = "midcom/alton";
|
|
103
|
+
break;
|
|
104
|
+
case "https://www.theintelligencer.com":
|
|
105
|
+
marketPrefix = "midcom/ed";
|
|
106
|
+
break;
|
|
107
|
+
case "https://www.myjournalcourier.com":
|
|
108
|
+
marketPrefix = "midcom/jv";
|
|
109
|
+
break;
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// Default is white text on black nav (SFC style)
|
|
114
|
+
let invertClass = "";
|
|
115
|
+
let color = "white";
|
|
116
|
+
// If inverted, do black on white nav
|
|
117
|
+
// Only change things if color isn't forced to white
|
|
118
|
+
if (invert || forceColor === "white") {
|
|
119
|
+
invertClass = "invert";
|
|
120
|
+
color = "black";
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
let subfolder = "";
|
|
124
|
+
if (meta.PROJECT.SUBFOLDER) {
|
|
125
|
+
subfolder = meta.PROJECT.SUBFOLDER + "/";
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
// If a link object was provided, format the insert
|
|
129
|
+
let navLinkInsert = "";
|
|
130
|
+
if (navLink) {
|
|
131
|
+
navLinkInsert = `
|
|
132
|
+
<a
|
|
133
|
+
class="nav2-title"
|
|
134
|
+
id="nav2-title"
|
|
135
|
+
href="${navLink.url}"
|
|
136
|
+
target="${navLink.target || "_blank"}"
|
|
137
|
+
>
|
|
138
|
+
${navLink.text}${dropdownIcon}
|
|
139
|
+
</a>
|
|
140
|
+
`
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
let rightBlock = `
|
|
144
|
+
<a id="nav2-sub-box" href="${subscribeLink}" target="_blank">
|
|
145
|
+
<div>Subscribe</div>
|
|
146
|
+
</a>
|
|
147
|
+
`;
|
|
148
|
+
|
|
149
|
+
|
|
150
|
+
let navHTML = `<nav class="nav2-container ${invertClass}">
|
|
151
|
+
<div class="nav2-left">
|
|
152
|
+
${navLinkInsert}
|
|
153
|
+
</div>
|
|
154
|
+
<div class="nav2-center">
|
|
155
|
+
<a
|
|
156
|
+
href="/"
|
|
157
|
+
target="_blank"
|
|
158
|
+
rel="noopener noreferrer"
|
|
159
|
+
>
|
|
160
|
+
<div>
|
|
161
|
+
<img
|
|
162
|
+
class="nav2-desk-logo"
|
|
163
|
+
alt="Logo"
|
|
164
|
+
src="https://files.sfchronicle.com/static-assets/logos/${marketPrefix}-${color}.png"
|
|
165
|
+
></img>
|
|
166
|
+
<img
|
|
167
|
+
class="nav2-mobile-logo"
|
|
168
|
+
alt="Logo"
|
|
169
|
+
src="https://files.sfchronicle.com/static-assets/logos/${marketPrefix}-square-${color}.png"
|
|
170
|
+
></img>
|
|
171
|
+
</div>
|
|
172
|
+
</a>
|
|
173
|
+
</div>
|
|
174
|
+
<div class="nav2-right">
|
|
175
|
+
${rightBlock}
|
|
176
|
+
</div>
|
|
177
|
+
${subnav}
|
|
178
|
+
</nav>`;
|
|
179
|
+
|
|
180
|
+
return navHTML;
|
|
181
|
+
};
|
|
182
|
+
|
|
183
|
+
module.exports = { getNav2 };
|