common/app/views/main.scala.html

@(projectName: Option[String] = None)(head: Html)(body: Html)(implicit page: model.Page, request: RequestHeader, context: model.ApplicationContext)
@import common.{Edition, commercial}
@import model.Page.getContent
@import views.support.{Commercial, RenderClasses}
@import play.api.Mode.Dev

@headerAndTopAds(showAdverts: Boolean, edition: Edition, content: Option[model.ContentType]) = {
  @if(!page.metadata.shouldHideHeaderAndTopAds) {
    @defining(showAdverts && !content.exists(_.tags.isTheMinuteArticle) && !Commercial.isAdFree(request)) { showTopSlot =>

      <div id="bannerandheader">
          @if(showTopSlot) {
            @fragments.commercial.topBanner()
          }
          @fragments.header()
      </div>

      <div id="maincontent" tabindex="0"></div>
    }
  }
}

<!DOCTYPE html>
<html id="js-context" class="js-off is-not-modern id--signed-out" lang="en" data-page-path="@request.path">
<head>
    @fragments.head(projectName, head)
</head>

@defining(getContent(page), Commercial.shouldShowAds(page), Edition(request)) { case (content, showAdverts, edition) =>
    <body
        id="top"
        class="@RenderClasses(Map(
            ("has-page-skin", page.metadata.hasPageSkin(request) && showAdverts),
            ("childrens-books-site", page.metadata.sectionId == "childrens-books-site"),
            ("has-super-sticky-banner", false),
            ("is-immersive", content.exists(_.content.isImmersive)),
            ("is-hosted-content", page.metadata.isHosted),
            ("is-immersive-interactive", content.exists(content => content.tags.isInteractive && content.content.isImmersive))))"
        itemscope itemtype="http://schema.org/WebPage">

        <a class="u-h skip" href="#maincontent" data-link-name="skip : main content">Skip to main content</a>

        @if(page.metadata.hasPageSkin(request)) {
            @fragments.commercial.pageSkin()
        }

        @if(!page.metadata.isFront && page.metadata.hasSurveyAd(request)) {
            @fragments.commercial.survey()
        }

        @page match {
            case page: commercial.hosted.HostedPage => {}
            case _ => {
                @headerAndTopAds(showAdverts, edition, content)
            }
        }

        @body

        @**********************
         24x7 support training

         We intentionally modified the displayed section on this specific article.
         This is a failure that trainees have to diagnose in frontend.
        ************************@
        @if(request.path == "/info/2015/mar/11/-removed-article") {
            <script type="text/javascript">
                document.querySelectorAll('[data-link-name="article section"]')[0].textContent = "Culture"
                @***
                 The following is a misdirection to let people think damned CAPI is causing the issue
                ***@
                console.log("Error connecting to content API to retrieve section: 503")
                console.log("Defaulting to Culture")
            </script>
        }

        @fragments.footer()

        @fragments.message()

        @fragments.inlineJSNonBlocking()

        @fragments.analytics.base()
    </body>
        @if(context.environment.mode == Dev) {
            <script>
                if (window.callPhantom) {
                    setTimeout(function() {
                        window.callPhantom('takeShot');
                    }, 10000); // Wait arbitrary 10 seconds before taking the screenshot to let things settled down
                }
            </script>
        }
    </html>
}