Skip to content

Commit 8b2b0e2

Browse files
hmillersarahhmillersarah
authored
Merge pull request #59 from imsdev/live-course-update
Live course update
2 parents de7a1a2 + ca34d47 commit 8b2b0e2

4 files changed

Lines changed: 68 additions & 31 deletions

File tree

‎ims-education.html‎

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -457,30 +457,32 @@
457457
<!-- =========================== Courses - Instructor-led =========================== -->
458458
<section id="live" class="white-bg card-section">
459459
<div><h2>Instructor-led</h2></div>
460-
<p>No instructor-led classes are scheduled at this time. Please check back in the coming weeks for class offerings.</p>
460+
<!-- <p>No instructor-led classes are scheduled at this time. Please check back in the coming weeks for class offerings.</p> -->
461461
<p>For more information about the live class format, see the upcoming events on the <a href="https://community.ibm.com/community/user/ibmz-and-linuxone/groups/public?CommunityKey=eba3ada3-db89-4dca-9154-328195f5e560" target="_blank" rel="noopener noreferrer">IMS community page.</a></p>
462462

463463
<!-- IMS Fundamentals, April Session -->
464-
<!-- <course-card
464+
<course-card
465465
id="ims-fundamentals-april-2025"
466-
name="IMS Fundamentals"
467-
session="April 2025 session"
468-
desc="Learn about the main components of IBM IMS: IMS Database Manager (IMS DB),
469-
IMS Transaction Manager (IMS TM), and common system services for IMS DB and
470-
IMS TM. Learn how these components work and interact with applications, how
471-
IMS databases differ from each other and differ from relational databases
472-
message types, security, maintenance, troubleshooting, and more."
466+
name="IMS Database Recovery Control (DBRC)"
467+
session="June 2025 session"
468+
desc="<p>This live course runs for 9 sessions, 4 hours each day. It describes the benefits of DBRC and the
469+
activities required to configure, implement, and manage Database Recovery Control (DBRC). DBRC is an
470+
IMS facility that provides database recovery and facilitates database sharing, between IMS systems in
471+
all IMS environments, but this class is most applicable for Database/Transaction Management (DB/TM),
472+
Database Control (DBCTL), and batch IMS systems.</p> <p>This is an intermediate to advanced IMS class that is
473+
intended for IMS DBAs and system programmers.</p>"
473474
imgsrc="wp-content/icons/icon_education.svg"
474475
selfpaced="false"
475-
level="Beginner"
476-
cost="None"
477-
badge="Yes"
478-
time="32 hours"
479-
start="Apr 22, 2025 08:00 AM (CT)"
480-
end="Apr 30, 2025 01:00 PM (CT)"
481-
link="https://www.ibm.com/it-infrastructure/us-en/resources/campaignmail/z/ims/eventsignup.html"
476+
level="Intermediate"
477+
badge="n/a"
478+
time="36 hours"
479+
start="Jun 9"
480+
end="Jun 19"
481+
hours="8:00 AM CDT (13:00 UTC) - 1:00 PM CDT (18:00 UTC)"
482+
registerlink="https://www.ibm.com/it-infrastructure/us-en/resources/campaignmail/z/ims/eventsignup.html"
483+
link="http://public.dhe.ibm.com/software/data/sw-library/ims/usergroups/IMS_Events_List.pdf"
482484
>
483-
</course-card> -->
485+
</course-card>
484486
</section>
485487

486488
<!-- =========================== FAQ =========================== -->

‎web-components/course-card/course-card.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ p {
1919
a {
2020
text-decoration: none;
2121
color: #0f62fe;
22+
font-size: 1.125em;
2223
}
2324

2425
img {

‎web-components/course-card/course-card.html‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,24 @@
88
<div>
99
<h2 class="course-name"></h2>
1010
<h3 class="live-session"></h3>
11-
<p class="course-desc"></p>
11+
<span class="course-desc"></span>
1212
<div class="column-g">
1313
<div class="inline-g">
1414
<p><b><span class="course-type"></span></b> Yes</p>
1515
<p><b>Level: </b><span class="course-level"></span></p>
1616
<p><b>Cost: </b><span class="course-cost"></span></p>
17-
<p><b>Badge: </b><span class="course-badge"></span></p>
17+
<!-- <p><b>Badge: </b><span class="course-badge"></span></p> -->
18+
<p class="course-badge-g"><b>Badge: </b><span class="course-badge"></span></p>
1819
<p class="course-time-g"><b>Time: </b><span class="course-time"></span></p>
1920
<p class="course-start-g"><b>Starts: </b><span class="course-start"></span></p>
2021
<p class="course-end-g"><b>Ends: </b><span class="course-end"></span></p>
22+
<p class="course-hours-g"><b>Hours: </b><span class="course-hours"></span></p>
2123
</div>
2224
</div>
2325
</div>
2426
<div class="link-g">
2527
<a class="course-link" target="_blank" rel="noopener noreferrer"></a>
28+
<a class="register-link" target="_blank" rel="noopener noreferrer"></a>
2629
</div>
2730
</div>
2831
</div>

‎web-components/course-card/course-card.js‎

Lines changed: 43 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,26 @@ function createComponent(html) {
2222
selector.textContent = content;
2323
}
2424

25+
/**
26+
* Sets the content of an element based on a CSS selector.
27+
* @param {string} cssSelector - The CSS selector of the element to set the content for.
28+
* @param {string} content - The content to set for the element.
29+
* @param {boolean} shadow - A boolean indicating whether to use the shadow DOM for the element.
30+
* @returns {void}
31+
*/
32+
function setDesc(cssSelector, content, shadow) {
33+
const selector = shadow.querySelector(cssSelector);
34+
// Check if span tag is used in desc
35+
if ((content != undefined) && (content.includes('<p>'))) {
36+
// Update HTML
37+
selector.innerHTML = content;
38+
} else {
39+
const paragraph = '<p>' + content + '</p>';
40+
// Update the text
41+
selector.innerHTML = paragraph;
42+
}
43+
}
44+
2545
/**
2646
* Sets the link of an element based on a CSS selector.
2747
* @param {string} cssSelector - The CSS selector of the element to set the link for.
@@ -56,14 +76,16 @@ function createComponent(html) {
5676
constructor() {
5777
super();
5878
this.selfpaced = 'true';
79+
this.cost = 'None';
80+
this.badge = 'Yes';
5981
}
6082

6183
/**
6284
* Returns an array of properties to observe.
6385
* @returns {Array} An array of property names.
6486
*/
6587
static get observedAttributes() {
66-
return ['name', 'session', 'desc', 'imgsrc', 'selfpaced', 'level', 'cost', 'badge', 'time', 'start', 'end', 'link'];
88+
return ['name', 'session', 'desc', 'imgsrc', 'selfpaced', 'level', 'cost', 'badge', 'time', 'start', 'end', 'hours', 'link', 'registerlink'];
6789
}
6890

6991
/**
@@ -92,12 +114,16 @@ function createComponent(html) {
92114
courseCard.style.alignItems = 'flex-start';
93115
}
94116

117+
if (this.name == 'IMS Database Recovery Control (DBRC)') {
118+
console.log(this.badge);
119+
}
120+
95121
// Set course name
96122
setContent('.course-name', this.name, shadow);
97123
// Set session for live course
98124
setContent('.live-session', this.session, shadow);
99125
// Set course desc
100-
setContent('.course-desc', this.desc, shadow);
126+
setDesc('.course-desc', this.desc, shadow);
101127
// Set course level
102128
setContent('.course-level', this.level, shadow);
103129
// Set course type
@@ -106,29 +132,34 @@ function createComponent(html) {
106132
// Set course cost
107133
setContent('.course-cost', this.cost, shadow);
108134
// Set course badge
109-
setContent('.course-badge', this.badge, shadow);
135+
if (this.badge != 'n/a') {
136+
setContent('.course-badge', this.badge, shadow);
137+
} else {
138+
hideContent('.course-badge-g', shadow);
139+
};
140+
// Set course time
141+
setContent('.course-time', this.time, shadow);
142+
// Set course link
143+
setLink('.course-link', this.link, this.name, 'Learn more →', shadow);
110144

111145
var linkText;
112146
// Change card content based on self-paced vs live course
113147
if (this.selfpaced == 'true') {
114-
// Set course time
115-
setContent('.course-time', this.time, shadow);
116148
// Hide course duration
117149
hideContent('.course-start-g', shadow);
118150
hideContent('.course-end-g', shadow);
119-
// Update link text
120-
linkText = 'Learn more →'
151+
// Hide course hours
152+
hideContent('.course-hours-g', shadow);
121153
} else {
122154
// Set course duration
123155
setContent('.course-start', this.start, shadow);
124156
setContent('.course-end', this.end, shadow);
125-
// Hide course time
126-
hideContent('.course-time-g', shadow);
127-
// Update link text
157+
// Set course hours
158+
setContent('.course-hours', this.hours, shadow);
159+
// Set register link
128160
linkText = 'Register →'
161+
setLink('.register-link', this.registerlink, this.name, 'Register →', shadow);
129162
}
130-
// Set course link
131-
setLink('.course-link', this.link, this.name, linkText, shadow);
132163
}
133164
}
134165

0 commit comments

Comments
 (0)