123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462 |
- <!DOCTYPE html>
-
- <html>
- <head>
-
-
- <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; media-src *; img-src 'self' data: content:;">
-
- <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
- <link href="css/robotocondensed.css" rel="stylesheet">
- <link rel="stylesheet" href="calendar_files/css/demo.css"/>
- <link rel="stylesheet" href="css/file.css"/>
- <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
-
- <link rel = "stylesheet" href = "css/searchbar1.css">
-
- <meta name="format-detection" content="telephone=no">
- <meta name="msapplication-tap-highlight" content="no">
- <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
- <link rel="stylesheet" type="text/css" href="css/index.css">
- <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
- <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
- <script src="lib/OnsenUI/js/onsenui.min.js"></script>
- <script src="js/jquery_.js"></script>
-
-
- </head>
- <body>
-
- <ons-navigator swipeable animation="slide" id="myNavigator">
- <ons-page>
- <ons-toolbar>
- <div class="center">Instituto de Cultura</div>
- </ons-toolbar>
- <ons-tabbar swipeable position="auto">
- <ons-tab page="home.html" label="Hogar"></ons-tab>
- <ons-tab page="renglones.html" label="Artesanias"active></ons-tab>
- <ons-tab page="ferias.html" label="Ferias"></ons-tab>
- <ons-tab page="instituto.html" label="Instituto"></ons-tab>
- </ons-tabbar>
- </ons-page>
- </ons-navigator>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- <template id="artesanias.html">
- <ons-page id="artesanias">
-
- <ons-toolbar>
- <div class="left"><ons-back-button>Atrás</ons-back-button></div>
- <div class="center"></div>
- </ons-toolbar>
-
- <ons-pull-hook id="pull-hook" threshold-height="120px">
- <ons-icon id="pull-hook-icon" size="22px" class="pull-hook-content" icon="fa-arrow-down"></ons-icon>
- </ons-pull-hook>
-
- <ons-list id="artesania-list" src="">
- <ons-list-header>Artesanias</ons-list-header>
- </ons-list>
-
- <ons-list id="artesanos-list" src="">
- <ons-list-header>Artesanos</ons-list-header>
- </ons-list>
-
- <script>
-
- ons.getScriptPage().onInit = function () {
- this.querySelector('ons-toolbar div.center').textContent = this.data.title;
-
-
- var Esp = this.data.esp.split(', ');
- var artesanos_json = this.data.json;
-
-
- for(var i=0; i<Esp.length; i++) {
- Esp[i] = Esp[i].charAt(0).toUpperCase() + Esp[i].slice(1);
- };
-
- var pullHook = document.getElementById('pull-hook');
- var icon = document.getElementById('pull-hook-icon');
- pullHook.addEventListener('changestate', function (event) {
- switch (event.state) {
- case 'initial':
- icon.setAttribute('icon', 'fa-arrow-down');
- icon.removeAttribute('rotate');
- icon.removeAttribute('spin');
- break;
- case 'preaction':
- icon.setAttribute('icon', 'fa-arrow-down');
- icon.setAttribute('rotate', '180');
- icon.removeAttribute('spin');
- break;
- case 'action':
- icon.setAttribute('icon', 'fa-spinner');
- icon.removeAttribute('rotate');
- icon.setAttribute('spin', true);
- break;
- }
- });
-
- var getArtesania = function (num) {
-
- var Artesanos = ``;
-
-
-
- var results = [];
- var searchVal = "my Name";
- for (var i=0 ; i < artesanos_json.length ; i++)
- {
- if (artesanos_json[i].Especificaciones.includes(Esp[num])) {
- results.push(artesanos_json[i]);
- }
- }
-
-
-
-
- for(var i=0; i<results.length; i++) {
-
-
- Artesanos=Artesanos+`<a id='home.html'>${results[i].Nombre} | ${results[i].Municipio}<br>`
-
- }
-
- return {
- name: Esp[num],
- artesan: Artesanos
- };
- };
-
- var getData = function () {
- const data = [];
- for (var i = 0; i < Esp.length; i++) {
- data.push(getArtesania(i));
- }
- return data;
- };
- var createArtesania = function (Artesania) {
-
-
-
- return ons.createElement(`
- <ons-list-item expandable tappable>
- <div class="center" >${Artesania.name}</div>
- <div class="expandable-content"> Artesanos que trabajan con ${Artesania.name}:<br><br>${Artesania.artesan}</div>
- </ons-list-item>`
- );
- };
-
- var Artesanias = getData();
-
- for (Art of Artesanias) {
-
- var Artesania = createArtesania(Art);
- document.getElementById('artesania-list').appendChild(Artesania);
- };
- pullHook.onAction = function (done) {
-
- setTimeout(function() {
- document.getElementById('artesania-list').appendChild(createArtesania(getArtesania()));
- done();
- }, 400);
- }
-
- var createArtesano = function (Artesano) {
-
- var info = ``;
-
-
-
-
- return ons.createElement(`
- <ons-list-item modifier="chevron" onclick="fn.pushPage({'id': 'artesanos.html', 'title': '${Artesano.Nombre}', 'esp': '${info}' })">
- <div class="center" >${Artesano.Nombre}</div>
- </ons-list-item>`
- );
- };
-
-
-
-
- for (Artesano of artesanos_json) {
-
- var info = ``;
-
- var lista = document.getElementById('artesanos-list');
-
-
- if (Artesano.Municipio.trim().length != 0) {
- info = info + `Municipio: `+Artesano.Municipio + `<br>`;
- }
- if (Artesano["Tel\u00e9fono 1"].trim().length != 0) {
- info = info + `Tel\u00e9fono: `+Artesano["Tel\u00e9fono 1"]+ `<br>`;
- }
- if (Artesano["E-mail"].trim().length != 0) {
- info = info + `Correo Electr\u00f3nico: `+Artesano["E-mail"]+ `<br>`;
- }
- if (Artesano.Especificaciones.trim().length != 0) {
- info = info + `Trabaja con: `+ Artesano.Especificaciones + `<br>`;
- }
-
-
- var item = ons.createElement(`<ons-list-item onclick="fn.pushPage1({'id':'artesanos.html','title':'${Artesano.Nombre}','esp': '${info}'})" tappable>
- <div class="title">${Artesano.Nombre}</div>
- </ons-list-item>`);
-
-
- if(info.trim() == ``){
- console.log(Artesano.Nombre+' no tiene ningun tipo de informacion.');
-
- }
- else {
- lista.appendChild(item);
- }
-
-
-
-
-
-
- };
-
- };
- </script>
-
- <style>
- .pull-hook-content {
- color: #333;
- transition: transform .25s ease-in-out;
- }
- </style>
- </ons-page>
- </template>
-
-
-
-
-
-
-
-
-
-
- <template id="artesanos.html">
- <ons-page id="artesanos">
- <ons-toolbar>
- <div class="left">
- <ons-back-button>back</ons-back-button>
- </div>
- <div class="center"></div>
- </ons-toolbar>
- <p style="text-align: center">
- Pagina con la informacion de artesanos!!!
- </p>
- <script>
- ons.getScriptPage().onInit = function () {
- this.querySelector('ons-toolbar div.center').textContent = this.data.title;
- }
- </script>
- </ons-page>
-
-
-
-
-
-
-
-
- <p style="text-align: center;">
- Pagina con la informacion de artesanos!!!
- </p>
- </ons-page>
- </template>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- <template id="home.html">
- <ons-page id="home">
- <p style="text-align: center;">
- Pagina Principal
- </p>
- </ons-page>
- </template>
-
-
-
- <template id="renglones.html">
- <ons-page id="renglones">
-
-
-
-
- <ons-card id="list">
- <script type="text/javascript" src="js/renglones.js"></script>
- </ons-card>
-
- <style>
- .intro {
- text-align: center;
- padding: 20px;
- margin-top: 30px;
- }
-
- ons-card {
- cursor: pointer;
- color: #333;
- }
-
- .card__title,
- .card--material__title {
- font-size: 15px;
- }
- </style>
- </ons-page>
-
-
-
-
-
- </template>
-
- <template id="ferias.html">
- <ons-page id="ferias">
-
- <div id = "caleandar" class = "calendar" style="margin-top: 50px;">
- <script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
- <script type="text/javascript" src="calendar_files/js/events.js"></script>
- </div>
- </ons-page>
- </template>
-
- <template id="instituto.html">
- <ons-page id="instituto">
- <p style="text-align: center;">
-
- <ons-toolbar>
- <div class="left"><ons-back-button>Pagejjn 3</ons-back-button></div>
- <div class="center"></div>
- </ons-toolbar>
-
-
- <h1>Instituto de Cultura Puertorriqueña</h1>
- <h3>Ven, descubre lo que nuestra riqueza cultural puertorriqueña tiene para tí.<br> Disfrútala, es tu identidad.
- </h3>
-
- <body>
- <br>
- El Instituto de Cultura Puertorriqueña (ICP) tiene como misión investigar, conservar, promover y divulgar la cultura puertorriqueña en su diversidad y complejidad. Con la memoria y la promesa de la cultura, los distintos niveles, sectores, edades e intereses de la comunidad crean el conjunto de modos de vida, costumbres y manifestaciones artísticas que nos identifica como país. El ICP existe para preservar y divulgar estos saberes, difundir internacionalmente nuestro talento y enriquecer el amor a lo propio.
- <br><br>
- Nuestras tradiciones no son rígidos objetos de museo, sino actividades vivas en constante renovación y reapropiación, según van también desarrollándose nuevas tradiciones. El respeto a la diversidad, a lo híbrido, a lo apropiado y a lo replanteado también son parte esencial de esta institución que busca activamente la colaboración de todos en un quehacer que debe ser siempre compartido de la mano con su ingente diversidad.
- <br><br>
- Prof. Carlos R. Ruiz Cortés<br>
- Director Ejecutivo<br>
- Instituto de Cultura Puertorriqueña<br>
- <br><br>
- </body>
-
-
- Visita nuestra <a href="https://www.icp.pr.gov/">Página Web</a> o síguenos en nuestras redes sociales: <br>
- <a href="https://twitter.com/icppr"><img src="img/twitter.png" alt="Twitter" style="width:35px;height:35px;border:0;">
- </a>
- <a href="https://facebook.com/icppr"><img src="img/facebook.png" alt="Facebook" style="width:35px;height:35px;border:0;">
- </a>
- <a href="https://youtube.com/user/icppr"><img src="img/youtube.png" alt="Youtube" style="width:35px;height:35px;border:0;">
- </a>
- <a href="https://instagram.com/icppr"><img src="img/instagram.png" alt="Instagram" style="width:35px;height:35px;border:0;">
- </a>
-
- </p>
- </ons-page>
- </template>
-
- <script src="js/load.js"></script>
-
- <script type="text/javascript" src="cordova.js"></script>
- <script type="text/javascript" src="js/index.js"></script>
- </body>
- </html>
|