<!DOCTYPE html> <html> <head>   <script type="text/javascript" src="config.js?v=0.5"></script> <script type="text/javascript" src="js/custom_ga.js?v=0.4"></script> <script type="text/javascript" src="./Minified/Minified.js?v=0.1"></script> <script type="text/javascript" src="js/owl.carousel.min.js"></script>  <script type="text/javascript" src="js/disable.js"></script> <script type="text/javascript"> function loadzone(from) { loadzonesforotherpages(from); } </script>  <script src="plugins/photoswipeV3.js?v=0.7"></script> <script src="plugins/photoswipe-ui-default.js?v=0.1"></script>   <script type="text/javascript" src="js/annimg.js?v=0.9"></script> <script type="text/javascript" src="controller/homeCtrl1.js?20240207v0.1"></script> <link rel="icon" href="data:;base64,iVBORw0KGgo="> <link rel="stylesheet" href="css/font-awesome-4.2.0/css/font-awesome.min.css"> <link href="./Minified/Minified.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="css/styleZoom.css" type="text/css"> <link rel="stylesheet" href="css/gridstyle.css?v=0.1>" type="text/css">   <link rel="stylesheet" href="css/photoswipe.css?v=0.2"> <link rel="stylesheet" href="css/default-skin/default-skin.css">   <link rel="stylesheet" href="css/user-access-pop.css"> <link rel="stylesheet" href="css/custom.css?v=20210916"> <link rel="stylesheet" href="css/font-family-monteseraat.css?v=0.7">  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, user-scalable=no"> <title></title> <meta name="robots" content="noindex" /> <meta name="googlebot" content="noindex" /> <meta name="description" content=""> <style> .slick-prev:before { color: #3498db; } .slick-next:before { color: #3498db; } .zoomDiv a[disabled="disabled"] { pointer-events: none; cursor:not-allowed !important; } body { font-family: 'Montserrat', Arial, sans-serif !important; } html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { font-family: 'Montserrat',Arial,sans-serif; } .nav-icons-right li { font-size: 12px !important; } .nav-icons-right li{ font-family: 'Montserrat', Arial, sans-serif !important; } </style> <script> var prevPage = ""; function functionImageLoad() { try { var str = document.getElementById('imageMap').src; if(prevPage == ""){ prevPage = str; } //avoid PR load issue if (str.substring(str.length - 6) == "FL.jpg") { if(prevPage == str){ setTimeout(function(){ var s1=document.getElementById('imageMap').src.substring(0,str.length - 6); var s2=str.substring(0,str.length - 6); if(s1==s2){ document.getElementById('imageMap').src = str.replace('_FL.jpg', '_PR.jpg'); } }, 10000); } else{ prevPage = str; functionImageLoad(); //avoid PR load issue } } else { document.getElementById("loader2").style.display = "none"; } } catch (err) { } } function firstLoad() { try { var str = document.getElementById('zoomImgId').src; if (str.substring(str.length - 6) == "FL.jpg") { document.getElementById('zoomImgId').src = str.replace('_FL.jpg', '_PR.jpg'); } else { document.getElementById("loader2").style.display = "none"; } } catch (err) { } } function onAudioPlay(val){ var temp = val.id.replace('clip',''); var eleID = "playClip"+temp; $( "#"+eleID ).trigger( "click" ); } function onArticleImgLoad(){ try { var strArtImg = document.getElementById('artimg').src; var img = new Image(); img.onload = function() { var divWidth = $(".art_img_div").width(); if(this.width > divWidth){ $("#artimg").css("width", "100%"); } else{ $("#artimg").css("width", ""); } } img.src = strArtImg; } catch (err) { } } /* function point_it(event) { console.log(event) var pos_x = event.offsetX ? (event.offsetX) : event.pageX - document.getElementById("pointer_div").offsetLeft; var pos_y = event.offsetY ? (event.offsetY) : event.pageY - document.getElementById("pointer_div").offsetTop; console.log(pos_x) console.log(pos_y) }*/ </script> </head> <body ng-app="app" ng-controller="homeCtrl"> <img src="images/GD.gif" style="display:none; z-index:999999; position:fixed; left:45%; width:50px; top:10%;" id="loader2" class="disableRightClick"> <div class="mmepaper-common-container inside-container disableRightClick"> <header class="mmepaper-container-fluid mmepaper-header"> <div class="mmepaper-container">  <div class="mmepaper-dropdown"> <label class="publications-label">Publications</label> <div class="mmepaper-top-banner-edition-input pub-list-section"> <select ng-model="selectedPublication" ng-change="onPublicationChange()"> <option ng-repeat="pubList in PublicationList" value="{{pubList.value}}">{{pubList.name}}</option> </select> </div> </div> <h1 class="mmepaper-mmlogo"><a href="home.html"><img src="images/logo.png"></a></h1> <div class="mmepaper-signin-account" ng-show="signInAccount"> <div class="mmepaper-signin-blk" ng-hide="userInfo" ng-click="signIn()"> <span ng-show="signText">SIGN IN</span> <div class="sign-in-image"> <img ng-show="signIcon" src="images/signin.png" alt="Sign in"/> </div> </div> <div class="mmepaper-account-blk" ng-show="userInfo"> <div class="mmepaper-account-name-photo"> <div class="mmepaper-account-name username">{{userName}}<i class="fa fa-angle-down" aria-hidden="true"></i></div> <div class="mmepaper-account-photo"><img src="images/account-photo.jpg"></div> <div class="mmepaper-account-details" style="z-index: 9999 !important; width: max-content;"> <div class="mmepaper-account-details-common"> <div class="mmepaper-account-welcome-blk" style="width: 100%;"> <div class="mmepaper-account-photo"><img src="images/account-photo.jpg"></div> <div class="mmepaper-account-welcome-name"> <div class="mmepaper-account-normal-text">Welcome</div> <div class="mmepaper-account-name username">{{userName}}</div> </div> </div> <ul class="mmepaper-account-welcome-details"> <li style="display: none !important"> <a href="epaper-myaccount/index.html"> <i class="fa fa-user" aria-hidden="true"></i>My Account </a> </li>  <li style="display: none !important"> <a href="https://subscribe.manoramaonline.com/content/subscription/home-digital.html?nav=cr" target="_blank"> <i class="fa fa-newspaper-o" style="font-size: 14px;" aria-hidden="true"></i>My Digital editions </a> </li> <li style="display: none !important"> <a href="https://id.manoramaonline.com/user/edit" target="_blank"> <i class="fa fa-user" aria-hidden="true"></i>Edit Profile </a> </li> <li style="display: none !important"> <a href="https://id.manoramaonline.com/changePassword" target="_blank"> <i class="fa fa-key" style="font-size: 17px;" aria-hidden="true"></i>Reset Password </a> </li>  <li> <a href="login/#/profile"> <i class="fa fa-user" aria-hidden="true"></i>Manage Profile </a> </li> <li> <a href="login/#/mysubscription"> <i class="fa fa-list" style="font-size: 14px;" aria-hidden="true"></i>My Subscription </a> </li> <li> <a href="login/#/profile#cp"> <i class="fa fa-key" style="font-size: 17px;" aria-hidden="true"></i>Change Password </a> </li> <li> <div ng-click="signOut()"> <i class="fa fa-sign-out" aria-hidden="true"></i>Sign out </div> </li> </ul> </div> <div class="mmepaper-account-common-sub mmepaper-preferences-list" style="display: none;"> <div class="mmepaper-account-welcome-blk"> <i class="fa fa-angle-left" aria-hidden="true"></i> <div class="mmepaper-account-welcome-name"> <div class="mmepaper-account-normal-text">Preferences</div> </div> </div> <ul class="mmepaper-account-welcome-details"> <li> <label>Choose Default Edition</label> <div class="mmepaper-account-form-input"> <select name="Select1"> <option selected="selected">Thiruvananthapuram</option> <option value="Kollam">Kollam</option> <option value="Pathanamthitta">Pathanamthitta</option> <option value="Alappuzha">Alappuzha</option> <option value="Kottayam">Kottayam</option> <option value="Idukki">Idukki</option> <option value="Kochi">Kochi</option> <option value="Thrissur">Thrissur</option> <option value="Palakkad">Palakkad</option> <option value="Malappuram">Malappuram</option> <option value="Wayanad">Wayanad</option> <option value="Kozhikode">Kozhikode</option> <option value="Kannur">Kannur</option> <option value="Kasargod">Kasargod</option> </select> </div> </li> <li> <label>Default Epaper Display Format</label> <div class="mmepaper-account-form-input"> <select name="Select1"> <option selected="selected">HTML</option> <option value="Kollam">Flash</option> </select> </div> </li> <li class="mmepaper-account-form-button-blk"> <input class="mmepaper-submit-button" name="Submit1" type="submit" value="Submit" /> <input class="mmepaper-cancel-button" name="Cancel1" type="reset" value="Cancel" /> </li> </ul> </div> </div> </div> </div> </div> </div> </header> <div class="mmepaper-container-fluid" id="idToHide1"> <div class="mmepaper-container"> <div class="mmepaper-inside-epaper-edition" style="text-align:center;"> <div id="desktop_view_filters" ng-show="showDesktopView"> <div class="mmepaper-inside-pages-header-left"> <ul class="mmepaper-breadcrumbs"> <li class="uppercase"> <a id="achHome" class="fSize" target="_self" href="home.html" title="Go To Home">Home</a> </li>  </ul> </div> <div class="mmepaper-top-banner-edition-input" style="border: none; margin-left: 15%"> <datepicker date-min-limit="{{calenderDefaultDate_Min}}" date-max-limit="{{calenderDefaultDate_Max}}" date-set="{{calenderDefaultDate}}" date-format="dd/MM/yyyy" class="mmepaper-top-banner-edition-input" style="width: 100%;" datepicker-mobile="true" autoclose="true"> <input style="padding-left: 10px;" class="search-control-area calendar-icon" readonly ng-model="selectedDate" ng-focus="onDateFocus()" ng-change="onDateChange()" name="Text1" type="text" value=""> </datepicker> </div>   <div class="mmepaper-inside-pages-header-middle" style="margin-top:7px;"> <div class="mmepaper-inside-pages-numbers"> <span class="fSize">PAGE:</span>   <span id="currentTop" class=""> <div class="mmepaper-top-banner-edition-input" style="width: fit-content;" ng-hide="showDataNotAvailable"> <select style="padding-left: 10px; font-size: 15px;" name="PageNumber" ng-model="selectedPageNo" ng-change="onPageNoChange()" ng-options="page.value as page.value for page in pageNoMaster"></select> </div> </span> / <span id="totalPagesDiv">{{totalPages}}</span> </div> <div ng-show="pageCountNOtFound" class="mmepaper-inside-pages-numbers"> <div style="color: red">{{pageNotFoundMsg}}</div> </div> </div> <div class="nav-icons-right" style="width: 350px;"> <ul>  <li> <a title="Show Thumbnails" ng-click="loadCarousel();" style="color:black; cursor:pointer"> <span class="icon-slotx fa fa-picture-o" style="font-size: 13px;"> </span> Thumbnails </a> </li> <li class="zoomDiv"> <a ng-click="zoomImage(-imgZoomInitialVal);" style="color:black; cursor:pointer" ng-disabled="zoomOutDisabled"> <span class="icon-slotx fa fa-search-minus" style="font-size:13px;"> </span>  Zoom </a> </li> <li class="zoomDiv"> <a ng-click="zoomImage(imgZoomInitialVal);" style="color:black; cursor:pointer" ng-disabled="zoomInDisabled"> <span class="icon-slotx fa fa-search-plus" style="font-size:13px;"> </span>  Zoom </a> </li> <li> <a ng-click="zoomImage(0);" style="color:black; cursor:pointer"> <span class="icon-slotx fa fa-refresh" style="font-size:13px;"> </span>   Reset Zoom </a> </li> <li ng-show="isAllowVoiceClip"> <a style="color:black; cursor:pointer;" data-toggle="modal" ng-click="getAudioClip()"> <span class="icon-slot"> <img src="images/topRightBar/top_news_icon.png"> </span> <span style="color: #d90000; font-weight: bold;"> Listen to Top News </span> </a> </li> </ul> </div> <div class="mmepaper-top-banner-edition-input table-of-content" ng-show="showTableContentDesktop"> <a ng-click="viewTableContentDesktop()">Table of content</a> </div> <div class="mmepaper-top-banner-edition-input table-of-content" ng-show="showThumbnailDesktop"> <a ng-click="viewThumbnailDesktop()">Thumbnail View</a> </div> <div class="mmepaper-top-banner-edition-input subscribe-now" ng-show="showSubscribeNowBtn"> <div class="subscribe-now-text" ng-click="subscribeNow()">Subscribe Now</div> </div> </div> <div id="mobile_view_filters" ng-show="showMobileView"> <div class="mmepaper-top-banner-edition-input" style="border: none;"> <datepicker date-min-limit="{{calenderDefaultDate_Min}}" date-max-limit="{{calenderDefaultDate_Max}}" date-set="{{calenderDefaultDate}}" date-format="dd/MM/yyyy" class="mmepaper-top-banner-edition-input" style="width: 100%;" datepicker-mobile="true" autoclose="true"> <input style="padding-left: 10px;" class="search-control-area calendar-icon" readonly ng-model="selectedDate" ng-focus="onDateFocus()" ng-change="onDateChange()" name="Text1" type="text" value=""> </datepicker> </div>   <div class="mmepaper-top-banner-edition-input subscribe-now" ng-show="showSubscribeNowBtn"> <div class="subscribe-now-text" ng-click="subscribeNow()">Subscribe Now</div> </div> </div> </div> </div> </div>  <div id="masterLoader"> <div id="loader"></div> <div id="cover-spin"></div> </div>   <div id="desktop_view" ng-show="showDesktopView"> <div class="mmepaper-container-fluid" style="background: #EEEEEE;"> <div class="mmepaper-container">  <div class="mmepaper-inside-pages-container" ng-hide="showDataNotAvailable" > <div class="mmepaper-inside-pages-header" style="display:none"> <div class="mmepaper-inside-pages-header-left"> <ul class="mmepaper-breadcrumbs"> <li class="uppercase"><a id="achHome" target="_self" href="home.html" title="Go To Home">Home</a></li>  </ul> </div> <div class="mmepaper-inside-pages-header-middle" style="margin-top:7px;"> <div class="mmepaper-inside-pages-numbers"> PAGE <span id="currentTop" class="">{{currentPage}}</span> / <span id="totalPagesDiv">{{totalPages}}</span> </div> <div ng-show="pageCountNOtFound" class="mmepaper-inside-pages-numbers"> <div style="color: red">{{pageNotFoundMsg}}</div> </div> </div> <div class="nav-icons-right" style="width: 365px;"> <ul>  <li> <a title="Show Thumbnails" ng-click="loadCarousel();" style="color:black; cursor:pointer"> <span class="icon-slotx fa fa-picture-o" style="font-size:medium;"> </span> Thumbnails </a> </li> <li class="zoomDiv"> <a ng-click="zoomImage(-imgZoomInitialVal);" style="color:black; cursor:pointer" ng-disabled="zoomOutDisabled"> <span class="icon-slotx fa fa-search-minus" style="font-size:medium;"> </span>  Zoom </a> </li> <li class="zoomDiv"> <a ng-click="zoomImage(imgZoomInitialVal);" style="color:black; cursor:pointer" ng-disabled="zoomInDisabled"> <span class="icon-slotx fa fa-search-plus" style="font-size:medium;"> </span>  Zoom </a> </li> <li> <a ng-click="zoomImage(0);" style="color:black; cursor:pointer"> <span class="icon-slotx fa fa-refresh" style="font-size:medium;"> </span>   Reset Zoom </a> </li>  </ul> </div> </div> </div>  </div>  <div class="mmepaper-inside-epaper-slide-container containerMain" style="overflow:hidden; width:100%; padding: 10px 10px; margin-top: 0px;" ng-show="showDesktopViewTC"> <div class="arrowTop left" style="z-index: 1000" ng-hide="showDataNotAvailable"> <a id="prev1" style="background-color:#5a5a5a; text-decoration: none; color:red;" ng-click="onPrevClick()" href="#" ng-class="{'prev': currentPage != 1, 'prev_disable': currentPage == 1}">‹</a> </div> <div id="OuterDiv" style="text-align:center;margin-top:0x;"> <div class="no-data" style="margin-top: 1.1%; margin-bottom: 1%;" ng-show="showDataNotAvailable"> Data Not Available </div> <img id="imgForSize" style="display: none"/> <div id="frm">    <div class="row"> <div class="col-sm-3"></div> <div class="col-sm-6"> <div class="progress" id="imgLoad" style="height: 7px; margin-bottom: 1px;border-radius: unset;"> <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width:100%;background-color: #b4b0b0;"> </div> </div> </div> <div class="col-sm-3"></div> </div> <div id="loaderDiv" class='loaderIMG'></div> <img id="mainImage" ng-dblclick="zoomImage(imgZoomInitialVal, 'onTap', event);" onload="javascript: loadzone('desktop')" id="singleImg" alt="" src="" usemap="#imgmap" class="annotated" ng-hide="showDataNotAvailable" ng-style="{'transform': 'scale('+zoom_value+')', 'width': imgWidth+'%'}" style="position: unset !important;object-fit: cover;border:2px solid #ddd"> <br> <div ng-show="curlDiv && !showDataNotAvailable" class="curl-bottom-right" ng-click="onNextClick()" ng-class="{'next_disable': currentPage == totalPages}"> <img src="img/pgCurl.jpg" class="img" style="max-width: 45%; float: right; margin-top: -13%;"> </div>   <map id="zoneMap" name="imgmap"> <span ng-repeat="imgarea in areaForImage"> <area class="title mapArea" target="{{imgarea.target}}" alt="{{imgarea.alt}}" icon="{{imgarea.icon}}" title="{{imgarea.title}}" href="{{imgarea.href}}" shape="rect" coords="{{imgarea.coords}}"> <div id="map_div"></div> </span> </map> <div class="zone" width=""></div> </div> </div> <div class="arrowTop right" style="z-index: 1000" ng-hide="showDataNotAvailable"> <a id="next1" style="background-color:#5a5a5a; text-decoration: none; color:red;" ng-click="onNextClick()" href="#" ng-class="{'next': currentPage != totalPages, 'next_disable': currentPage == totalPages}">›</a> </div> </div>   </div> </div>   <div id="mobile_view" ng-show="showMobileView"> <div class="mmepaper-container-fluid" style="background: #EEEEEE;"> <div class="mmepaper-container">  <div class="mmepaper-inside-pages-container" style="margin-bottom: 1px !important;" ng-hide="showDataNotAvailable"> <div class="mmepaper-inside-pages-header" style="height: 35px; margin: 1px !important;"> <div class="mmepaper-inside-pages-header-left" style="width: auto;"> <ul class="mmepaper-breadcrumbs"> <li class="uppercase"><a target="_self" href="home.html" title="Go To Home">Home</a></li>   </ul> </div> <div class="nav-icons-right-cust"> <ul> <li ng-show="isAllowVoiceClip"> <a style="color:black; cursor:pointer;" data-toggle="modal" ng-click="getAudioClip()"> <span class="icon-slot"> <img src="images/topRightBar/top_news_icon.png"> </span> <span style="color: #d90000; font-weight: bold;"> Listen to Top News </span> </a> </li> </ul> </div> </div> </div>   <div class="mmepaper-inside-epaper-slide-container containerMain" style="overflow:hidden; width:100%;" ng-show="showMobileViewTC"> <div id="OuterDiv" style="text-align:center;margin-top:0x;"> <div class="no-data" style="margin-top: 10%; margin-bottom: 10%;" ng-show="showDataNotAvailable"> Data Not Available </div> <div id="container" ng-hide="showDataNotAvailable"> <div class="container grid_container_cust"> <div class="row text-center text-lg-left demo-gallery">  <div class="main col-lg-3" ng-repeat="pro in emagazineDataMobile track by $index"> <a ng-click="onMobileThumbnailClick(pro.indexL)" style="cursor: pointer;"> <span class="img_main"> <figure class="fig" ng-show="pro.showL"> <img class="img-fluid img_cust" ng-src="{{pro.srcL}}"> <figcaption class="image-caption-text"> <div>{{pro.pageNoL}}</div>  </figcaption> </figure> <img class="img-fluid img_cust1" ng-hide="pro.showL">  </span> </a> <a ng-click="onMobileThumbnailClick(pro.indexR)" style="cursor: pointer;"> <span class="img_main"> <figure class="fig" ng-show="pro.showR"> <img class="img-fluid img_cust" ng-src="{{pro.srcR}}"> <figcaption class="image-caption-text"> <div>{{pro.pageNoR}}</div>  </figcaption> </figure> <img class="img-fluid img_cust1" ng-hide="pro.showR">  </span> </a> </div> </div> </div> </div> </div> </div>  </div> </div> </div>  <div class="mmepaper-inside-epaper-papge-listing" style="z-index: 999"> <a ng-if="false" href data-toggle="modal" data-target="#viewArticalModal2" ng-click="viewArticals('all')"><div class="mmepaper-epaper-view-by-article">VIEW BY ARTICLE</div></a> <div class="mob-nav-cust" ng-show="show_mob_nav"> <ul> <li ng-show="false"><img src="images/topRightBar/cut-icon.png"></li> <li ng-click="OpenFeedback()"><img src="images/topRightBar/feed-back-icon.png"></li> <li ng-click="helpWindow();"><img src="images/topRightBar/help-icon.png"></li> </ul> </div> <div class="mmepaper-epaper-papge-listing-buttons" ng-hide="show_mob_nav"> <div class="mmepaper-epaper-listing-buttons-up" id="bottomCarouselButtonUp"> <i class="fa fa-caret-up" aria-hidden="true"></i> </div> <div class="mmepaper-epaper-listing-buttons-down" id="bottomCarouselButtonDown" style="display:none;"> <i class="fa fa-caret-down" aria-hidden="true"></i> </div> </div> <div ng-show="mainBottomCarousel" class="mmepaper-inside-epaper-papge-listing-slide" id="bottomCarousel" > <div class="owl-carousel mmepaper-inside-epaper-listing-carousel" id="bottomCarouselInner"> <div class="item" style="cursor: pointer;" ng-repeat="epaper in epaperDataBottom" ng-init="$last && bottomCarouselFinished()"> <div class="mmepaper-epaper-page-no">{{epaper.pageno}}</div> <figure id="thumb{{epaper.pageno}}" title="{{epaper.pagename}}" class="mmepaper-carousel-thumb-img1 active-thumb" style="width: unset !important;" ng-click="onBottomThumbClick(epaper)"><img class="owl-lazy" style="height: auto;max-width: 202px;" data-src="{{epaper.thumnailurl}}"></figure> <br /> </div> </div> </div> </div> </div> <div class="mmepaper-container-fluid disableRightClick" style="background: #EEEEEE;" ng-show="showSwitchToOldVerion"> <div class="switch-to-button disableRightClick" ng-click="switchToOldVersion()" style="color: cornflowerblue; float: right; font-size: 12px; margin-right: 21px;">switch to old view</div> </div> <footer class="mmepaper-footer"> <div class="mmepaper-container"> <ul class="mmepaper-footer-menu"> <li><a href="footer/about-gn-media.html" target="_blank">About GN Media</a></li> <li><a href="footer/contact-us.html" target="_blank">Contact us</a></li> <li><a href="footer/terms-conditions.html" target="_blank">Terms and Conditions</a></li> </ul> <div class="mmepaper-footer-copyright">漏 Copyright <span id="copyrightyear"></span> Al Nisr Publishing. All rights reserved.</div> <div class="footer-dev-by"> <a href="http://www.eliteinfosoft.com" target="new" class="inner">Developed by: ELITE INFOSOFT</a> </div> </div> </footer> </div> <div id="floatingZoomBtn"> <div class="nav-icons-right"> <div class="zoomDiv"> <a ng-click="zoomImage(-imgZoomInitialVal);" title="Zoom out" style="color:black; cursor:pointer" ng-disabled="zoomOutDisabled"> <span class="icon-slotx fa fa-search-minus" style="font-size:medium;"> </span> </a> </div> <div class="zoomDiv"> <a ng-click="zoomImage(imgZoomInitialVal);" title="Zoom in" style="color:black; cursor:pointer" ng-disabled="zoomInDisabled"> <span class="icon-slotx fa fa-search-plus" style="font-size:medium;"> </span> </a> </div> <div> <a ng-click="zoomImage(0);" title="Reset zoom" style="color:black; cursor:pointer"> <span class="icon-slotx fa fa-refresh" style="font-size:medium;"> </span> </a> </div>  <div class="zoomDiv"> <a ng-click="onPrevClick(0);" style="color:black; cursor:pointer" ng-disabled="currentPage == 1" title="Previous"> <span class="icon-slotx fa fa-angle-left" style="font-size:x-large;" > </span> </a> </div> <div class="zoomDiv"> <a ng-click="onNextClick()" style="color:black; cursor:pointer" ng-disabled="currentPage == totalPages" title="Next"> <span class="icon-slotx fa fa-angle-right" style="font-size:x-large;"> </span> </a> </div> </div> </div>   <div id="subscriptionModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-body"> <div id="modalEdition1" ng-show="showMsgSubscribeNew"> <div id="afterRenew1" class="kar-close-btn" data-dismiss="modal"><img src="images/close.png"></div> <div class='kar-title'> <p class='margin-bottom'>Hi,</p> <p class='margin-bottom bold'>You are not a {{Publication}} Edition Subscriber.</p> <p class="margin-bottom"> <span> <span class="click-here"> <a ng-click='subscribeNow(Publication)'>Click Here</a> </span> to Subscribe </span> </p> </div> <div style='clear: both;'></div> </div> <div id="modalEdition" ng-show="showMsgRenew"> <div id="afterRenew" class="kar-close-btn" data-dismiss="modal"><img src="images/close.png"></div> <div class='kar-title'> <p class='margin-bottom bold'>You don't have subscription on {{selectedDate}} for {{Publication}} Edition.</p> </div> <div style='clear: both;'></div> <div class="subscribe-now-button-section-reader"> <div ng-show="showSubscribeNowBtn" class="subscribe-now-button" ng-click="subscribeNow()">SUBSCRIBE NOW</div> <div ng-show="showViewSubscriptionsBtn" class="subscribe-now-button" ng-click="viewSubscriptions()">VIEW SUBSCRIPTIONS</div> </div> </div> </div> </div> </div> </div>   <div class="modal" id="renewSubModal"> <div class="modal-dialog"> <div class="modal-content" style="border-radius: 0px;">  <div class="modal-header" style="border-bottom: none !important;"> <button type="button" class="close" data-dismiss="modal">×</button> </div>  <div class="modal-body" style="text-align: center; margin-top: -35px; padding: 0px 25px 25px 25px;"> <h3 style="word-break: break-word;">Your subscription will expire soon</h3> <div class="button-block-outer"> <div class="button-block-inner"> <div class="btnRenew clr-orange" ng-click="RenewSubRenewClick();">RENEW</div> <div class="btnRenew clr-light" data-dismiss="modal" ng-click="renewRemindMeLaterClick();">REMIND ME LATER</div> <div style="clear:both"></div> </div> </div> </div> </div> </div> </div>  <div id="mainPaperGallery" class="pswp" tabindex="-1" role="dialog" aria-hidden="true"> <div class="pswp__bg"></div> <div class="pswp__scroll-wrap"> <div class="pswp__container"> <div class="pswp__item"></div> <div class="pswp__item"></div> <div class="pswp__item"></div>  <map id="zoneMapMob" name="imgmapmob"></map> <div class="zoneMob" width=""></div>  </div> <div class="pswp__ui pswp__ui--hidden"> <div class="pswp__top-bar"> <div class="pswp__counter"></div> <button id="close" class="pswp__button pswp__button--close" title="Close (Esc)"></button>  <button id="help" class="pswp__button fa fa-question fa-lg fa-lg-cust" style="background-image: none!important; color: #fff;"></button> <button id="mainShareBtn" class="pswp__button pswp__button--share" title="Share"></button> <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button> <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button> <button id="mobilePluginTopNews" class="pswp__button" style="background:url(./images/topNewsIcon.png); background-repeat:no-repeat; background-position:center;" ng-show="isAllowVoiceClip"></button> <div id="loaderForMainPhotoSwipe11" class="PhotoOnZoomLoaderMain1"> <i class="fa fa-circle-o-notch fa-spin" style="font-size:20px"></i> </div> <div class="pswp__preloader"> <div class="pswp__preloader__icn"> <div class="pswp__preloader__cut"> <div class="pswp__preloader__donut"></div> </div> </div> </div> </div>  <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap"> <div class="pswp__share-tooltip">  </div> </div> <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button> <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button> <div class="pswp__caption"> <div class="pswp__caption__center"> </div> </div> </div> </div> </div>   <div id="clipSlider" class="pswp" tabindex="-1" role="dialog" aria-hidden="true">  <div class="pswp__bg"></div>  <div class="pswp__scroll-wrap">  <div class="pswp__container"> <div class="pswp__item"></div> <div class="pswp__item"></div> <div class="pswp__item"></div> </div>  <div class="pswp__ui pswp__ui--hidden"> <div class="pswp__top-bar">  <div class="pswp__counter"></div> <button class="pswp__button pswp__button--close" title="Close (Esc)"></button> <button class="pswp__button pswp__button--share" title="Share"></button> <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button> <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>   <div class="pswp__preloader"> <div class="pswp__preloader__icn"> <div class="pswp__preloader__cut"> <div class="pswp__preloader__donut"></div> </div> </div> </div> </div> <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap"> <div class="pswp__share-tooltip"></div> </div> <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button> <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button> <div class="pswp__caption"> <div class="pswp__caption__center"></div> </div> </div> </div>  <div class="mmepaper-inside-epaper-papge-listing" style="z-index: 999"> <div class="mob-nav-cust" ng-show="show_mob_nav"> <ul> <li ng-show="editionPresent" id="ClipCarouselToggleButton"><img src="images/topRightBar/other-page-icon.png"></li> </ul> </div> <div class="mmepaper-epaper-papge-listing-buttons"> <div class="mmepaper-epaper-listing-buttons-up" style="display:none;" id="ClipCarouselButtonUp"><i class="fa fa-caret-up" aria-hidden="true"></i></div> <div class="mmepaper-epaper-listing-buttons-down" id="ClipCarouselButtonDown"><i class="fa fa-caret-down" aria-hidden="true"></i></div> </div> <div class="mmepaper-inside-epaper-papge-listing-slide"> <div class="owl-carousel mmepaper-inside-epaper-listing-carousel" id="ClipCarousel"> <div class="item" style="margin-bottom: 10px" ng-repeat="clip in ClipThumbnails" ng-click="onClipClick($index)"> <div class="mmepaper-epaper-page-no">{{$index + 1}}</div> <div id="clipThumb{{$index}}" class="mmepaper-carousel-thumb-img active-clip artHeight"><img class="owl-lazy" data-src="{{clip.src}}"></div> <div class="mmepaper-epaper-page-name">{{clip.pageNo}}</div> </div> </div> </div> </div> </div> <div id="pluginHelp"> <div> <button class="btn btn-default pluginHelpCLose" ng-click="closeHelp()">Close</button> </div> </div> <div id="localPopupMain" style="display: none;">  <div class="popup-block"> <div class="popup-block-inner"> <div class="close-popup" id="closeLocalPopup">x</div>  <p style="text-align: left !important; padding-left: 4%; font-weight: bold; word-break: normal;"> The thumbnail view of additional local pages have been moved to 'All Pages' section on top of the web page. </p> </div> </div>  </div>  <div class="modal" id="checkDevRestriction" style="display: none; background-color: rgba(0, 0, 0, 0.8);"> <div class="modal-dialog"> <div class="modal-content" style="border-radius: 0px;">  <div class="modal-body" style="text-align: left; padding: 25px 25px 25px 25px"> <div class="user-access-pop-in" ng-show="deviceDetailsSection"> <table class="user-access-table" cellpadding="0" cellspacing="0"> <tbody> <tr valign="middle" ng-repeat="details in DeviceDetails track by $index"> <td align="center">{{$index + 1}}</td> <td> <span class="browser-icon"><img ng-src="{{details.img}}" alt=""></span> <span class="browser-name"> <span>{{details.Device}} - </span> <span>{{details.OS}}, </span> <span>{{details.Browser}}.</span> </span> </td> <td align="center"> <a style="cursor: pointer" ng-click="LogoutFromOtherDevice(details)">Logout</a> </td> </tr> </tbody> </table> <div class="user-access-msg"> You have reached the maximum number of log-ins allowed. Please log out from other device(s) and try again </div> <div class="user-access-logout-wrp"> <a href="" class="user-access-logout-btn" ng-click="checkDevRestrictionClose()">Close </a> </div> </div> <div class="user-access-pop-in" ng-show="LogoutSuccessMsgSection"> <div class="user-access-msg"> {{LogoutSuccessMsg}} </div> <div class="user-access-logout-wrp"> <a href="" class="user-access-logout-btn" ng-show="logoutAnotherDeviceBtnShow" ng-click="logoutAnotherDevice()">Logout Another</a> <a href="" class="user-access-logout-btn" ng-click="loginNow()">Login Now</a> </div> </div> </div> </div> </div> </div>  <div id="loaderForMainPhotoSwipe" class="PhotoOnZoomLoaderMain" style="display:none"> <div class="PhotoOnZoomLoaderInner"> <img src="images/giphy.gif" style="width: 40%;"/> </div> </div> <div style="display: none !important;"> <input type="text" id="zoneValue" /> <button type="button" id="btnZone" ng-click="getZoneValue()"></button> <input type="text" id="pageValueWhenZone" /> <button type="button" id="btnOpenPhotoSwipeWhenZone" ng-click="openPhotoSwipeWhenZone()"></button> </div> <div style="display: none !important;"> <input type="text" id="lastSelectedPgNo" /> </div> <script type="text/javascript" src="js/directiveZoom.js?190720181200"></script> </body> <script> function openShare(){ $("#shareDiv").toggle(); } $(document).ready(function () { if(typeof appTitle == "undefined"){ document.title = ""; } else{ if(appTitle == "" || appTitle == null){ document.title = ""; } else{ document.title = appTitle; } } //Disable Right Click $(".disableRightClick").on("contextmenu", function (e) { //return false; }); //End $('#copyrightyear').html(new Date().getFullYear()); $('#subscriptionModal').modal({ backdrop: 'static', keyboard: false, show: false }); function deleteCookies() { } //Epaper Bottom Carousel var isFirst = true; $("#bottomCarouselButtonUp").click(function () { // console.log("isFirst = ", isFirst); if(isFirst){ $('#bottomCarouselInner').owlCarousel({ loop: false, margin: 30, lazyLoad: true, autoWidth: true, responsiveClass: true, responsive: { 0: { items: 1, nav: true }, 360: { items: 3, nav: true }, 600: { items: 6, nav: true }, 1000: { items: 8, nav: true } } }) } isFirst = false; $("#bottomCarousel").slideDown(); $(".mmepaper-common-container").removeClass("epaper-toggle"); $("#bottomCarouselButtonUp").hide(); $("#bottomCarouselButtonDown").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); $("#bottomCarouselButtonDown").click(function () { $("#bottomCarousel").slideUp(); $(".mmepaper-common-container").addClass("epaper-toggle"); $("#bottomCarouselButtonDown").hide(); $("#bottomCarouselButtonUp").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); //Epaper Clip Carousel $("#ClipCarouselButtonUp").click(function () { $("#ClipCarousel").slideDown(); $(".mmepaper-common-container").removeClass("epaper-toggle"); $("#ClipCarouselButtonUp").hide(); $("#ClipCarouselButtonDown").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); $("#ClipCarouselButtonDown").click(function () { $("#ClipCarousel").slideUp(); $(".mmepaper-common-container").addClass("epaper-toggle"); $("#ClipCarouselButtonDown").hide(); $("#ClipCarouselButtonUp").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); //For mobile clip click start $("#ClipCarouselToggleButton").click(function () { $("#ClipCarousel").slideToggle('slow'); }); //End //For mobile other edition click start $("#bottomCarouselToggleButton").click(function () { $("#bottomCarousel").slideToggle('slow'); }); //For mobile other edition click start $("#articalCarouselToggleButton").click(function () { $("#articleCarouselSlide").slideToggle('slow'); }); //For mobile other edition click end //End //Article Botton Carousel $("#articleCarouselButtonUp").click(function () { $("#articleCarouselSlide").slideDown(); $("#articleCarouselButtonUp").hide(); $("#articleCarouselButtonDown").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); $("#articleCarouselButtonDown").click(function () { $("#articleCarouselSlide").slideUp(); $("#articleCarouselButtonDown").hide(); $("#articleCarouselButtonUp").show(); try { event.stopImmediatePropagation(); } catch (err) { } }); //End $(".mmepaper-account-name-photo").on('click', function (event) { if ($('.mmepaper-account-details').css('display') == 'block') { $(".mmepaper-account-details").hide(); } else { $(".mmepaper-account-details").show(); } if ($('.mmepaper-dropdown-list').css('display') == 'block') { $(".mmepaper-dropdown-list").hide(); } event.stopImmediatePropagation(); }); $(".mmepaper-account-welcome-details li a").on('click', function (event) { if ($('.mmepaper-account-details').css('display') == 'block') { $(".mmepaper-account-details").hide(); } else { $(".mmepaper-account-details").show(); } if ($('.mmepaper-dropdown-list').css('display') == 'block') { $(".mmepaper-dropdown-list").hide(); } event.stopImmediatePropagation(); }); $(document).on('click', function (event) { if ($('.mmepaper-account-details').css('display') == 'block') { $(".mmepaper-account-details").hide(); } if ($('.mmepaper-dropdown-list').css('display') == 'block') { $(".mmepaper-dropdown-list").hide(); } }); $(".mmepaper-preferences").click(function () { $(".mmepaper-account-details-common").hide(); $(".mmepaper-preferences-list").show(); event.stopImmediatePropagation(); }); $(".mmepaper-preferences-list .mmepaper-account-welcome-blk").click(function () { $(".mmepaper-preferences-list").hide(); $(".mmepaper-account-details-common").show(); event.stopImmediatePropagation(); }); $(".mmepaper-dropdown-label").click(function () { $(".mmepaper-dropdown-list").slideToggle(); if ($('.mmepaper-account-details').css('display') == 'block') { $(".mmepaper-account-details").hide(); } event.stopImmediatePropagation(); }); $(".mmepaper-account-welcome-details").click(function () { event.stopImmediatePropagation(); }) //Add by vijaykumar on 05 Sep 2020 start $('#bottomCarouselInner').on('click', 'div.owl-next', function(e) { var active = $("#bottomCarouselInner").find(".owl-item.active").find(".mmepaper-epaper-page-no").last(); var totalPages = $("#totalPagesDiv").text(); for(var i = 0; i < active.length; i++){ var pgNo = active[i].innerText; if(pgNo != ""){ if(parseInt(pgNo) == parseInt(totalPages)){ $('#bottomCarouselInner').find("div.owl-next").hide(); } } } $('#bottomCarouselInner').find("div.owl-prev").show(); }); $('#bottomCarouselInner').on('click', 'div.owl-prev', function(e) { var active = $("#bottomCarouselInner").find(".owl-item.active").find(".mmepaper-epaper-page-no").first(); for(var i = 0; i < active.length; i++){ var pgNo = active[i].innerText; if(pgNo != ""){ if(parseInt(pgNo) == 1){ $('#bottomCarouselInner').find("div.owl-prev").hide(); } } } $('#bottomCarouselInner').find("div.owl-next").show(); }); //Add by vijaykumar on 05 Sep 2020 end $('.articalHref').click(function () { var actual_href = $(this).attr('href'); var classname = $(this).attr('class'); var actual_src = ""; var isMobile = { Android: function () { return navigator.userAgent.match(/Android/i); }, BlackBerry: function () { return navigator.userAgent.match(/BlackBerry/i); }, iOS: function () { return navigator.userAgent.match(/iPhone|iPad|iPod/i); }, Opera: function () { return navigator.userAgent.match(/Opera Mini/i); }, Windows: function () { return navigator.userAgent.match(/IEMobile/i); }, any: function () { return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); } }; actual_src = $('#artView img').attr('src'); var shareflag = "" if(classname.indexOf("clip") != -1){shareflag = "c"}else{shareflag = "a"} var url = sharePageURL + "?action=getsharelink&&ImageURL=" + actual_src +"&ShareType=" + shareflag; var response = ''; $.ajax({ type: "GET", url: url, async: true, success: function (data) { response = data; }, complete: function (data, status) {//this is always called - 31 Jan 2018 response = data; actual_src = response.responseText; var subStr = actual_href.match("url=url"); var modified_href = null; if (subStr != null) { modified_href = actual_href.replace("url=url", "url=" + actual_src); } else { subStr = actual_href.match("u=url"); if (subStr != null) { modified_href = actual_href.replace("u=url", "u=" + actual_src); } else { modified_href = actual_href.replace("text=url", "text=" + actual_src); } } var final_href = (actual_href.replace(actual_href, modified_href)); window.open(final_href); } }); }); function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); var expires = "expires=" + d.toUTCString(); document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; } function getCookie(cname) { var name = cname + "="; var ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return ""; } if (!isMobile.any()){ $("#artView").draggable({ handle: "img" }); } $("#closeLocalPopup").on('click', function(){ $("#localPopupMain").css("display", "none"); }); }); function onZoneClick(data){ $("#masterLoader").css("display", "block"); $("#zoneValue").val(data); setTimeout(function(){ $("#btnZone").click(); },0); var pswpText = $(".pswp__counter").text(); if (pswpText.indexOf("/") != -1){ var currPage = parseInt($(".pswp__counter").text().split("/")[0]); var imgEleVal = "cust_pswp_img" + currPage; var tmpZoomVal = $(".pswp__zoom-wrap").css("transform"); var lastIndex = tmpZoomVal.lastIndexOf(",") tmpZoomVal = tmpZoomVal.substring(lastIndex + 1); //after this s2="true" tmpZoomVal = tmpZoomVal.split(")")[0]; var zoomInitialVal = "translate3d(0px,"+ tmpZoomVal +"px, 0px) scale(1)"; var orgWidth = $(".pswp__img").width(); var orgHeight = $(".pswp__img").height(); setTimeout(function(){ $("#mainImageDev").css("width", orgWidth); $("#mainImageDev").css("height", orgHeight); $("#mainImageDev").parents(".pswp__zoom-wrap").css("transform", zoomInitialVal); $(".zoneMob").show(); },1500); } } function loadZoneCust(ps_Page){ $("#pageValueWhenZone").val(ps_Page); setTimeout(function(){ $("#btnOpenPhotoSwipeWhenZone").click(); },0); } /* For mobile grid view start */ var isMobileGrid = { Android: function () { return navigator.userAgent.match(/Android/i); }, BlackBerry: function () { return navigator.userAgent.match(/BlackBerry/i); }, iOS: function () { return navigator.userAgent.match(/iPhone|iPad|iPod/i); }, Opera: function () { return navigator.userAgent.match(/Opera Mini/i); }, Windows: function () { return navigator.userAgent.match(/IEMobile/i); }, any: function () { return (isMobileGrid.Android() || isMobileGrid.BlackBerry() || isMobileGrid.iOS() || isMobileGrid.Opera() || isMobileGrid.Windows()); } }; window.addEventListener("resize", function() { if(screen.width <= 568){ $(".main").removeClass("col-xs-6"); } else{ $(".main").addClass("col-xs-6"); } if(isMobileGrid.any()){ if(isMobileGrid.any()[0] == "iPhone" && window.matchMedia("(orientation: landscape)").matches){ if(screen.width >= 480 && screen.width <= 600){ $(".main").addClass("col-xs-6"); } } } }, false); /* For mobile grid view end */ function hideTapMsg() { $("#mymsgdiv").hide("slow"); } function getDeviceWidth() { var deviceWidth, landscape = Math.abs(window.orientation) == 90; if (landscape) { deviceWidth = screen.height; } else { deviceWidth = screen.width; } return deviceWidth; } /*For Swipe Image on Mobile Start*/ var isMobile = { Android: function () { return navigator.userAgent.match(/Android/i); }, BlackBerry: function () { return navigator.userAgent.match(/BlackBerry/i); }, iOS: function () { return navigator.userAgent.match(/iPhone|iPad|iPod/i); }, Opera: function () { return navigator.userAgent.match(/Opera Mini/i); }, Windows: function () { return navigator.userAgent.match(/IEMobile/i); }, any: function () { return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); } }; /*For Swipe Image on Mobile End*/ if (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) { var myElement = document.getElementById('container'); var mc = new Hammer.Manager(myElement, { touchAction: 'pan-y' }); mc.add(new Hammer.Swipe()); mc.on("swipeleft", function (ev) { if(typeof document.getElementById('infoDiv') != "undefined"){ if (parseFloat(document.getElementById('infoDiv').innerHTML) <= "1.2") { document.getElementById('swipeNext').click(); } } }); mc.on("swiperight", function (ev) { if(typeof document.getElementById('infoDiv') != "undefined"){ if (parseFloat(document.getElementById('infoDiv').innerHTML) <= "1.2") { document.getElementById('swipePrev').click(); } } }); } var mybutton = document.getElementById("floatingZoomBtn"); // When the user scrolls down 20px from the top of the document, show the button window.onscroll = function() {scrollFunction()}; function scrollFunction() { if (document.body.scrollTop > 150 || document.documentElement.scrollTop > 150) { mybutton.style.display = "block"; } else { mybutton.style.display = "none"; } } </script> </html>

CINXE.COM