CINXE.COM
M茅xico | SIODS | Sistema de Informaci贸n de los Objetivos de Desarrollo Sostenible
<!DOCTYPE html> <!--index.html (Server page)--> <!--en: Home page of the SDGs (home)--> <!--es: P谩gina principal del sitio de los ODS (home) Esta p谩gina se divide en: - Banda "Sitio de revisi贸n y validaci贸n": Solo cuando se apunta al esquema Pre-productivo o de pruebas - Carousel: Fotograf铆as alusivas al sitio, incluye ligas a sitios internos y externos a esta p谩gina - Nav (Menu principal): contiene le men煤 principal del sitio (ver archivo: app/includes/Header_menu.html) - Contenido del home: Objetivos, Indicadores por cobertura geogr谩fica e informaci贸n relacionada (ver archivo: app/partials/home_content.html) - Pie: (ver archivo: app/includes/Footer.html) Nota importante: El sistema contempla 3 p谩ginas principales (index.html, ODSind.html, ODSopc.html), por medio de index.html se llega a las dem谩s utilizando ligas y pase de par谩metros Archivo de control: app/js/app_Index.js--> <html ng-app="app_Index" class="ng-scope"> <head> <!-- Required meta tags always come first --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="refresh"> <title>M茅xico | SIODS | Sistema de Informaci贸n de los Objetivos de Desarrollo Sostenible</title> <!-- link's --> <link rel="shortcut icon" href="app/images/LogoODS.png"> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,200,200italic,300,300italic,400italic,600,600italic,700' type='text/css'> <link rel="stylesheet" href="libs/please-wait/please-wait.min.css"> <link rel="stylesheet" href="libs/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" href="libs/normalize/normalize.min.css"> <link rel="stylesheet" href="libs/form-helpers/css/bootstrap-formhelpers.min.css"> <link rel='stylesheet' href='libs/build/loading-bar.min.css' type='text/css' media='all'> <link rel="stylesheet" href="app/css/ajuste_mapa.css"> <link rel="stylesheet" href="app/css/ODS.css"> </head> <body id="content" ng-controller="ctrlIndex" ng-init="loadParameters()"> <!--Banda "Sitio de revisi贸n y validaci贸n": esta banda se activa siempre y cuando el sitio sea diferente de PUB (sitio p煤blico)--> <div id="msjS" class="msjSinC"> <div> <button type="button" class="close" ng-click="closeMsjSinC();"> <img ng-src="{{imgPath}}{{imagen[27].file}}" alt="{{imagen[27].name}}" title="{{imagen[27].nameTitle}}"> </button> </div> <div class="txtMsjSinC"> <p> Apreciable usuario, en este momento, algunas secciones del sitio experimentan intermitencias. Se est谩 trabajando para reestablecer el acceso completo a la brevedad. Lamentamos los inconvenientes que esto pueda ocasionar y agradecemos su comprensi贸n. </p> <p class="txtMsjSinC2 a-bold">Conociendo M茅xico</p> </div> </div> <div ng-if="schema!='PUB'" class="row text-center color-gris8"> <h3 class="Margen0 Padding5 text-center a-blanco" ng-bind="system.namePRE"></h3> </div> <!--Carousel of photographs and leagues--> <div class="row Padding0"> <!-- mensaje cuando no hay conexion a datos --> <div class="col-md-12 Padding0"> <div id="myCarousel" class="carousel slide" data-ride="carousel"> <div class="carousel-caption"> <div class="row"> <div class="col-md-12 text-center"> <!--logo ODS--> <img ng-src="{{imgPath}}{{imagen[0].file}}" class="logo0" alt="{{imagen[0].name}}" title="{{imagen[0].name}}"> <!-- <img ng-if="lang=='es'" ng-src="app/images/logoODS_es.png" class="logo0" alt="{{objIdioma.arrIdioma[127].es}}" title="{{objIdioma.arrIdioma[127].es}}"> <img ng-if="lang=='en'" ng-src="app/images/logoODS_en.png" class="logo0" alt="{{objIdioma.arrIdioma[127].en}}" title="{{objIdioma.arrIdioma[127].en}}"> --> </div> </div> <div class="row"> <div class="col-md-12 text-center"> <!--acerca de--> <label class="label-border"> <a href="{{indexContent[7].url}}" ng-bind="indexContent[7].text" class="a-blanco" target="_blank" tabindex="2"></a> <!-- <a ng-if="lang=='es'" href="ODSopc.html?lang=es#/about" ng-bind="objIdioma.arrIdioma[292].es" class="a-blanco" target="_blank" tabindex="2"></a> <a ng-if="lang=='en'" href="ODSopc.html?lang=en#/about" ng-bind="objIdioma.arrIdioma[292].en" class="a-blanco" target="_blank" tabindex="2"></a> --> </label> </div><br> </div> <div class="row"> <!--presidencia--> <div class="col-lg-6 col-md-6 col-xs-6 text-right"> <a href="{{imagen[2].url}}" target="_blank" tabindex="4"> <img ng-src="{{imgPath}}{{imagen[2].file}}" class="logo1" alt="{{imagen[2].name}}" title="{{imagen[2].name}}"></a> <!-- <a ng-show="lang=='es'" href="https://www.gob.mx/presidencia" target="_blank" tabindex="4"> <img ng-src="app/images/LogoPR.png" class="logo1" alt="{{objIdioma.arrIdioma[249].es}}" title="{{objIdioma.arrIdioma[249].es}}"></a> <a ng-show="lang=='en'" href="https://www.gob.mx" target="_blank" tabindex="4"> <img ng-src="app/images/LogoPR.png" class="logo1" alt="{{objIdioma.arrIdioma[249].en}}" title="{{objIdioma.arrIdioma[249].en}}"></a> --> </div> <!--inegi--> <div class="col-lg-6 col-md-6 col-xs-6 text-left"> <a href="{{imagen[3].url}}" target="_blank" tabindex="6"> <img ng-src="{{imgPath}}{{imagen[3].file}}" class="logo2" alt="{{imagen[3].name}}" title="{{imagen[3].name}}"></a> <!-- <a ng-show="lang=='es'" href="http://www.inegi.org.mx" target="_blank" tabindex="6"> <img ng-src="app/images/LogoINEGI.png" class="logo2" alt="{{objIdioma.arrIdioma[5].es}}" title="{{objIdioma.arrIdioma[5].es}}"></a> <a ng-show="lang=='en'" href="http://www.inegi.org.mx" target="_blank" tabindex="6"> <img ng-src="app/images/LogoINEGI.png" class="logo2" alt="{{objIdioma.arrIdioma[5].en}}" title="{{objIdioma.arrIdioma[5].en}}"></a> --> </div> </div> <br><br> </div> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> <li data-target="#myCarousel" data-slide-to="3"></li> </ol> <!--im谩genes del carrousel--> <div class="carousel-inner"> <div class="item active"> <img ng-src="{{imgPath}}{{indexImagen[0].file}}" class="container2" alt="{{indexImagen[0].name}}" title="{{indexImagen[0].name}}"> <!-- <img ng-if="lang=='es'" ng-src="app/images/fondo1.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].es}}" title="{{objIdioma.arrIdioma[169].es}}"> <img ng-if="lang=='en'" ng-src="app/images/fondo1.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].en}}" title="{{objIdioma.arrIdioma[169].en}}"> --> </div> <div class="item"> <img ng-src="{{imgPath}}{{indexImagen[2].file}}" class="container2" alt="{{indexImagen[2].name}}" title="{{indexImagen[2].name}}"> <!-- <img ng-if="lang=='es'" ng-src="app/images/fondo3.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].es}}" title="{{objIdioma.arrIdioma[169].es}}"> <img ng-if="lang=='en'" ng-src="app/images/fondo3.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].en}}" title="{{objIdioma.arrIdioma[169].en}}"> --> </div> <div class="item"> <img ng-src="{{imgPath}}{{indexImagen[1].file}}" class="container2" alt="{{indexImagen[1].name}}" title="{{indexImagen[1].name}}"> <!-- <img ng-if="lang=='es'" ng-src="app/images/fondo2.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].es}}" title="{{objIdioma.arrIdioma[169].es}}"> <img ng-if="lang=='en'" ng-src="app/images/fondo2.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].en}}" title="{{objIdioma.arrIdioma[169].en}}"> --> </div> <div class="item"> <img ng-src="{{imgPath}}{{indexImagen[3].file}}" class="container2" alt="{{indexImagen[3].name}}" title="{{indexImagen[3].name}}"> <!-- <img ng-if="lang=='es'" ng-src="app/images/fondo4.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].es}}" title="{{objIdioma.arrIdioma[169].es}}"> <img ng-if="lang=='en'" ng-src="app/images/fondo4.jpg" class="container2" alt="{{objIdioma.arrIdioma[169].en}}" title="{{objIdioma.arrIdioma[169].en}}"> --> </div> </div> <!-- flechas en las im谩genes--> <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev"> <span class="fa fa-chevron-left" aria-hidden="true"></span> <span class="sr-only">{{indexContent[1].text}}</span> <!-- <span ng-show="lang=='es'" class="sr-only">{{objIdioma.arrIdioma[278].es}}</span> <span ng-show="lang=='en'" class="sr-only">{{objIdioma.arrIdioma[278].en}}</span> --> </a> <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next"> <span class="fa fa-chevron-right" aria-hidden="true"></span> <span class="sr-only">{{indexContent[2].text}}</span> <!-- <span ng-show="lang=='es'" class="sr-only">{{objIdioma.arrIdioma[279].es}}</span> <span ng-show="lang=='en'" class="sr-only">{{objIdioma.arrIdioma[279].en}}</span> --> </a> </div> </div> </div> <!--NAV--> <nav id="navContent" class="navbar navbar-ods color-azul8 Padding0"> <div class="color-azul8"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#divNavContent" aria-expanded="false" aria-controls="navbar"> <span class="sr-only PaddingTopBottom2 color-gris">Toggle navigation</span> <span class="icon-bar color-gris"></span> <span class="icon-bar color-gris"></span> <span class="icon-bar color-gris"></span> </button> </div> </div> <div class="container color-azul8"> <div id="divNavContent" class="collapse navbar-collapse" ng-include="'app/includes/Header_menu.html'"></div> </div> </nav> <!--Content--> <div class="inner" ui-view></div> <!--Foote--> <div ng-include="'app/includes/Footer.html'"></div> <!--ScriptJS --> <script src="libs/please-wait/please-wait.min.js"></script> <!-- Angularjs first, then directives and angularJS app. --> <script src="libs/angularjs/angular.min.js"></script> <script src="libs/angularjs-ui-router/angular-ui-router.min.js"></script> <script src="libs/angularjs-sanitize/sanitize.min.js"></script> <!-- jQuery first, then Bootstrap JS. --> <script src="libs/jquery/jquery-2.1.4.min.js"></script> <script src="libs/bootstrap/js/bootstrap.min.js"></script> <script src="libs/form-helpers/js/bootstrap-formhelpers.min.js"></script> <script src="libs/angularjs-resource/angular-resource.min.js"></script> <script src="libs/underscorejs_org/underscore-min.js"></script> <!--Minificaci贸n en sitio de salida--> <any ng-if="schema=='PUB'"> <script src="app/js/appFactory.min.js"></script> <script src="app/js/appService.min.js"></script> <script src="app/js/app_index.min.js"></script> <script src="app/js/rutinas.min.js"></script> <script src="app/js/appSite.min.js"></script> </any> <any ng-if="schema!='PUB'"> <script src="app/js/appFactory.js"></script> <script src="app/js/appService.js"></script> <script src="app/js/app_index.js"></script> <script src="app/js/rutinas.js"></script> <script src="app/js/appSite.js"></script> </any> <script type='text/javascript' src='libs/build/loading-bar.min.js'></script> <!--Manejo del nav (menu), para fijar la l铆nea arriba al bajar la p谩gina--> <script> $(function() { var obj = $(document); //objeto sobre el que quiero detectar scroll var obj_top = obj.scrollTop() //scroll vertical inicial del objeto obj.scroll(function() { var obj_act_top = $(this).scrollTop(); //obtener scroll top instantaneo //alert('obj_act_top: ' + obj_act_top + ' obj_top:' + obj_top); //if(obj_act_top > obj_top){ if (obj_act_top >= 920) { //alert ('scroll hacia abajo'); document.getElementById('navContent').className = "navbar navbar-ods color-azul8 Padding0 navbar-fixed-top"; } else { //alert ('scroll hacia arriba'); document.getElementById('navContent').className = "navbar navbar-ods color-azul8 Padding0"; } obj_top = obj_act_top; //almacenar scroll top anterior }); }); </script> <script type="text/javascript"> var paso = "app/images/logo_es.png"; //var paso = "app/images/logo_{{lang}}.png" var loading_screen = pleaseWait({ logo: paso, backgroundColor: '#cbe9f8', loadingHtml: "<div class='spinner spinner-rect'><div class='rect1'></div><div class='rect2'></div><div class='rect3'></div><div class='rect4'></div><div class='rect5'></div></div>" }); window.loading_screen.finish(); </script> </body> </html>