301 lines
17 KiB
Plaintext
301 lines
17 KiB
Plaintext
@model CatherineLynwood.Models.DiscoveryPageViewModel
|
||
|
||
@{
|
||
ViewData["Title"] = "The Alpha Flame: A Gritty 1980s Birmingham Crime Novel about Twin Sisters";
|
||
bool showReviews = Model.Reviews.Items.Any();
|
||
}
|
||
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<nav aria-label="breadcrumb">
|
||
<ol class="breadcrumb">
|
||
<li class="breadcrumb-item"><a asp-controller="Home" asp-action="Index">Home</a></li>
|
||
<li class="breadcrumb-item"><a asp-controller="TheAlphaFlame" asp-action="Index">The Alpha Flame</a></li>
|
||
<li class="breadcrumb-item active" aria-current="page">Discovery</li>
|
||
</ol>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- HERO: Cover + Trailer (no Buy Box here in Version B) -->
|
||
<section class="mb-4">
|
||
<div class="row g-3 align-items-stretch">
|
||
<!-- Trailer only -->
|
||
<div class="col-12">
|
||
<div class="card character-card" id="hero-media-card">
|
||
<div class="card-body">
|
||
<!-- Trailer -->
|
||
<div class="trailer-wrapper mb-3">
|
||
<!-- Mobile / tablet: PORTRAIT -->
|
||
<video id="trailerPortrait"
|
||
class="w-100"
|
||
playsinline
|
||
preload="none"
|
||
poster="/images/webp/the-alpha-flame-discovery-trailer-portrait-400.webp"
|
||
controls>
|
||
<source src="/videos/the-alpha-flame-discovery-trailer-portrait.mp4" type="video/mp4">
|
||
Sorry, your browser doesn't support embedded video.
|
||
</video>
|
||
|
||
<button id="trailerPlayBtn" class="trailer-play-btn">
|
||
<i class="fad fa-play"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<!-- If JS is off, hide the custom play button so native controls are used -->
|
||
<noscript>
|
||
<style>
|
||
#trailerPlayBtn {
|
||
display: none !important
|
||
}</style>
|
||
</noscript>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Synopsis first (story-first layout) -->
|
||
<section id="synopsis" class="mb-4">
|
||
<div class="card character-card text-white" style="background: url('/images/webp/synopsis-background-960.webp'); background-position: center; background-size: cover;">
|
||
<div class="card-header">
|
||
<h2 class="card-title h1 mb-0">The Alpha Flame: <span class="fw-light">Discovery</span></h2>
|
||
<p class="mb-0">Survival, secrets, and sisters in 1983 Birmingham.</p>
|
||
</div>
|
||
|
||
<div class="card-body" id="synopsis-body">
|
||
<!-- Audio blurb -->
|
||
<div class="row align-items-center mb-3">
|
||
<div class="col-2">
|
||
<responsive-image src="catherine-lynwood-16.png" class="img-fluid rounded-circle border border-2 border-dark" alt="Catherine Lynwood" display-width-percentage="20"></responsive-image>
|
||
</div>
|
||
<div class="col-10">
|
||
<div class="audio-player text-center">
|
||
<audio id="player">
|
||
<source src="/audio/the-alpha-flame-discovery-catherine.mp3" type="audio/mpeg">
|
||
Your browser does not support the audio element.
|
||
</audio>
|
||
</div>
|
||
<p class="text-center text-white small mb-0">Listen to Catherine talking about the book</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Teaser -->
|
||
<p class="card-text">
|
||
Set in 1983 Birmingham, nearby Redditch, and Barmouth in Wales, The Alpha Flame: Discovery follows two young women, Beth and Maggie, as they uncover dark family secrets and fight to survive. Gritty and emotionally charged, it explores the bond between two women who refuse to be broken.
|
||
</p>
|
||
|
||
<!-- One copy of the full synopsis -->
|
||
<div>
|
||
<div class="mt-2">
|
||
<p class="card-text">For Beth, the world is a cold and unforgiving place. Devastation strikes in a single moment, leaving her isolated, shattered, and vulnerable. Alone in the bleak shadows of a city that offers neither refuge nor redemption, she is forced to navigate a relentless cycle of desperation and despair. Every step of her journey tests the limits of her endurance, pushing her into harrowing situations where survival feels like a hollow victory. Beth’s existence is marked by loss, betrayal, and an almost suffocating loneliness that threatens to consume her entirely. Yet, even in the darkest corners of her ordeal, a fragile ember of defiance smoulders within her, a quiet, stubborn refusal to let the world destroy her completely.</p>
|
||
<p class="card-text">Maggie, by contrast, is a force of nature, a woman who thrives on her unshakable drive and an unrelenting belief in her own power. Behind her fiery red hair and disarming charm lies a storm of determination and ferocity. Maggie doesn’t just live; she races through life, fuelled by a need for speed and the thrill of freedom. Her Triumph TR6 isn’t just a car; it’s an extension of her spirit, sleek, powerful, and unapologetically bold. On the open road, with the engine roaring and the world blurring past her, she feels invincible. But Maggie’s intensity doesn’t stop at the wheel. Her relationships burn just as brightly. As a lover, she is dominant, passionate, and unafraid to embrace her darker desires. While fiercely loving and loyal, Maggie is also formidable; crossing her isn’t a mistake anyone makes twice.</p>
|
||
<p class="card-text">When fate brings Beth and Maggie together, their connection is explosive, a union of two polar opposites that burns with both tenderness and raw power. For Beth, Maggie represents a lifeline, a reminder that love and trust still exist, even in a world that has betrayed her at every turn. For Maggie, Beth awakens a fierce protectiveness and vulnerability she’s rarely allowed herself to feel. Together, they ignite a flame that challenges them to confront their own fears, desires, and limitations.</p>
|
||
<p class="card-text">Set against the kaleidoscope of 1983, where synthesised anthems provide a pulsing soundtrack and the streets are alive with the bold styles and rebellious energy of the decade, their story unfolds in a city teeming with danger and intrigue. From high speed chases along winding roads to dimly lit clubs and desolate alleyways, the heroines’ journey is a visceral exploration of survival and freedom. The neon haze of the era contrasts sharply with the stark realities they face, painting a vivid picture of a world where strength and vulnerability coexist.</p>
|
||
<p class="card-text">As secrets surface and danger tightens its grip, Beth and Maggie must confront not only the challenges around them but the truths within themselves. Their bond is tested by betrayal, desire, and the shadows of their pasts, but through it all, their flame burns brighter, illuminating their courage and the unbreakable spirit of two heroines determined to rewrite their fates.</p>
|
||
<p class="card-text">At its heart, The Alpha Flame is a story of survival, passion, and empowerment. It captures the raw power of human connection against the gritty, vibrant backdrop of an unforgettable era. With its blend of drama, intensity, and unapologetic emotion, this is a story that will leave its mark long after the final page.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Social proof near top -->
|
||
@if (showReviews)
|
||
{
|
||
var top = Model.Reviews.Items.Where(x => x.RatingValue == 5).OrderByDescending(y => y.DatePublished).First();
|
||
var fullStars = (int)Math.Floor(top.RatingValue);
|
||
var hasHalfStar = top.RatingValue - fullStars >= 0.5;
|
||
var emptyStars = 5 - fullStars - (hasHalfStar ? 1 : 0);
|
||
var reviewDate = top.DatePublished.ToString("d MMMM yyyy");
|
||
|
||
<section class="mb-4">
|
||
<div class="card character-card">
|
||
<div class="card-body">
|
||
<h3 class="h6 text-uppercase text-muted mb-2">★ Reader Praise ★</h3>
|
||
<blockquote class="blockquote mb-2">
|
||
<span class="mb-2 text-warning d-inline-block">
|
||
@for (int i = 0; i < fullStars; i++)
|
||
{
|
||
<i class="fad fa-star"></i>
|
||
}
|
||
@if (hasHalfStar)
|
||
{
|
||
<i class="fad fa-star-half-alt"></i>
|
||
}
|
||
@for (int i = 0; i < emptyStars; i++)
|
||
{
|
||
<i class="fad fa-star" style="--fa-primary-opacity:0.2;--fa-secondary-opacity:0.2;"></i>
|
||
}
|
||
</span>
|
||
@Html.Raw(top.ReviewBody)
|
||
<footer>
|
||
@top.AuthorName on
|
||
<cite title="@top.SiteName">
|
||
@if (string.IsNullOrEmpty(top.URL))
|
||
{
|
||
@top.SiteName
|
||
}
|
||
else
|
||
{
|
||
<a href="@top.URL" target="_blank">@top.SiteName</a>
|
||
}
|
||
</cite>
|
||
<span class="text-muted smaller">, @reviewDate</span>
|
||
</footer>
|
||
</blockquote>
|
||
@if (Model.Reviews.Items.Count > 1)
|
||
{
|
||
<div class="text-end">
|
||
<a asp-action="Reviews" class="btn btn-outline-secondary btn-sm">Read more reviews</a>
|
||
</div>
|
||
}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
}
|
||
|
||
<!-- Buy Box now AFTER synopsis/review -->
|
||
<section class="mb-4" id="buy">
|
||
<div class="row">
|
||
<div class="col-12 d-flex">
|
||
<div class="card character-card h-100 flex-fill" id="buy-card">
|
||
<div class="card-body d-flex flex-column">
|
||
@* buyBox: server-side slugs + <a ping> tracking *@
|
||
@* Model: CatherineLynwood.Models.DiscoveryPageViewModel *@
|
||
@{
|
||
var L = Model.Buy;
|
||
string pingBase = "/track/click";
|
||
string countryIso2 = Model.UserIso2 ?? "GB";
|
||
string flagPathSvg = $"/images/flags/{countryIso2}.svg";
|
||
string flagPathPng = $"/images/flags/{countryIso2}.png";
|
||
}
|
||
|
||
<partial name="_BuyBox" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Sticky mobile buy bar (global, still points to #buyBox inside the partial) -->
|
||
<div id="mobileBuyBar" class="d-md-none fixed-bottom bg-dark text-white py-2 border-top border-3 border-light" style="z-index:1030;">
|
||
<div class="container d-flex justify-content-between align-items-center">
|
||
<span class="small">The Alpha Flame: Discovery</span>
|
||
<a href="#buyBox" class="btn btn-light btn-sm">Buy now</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Chapter Previews -->
|
||
<section id="chapters" class="mt-4">
|
||
<h2>Chapter Previews</h2>
|
||
<div class="row">
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card h-100 character-card">
|
||
<a asp-action="Chapter1">
|
||
<responsive-image src="beth-stood-in-bathroom.png" class="card-img-top" alt="Beth's Bathroom" display-width-percentage="50"></responsive-image>
|
||
</a>
|
||
<div class="card-body border-top border-3 border-dark">
|
||
<h3 class="card-title">Chapter 1, Drowning in Silence, Beth</h3>
|
||
<p class="card-text">Beth returns home to find her mother lifeless in the bath...</p>
|
||
<div class="text-end"><a asp-action="Chapter1" class="btn btn-dark">Read More</a></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card h-100 character-card">
|
||
<a asp-action="Chapter2">
|
||
<responsive-image src="maggie-with-her-tr6-2.png" class="fit-image" alt="Maggie With Her TR6" display-width-percentage="50"></responsive-image>
|
||
</a>
|
||
<div class="card-body border-top border-3 border-dark">
|
||
<h3 class="card-title">Chapter 2, The Last Lesson, Maggie</h3>
|
||
<p class="card-text">On Christmas Eve, Maggie nervously heads out for her driving test not knowing the story that will pan out before her...</p>
|
||
<div class="text-end"><a asp-action="Chapter2" class="btn btn-dark">Read More</a></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card h-100 character-card">
|
||
<a asp-action="Chapter13">
|
||
<responsive-image src="pub-from-chapter-13.png" class="fit-image" alt="Pub from Chapter 13" display-width-percentage="50"></responsive-image>
|
||
</a>
|
||
<div class="card-body border-top border-3 border-dark">
|
||
<h3 class="card-title">Chapter 13, A Name She Never Owned, Susie</h3>
|
||
<p class="card-text">Susie goes out for a drink with a punter. What on earth could go wrong...</p>
|
||
<div class="text-end"><a asp-action="Chapter13" class="btn btn-dark">Read More</a></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
@section Scripts {
|
||
<!-- Plyr for audio -->
|
||
<script>
|
||
const player = new Plyr('audio');
|
||
</script>
|
||
|
||
<!-- Trailer play/pause via custom button or video click (single video) -->
|
||
<script>
|
||
document.addEventListener("DOMContentLoaded", () => {
|
||
const v = document.getElementById("trailerPortrait");
|
||
const playBtn = document.getElementById("trailerPlayBtn");
|
||
if (!v || !playBtn) return;
|
||
|
||
// Hide native controls when JS is active; use custom button instead
|
||
v.controls = false;
|
||
|
||
// Start playback
|
||
const startPlayback = () => {
|
||
v.muted = false;
|
||
v.volume = 1.0;
|
||
v.play()
|
||
.then(() => { playBtn.style.display = "none"; })
|
||
.catch(err => console.warn("Video play failed:", err));
|
||
};
|
||
|
||
// Toggle on video click
|
||
const togglePlayback = () => {
|
||
if (v.paused) {
|
||
startPlayback();
|
||
} else {
|
||
v.pause();
|
||
playBtn.style.display = "block";
|
||
}
|
||
};
|
||
|
||
// Events
|
||
playBtn.addEventListener("click", (e) => { e.preventDefault(); startPlayback(); });
|
||
v.addEventListener("click", togglePlayback);
|
||
|
||
// Keep button state in sync with native events
|
||
v.addEventListener("play", () => { playBtn.style.display = "none"; });
|
||
v.addEventListener("pause", () => { playBtn.style.display = "block"; });
|
||
v.addEventListener("ended", () => { playBtn.style.display = "block"; });
|
||
});
|
||
</script>
|
||
|
||
|
||
}
|
||
|
||
@section Meta {
|
||
<MetaTag meta-title="The Alpha Flame: Discovery by Catherine Lynwood"
|
||
meta-description="A gritty 1980s Birmingham psycological crime novel about two girls uncovering dark family secrets and surviving abuse. Realistic, powerful, and unflinching... discover The Alpha Flame today."
|
||
meta-keywords="The Alpha Flame Discovery, Catherine Lynwood, 1983 novel, twin sisters, suspense fiction, Rubery, Birmingham fiction, historical drama, family secrets"
|
||
meta-author="Catherine Lynwood"
|
||
meta-url="https://www.catherinelynwood.com/the-alpha-flame/discovery"
|
||
meta-image="https://www.catherinelynwood.com/images/webp/the-alpha-flame-discovery-cover-1200.webp"
|
||
meta-image-png="https://www.catherinelynwood.com/images/the-alpha-flame-discovery-cover.png"
|
||
meta-image-alt="Maggie from 'The Alpha Flame: Discovery' by Catherine Lynwood"
|
||
og-site-name="Catherine Lynwood - The Alpha Flame: Discovery"
|
||
article-published-time="@new DateTime(2024, 11, 20)"
|
||
article-modified-time="@new DateTime(2025, 09, 10)"
|
||
twitter-card-type="summary_large_image"
|
||
twitter-site-handle="@@CathLynwood"
|
||
twitter-creator-handle="@@CathLynwood" />
|
||
|
||
<script type="application/ld+json">
|
||
@Html.Raw(Model.Reviews.SchemaJsonLd)
|
||
</script>
|
||
}
|