CCOM4030
/
artesanias
Слідкувати 5
В обрані 0
Форк 0
Код Проблеми 0 Запити на злиття 0 Релізи 0 Вікі Активність
Переглянути джерело

Renglones

Emmanuel 5 роки тому
джерело
579b565991
коміт
a7df9d7fa7
51 змінених файлів з 2366 додано та 90 видалено
Розділений перегляд Показати статистику Diff
  1. 27
    0
      platforms/android/app/src/main/assets/www/calendar_files/calendar.html
  2. 6
    0
      platforms/android/app/src/main/assets/www/calendar_files/css/demo.css
  3. 111
    0
      platforms/android/app/src/main/assets/www/calendar_files/css/theme1.css
  4. 111
    0
      platforms/android/app/src/main/assets/www/calendar_files/css/theme2.css
  5. 95
    0
      platforms/android/app/src/main/assets/www/calendar_files/css/theme3.css
  6. 299
    0
      platforms/android/app/src/main/assets/www/calendar_files/js/caleandar.js
  7. 1
    0
      platforms/android/app/src/main/assets/www/calendar_files/js/caleandar.min.js
  8. 8
    0
      platforms/android/app/src/main/assets/www/calendar_files/js/events.js
  9. 20
    0
      platforms/android/app/src/main/assets/www/css/index.css
  10. 12
    0
      platforms/android/app/src/main/assets/www/css/searchbar1.css
  11. 0
    0
      platforms/android/app/src/main/assets/www/img/ICPlogo.png
  12. 0
    0
      platforms/android/app/src/main/assets/www/img/facebook.png
  13. 0
    0
      platforms/android/app/src/main/assets/www/img/instagram.png
  14. 0
    0
      platforms/android/app/src/main/assets/www/img/twitter.png
  15. 0
    0
      platforms/android/app/src/main/assets/www/img/youtube.png
  16. 114
    11
      platforms/android/app/src/main/assets/www/index.html
  17. 0
    41
      platforms/android/app/src/main/assets/www/instituto.html
  18. 45
    0
      platforms/android/app/src/main/assets/www/js/link.js
  19. 67
    0
      platforms/android/app/src/main/assets/www/js/test.js
  20. 1
    0
      platforms/android/app/src/main/assets/www/json/MADERA.json
  21. 1
    0
      platforms/android/app/src/main/assets/www/json/renglones.json
  22. 54
    0
      platforms/android/app/src/main/assets/www/madera.html
  23. 115
    0
      platforms/android/app/src/main/assets/www/temp/index.html
  24. 27
    0
      platforms/browser/www/calendar_files/calendar.html
  25. 6
    0
      platforms/browser/www/calendar_files/css/demo.css
  26. 111
    0
      platforms/browser/www/calendar_files/css/theme1.css
  27. 111
    0
      platforms/browser/www/calendar_files/css/theme2.css
  28. 95
    0
      platforms/browser/www/calendar_files/css/theme3.css
  29. 299
    0
      platforms/browser/www/calendar_files/js/caleandar.js
  30. 1
    0
      platforms/browser/www/calendar_files/js/caleandar.min.js
  31. 8
    0
      platforms/browser/www/calendar_files/js/events.js
  32. 20
    0
      platforms/browser/www/css/index.css
  33. 12
    0
      platforms/browser/www/css/searchbar1.css
  34. BIN
      platforms/browser/www/img/ICPlogo.png
  35. BIN
      platforms/browser/www/img/facebook.png
  36. BIN
      platforms/browser/www/img/instagram.png
  37. BIN
      platforms/browser/www/img/twitter.png
  38. BIN
      platforms/browser/www/img/youtube.png
  39. 115
    11
      platforms/browser/www/index.html
  40. 45
    0
      platforms/browser/www/js/link.js
  41. 67
    0
      platforms/browser/www/js/test.js
  42. 1
    0
      platforms/browser/www/json/MADERA.json
  43. 1
    0
      platforms/browser/www/json/renglones.json
  44. 54
    0
      platforms/browser/www/madera.html
  45. 115
    0
      platforms/browser/www/temp/index.html
  46. 20
    0
      www/css/index.css
  47. 48
    27
      www/index.html
  48. 67
    0
      www/js/test.js
  49. 1
    0
      www/json/MADERA.json
  50. 1
    0
      www/json/renglones.json
  51. 54
    0
      www/madera.html

+ 27
- 0
platforms/android/app/src/main/assets/www/calendar_files/calendar.html Переглянути файл 

@@ -0,0 +1,27 @@
1 
+<!DOCTYPE html>
2 
+<html>
3 
+<head>
4 
+	<title>Ferias</title>
5 
+	<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
6 
+    <link rel="stylesheet" href="calendar_files/css/demo.css"/>
7 
+    <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
8 
+    <link rel= "stylesheet" href = "onsenui/css/onsenui.css">
9 
+	<link rel = "stylesheet" href = "onsenui/css/onsen-css-components.min.css">
10 
+	<script src = "onsenui/js/onsenui.min.js"></script>
11 
+	<link rel = "stylesheet" href = "searchbar1.css">
12 
+</head>
13 
+<body>
14 
+	<ons-page>
15 
+	<ons-toolbar>
16 
+	          <div class="center">
17 
+	            Ferias
18 
+	          </div>
19 
+	</ons-toolbar>
20 
+
21 
+	<div id = "caleandar" class = "calendar">
22 
+		<script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
23 
+    	<script type="text/javascript" src="calendar_files/js/events.js"></script>
24 
+	</div>
25 
+	</ons-page>
26 
+</body>
27 
+</html>

+ 6
- 0
platforms/android/app/src/main/assets/www/calendar_files/css/demo.css Переглянути файл 

@@ -0,0 +1,6 @@
1 
+body{
2 
+  font-family: Calibri, sans-serif;
3 
+  font-family: 'Roboto Condensed', sans-serif;
4 
+  color: #333;
5 
+  text-align: center;
6 
+}

+ 111
- 0
platforms/android/app/src/main/assets/www/calendar_files/css/theme1.css Переглянути файл 

@@ -0,0 +1,111 @@
1 
+.cld-main{
2 
+  width: 330px;
3 
+}
4 
+.cld-main a{
5 
+  color: #333;
6 
+  font-weight: bold;
7 
+}
8 
+  .cld-datetime{
9 
+    position: relative;
10 
+    width: 66%;
11 
+    min-width: 100px;
12 
+    max-width: 300px;
13 
+    margin: auto;
14 
+    overflow: hidden;
15 
+  }
16 
+  .cld-datetime .today{
17 
+    position: relative;
18 
+    float: left;
19 
+    width: calc(100% - 40px);
20 
+    margin: auto;
21 
+    text-align: center;
22 
+  }
23 
+  .cld-nav{
24 
+    position: relative;
25 
+    width: 20px;
26 
+    height: 20px;
27 
+    margin-top: 2px;
28 
+  }
29 
+  .cld-nav:hover{
30 
+    cursor: pointer;
31 
+  }
32 
+  .cld-nav:hover svg{
33 
+      fill: #666;
34 
+  }
35 
+  .cld-rwd{
36 
+    float: left;
37 
+  }
38 
+  .cld-fwd{
39 
+    float: right;
40 
+  }
41 
+    .cld-nav svg:hover{
42 
+
43 
+    }
44 
+.cld-labels, .cld-days{
45 
+  padding-left: 0;
46 
+}
47 
+  .cld-label, .cld-day{
48 
+    display: inline-block;
49 
+    width: 14.28%;
50 
+    text-align: center;
51 
+  }
52 
+  .cld-day.today .cld-number{
53 
+    display: inline-block;
54 
+    height: 20px;
55 
+    width: 20px;
56 
+    border-radius: 50px;
57 
+    background: #666;
58 
+    color: #fff;
59 
+  }
60 
+  .cld-day.disableDay{
61 
+    opacity: 0.5;
62 
+  }
63 
+  .cld-day.nextMonth, .cld-day.prevMonth{
64 
+    opacity: 0.33;
65 
+  }
66 
+    .cld-number{
67 
+      position: relative;
68 
+      margin: 5px;
69 
+      padding: 5px;
70 
+    }
71 
+      .cld-title{
72 
+        position: absolute;
73 
+        z-index: 5;
74 
+        display: none;
75 
+        top: 30px;
76 
+        left: 0;
77 
+        padding: 5px 10px;
78 
+        background: #fff;
79 
+        white-space: nowrap;
80 
+        border: 1px solid #ccc;
81 
+        border-radius: 5px;
82 
+        font-size: 12px;
83 
+      }
84 
+      .cld-number:hover .cld-title{
85 
+        display: block;
86 
+      }
87 
+      .cld-title::before{
88 
+        content: '';
89 
+        position: absolute;
90 
+        top: -7.5px; left: 7.5px;
91 
+        width: 0;
92 
+        height: 0;
93 
+        border-left: 7.5px solid transparent;
94 
+        border-right: 7.5px solid transparent;
95 
+
96 
+        border-bottom: 7.5px solid #ccc;
97 
+      }
98 
+      .cld-number.eventday{
99 
+        display: inline-block;
100 
+        height: 20px;
101 
+        width: 20px;
102 
+        border-radius: 50px;
103 
+        border: 1px solid #999;
104 
+      }
105 
+      .cld-number.eventday:hover{
106 
+        cursor: pointer;
107 
+        background: #eee;
108 
+      }
109 
+      .today .cld-number.eventday:hover{
110 
+        background: #888;
111 
+      }

+ 111
- 0
platforms/android/app/src/main/assets/www/calendar_files/css/theme2.css Переглянути файл 

@@ -0,0 +1,111 @@
1 
+.cld-main{
2 
+  width: 200px;
3 
+  text-align: center;
4 
+}
5 
+.cld-main a{
6 
+  color: #0080FF;
7 
+}
8 
+.cld-main svg{
9 
+  fill: #0080FF;
10 
+}
11 
+  .cld-datetime{
12 
+    position: relative;
13 
+    width: 66%;
14 
+    min-width: 100px;
15 
+    max-width: 300px;
16 
+    margin: auto;
17 
+    overflow: hidden;
18 
+  }
19 
+  .cld-datetime .today{
20 
+    position: relative;
21 
+    float: left;
22 
+    width: calc(100% - 40px);
23 
+    margin: auto;
24 
+    text-align: center;
25 
+  }
26 
+  .cld-nav{
27 
+    position: relative;
28 
+    width: 20px;
29 
+    height: 20px;
30 
+    margin-top: 2px;
31 
+  }
32 
+  .cld-nav:hover{
33 
+    cursor: pointer;
34 
+  }
35 
+  .cld-nav:hover svg{
36 
+      fill: #005EFF;
37 
+  }
38 
+  .cld-rwd{
39 
+    float: left;
40 
+  }
41 
+  .cld-fwd{
42 
+    float: right;
43 
+  }
44 
+    .cld-nav svg:hover{
45 
+
46 
+    }
47 
+.cld-labels, .cld-days{
48 
+  padding-left: 0;
49 
+}
50 
+  .cld-label, .cld-day{
51 
+    box-sizing: border-box;
52 
+    display: inline-block;
53 
+    width: 14.28%;
54 
+    text-align: center;
55 
+  }
56 
+  .cld-day{
57 
+    border: 1px solid #eee;
58 
+  }
59 
+  .cld-day.today .cld-number{
60 
+    background: #0080FF;
61 
+    color: #fff;
62 
+  }
63 
+  .cld-day.disableDay{
64 
+    opacity: 0.5;
65 
+  }
66 
+  .cld-day.nextMonth, .cld-day.prevMonth{
67 
+    opacity: 0.33;
68 
+  }
69 
+    .cld-number{
70 
+      position: relative;
71 
+      margin: 0;
72 
+      padding: 10px;
73 
+    }
74 
+      .cld-title{
75 
+        position: absolute;
76 
+        z-index: 5;
77 
+        display: none;
78 
+        top: 35px;
79 
+        left: 0;
80 
+        padding: 5px 10px;
81 
+        background: #fff;
82 
+        white-space: nowrap;
83 
+        border: 1px solid #ccc;
84 
+        border-radius: 5px;
85 
+        font-size: 12px;
86 
+      }
87 
+      .cld-number:hover .cld-title{
88 
+        display: block;
89 
+      }
90 
+      .cld-title::before{
91 
+        content: '';
92 
+        position: absolute;
93 
+        top: -7.5px; left: 10px;
94 
+        width: 0;
95 
+        height: 0;
96 
+        border-left: 7.5px solid transparent;
97 
+        border-right: 7.5px solid transparent;
98 
+
99 
+        border-bottom: 7.5px solid #ccc;
100 
+      }
101 
+      .cld-number.eventday{
102 
+        font-weight: bold;
103 
+        color: #0080FF;
104 
+      }
105 
+      .cld-number.eventday:hover{
106 
+        cursor: pointer;
107 
+        background: #eee;
108 
+      }
109 
+      .today .cld-number.eventday:hover{
110 
+        background: #005EFF;
111 
+      }

+ 95
- 0
platforms/android/app/src/main/assets/www/calendar_files/css/theme3.css Переглянути файл 

@@ -0,0 +1,95 @@
1 
+.cld-main{
2 
+  width: 660px;
3 
+  text-align: center;
4 
+}
5 
+.cld-main a{
6 
+  color: #7B00FF;
7 
+}
8 
+  .cld-datetime{
9 
+    position: relative;
10 
+    width: 66%;
11 
+    min-width: 100px;
12 
+    max-width: 300px;
13 
+    margin: auto;
14 
+    overflow: hidden;
15 
+  }
16 
+  .cld-datetime .today{
17 
+    position: relative;
18 
+    float: left;
19 
+    width: calc(100% - 40px);
20 
+    margin: auto;
21 
+    text-align: center;
22 
+  }
23 
+  .cld-nav{
24 
+    position: relative;
25 
+    width: 20px;
26 
+    height: 20px;
27 
+    margin-top: 2px;
28 
+  }
29 
+  .cld-nav:hover{
30 
+    cursor: pointer;
31 
+  }
32 
+  .cld-nav:hover svg{
33 
+      fill: #666;
34 
+  }
35 
+  .cld-rwd{
36 
+    float: left;
37 
+  }
38 
+  .cld-fwd{
39 
+    float: right;
40 
+  }
41 
+    .cld-nav svg:hover{
42 
+
43 
+    }
44 
+.cld-labels, .cld-days{
45 
+  padding-left: 0;
46 
+}
47 
+  .cld-label, .cld-day{
48 
+    box-sizing: border-box;
49 
+    display: inline-block;
50 
+    width: 14.28%;
51 
+    text-align: center;
52 
+  }
53 
+  .cld-day{
54 
+    display: block;
55 
+    float: left;
56 
+    position: relative;
57 
+    margin: 0;
58 
+    padding: 5px;
59 
+    height: 66px;
60 
+    border: 1px solid #ddd;
61 
+    overflow-y: auto;
62 
+  }
63 
+  .cld-day.clickable:hover{
64 
+    cursor: pointer;
65 
+  }
66 
+  .cld-day.today{
67 
+    border: 1px solid #7B00FF;
68 
+  }
69 
+  .cld-day.disableDay{
70 
+    opacity: 0.5;
71 
+  }
72 
+  .cld-day.nextMonth, .cld-day.prevMonth{
73 
+    opacity: 0.33;
74 
+  }
75 
+    .cld-number{
76 
+      margin: 0;
77 
+      text-align: left;
78 
+    }
79 
+      .cld-title{
80 
+        font-size: 10px;
81 
+        display: block;
82 
+        margin: 0;
83 
+        font-weight: normal;
84 
+      }
85 
+      .cld-day:hover{
86 
+        background: #eee;
87 
+      }
88 
+      .cld-number.eventday{
89 
+        font-weight: bold;
90 
+      }
91 
+      .cld-number.eventday:hover{
92 
+        background: #eee;
93 
+      }
94 
+      .today .cld-number.eventday:hover{
95 
+      }

+ 299
- 0
platforms/android/app/src/main/assets/www/calendar_files/js/caleandar.js Переглянути файл 

@@ -0,0 +1,299 @@
1 
+/*
2 
+  Author: Jack Ducasse;
3 
+  Version: 0.1.0;
4 
+  (◠‿◠✿)
5 
+*/
6 
+var Calendar = function(model, options, date){
7 
+  // Default Values
8 
+  this.Options = {
9 
+    Color: '',
10 
+    LinkColor: '',
11 
+    NavShow: true,
12 
+    NavVertical: false,
13 
+    NavLocation: '',
14 
+    DateTimeShow: true,
15 
+    DateTimeFormat: 'mmm, yyyy',
16 
+    DatetimeLocation: '',
17 
+    EventClick: '',
18 
+    EventTargetWholeDay: false,
19 
+    DisabledDays: [],
20 
+    ModelChange: model
21 
+  };
22 
+  // Overwriting default values
23 
+  for(var key in options){
24 
+    this.Options[key] = typeof options[key]=='string'?options[key].toLowerCase():options[key];
25 
+  }
26 
+
27 
+  model?this.Model=model:this.Model={};
28 
+  this.Today = new Date();
29 
+
30 
+  this.Selected = this.Today
31 
+  this.Today.Month = this.Today.getMonth();
32 
+  this.Today.Year = this.Today.getFullYear();
33 
+  if(date){this.Selected = date}
34 
+  this.Selected.Month = this.Selected.getMonth();
35 
+  this.Selected.Year = this.Selected.getFullYear();
36 
+
37 
+  this.Selected.Days = new Date(this.Selected.Year, (this.Selected.Month + 1), 0).getDate();
38 
+  this.Selected.FirstDay = new Date(this.Selected.Year, (this.Selected.Month), 1).getDay();
39 
+  this.Selected.LastDay = new Date(this.Selected.Year, (this.Selected.Month + 1), 0).getDay();
40 
+
41 
+  this.Prev = new Date(this.Selected.Year, (this.Selected.Month - 1), 1);
42 
+  if(this.Selected.Month==0){this.Prev = new Date(this.Selected.Year-1, 11, 1);}
43 
+  this.Prev.Days = new Date(this.Prev.getFullYear(), (this.Prev.getMonth() + 1), 0).getDate();
44 
+};
45 
+
46 
+function createCalendar(calendar, element, adjuster){
47 
+  if(typeof adjuster !== 'undefined'){
48 
+    var newDate = new Date(calendar.Selected.Year, calendar.Selected.Month + adjuster, 1);
49 
+    calendar = new Calendar(calendar.Model, calendar.Options, newDate);
50 
+    element.innerHTML = '';
51 
+  }else{
52 
+    for(var key in calendar.Options){
53 
+      typeof calendar.Options[key] != 'function' && typeof calendar.Options[key] != 'object' && calendar.Options[key]?element.className += " " + key + "-" + calendar.Options[key]:0;
54 
+    }
55 
+  }
56 
+  var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
57 
+
58 
+  function AddSidebar(){
59 
+    var sidebar = document.createElement('div');
60 
+    sidebar.className += 'cld-sidebar';
61 
+
62 
+    var monthList = document.createElement('ul');
63 
+    monthList.className += 'cld-monthList';
64 
+
65 
+    for(var i = 0; i < months.length - 3; i++){
66 
+      var x = document.createElement('li');
67 
+      x.className += 'cld-month';
68 
+      var n = i - (4 - calendar.Selected.Month);
69 
+      // Account for overflowing month values
70 
+      if(n<0){n+=12;}
71 
+      else if(n>11){n-=12;}
72 
+      // Add Appropriate Class
73 
+      if(i==0){
74 
+        x.className += ' cld-rwd cld-nav';
75 
+        x.addEventListener('click', function(){
76 
+          typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
77 
+          createCalendar(calendar, element, -1);});
78 
+        x.innerHTML += '<svg height="15" width="15" viewBox="0 0 100 75" fill="rgba(255,255,255,0.5)"><polyline points="0,75 100,75 50,0"></polyline></svg>';
79 
+      }
80 
+      else if(i==months.length - 4){
81 
+        x.className += ' cld-fwd cld-nav';
82 
+        x.addEventListener('click', function(){
83 
+          typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
84 
+          createCalendar(calendar, element, 1);} );
85 
+        x.innerHTML += '<svg height="15" width="15" viewBox="0 0 100 75" fill="rgba(255,255,255,0.5)"><polyline points="0,0 100,0 50,75"></polyline></svg>';
86 
+      }
87 
+      else{
88 
+        if(i < 4){x.className += ' cld-pre';}
89 
+        else if(i > 4){x.className += ' cld-post';}
90 
+        else{x.className += ' cld-curr';}
91 
+
92 
+        //prevent losing var adj value (for whatever reason that is happening)
93 
+        (function () {
94 
+          var adj = (i-4);
95 
+          //x.addEventListener('click', function(){createCalendar(calendar, element, adj);console.log('kk', adj);} );
96 
+          x.addEventListener('click', function(){
97 
+            typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
98 
+            createCalendar(calendar, element, adj);} );
99 
+          x.setAttribute('style', 'opacity:' + (1 - Math.abs(adj)/4));
100 
+          x.innerHTML += months[n].substr(0,3);
101 
+        }()); // immediate invocation
102 
+
103 
+        if(n==0){
104 
+          var y = document.createElement('li');
105 
+          y.className += 'cld-year';
106 
+          if(i<5){
107 
+            y.innerHTML += calendar.Selected.Year;
108 
+          }else{
109 
+            y.innerHTML += calendar.Selected.Year + 1;
110 
+          }
111 
+          monthList.appendChild(y);
112 
+        }
113 
+      }
114 
+      monthList.appendChild(x);
115 
+    }
116 
+    sidebar.appendChild(monthList);
117 
+    if(calendar.Options.NavLocation){
118 
+      document.getElementById(calendar.Options.NavLocation).innerHTML = "";
119 
+      document.getElementById(calendar.Options.NavLocation).appendChild(sidebar);
120 
+    }
121 
+    else{element.appendChild(sidebar);}
122 
+  }
123 
+
124 
+  var mainSection = document.createElement('div');
125 
+  mainSection.className += "cld-main";
126 
+
127 
+  function AddDateTime(){
128 
+      var datetime = document.createElement('div');
129 
+      datetime.className += "cld-datetime";
130 
+      if(calendar.Options.NavShow && !calendar.Options.NavVertical){
131 
+        var rwd = document.createElement('div');
132 
+        rwd.className += " cld-rwd cld-nav";
133 
+        rwd.addEventListener('click', function(){createCalendar(calendar, element, -1);} );
134 
+        rwd.innerHTML = '<svg height="15" width="15" viewBox="0 0 75 100" fill="rgba(0,0,0,0.5)"><polyline points="0,50 75,0 75,100"></polyline></svg>';
135 
+        datetime.appendChild(rwd);
136 
+      }
137 
+      var today = document.createElement('div');
138 
+      today.className += ' today';
139 
+      today.innerHTML = months[calendar.Selected.Month] + ", " + calendar.Selected.Year;
140 
+      datetime.appendChild(today);
141 
+      if(calendar.Options.NavShow && !calendar.Options.NavVertical){
142 
+        var fwd = document.createElement('div');
143 
+        fwd.className += " cld-fwd cld-nav";
144 
+        fwd.addEventListener('click', function(){createCalendar(calendar, element, 1);} );
145 
+        fwd.innerHTML = '<svg height="15" width="15" viewBox="0 0 75 100" fill="rgba(0,0,0,0.5)"><polyline points="0,0 75,50 0,100"></polyline></svg>';
146 
+        datetime.appendChild(fwd);
147 
+      }
148 
+      if(calendar.Options.DatetimeLocation){
149 
+        document.getElementById(calendar.Options.DatetimeLocation).innerHTML = "";
150 
+        document.getElementById(calendar.Options.DatetimeLocation).appendChild(datetime);
151 
+      }
152 
+      else{mainSection.appendChild(datetime);}
153 
+  }
154 
+
155 
+  function AddLabels(){
156 
+    var labels = document.createElement('ul');
157 
+    labels.className = 'cld-labels';
158 
+    var labelsList = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
159 
+    for(var i = 0; i < labelsList.length; i++){
160 
+      var label = document.createElement('li');
161 
+      label.className += "cld-label";
162 
+      label.innerHTML = labelsList[i];
163 
+      labels.appendChild(label);
164 
+    }
165 
+    mainSection.appendChild(labels);
166 
+  }
167 
+  function AddDays(){
168 
+    // Create Number Element
169 
+    function DayNumber(n){
170 
+      var number = document.createElement('p');
171 
+      number.className += "cld-number";
172 
+      number.innerHTML += n;
173 
+      return number;
174 
+    }
175 
+    var days = document.createElement('ul');
176 
+    days.className += "cld-days";
177 
+    // Previous Month's Days
178 
+    for(var i = 0; i < (calendar.Selected.FirstDay); i++){
179 
+      var day = document.createElement('li');
180 
+      day.className += "cld-day prevMonth";
181 
+      //Disabled Days
182 
+      var d = i%7;
183 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
184 
+        if(d==calendar.Options.DisabledDays[q]){
185 
+          day.className += " disableDay";
186 
+        }
187 
+      }
188 
+
189 
+      var number = DayNumber((calendar.Prev.Days - calendar.Selected.FirstDay) + (i+1));
190 
+      day.appendChild(number);
191 
+
192 
+      days.appendChild(day);
193 
+    }
194 
+    // Current Month's Days
195 
+    for(var i = 0; i < calendar.Selected.Days; i++){
196 
+      var day = document.createElement('li');
197 
+      day.className += "cld-day currMonth";
198 
+      //Disabled Days
199 
+      var d = (i + calendar.Selected.FirstDay)%7;
200 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
201 
+        if(d==calendar.Options.DisabledDays[q]){
202 
+          day.className += " disableDay";
203 
+        }
204 
+      }
205 
+      var number = DayNumber(i+1);
206 
+      // Check Date against Event Dates
207 
+      for(var n = 0; n < calendar.Model.length; n++){
208 
+        var evDate = calendar.Model[n].Date;
209 
+        var toDate = new Date(calendar.Selected.Year, calendar.Selected.Month, (i+1));
210 
+        if(evDate.getTime() == toDate.getTime()){
211 
+          number.className += " eventday";
212 
+          var title = document.createElement('span');
213 
+          title.className += "cld-title";
214 
+          if(typeof calendar.Model[n].Link == 'function' || calendar.Options.EventClick){
215 
+            var a = document.createElement('a');
216 
+            a.setAttribute('href', '#');
217 
+            a.innerHTML += calendar.Model[n].Title;
218 
+            if(calendar.Options.EventClick){
219 
+              var z = calendar.Model[n].Link;
220 
+              if(typeof calendar.Model[n].Link != 'string'){
221 
+                  a.addEventListener('click', calendar.Options.EventClick.bind.apply(calendar.Options.EventClick, [null].concat(z)) );
222 
+                  if(calendar.Options.EventTargetWholeDay){
223 
+                    day.className += " clickable";
224 
+                    day.addEventListener('click', calendar.Options.EventClick.bind.apply(calendar.Options.EventClick, [null].concat(z)) );
225 
+                  }
226 
+              }else{
227 
+                a.addEventListener('click', calendar.Options.EventClick.bind(null, z) );
228 
+                if(calendar.Options.EventTargetWholeDay){
229 
+                  day.className += " clickable";
230 
+                  day.addEventListener('click', calendar.Options.EventClick.bind(null, z) );
231 
+                }
232 
+              }
233 
+            }else{
234 
+              a.addEventListener('click', calendar.Model[n].Link);
235 
+              if(calendar.Options.EventTargetWholeDay){
236 
+                day.className += " clickable";
237 
+                day.addEventListener('click', calendar.Model[n].Link);
238 
+              }
239 
+            }
240 
+            title.appendChild(a);
241 
+          }else{
242 
+            title.innerHTML += '<a href="' + calendar.Model[n].Link + '">' + calendar.Model[n].Title + '</a>';
243 
+          }
244 
+          number.appendChild(title);
245 
+        }
246 
+      }
247 
+      day.appendChild(number);
248 
+      // If Today..
249 
+      if((i+1) == calendar.Today.getDate() && calendar.Selected.Month == calendar.Today.Month && calendar.Selected.Year == calendar.Today.Year){
250 
+        day.className += " today";
251 
+      }
252 
+      days.appendChild(day);
253 
+    }
254 
+    // Next Month's Days
255 
+    // Always same amount of days in calander
256 
+    var extraDays = 13;
257 
+    if(days.children.length>35){extraDays = 6;}
258 
+    else if(days.children.length<29){extraDays = 20;}
259 
+
260 
+    for(var i = 0; i < (extraDays - calendar.Selected.LastDay); i++){
261 
+      var day = document.createElement('li');
262 
+      day.className += "cld-day nextMonth";
263 
+      //Disabled Days
264 
+      var d = (i + calendar.Selected.LastDay + 1)%7;
265 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
266 
+        if(d==calendar.Options.DisabledDays[q]){
267 
+          day.className += " disableDay";
268 
+        }
269 
+      }
270 
+
271 
+      var number = DayNumber(i+1);
272 
+      day.appendChild(number);
273 
+
274 
+      days.appendChild(day);
275 
+    }
276 
+    mainSection.appendChild(days);
277 
+  }
278 
+  if(calendar.Options.Color){
279 
+    mainSection.innerHTML += '<style>.cld-main{color:' + calendar.Options.Color + ';}</style>';
280 
+  }
281 
+  if(calendar.Options.LinkColor){
282 
+    mainSection.innerHTML += '<style>.cld-title a{color:' + calendar.Options.LinkColor + ';}</style>';
283 
+  }
284 
+  element.appendChild(mainSection);
285 
+
286 
+  if(calendar.Options.NavShow && calendar.Options.NavVertical){
287 
+    AddSidebar();
288 
+  }
289 
+  if(calendar.Options.DateTimeShow){
290 
+    AddDateTime();
291 
+  }
292 
+  AddLabels();
293 
+  AddDays();
294 
+}
295 
+
296 
+function caleandar(el, data, settings){
297 
+  var obj = new Calendar(data, settings);
298 
+  createCalendar(obj, el);
299 
+}

+ 1
- 0
platforms/android/app/src/main/assets/www/calendar_files/js/caleandar.min.js
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 8
- 0
platforms/android/app/src/main/assets/www/calendar_files/js/events.js Переглянути файл 

@@ -0,0 +1,8 @@
1 
+var events = [
2 
+  {'Date': new Date(2019, 9, 7), 'Title': 'Doctor appointment at 3:25pm.'},
3 
+  {'Date': new Date(2019, 9, 7), 'Title': 'New Garfield movie comes out!', 'Link': 'https://garfield.com'},
4 
+  {'Date': new Date(2019, 9, 27), 'Title': '25 year anniversary', 'Link': 'https://www.google.com.au/#q=anniversary+gifts'},
5 
+];
6 
+var settings = {};
7 
+var element = document.getElementById('caleandar');
8 
+caleandar(element, events, settings);

+ 20
- 0
platforms/android/app/src/main/assets/www/css/index.css Переглянути файл 

@@ -105,3 +105,23 @@ h1 {
105 105 
     animation:fade 3000ms infinite;
106 106 
     -webkit-animation:fade 3000ms infinite;
107 107 
 }
108 
+
109 
+a:link {
110 
+  text-decoration: none;
111 
+    color: black;
112 
+}
113 
+
114 
+a:visited {
115 
+  text-decoration: none;
116 
+    color: black;
117 
+}
118 
+
119 
+a:hover {
120 
+  text-decoration: none;
121 
+    color: black;
122 
+}
123 
+
124 
+a:active {
125 
+  text-decoration: none;
126 
+    color: black;
127 
+}

+ 12
- 0
platforms/android/app/src/main/assets/www/css/searchbar1.css Переглянути файл 

@@ -0,0 +1,12 @@
1 
+ons-toolbar ~ .page__content{
2 
+    margin-top: 45px;
3 
+}
4 
+.search-bar {
5 
+    width: 100%;
6 
+    position: fixed;
7 
+    display: block;
8 
+    margin-top: -45px;
9 
+}
10 
+.after-search-bar {
11 
+    margin-top: -10px;
12 
+}

platforms/android/app/src/main/assets/www/ICPlogo.png → platforms/android/app/src/main/assets/www/img/ICPlogo.png Переглянути файл


platforms/android/app/src/main/assets/www/facebook.png → platforms/android/app/src/main/assets/www/img/facebook.png Переглянути файл


platforms/android/app/src/main/assets/www/instagram.png → platforms/android/app/src/main/assets/www/img/instagram.png Переглянути файл


platforms/android/app/src/main/assets/www/twitter.png → platforms/android/app/src/main/assets/www/img/twitter.png Переглянути файл


platforms/android/app/src/main/assets/www/youtube.png → platforms/android/app/src/main/assets/www/img/youtube.png Переглянути файл


+ 114
- 11
platforms/android/app/src/main/assets/www/index.html Переглянути файл 

@@ -28,23 +28,33 @@
28 28 
             * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29 29 
                 * Enable inline JS: add 'unsafe-inline' to default-src
30 30 
         -->
31 
-        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
31 
+        <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:;">
32 
+        <!--these three for the calendar-->
33 
+        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
34 
+        <link rel="stylesheet" href="calendar_files/css/demo.css"/>
35 
+        <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
36 
+        <!--this is for the search bar-->
37 
+        <link rel = "stylesheet" href = "css/searchbar1.css">
38 
+
32 39 
         <meta name="format-detection" content="telephone=no">
33 40 
         <meta name="msapplication-tap-highlight" content="no">
34 41 
         <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
35 42 
         <link rel="stylesheet" type="text/css" href="css/index.css">
36 
-        <title>Cultura</title>
37 43 
         <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
38 44 
         <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
39 45 
         <script src="lib/OnsenUI/js/onsenui.min.js"></script>
46 
+
40 47 
     </head>
41 48 
     <body>
42 49
50 
+        <ons-navegator id="myNavigator">
43 51 
         <ons-page>
52 
+
44 53 
             <ons-toolbar>
45 54 
                 <div class="center">Cultura</div>
46 55 
             </ons-toolbar>
47 56
57 
+
48 58 
             <ons-tabbar swipeable position="auto">
49 59 
                 <ons-tab page="home.html" label="Hogar" active></ons-tab>
50 60 
                 <ons-tab page="artesania.html" label="Artesanias"></ons-tab>
 
@@ -52,40 +62,133 @@
52 62 
                 <ons-tab page="instituto.html" label="Instituto"></ons-tab>
53 63 
             </ons-tabbar>
54 64 
         </ons-page>
65 
+        </ons-navegator>
66 
+
67 
+        <!--<ons-toolbar>
68 
+                <div class="center">Cultura</div>
69 
+                style="background-color:#ABBC5D"
70 
+        </ons-toolbar>-->
71 
+
55 72
56 73 
         <template id="home.html">
57 74 
             <ons-page id="Hogar">
58 75 
                 <p style="text-align: center;">
59 
-                    Este es el hogar.
76 
+			     Pantalla Principal
60 77 
                 </p>
61 78 
             </ons-page>
62 79 
         </template>
63 80
64 81 
         <template id="artesania.html">
65 
-            <ons-page id="Artesanias">
66 
-                <p style="text-align: center;">
67 
-                    Aqui estan las artesanias.
68 
-                </p>
82 
+            <ons-page id="artesania">
83 
+
84 
+                <div class="search-bar">
85 
+                     <p style="text-align: center; margin-top: 10px;">
86 
+                        <ons-search-input placeholder="Search" onchange="ons.notification.alert('Searched for: ' + this.value)" style="width: 96%; margin: 6px auto 6px auto;"></ons-search-input>
87 
+                    </p>
88 
+                </div>
89 
+
90 
+                <div>
91 
+                <ons-scroller>
92 
+                    <!--<table id="table" align="center">
93 
+                        <tr>
94 
+                            <th>Renglones</th>
95 
+                            <th>Especificaciones</th>
96 
+                        </tr>
97 
+                    <script type="text/javascript" src="js/test.js"></script>
98 
+                    </table>     -->
99 
+
100 
+                    <ons-list>
101 
+                    <ons-list-header>Renglones</ons-list-header>
102 
+                    <!--<ons-list-item modifier="chevron" id="myNavigator.pushPage('pageNav1.html')">Madera</ons-list-item>-->
103 
+                    <ons-list-item><a href="madera.html">Madera</a></ons-list-item>
104 
+                    <ons-list-item>Labores en aguja</ons-list-item>
105 
+                    <ons-list-item>Textiles</ons-list-item>
106 
+                    <ons-list-item>Barro</ons-list-item>
107 
+                    <ons-list-item>Instrumentos Típicos</ons-list-item>
108 
+                    <ons-list-item>Juguetes tradicionales</ons-list-item>
109 
+                    <ons-list-item>Fibras</ons-list-item>
110 
+                    <ons-list-item>Caretas</ons-list-item>
111 
+                    <ons-list-item>Cuero</ons-list-item>
112 
+                    <ons-list-item>Metal</ons-list-item>
113 
+                    <ons-list-item>Piedras</ons-list-item>
114 
+                    <ons-list-item>Papel</ons-list-item>
115 
+                    <ons-list-item>Bambú</ons-list-item>
116 
+                    <ons-list-item>Cristal</ons-list-item>
117 
+                    <ons-list-item>Higüera</ons-list-item>
118 
+                    <ons-list-item>Desechos Marinos</ons-list-item>
119 
+                    <ons-list-item>Porcelanicrón</ons-list-item>
120 
+                    <ons-list-item>Tabacos</ons-list-item>
121 
+                    <ons-list-item>Semillas</ons-list-item>
122 
+                    <ons-list-item>Aromatización</ons-list-item>
123 
+                    <ons-list-item>Dulces Típicos</ons-list-item>
124 
+                    </ons-list>
125 
+                </ons-scroller>
126 
+                </div>
69 127 
             </ons-page>
70 128 
         </template>
71 129
130 
+        <!--<template id="pageNav1.html">
131 
+        <ons-page id="pageNav1">
132 
+            <ons-toolbar>
133 
+            <div class="left">
134 
+                <ons-back-button>Back</ons-back-button>
135 
+            </div>
136 
+      <     div class="center"></div>
137 
+            </ons-toolbar>
138 
+            <p style="text-align: center">
139 
+            Use the VOnsBackButton
140 
+            </p>
141 
+        </ons-page>
142 
+        </template>-->
143 
+
72 144 
         <template id="ferias.html">
73 145 
             <ons-page id="Ferias">
74 
-                <p style="text-align: center;">
75 
-                    Aqui estan las ferias.
76 
-                </p>
146 
+
147 
+                <div id = "caleandar" class = "calendar" style="margin-top: 50px;">
148 
+                    <script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
149 
+                    <script type="text/javascript" src="calendar_files/js/events.js"></script>
150 
+                </div>
77 151 
             </ons-page>
78 152 
         </template>
79 153
80 154 
         <template id="instituto.html">
81 155 
             <ons-page id="Instituto">
82 156 
                 <p style="text-align: center;">
83 
-                    Aqui esta la informacion del instituto.
157 
+
158 
+		<h1>Instituto de Cultura Puertorriqueña</h1>
159 
+		<h3>Ven, descubre lo que nuestra riqueza cultural puertorriqueña tiene para tí.<br> Disfrútala, es tu identidad.
160 
+		</h3>
161 
+
162 
+		<body>
163 
+		<br>
164 
+		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.
165 
+		<br><br>
166 
+		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.
167 
+		<br><br>
168 
+		Prof. Carlos R. Ruiz Cortés<br>
169 
+		Director Ejecutivo<br>
170 
+		Instituto de Cultura Puertorriqueña<br>
171 
+		<br><br>
172 
+		</body>
173 
+
174 
+		Visita nuestra <a href="https://www.icp.pr.gov/">Página Web</a> o síguenos en nuestras redes sociales:
175 
+		<a href="https://twitter.com/icppr"><img src="img/twitter.png" alt="Twitter" style="width:35px;height:35px;border:0;">
176 
+		</a>
177 
+		<a href="https://facebook.com/icppr"><img src="img/facebook.png" alt="Facebook" style="width:35px;height:35px;border:0;">
178 
+		</a>
179 
+		<a href="https://youtube.com/user/icppr"><img src="img/youtube.png" alt="Youtube" style="width:35px;height:35px;border:0;">
180 
+		</a>
181 
+		<a href="https://instagram.com/icppr"><img src="img/instagram.png" alt="Instagram" style="width:35px;height:35px;border:0;">
182 
+		</a>
183 
+
184 
+
185 
+
84 186 
                 </p>
85 187 
             </ons-page>
86 188 
         </template>
87 189
88 190 
         <script type="text/javascript" src="cordova.js"></script>
89 191 
         <script type="text/javascript" src="js/index.js"></script>
192 
+        <script type="text/javascript" src="js/link.js"></script>
90 193 
     </body>
91 194 
 </html>

+ 0
- 41
platforms/android/app/src/main/assets/www/instituto.html Переглянути файл 

@@ -1,41 +0,0 @@
1 
-<!DOCTYPE html>
2 
-
3 
-<script>
4 
-</script>
5 
-
6 
-<html lang="en-US">
7 
-
8 
-<head>
9 
-    <meta charset="UTF-8">
10 
-    <meta name="viewport" content="width=device-width, initial-scale=1">
11 
-    <title>Instituto de Cultura | Puerto Rico</title>
12 
-</head>
13 
-
14 
-<h1>Instituto de Cultura Puertorriqueña</h1>
15 
-<h3>Ven, descubre lo que nuestra riqueza cultural puertorriqueña tiene para tí.<br> Disfrútala, es tu identidad.</h3>
16 
-
17 
-<body>
18 
-<br>
19 
-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.
20 
-<br><br>
21 
-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.
22 
-<br><br>
23 
-Prof. Carlos R. Ruiz Cortés<br>
24 
-Director Ejecutivo<br>
25 
-Instituto de Cultura Puertorriqueña<br>
26 
-<br><br>
27 
-</body>
28 
-
29 
-<footer>
30 
-Visita nuestra <a href="https://www.icp.pr.gov/">Página Web</a> o síguenos en nuestras redes sociales:
31 
-<a href="https://twitter.com/icppr"><img src="twitter.png" alt="Twitter" style="width:35px;height:35px;border:0;">
32 
-</a>
33 
-<a href="https://facebook.com/icppr"><img src="facebook.png" alt="Facebook" style="width:35px;height:35px;border:0;">
34 
-</a>
35 
-<a href="https://youtube.com/user/icppr"><img src="youtube.png" alt="Youtube" style="width:35px;height:35px;border:0;">
36 
-</a>
37 
-<a href="https://instagram.com/icppr"><img src="instagram.png" alt="Instagram" style="width:35px;height:35px;border:0;">
38 
-</a>
39 
-</footer>
40 
-
41 
-</html>

+ 45
- 0
platforms/android/app/src/main/assets/www/js/link.js Переглянути файл 

@@ -0,0 +1,45 @@
1 
+/*window.fn = {};
2 
+
3 
+window.fn.toggleMenu = function () {
4 
+  document.getElementById('appSplitter').right.toggle();
5 
+};
6 
+
7 
+window.fn.loadView = function (index) {
8 
+  document.getElementById('appTabbar').setActiveTab(index);
9 
+  document.getElementById('sidemenu').close();
10 
+};
11 
+
12 
+window.fn.loadLink = function (url) {
13 
+  window.open(url, '_blank');
14 
+};
15 
+
16 
+window.fn.pushPage = function (page, anim) {
17 
+  if (anim) {
18 
+    document.getElementById('appNavigator').pushPage(page.id, { data: { title: page.title }, animation: anim });
19 
+  } else {
20 
+    document.getElementById('appNavigator').pushPage(page.id, { data: { title: page.title } });
21 
+  }
22 
+};
23 
+
24 
+document.addEventListener('init', function(event) {
25 
+  var page = event.target;
26 
+
27 
+  if (page.id === 'artesania') {
28 
+    page.querySelector('#push-button').onclick = function() {
29 
+      document.querySelector('#myNavigator').pushPage('page1.html', {data: {title: 'Page 1'}});
30 
+    };
31 
+  } else if (page.id === 'page1') {
32 
+    page.querySelector('ons-toolbar .center').innerHTML = page.data.title;
33 
+  }
34 
+});*/
35 
+
36 
+/*document.addEventListener('init', function (event) {
37 
+  if (event.target.id === 'pageNav1') {
38 
+    var title = event.target.data && event.target.data.title ? event.target.data.title : 'Custom Page';
39 
+    event.target.querySelector('ons-toolbar div.center').textContent = title;
40 
+  }
41 
+  if (event.target.id === 'pageNav2') {
42 
+    var cardTitle = event.target.data && event.target.data.cardTitle ? event.target.data.cardTitle : 'Custom Card';
43 
+    event.target.querySelector('ons-card div.title').textContent = cardTitle;
44 
+  }
45 
+});*/

+ 67
- 0
platforms/android/app/src/main/assets/www/js/test.js Переглянути файл 

@@ -0,0 +1,67 @@
1 
+var request = new XMLHttpRequest()
2 
+
3 
+/*request.open('GET', 'json/renglones.json', true)
4 
+
5 
+request.onload = function() {
6 
+  // begin accessing JSON data here
7 
+  var info = JSON.parse(this.response)
8 
+
9 
+  var table = document.getElementById("table");
10 
+
11 
+    for (var i = 0; i < info.length; i++) {
12 
+
13 
+            tr = table.insertRow(-1);
14 
+
15 
+            for (var j = 0; j < 2; j++) {
16 
+                var tabCell = tr.insertCell(-1);
17 
+                if (j==0) {
18 
+                    tabCell.innerHTML = info[i].Renglones;
19 
+                }
20 
+                else{
21 
+                    tabCell.innerHTML = info[i].Especificaciones;
22 
+                }
23 
+            }
24 
+        }
25 
+    var divContainer = document.getElementById("showData");
26 
+        divContainer.innerHTML = "";
27 
+        divContainer.appendChild(tr);
28 
+
29 
+}*/
30 
+request.open('GET', 'json/MADERA.json', true)
31 
+
32 
+request.onload = function() {
33 
+  // begin accessing JSON data here
34 
+  var info = JSON.parse(this.response)
35 
+
36 
+  var table = document.getElementById("table");
37 
+
38 
+    for (var i = 0; i < info.length; i++) {
39 
+
40 
+            tr = table.insertRow(-1);
41 
+
42 
+            for (var j = 0; j < 5; j++) {
43 
+                var tabCell = tr.insertCell(-1);
44 
+                if (j==0) {
45 
+                    tabCell.innerHTML = info[i].Nombre;
46 
+                }
47 
+                else if (j==1) {
48 
+                    tabCell.innerHTML = info[i].Especificaciones;
49 
+                }
50 
+                else if (j==2) {
51 
+                    tabCell.innerHTML = info[i]["Teléfono 1"];
52 
+                }
53 
+                else if (j==3) {
54 
+                    tabCell.innerHTML = info[i]["E-mail"];
55 
+                }
56 
+                else{
57 
+                    tabCell.innerHTML = info[i].Municipio
58 
+                }
59 
+            }
60 
+        }
61 
+    var divContainer = document.getElementById("showData");
62 
+        divContainer.innerHTML = "";
63 
+        divContainer.appendChild(tr);
64 
+}
65 
+
66 
+
67 
+request.send()

+ 1
- 0
platforms/android/app/src/main/assets/www/json/MADERA.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 1
- 0
platforms/android/app/src/main/assets/www/json/renglones.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 54
- 0
platforms/android/app/src/main/assets/www/madera.html Переглянути файл 

@@ -0,0 +1,54 @@
1 
+<html>
2 
+    <head>
3 
+        <!--
4 
+        Customize this policy to fit your own app's needs. For more guidance, see:
5 
+            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
6 
+        Some notes:
7 
+            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
8 
+            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
9 
+            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
10 
+                * Enable inline JS: add 'unsafe-inline' to default-src
11 
+        -->
12 
+        <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:;">
13 
+        <!--these three for the calendar-->
14 
+        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
15 
+        <link rel="stylesheet" href="calendar_files/css/demo.css"/>
16 
+        <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
17 
+        <!--this is for the search bar-->
18 
+        <link rel = "stylesheet" href = "css/searchbar1.css">
19 
+
20 
+        <meta name="format-detection" content="telephone=no">
21 
+        <meta name="msapplication-tap-highlight" content="no">
22 
+        <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
23 
+        <link rel="stylesheet" type="text/css" href="css/index.css">
24 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
25 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
26 
+        <script src="lib/OnsenUI/js/onsenui.min.js"></script>
27 
+
28 
+    </head>
29 
+    <body>
30 
+        <br><br><br><br>
31 
+        <ons-page>
32 
+            <ons-toolbar>
33 
+                <div class="left"><ons-toolbar-button><a href="index.html">Home</a></ons-toolbar-button></div>
34 
+                <div class="center">Cultura</div>
35 
+            </ons-toolbar>
36 
+        <div>
37 
+        <ons-scroller>
38 
+                    <table id="table" align="center" border=1>
39 
+                        <tr>
40 
+                            <th>Nombres</th>
41 
+                            <th>Especificaciones</th>
42 
+                            <th>Teléfono</th>
43 
+                            <th>E-mail</th>
44 
+                            <th>Municipio</th>
45 
+                        </tr>
46 
+                    <script type="text/javascript" src="js/test.js"></script>
47 
+                    </table>
48 
+        </ons-scroller>
49 
+            </div>
50 
+        </ons-page>
51 
+        <script type="text/javascript" src="cordova.js"></script>
52 
+        <script type="text/javascript" src="js/index.js"></script>
53 
+    </body>
54 
+</html>

+ 115
- 0
platforms/android/app/src/main/assets/www/temp/index.html Переглянути файл 

@@ -0,0 +1,115 @@
1 
+<!DOCTYPE html>
2 
+<!--
3 
+    Licensed to the Apache Software Foundation (ASF) under one
4 
+    or more contributor license agreements.  See the NOTICE file
5 
+    distributed with this work for additional information
6 
+    regarding copyright ownership.  The ASF licenses this file
7 
+    to you under the Apache License, Version 2.0 (the
8 
+    "License"); you may not use this file except in compliance
9 
+    with the License.  You may obtain a copy of the License at
10 
+
11 
+    http://www.apache.org/licenses/LICENSE-2.0
12 
+
13 
+    Unless required by applicable law or agreed to in writing,
14 
+    software distributed under the License is distributed on an
15 
+    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
16 
+     KIND, either express or implied.  See the License for the
17 
+    specific language governing permissions and limitations
18 
+    under the License.
19 
+-->
20 
+<html>
21 
+    <head>
22 
+        <!--
23 
+        Customize this policy to fit your own app's needs. For more guidance, see:
24 
+            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
25 
+        Some notes:
26 
+            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
27 
+            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
28 
+            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29 
+                * Enable inline JS: add 'unsafe-inline' to default-src
30 
+        -->
31 
+
32 
+        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
33 
+        <meta name="format-detection" content="telephone=no">
34 
+        <meta name="msapplication-tap-highlight" content="no">
35 
+        <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
36 
+        <link rel="stylesheet" type="text/css" href="css/index.css">
37 
+        <title>Cultura</title>
38 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
39 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
40 
+        <script src="lib/OnsenUI/js/onsenui.min.js"></script>
41 
+    </head>
42 
+    <body>
43 
+
44 
+        <ons-page>
45 
+            <ons-toolbar>
46 
+                <div class="center">Cultura</div>
47 
+            </ons-toolbar>
48 
+
49 
+            <ons-tabbar swipeable position="auto">
50 
+                <ons-tab page="home.html" label="Hogar" active></ons-tab>
51 
+                <ons-tab page="artesania.html" label="Artesanias"></ons-tab>
52 
+                <ons-tab page="ferias.html" label="Ferias"></ons-tab>
53 
+                <ons-tab page="instituto.html" label="Instituto"></ons-tab>
54 
+            </ons-tabbar>
55 
+        </ons-page>
56 
+
57 
+        <template id="home.html">
58 
+            <ons-page id="Hogar">
59 
+                <p style="text-align: center;">
60 
+                    Este es el hogar.
61 
+                </p>
62 
+            </ons-page>
63 
+        </template>
64 
+
65 
+        <template id="artesania.html">
66 
+            <ons-page id="Artesanias">
67 
+                <table id="table" align="center">
68 
+                   <tr>
69 
+                       <th>Renglones</th>
70 
+                       <th>Especificaciones</th>
71 
+                   </tr>
72 
+                   <script type="text/javascript" src="test.js">
73 
+                       table = document.getElementById("table");
74 
+                       for(var i = 0; i < esp.length; i++)
75 
+                            {
76 
+                            // create a new row
77 
+                            var newRow = table.insertRow(table.length);
78 
+
79 
+                            // create a new cell
80 
+                            var cell = newRow.insertCell(0);
81 
+                            // add value to the cell
82 
+                            cell.innerHTML = renglones[i];
83 
+
84 
+                            // create a new cell
85 
+                            var cell = newRow.insertCell(1);
86 
+                            // add value to the cell
87 
+                            cell.innerHTML = esp[i];
88 
+
89 
+                            }
90 
+                   </script>
91 
+                </table>
92 
+            </ons-page>
93 
+        </template>
94 
+
95 
+        <template id="ferias.html">
96 
+            <ons-page id="Ferias">
97 
+                <p style="text-align: center;">
98 
+                    Aqui estan las ferias.
99 
+                </p>
100 
+            </ons-page>
101 
+        </template>
102 
+
103 
+        <template id="instituto.html">
104 
+            <ons-page id="Instituto">
105 
+                <p style="text-align: center;">
106 
+                    Aqui esta la informacion del instituto.
107 
+                </p>
108 
+            </ons-page>
109 
+        </template>
110 
+
111 
+        <script type="text/javascript" src="cordova.js"></script>
112 
+        <script type="text/javascript" src="js/index.js"></script>
113 
+        <script type="text/javascript" src="json/renglones.json"></script>
114 
+    </body>
115 
+</html>

+ 27
- 0
platforms/browser/www/calendar_files/calendar.html Переглянути файл 

@@ -0,0 +1,27 @@
1 
+<!DOCTYPE html>
2 
+<html>
3 
+<head>
4 
+	<title>Ferias</title>
5 
+	<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
6 
+    <link rel="stylesheet" href="calendar_files/css/demo.css"/>
7 
+    <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
8 
+    <link rel= "stylesheet" href = "onsenui/css/onsenui.css">
9 
+	<link rel = "stylesheet" href = "onsenui/css/onsen-css-components.min.css">
10 
+	<script src = "onsenui/js/onsenui.min.js"></script>
11 
+	<link rel = "stylesheet" href = "searchbar1.css">
12 
+</head>
13 
+<body>
14 
+	<ons-page>
15 
+	<ons-toolbar>
16 
+	          <div class="center">
17 
+	            Ferias
18 
+	          </div>
19 
+	</ons-toolbar>
20 
+
21 
+	<div id = "caleandar" class = "calendar">
22 
+		<script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
23 
+    	<script type="text/javascript" src="calendar_files/js/events.js"></script>
24 
+	</div>
25 
+	</ons-page>
26 
+</body>
27 
+</html>

+ 6
- 0
platforms/browser/www/calendar_files/css/demo.css Переглянути файл 

@@ -0,0 +1,6 @@
1 
+body{
2 
+  font-family: Calibri, sans-serif;
3 
+  font-family: 'Roboto Condensed', sans-serif;
4 
+  color: #333;
5 
+  text-align: center;
6 
+}

+ 111
- 0
platforms/browser/www/calendar_files/css/theme1.css Переглянути файл 

@@ -0,0 +1,111 @@
1 
+.cld-main{
2 
+  width: 330px;
3 
+}
4 
+.cld-main a{
5 
+  color: #333;
6 
+  font-weight: bold;
7 
+}
8 
+  .cld-datetime{
9 
+    position: relative;
10 
+    width: 66%;
11 
+    min-width: 100px;
12 
+    max-width: 300px;
13 
+    margin: auto;
14 
+    overflow: hidden;
15 
+  }
16 
+  .cld-datetime .today{
17 
+    position: relative;
18 
+    float: left;
19 
+    width: calc(100% - 40px);
20 
+    margin: auto;
21 
+    text-align: center;
22 
+  }
23 
+  .cld-nav{
24 
+    position: relative;
25 
+    width: 20px;
26 
+    height: 20px;
27 
+    margin-top: 2px;
28 
+  }
29 
+  .cld-nav:hover{
30 
+    cursor: pointer;
31 
+  }
32 
+  .cld-nav:hover svg{
33 
+      fill: #666;
34 
+  }
35 
+  .cld-rwd{
36 
+    float: left;
37 
+  }
38 
+  .cld-fwd{
39 
+    float: right;
40 
+  }
41 
+    .cld-nav svg:hover{
42 
+
43 
+    }
44 
+.cld-labels, .cld-days{
45 
+  padding-left: 0;
46 
+}
47 
+  .cld-label, .cld-day{
48 
+    display: inline-block;
49 
+    width: 14.28%;
50 
+    text-align: center;
51 
+  }
52 
+  .cld-day.today .cld-number{
53 
+    display: inline-block;
54 
+    height: 20px;
55 
+    width: 20px;
56 
+    border-radius: 50px;
57 
+    background: #666;
58 
+    color: #fff;
59 
+  }
60 
+  .cld-day.disableDay{
61 
+    opacity: 0.5;
62 
+  }
63 
+  .cld-day.nextMonth, .cld-day.prevMonth{
64 
+    opacity: 0.33;
65 
+  }
66 
+    .cld-number{
67 
+      position: relative;
68 
+      margin: 5px;
69 
+      padding: 5px;
70 
+    }
71 
+      .cld-title{
72 
+        position: absolute;
73 
+        z-index: 5;
74 
+        display: none;
75 
+        top: 30px;
76 
+        left: 0;
77 
+        padding: 5px 10px;
78 
+        background: #fff;
79 
+        white-space: nowrap;
80 
+        border: 1px solid #ccc;
81 
+        border-radius: 5px;
82 
+        font-size: 12px;
83 
+      }
84 
+      .cld-number:hover .cld-title{
85 
+        display: block;
86 
+      }
87 
+      .cld-title::before{
88 
+        content: '';
89 
+        position: absolute;
90 
+        top: -7.5px; left: 7.5px;
91 
+        width: 0;
92 
+        height: 0;
93 
+        border-left: 7.5px solid transparent;
94 
+        border-right: 7.5px solid transparent;
95 
+
96 
+        border-bottom: 7.5px solid #ccc;
97 
+      }
98 
+      .cld-number.eventday{
99 
+        display: inline-block;
100 
+        height: 20px;
101 
+        width: 20px;
102 
+        border-radius: 50px;
103 
+        border: 1px solid #999;
104 
+      }
105 
+      .cld-number.eventday:hover{
106 
+        cursor: pointer;
107 
+        background: #eee;
108 
+      }
109 
+      .today .cld-number.eventday:hover{
110 
+        background: #888;
111 
+      }

+ 111
- 0
platforms/browser/www/calendar_files/css/theme2.css Переглянути файл 

@@ -0,0 +1,111 @@
1 
+.cld-main{
2 
+  width: 200px;
3 
+  text-align: center;
4 
+}
5 
+.cld-main a{
6 
+  color: #0080FF;
7 
+}
8 
+.cld-main svg{
9 
+  fill: #0080FF;
10 
+}
11 
+  .cld-datetime{
12 
+    position: relative;
13 
+    width: 66%;
14 
+    min-width: 100px;
15 
+    max-width: 300px;
16 
+    margin: auto;
17 
+    overflow: hidden;
18 
+  }
19 
+  .cld-datetime .today{
20 
+    position: relative;
21 
+    float: left;
22 
+    width: calc(100% - 40px);
23 
+    margin: auto;
24 
+    text-align: center;
25 
+  }
26 
+  .cld-nav{
27 
+    position: relative;
28 
+    width: 20px;
29 
+    height: 20px;
30 
+    margin-top: 2px;
31 
+  }
32 
+  .cld-nav:hover{
33 
+    cursor: pointer;
34 
+  }
35 
+  .cld-nav:hover svg{
36 
+      fill: #005EFF;
37 
+  }
38 
+  .cld-rwd{
39 
+    float: left;
40 
+  }
41 
+  .cld-fwd{
42 
+    float: right;
43 
+  }
44 
+    .cld-nav svg:hover{
45 
+
46 
+    }
47 
+.cld-labels, .cld-days{
48 
+  padding-left: 0;
49 
+}
50 
+  .cld-label, .cld-day{
51 
+    box-sizing: border-box;
52 
+    display: inline-block;
53 
+    width: 14.28%;
54 
+    text-align: center;
55 
+  }
56 
+  .cld-day{
57 
+    border: 1px solid #eee;
58 
+  }
59 
+  .cld-day.today .cld-number{
60 
+    background: #0080FF;
61 
+    color: #fff;
62 
+  }
63 
+  .cld-day.disableDay{
64 
+    opacity: 0.5;
65 
+  }
66 
+  .cld-day.nextMonth, .cld-day.prevMonth{
67 
+    opacity: 0.33;
68 
+  }
69 
+    .cld-number{
70 
+      position: relative;
71 
+      margin: 0;
72 
+      padding: 10px;
73 
+    }
74 
+      .cld-title{
75 
+        position: absolute;
76 
+        z-index: 5;
77 
+        display: none;
78 
+        top: 35px;
79 
+        left: 0;
80 
+        padding: 5px 10px;
81 
+        background: #fff;
82 
+        white-space: nowrap;
83 
+        border: 1px solid #ccc;
84 
+        border-radius: 5px;
85 
+        font-size: 12px;
86 
+      }
87 
+      .cld-number:hover .cld-title{
88 
+        display: block;
89 
+      }
90 
+      .cld-title::before{
91 
+        content: '';
92 
+        position: absolute;
93 
+        top: -7.5px; left: 10px;
94 
+        width: 0;
95 
+        height: 0;
96 
+        border-left: 7.5px solid transparent;
97 
+        border-right: 7.5px solid transparent;
98 
+
99 
+        border-bottom: 7.5px solid #ccc;
100 
+      }
101 
+      .cld-number.eventday{
102 
+        font-weight: bold;
103 
+        color: #0080FF;
104 
+      }
105 
+      .cld-number.eventday:hover{
106 
+        cursor: pointer;
107 
+        background: #eee;
108 
+      }
109 
+      .today .cld-number.eventday:hover{
110 
+        background: #005EFF;
111 
+      }

+ 95
- 0
platforms/browser/www/calendar_files/css/theme3.css Переглянути файл 

@@ -0,0 +1,95 @@
1 
+.cld-main{
2 
+  width: 660px;
3 
+  text-align: center;
4 
+}
5 
+.cld-main a{
6 
+  color: #7B00FF;
7 
+}
8 
+  .cld-datetime{
9 
+    position: relative;
10 
+    width: 66%;
11 
+    min-width: 100px;
12 
+    max-width: 300px;
13 
+    margin: auto;
14 
+    overflow: hidden;
15 
+  }
16 
+  .cld-datetime .today{
17 
+    position: relative;
18 
+    float: left;
19 
+    width: calc(100% - 40px);
20 
+    margin: auto;
21 
+    text-align: center;
22 
+  }
23 
+  .cld-nav{
24 
+    position: relative;
25 
+    width: 20px;
26 
+    height: 20px;
27 
+    margin-top: 2px;
28 
+  }
29 
+  .cld-nav:hover{
30 
+    cursor: pointer;
31 
+  }
32 
+  .cld-nav:hover svg{
33 
+      fill: #666;
34 
+  }
35 
+  .cld-rwd{
36 
+    float: left;
37 
+  }
38 
+  .cld-fwd{
39 
+    float: right;
40 
+  }
41 
+    .cld-nav svg:hover{
42 
+
43 
+    }
44 
+.cld-labels, .cld-days{
45 
+  padding-left: 0;
46 
+}
47 
+  .cld-label, .cld-day{
48 
+    box-sizing: border-box;
49 
+    display: inline-block;
50 
+    width: 14.28%;
51 
+    text-align: center;
52 
+  }
53 
+  .cld-day{
54 
+    display: block;
55 
+    float: left;
56 
+    position: relative;
57 
+    margin: 0;
58 
+    padding: 5px;
59 
+    height: 66px;
60 
+    border: 1px solid #ddd;
61 
+    overflow-y: auto;
62 
+  }
63 
+  .cld-day.clickable:hover{
64 
+    cursor: pointer;
65 
+  }
66 
+  .cld-day.today{
67 
+    border: 1px solid #7B00FF;
68 
+  }
69 
+  .cld-day.disableDay{
70 
+    opacity: 0.5;
71 
+  }
72 
+  .cld-day.nextMonth, .cld-day.prevMonth{
73 
+    opacity: 0.33;
74 
+  }
75 
+    .cld-number{
76 
+      margin: 0;
77 
+      text-align: left;
78 
+    }
79 
+      .cld-title{
80 
+        font-size: 10px;
81 
+        display: block;
82 
+        margin: 0;
83 
+        font-weight: normal;
84 
+      }
85 
+      .cld-day:hover{
86 
+        background: #eee;
87 
+      }
88 
+      .cld-number.eventday{
89 
+        font-weight: bold;
90 
+      }
91 
+      .cld-number.eventday:hover{
92 
+        background: #eee;
93 
+      }
94 
+      .today .cld-number.eventday:hover{
95 
+      }

+ 299
- 0
platforms/browser/www/calendar_files/js/caleandar.js Переглянути файл 

@@ -0,0 +1,299 @@
1 
+/*
2 
+  Author: Jack Ducasse;
3 
+  Version: 0.1.0;
4 
+  (◠‿◠✿)
5 
+*/
6 
+var Calendar = function(model, options, date){
7 
+  // Default Values
8 
+  this.Options = {
9 
+    Color: '',
10 
+    LinkColor: '',
11 
+    NavShow: true,
12 
+    NavVertical: false,
13 
+    NavLocation: '',
14 
+    DateTimeShow: true,
15 
+    DateTimeFormat: 'mmm, yyyy',
16 
+    DatetimeLocation: '',
17 
+    EventClick: '',
18 
+    EventTargetWholeDay: false,
19 
+    DisabledDays: [],
20 
+    ModelChange: model
21 
+  };
22 
+  // Overwriting default values
23 
+  for(var key in options){
24 
+    this.Options[key] = typeof options[key]=='string'?options[key].toLowerCase():options[key];
25 
+  }
26 
+
27 
+  model?this.Model=model:this.Model={};
28 
+  this.Today = new Date();
29 
+
30 
+  this.Selected = this.Today
31 
+  this.Today.Month = this.Today.getMonth();
32 
+  this.Today.Year = this.Today.getFullYear();
33 
+  if(date){this.Selected = date}
34 
+  this.Selected.Month = this.Selected.getMonth();
35 
+  this.Selected.Year = this.Selected.getFullYear();
36 
+
37 
+  this.Selected.Days = new Date(this.Selected.Year, (this.Selected.Month + 1), 0).getDate();
38 
+  this.Selected.FirstDay = new Date(this.Selected.Year, (this.Selected.Month), 1).getDay();
39 
+  this.Selected.LastDay = new Date(this.Selected.Year, (this.Selected.Month + 1), 0).getDay();
40 
+
41 
+  this.Prev = new Date(this.Selected.Year, (this.Selected.Month - 1), 1);
42 
+  if(this.Selected.Month==0){this.Prev = new Date(this.Selected.Year-1, 11, 1);}
43 
+  this.Prev.Days = new Date(this.Prev.getFullYear(), (this.Prev.getMonth() + 1), 0).getDate();
44 
+};
45 
+
46 
+function createCalendar(calendar, element, adjuster){
47 
+  if(typeof adjuster !== 'undefined'){
48 
+    var newDate = new Date(calendar.Selected.Year, calendar.Selected.Month + adjuster, 1);
49 
+    calendar = new Calendar(calendar.Model, calendar.Options, newDate);
50 
+    element.innerHTML = '';
51 
+  }else{
52 
+    for(var key in calendar.Options){
53 
+      typeof calendar.Options[key] != 'function' && typeof calendar.Options[key] != 'object' && calendar.Options[key]?element.className += " " + key + "-" + calendar.Options[key]:0;
54 
+    }
55 
+  }
56 
+  var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
57 
+
58 
+  function AddSidebar(){
59 
+    var sidebar = document.createElement('div');
60 
+    sidebar.className += 'cld-sidebar';
61 
+
62 
+    var monthList = document.createElement('ul');
63 
+    monthList.className += 'cld-monthList';
64 
+
65 
+    for(var i = 0; i < months.length - 3; i++){
66 
+      var x = document.createElement('li');
67 
+      x.className += 'cld-month';
68 
+      var n = i - (4 - calendar.Selected.Month);
69 
+      // Account for overflowing month values
70 
+      if(n<0){n+=12;}
71 
+      else if(n>11){n-=12;}
72 
+      // Add Appropriate Class
73 
+      if(i==0){
74 
+        x.className += ' cld-rwd cld-nav';
75 
+        x.addEventListener('click', function(){
76 
+          typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
77 
+          createCalendar(calendar, element, -1);});
78 
+        x.innerHTML += '<svg height="15" width="15" viewBox="0 0 100 75" fill="rgba(255,255,255,0.5)"><polyline points="0,75 100,75 50,0"></polyline></svg>';
79 
+      }
80 
+      else if(i==months.length - 4){
81 
+        x.className += ' cld-fwd cld-nav';
82 
+        x.addEventListener('click', function(){
83 
+          typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
84 
+          createCalendar(calendar, element, 1);} );
85 
+        x.innerHTML += '<svg height="15" width="15" viewBox="0 0 100 75" fill="rgba(255,255,255,0.5)"><polyline points="0,0 100,0 50,75"></polyline></svg>';
86 
+      }
87 
+      else{
88 
+        if(i < 4){x.className += ' cld-pre';}
89 
+        else if(i > 4){x.className += ' cld-post';}
90 
+        else{x.className += ' cld-curr';}
91 
+
92 
+        //prevent losing var adj value (for whatever reason that is happening)
93 
+        (function () {
94 
+          var adj = (i-4);
95 
+          //x.addEventListener('click', function(){createCalendar(calendar, element, adj);console.log('kk', adj);} );
96 
+          x.addEventListener('click', function(){
97 
+            typeof calendar.Options.ModelChange == 'function'?calendar.Model = calendar.Options.ModelChange():calendar.Model = calendar.Options.ModelChange;
98 
+            createCalendar(calendar, element, adj);} );
99 
+          x.setAttribute('style', 'opacity:' + (1 - Math.abs(adj)/4));
100 
+          x.innerHTML += months[n].substr(0,3);
101 
+        }()); // immediate invocation
102 
+
103 
+        if(n==0){
104 
+          var y = document.createElement('li');
105 
+          y.className += 'cld-year';
106 
+          if(i<5){
107 
+            y.innerHTML += calendar.Selected.Year;
108 
+          }else{
109 
+            y.innerHTML += calendar.Selected.Year + 1;
110 
+          }
111 
+          monthList.appendChild(y);
112 
+        }
113 
+      }
114 
+      monthList.appendChild(x);
115 
+    }
116 
+    sidebar.appendChild(monthList);
117 
+    if(calendar.Options.NavLocation){
118 
+      document.getElementById(calendar.Options.NavLocation).innerHTML = "";
119 
+      document.getElementById(calendar.Options.NavLocation).appendChild(sidebar);
120 
+    }
121 
+    else{element.appendChild(sidebar);}
122 
+  }
123 
+
124 
+  var mainSection = document.createElement('div');
125 
+  mainSection.className += "cld-main";
126 
+
127 
+  function AddDateTime(){
128 
+      var datetime = document.createElement('div');
129 
+      datetime.className += "cld-datetime";
130 
+      if(calendar.Options.NavShow && !calendar.Options.NavVertical){
131 
+        var rwd = document.createElement('div');
132 
+        rwd.className += " cld-rwd cld-nav";
133 
+        rwd.addEventListener('click', function(){createCalendar(calendar, element, -1);} );
134 
+        rwd.innerHTML = '<svg height="15" width="15" viewBox="0 0 75 100" fill="rgba(0,0,0,0.5)"><polyline points="0,50 75,0 75,100"></polyline></svg>';
135 
+        datetime.appendChild(rwd);
136 
+      }
137 
+      var today = document.createElement('div');
138 
+      today.className += ' today';
139 
+      today.innerHTML = months[calendar.Selected.Month] + ", " + calendar.Selected.Year;
140 
+      datetime.appendChild(today);
141 
+      if(calendar.Options.NavShow && !calendar.Options.NavVertical){
142 
+        var fwd = document.createElement('div');
143 
+        fwd.className += " cld-fwd cld-nav";
144 
+        fwd.addEventListener('click', function(){createCalendar(calendar, element, 1);} );
145 
+        fwd.innerHTML = '<svg height="15" width="15" viewBox="0 0 75 100" fill="rgba(0,0,0,0.5)"><polyline points="0,0 75,50 0,100"></polyline></svg>';
146 
+        datetime.appendChild(fwd);
147 
+      }
148 
+      if(calendar.Options.DatetimeLocation){
149 
+        document.getElementById(calendar.Options.DatetimeLocation).innerHTML = "";
150 
+        document.getElementById(calendar.Options.DatetimeLocation).appendChild(datetime);
151 
+      }
152 
+      else{mainSection.appendChild(datetime);}
153 
+  }
154 
+
155 
+  function AddLabels(){
156 
+    var labels = document.createElement('ul');
157 
+    labels.className = 'cld-labels';
158 
+    var labelsList = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
159 
+    for(var i = 0; i < labelsList.length; i++){
160 
+      var label = document.createElement('li');
161 
+      label.className += "cld-label";
162 
+      label.innerHTML = labelsList[i];
163 
+      labels.appendChild(label);
164 
+    }
165 
+    mainSection.appendChild(labels);
166 
+  }
167 
+  function AddDays(){
168 
+    // Create Number Element
169 
+    function DayNumber(n){
170 
+      var number = document.createElement('p');
171 
+      number.className += "cld-number";
172 
+      number.innerHTML += n;
173 
+      return number;
174 
+    }
175 
+    var days = document.createElement('ul');
176 
+    days.className += "cld-days";
177 
+    // Previous Month's Days
178 
+    for(var i = 0; i < (calendar.Selected.FirstDay); i++){
179 
+      var day = document.createElement('li');
180 
+      day.className += "cld-day prevMonth";
181 
+      //Disabled Days
182 
+      var d = i%7;
183 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
184 
+        if(d==calendar.Options.DisabledDays[q]){
185 
+          day.className += " disableDay";
186 
+        }
187 
+      }
188 
+
189 
+      var number = DayNumber((calendar.Prev.Days - calendar.Selected.FirstDay) + (i+1));
190 
+      day.appendChild(number);
191 
+
192 
+      days.appendChild(day);
193 
+    }
194 
+    // Current Month's Days
195 
+    for(var i = 0; i < calendar.Selected.Days; i++){
196 
+      var day = document.createElement('li');
197 
+      day.className += "cld-day currMonth";
198 
+      //Disabled Days
199 
+      var d = (i + calendar.Selected.FirstDay)%7;
200 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
201 
+        if(d==calendar.Options.DisabledDays[q]){
202 
+          day.className += " disableDay";
203 
+        }
204 
+      }
205 
+      var number = DayNumber(i+1);
206 
+      // Check Date against Event Dates
207 
+      for(var n = 0; n < calendar.Model.length; n++){
208 
+        var evDate = calendar.Model[n].Date;
209 
+        var toDate = new Date(calendar.Selected.Year, calendar.Selected.Month, (i+1));
210 
+        if(evDate.getTime() == toDate.getTime()){
211 
+          number.className += " eventday";
212 
+          var title = document.createElement('span');
213 
+          title.className += "cld-title";
214 
+          if(typeof calendar.Model[n].Link == 'function' || calendar.Options.EventClick){
215 
+            var a = document.createElement('a');
216 
+            a.setAttribute('href', '#');
217 
+            a.innerHTML += calendar.Model[n].Title;
218 
+            if(calendar.Options.EventClick){
219 
+              var z = calendar.Model[n].Link;
220 
+              if(typeof calendar.Model[n].Link != 'string'){
221 
+                  a.addEventListener('click', calendar.Options.EventClick.bind.apply(calendar.Options.EventClick, [null].concat(z)) );
222 
+                  if(calendar.Options.EventTargetWholeDay){
223 
+                    day.className += " clickable";
224 
+                    day.addEventListener('click', calendar.Options.EventClick.bind.apply(calendar.Options.EventClick, [null].concat(z)) );
225 
+                  }
226 
+              }else{
227 
+                a.addEventListener('click', calendar.Options.EventClick.bind(null, z) );
228 
+                if(calendar.Options.EventTargetWholeDay){
229 
+                  day.className += " clickable";
230 
+                  day.addEventListener('click', calendar.Options.EventClick.bind(null, z) );
231 
+                }
232 
+              }
233 
+            }else{
234 
+              a.addEventListener('click', calendar.Model[n].Link);
235 
+              if(calendar.Options.EventTargetWholeDay){
236 
+                day.className += " clickable";
237 
+                day.addEventListener('click', calendar.Model[n].Link);
238 
+              }
239 
+            }
240 
+            title.appendChild(a);
241 
+          }else{
242 
+            title.innerHTML += '<a href="' + calendar.Model[n].Link + '">' + calendar.Model[n].Title + '</a>';
243 
+          }
244 
+          number.appendChild(title);
245 
+        }
246 
+      }
247 
+      day.appendChild(number);
248 
+      // If Today..
249 
+      if((i+1) == calendar.Today.getDate() && calendar.Selected.Month == calendar.Today.Month && calendar.Selected.Year == calendar.Today.Year){
250 
+        day.className += " today";
251 
+      }
252 
+      days.appendChild(day);
253 
+    }
254 
+    // Next Month's Days
255 
+    // Always same amount of days in calander
256 
+    var extraDays = 13;
257 
+    if(days.children.length>35){extraDays = 6;}
258 
+    else if(days.children.length<29){extraDays = 20;}
259 
+
260 
+    for(var i = 0; i < (extraDays - calendar.Selected.LastDay); i++){
261 
+      var day = document.createElement('li');
262 
+      day.className += "cld-day nextMonth";
263 
+      //Disabled Days
264 
+      var d = (i + calendar.Selected.LastDay + 1)%7;
265 
+      for(var q = 0; q < calendar.Options.DisabledDays.length; q++){
266 
+        if(d==calendar.Options.DisabledDays[q]){
267 
+          day.className += " disableDay";
268 
+        }
269 
+      }
270 
+
271 
+      var number = DayNumber(i+1);
272 
+      day.appendChild(number);
273 
+
274 
+      days.appendChild(day);
275 
+    }
276 
+    mainSection.appendChild(days);
277 
+  }
278 
+  if(calendar.Options.Color){
279 
+    mainSection.innerHTML += '<style>.cld-main{color:' + calendar.Options.Color + ';}</style>';
280 
+  }
281 
+  if(calendar.Options.LinkColor){
282 
+    mainSection.innerHTML += '<style>.cld-title a{color:' + calendar.Options.LinkColor + ';}</style>';
283 
+  }
284 
+  element.appendChild(mainSection);
285 
+
286 
+  if(calendar.Options.NavShow && calendar.Options.NavVertical){
287 
+    AddSidebar();
288 
+  }
289 
+  if(calendar.Options.DateTimeShow){
290 
+    AddDateTime();
291 
+  }
292 
+  AddLabels();
293 
+  AddDays();
294 
+}
295 
+
296 
+function caleandar(el, data, settings){
297 
+  var obj = new Calendar(data, settings);
298 
+  createCalendar(obj, el);
299 
+}

+ 1
- 0
platforms/browser/www/calendar_files/js/caleandar.min.js
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 8
- 0
platforms/browser/www/calendar_files/js/events.js Переглянути файл 

@@ -0,0 +1,8 @@
1 
+var events = [
2 
+  {'Date': new Date(2019, 9, 7), 'Title': 'Doctor appointment at 3:25pm.'},
3 
+  {'Date': new Date(2019, 9, 7), 'Title': 'New Garfield movie comes out!', 'Link': 'https://garfield.com'},
4 
+  {'Date': new Date(2019, 9, 27), 'Title': '25 year anniversary', 'Link': 'https://www.google.com.au/#q=anniversary+gifts'},
5 
+];
6 
+var settings = {};
7 
+var element = document.getElementById('caleandar');
8 
+caleandar(element, events, settings);

+ 20
- 0
platforms/browser/www/css/index.css Переглянути файл 

@@ -105,3 +105,23 @@ h1 {
105 105 
     animation:fade 3000ms infinite;
106 106 
     -webkit-animation:fade 3000ms infinite;
107 107 
 }
108 
+
109 
+a:link {
110 
+  text-decoration: none;
111 
+    color: black;
112 
+}
113 
+
114 
+a:visited {
115 
+  text-decoration: none;
116 
+    color: black;
117 
+}
118 
+
119 
+a:hover {
120 
+  text-decoration: none;
121 
+    color: black;
122 
+}
123 
+
124 
+a:active {
125 
+  text-decoration: none;
126 
+    color: black;
127 
+}

+ 12
- 0
platforms/browser/www/css/searchbar1.css Переглянути файл 

@@ -0,0 +1,12 @@
1 
+ons-toolbar ~ .page__content{
2 
+    margin-top: 45px;
3 
+}
4 
+.search-bar {
5 
+    width: 100%;
6 
+    position: fixed;
7 
+    display: block;
8 
+    margin-top: -45px;
9 
+}
10 
+.after-search-bar {
11 
+    margin-top: -10px;
12 
+}

BIN
platforms/browser/www/img/ICPlogo.png Переглянути файл


BIN
platforms/browser/www/img/facebook.png Переглянути файл


BIN
platforms/browser/www/img/instagram.png Переглянути файл


BIN
platforms/browser/www/img/twitter.png Переглянути файл


BIN
platforms/browser/www/img/youtube.png Переглянути файл


+ 115
- 11
platforms/browser/www/index.html Переглянути файл 

@@ -28,23 +28,33 @@
28 28 
             * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29 29 
                 * Enable inline JS: add 'unsafe-inline' to default-src
30 30 
         -->
31 
-        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
31 
+        <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:;">
32 
+        <!--these three for the calendar-->
33 
+        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
34 
+        <link rel="stylesheet" href="calendar_files/css/demo.css"/>
35 
+        <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
36 
+        <!--this is for the search bar-->
37 
+        <link rel = "stylesheet" href = "css/searchbar1.css">
38 
+
32 39 
         <meta name="format-detection" content="telephone=no">
33 40 
         <meta name="msapplication-tap-highlight" content="no">
34 41 
         <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
35 42 
         <link rel="stylesheet" type="text/css" href="css/index.css">
36 
-        <title>Cultura</title>
37 43 
         <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
38 44 
         <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
39 45 
         <script src="lib/OnsenUI/js/onsenui.min.js"></script>
46 
+
40 47 
     </head>
41 48 
     <body>
42 49
50 
+        <ons-navegator id="myNavigator">
43 51 
         <ons-page>
52 
+
44 53 
             <ons-toolbar>
45 54 
                 <div class="center">Cultura</div>
46 55 
             </ons-toolbar>
47 56
57 
+
48 58 
             <ons-tabbar swipeable position="auto">
49 59 
                 <ons-tab page="home.html" label="Hogar" active></ons-tab>
50 60 
                 <ons-tab page="artesania.html" label="Artesanias"></ons-tab>
 
@@ -52,40 +62,134 @@
52 62 
                 <ons-tab page="instituto.html" label="Instituto"></ons-tab>
53 63 
             </ons-tabbar>
54 64 
         </ons-page>
65 
+        </ons-navegator>
66 
+
67 
+        <!--<ons-toolbar>
68 
+                <div class="center">Cultura</div>
69 
+                style="background-color:#ABBC5D"
70 
+        </ons-toolbar>-->
71 
+
55 72
56 73 
         <template id="home.html">
57 74 
             <ons-page id="Hogar">
58 75 
                 <p style="text-align: center;">
59 
-                    Este es el hogar.
76 
+			     Pantalla Principal
60 77 
                 </p>
61 78 
             </ons-page>
62 79 
         </template>
63 80
64 81 
         <template id="artesania.html">
65 
-            <ons-page id="Artesanias">
66 
-                <p style="text-align: center;">
67 
-                    Aqui estan las artesanias.
68 
-                </p>
82 
+            <ons-page id="artesania">
83 
+
84 
+                <div class="search-bar">
85 
+                     <p style="text-align: center; margin-top: 10px;">
86 
+                        <ons-search-input placeholder="Search" onchange="ons.notification.alert('Searched for: ' + this.value)" style="width: 96%; margin: 6px auto 6px auto;"></ons-search-input>
87 
+                    </p>
88 
+                </div>
89 
+
90 
+                <div>
91 
+                <ons-scroller>
92 
+                    <!--<table id="table" align="center">
93 
+                        <tr>
94 
+                            <th>Renglones</th>
95 
+                            <th>Especificaciones</th>
96 
+                        </tr>
97 
+                    <script type="text/javascript" src="js/test.js"></script>
98 
+                    </table>     -->
99 
+
100 
+                    <ons-list>
101 
+                    <ons-list-header>Renglones</ons-list-header>
102 
+                    <!--<ons-list-item modifier="chevron" id="myNavigator.pushPage('pageNav1.html')">Madera</ons-list-item>-->
103 
+                    <ons-list-item><a href="madera.html">Madera</a></ons-list-item>
104 
+                    <ons-list-item>Labores en aguja</ons-list-item>
105 
+                    <ons-list-item>Textiles</ons-list-item>
106 
+                    <ons-list-item>Barro</ons-list-item>
107 
+                    <ons-list-item>Instrumentos Típicos</ons-list-item>
108 
+                    <ons-list-item>Juguetes tradicionales</ons-list-item>
109 
+                    <ons-list-item>Fibras</ons-list-item>
110 
+                    <ons-list-item>Caretas</ons-list-item>
111 
+                    <ons-list-item>Cuero</ons-list-item>
112 
+                    <ons-list-item>Metal</ons-list-item>
113 
+                    <ons-list-item>Piedras</ons-list-item>
114 
+                    <ons-list-item>Papel</ons-list-item>
115 
+                    <ons-list-item>Bambú</ons-list-item>
116 
+                    <ons-list-item>Cristal</ons-list-item>
117 
+                    <ons-list-item>Higüera</ons-list-item>
118 
+                    <ons-list-item>Desechos Marinos</ons-list-item>
119 
+                    <ons-list-item>Porcelanicrón</ons-list-item>
120 
+                    <ons-list-item>Tabacos</ons-list-item>
121 
+                    <ons-list-item>Semillas</ons-list-item>
122 
+                    <ons-list-item>Aromatización</ons-list-item>
123 
+                    <ons-list-item>Dulces Típicos</ons-list-item>
124 
+                    </ons-list>
125 
+                </ons-scroller>
126 
+                </div>
69 127 
             </ons-page>
70 128 
         </template>
71 129
130 
+        <!--<template id="pageNav1.html">
131 
+        <ons-page id="pageNav1">
132 
+            <ons-toolbar>
133 
+            <div class="left">
134 
+                <ons-back-button>Back</ons-back-button>
135 
+            </div>
136 
+      <     div class="center"></div>
137 
+            </ons-toolbar>
138 
+            <p style="text-align: center">
139 
+            Use the VOnsBackButton
140 
+            </p>
141 
+        </ons-page>
142 
+        </template>-->
143 
+
72 144 
         <template id="ferias.html">
73 145 
             <ons-page id="Ferias">
74 
-                <p style="text-align: center;">
75 
-                    Aqui estan las ferias.
76 
-                </p>
146 
+
147 
+                <div id = "caleandar" class = "calendar" style="margin-top: 50px;">
148 
+                    <script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
149 
+                    <script type="text/javascript" src="calendar_files/js/events.js"></script>
150 
+                </div>
77 151 
             </ons-page>
78 152 
         </template>
79 153
80 154 
         <template id="instituto.html">
81 155 
             <ons-page id="Instituto">
82 156 
                 <p style="text-align: center;">
83 
-                    Aqui esta la informacion del instituto.
157 
+
158 
+		<h1>Instituto de Cultura Puertorriqueña</h1>
159 
+		<h3>Ven, descubre lo que nuestra riqueza cultural puertorriqueña tiene para tí.<br> Disfrútala, es tu identidad.
160 
+		</h3>
161 
+
162 
+		<body>
163 
+		<br>
164 
+		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.
165 
+		<br><br>
166 
+		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.
167 
+		<br><br>
168 
+		Prof. Carlos R. Ruiz Cortés<br>
169 
+		Director Ejecutivo<br>
170 
+		Instituto de Cultura Puertorriqueña<br>
171 
+		<br><br>
172 
+        </body>
173 
+
174 
+
175 
+		Visita nuestra <a href="https://www.icp.pr.gov/">Página Web</a> o síguenos en nuestras redes sociales:
176 
+		<a href="https://twitter.com/icppr"><img src="img/twitter.png" alt="Twitter" style="width:35px;height:35px;border:0;">
177 
+		</a>
178 
+		<a href="https://facebook.com/icppr"><img src="img/facebook.png" alt="Facebook" style="width:35px;height:35px;border:0;">
179 
+		</a>
180 
+		<a href="https://youtube.com/user/icppr"><img src="img/youtube.png" alt="Youtube" style="width:35px;height:35px;border:0;">
181 
+		</a>
182 
+		<a href="https://instagram.com/icppr"><img src="img/instagram.png" alt="Instagram" style="width:35px;height:35px;border:0;">
183 
+		</a>
184 
+
185 
+
186 
+
84 187 
                 </p>
85 188 
             </ons-page>
86 189 
         </template>
87 190
88 191 
         <script type="text/javascript" src="cordova.js"></script>
89 192 
         <script type="text/javascript" src="js/index.js"></script>
193 
+        <script type="text/javascript" src="js/link.js"></script>
90 194 
     </body>
91 195 
 </html>

+ 45
- 0
platforms/browser/www/js/link.js Переглянути файл 

@@ -0,0 +1,45 @@
1 
+/*window.fn = {};
2 
+
3 
+window.fn.toggleMenu = function () {
4 
+  document.getElementById('appSplitter').right.toggle();
5 
+};
6 
+
7 
+window.fn.loadView = function (index) {
8 
+  document.getElementById('appTabbar').setActiveTab(index);
9 
+  document.getElementById('sidemenu').close();
10 
+};
11 
+
12 
+window.fn.loadLink = function (url) {
13 
+  window.open(url, '_blank');
14 
+};
15 
+
16 
+window.fn.pushPage = function (page, anim) {
17 
+  if (anim) {
18 
+    document.getElementById('appNavigator').pushPage(page.id, { data: { title: page.title }, animation: anim });
19 
+  } else {
20 
+    document.getElementById('appNavigator').pushPage(page.id, { data: { title: page.title } });
21 
+  }
22 
+};
23 
+
24 
+document.addEventListener('init', function(event) {
25 
+  var page = event.target;
26 
+
27 
+  if (page.id === 'artesania') {
28 
+    page.querySelector('#push-button').onclick = function() {
29 
+      document.querySelector('#myNavigator').pushPage('page1.html', {data: {title: 'Page 1'}});
30 
+    };
31 
+  } else if (page.id === 'page1') {
32 
+    page.querySelector('ons-toolbar .center').innerHTML = page.data.title;
33 
+  }
34 
+});*/
35 
+
36 
+/*document.addEventListener('init', function (event) {
37 
+  if (event.target.id === 'pageNav1') {
38 
+    var title = event.target.data && event.target.data.title ? event.target.data.title : 'Custom Page';
39 
+    event.target.querySelector('ons-toolbar div.center').textContent = title;
40 
+  }
41 
+  if (event.target.id === 'pageNav2') {
42 
+    var cardTitle = event.target.data && event.target.data.cardTitle ? event.target.data.cardTitle : 'Custom Card';
43 
+    event.target.querySelector('ons-card div.title').textContent = cardTitle;
44 
+  }
45 
+});*/

+ 67
- 0
platforms/browser/www/js/test.js Переглянути файл 

@@ -0,0 +1,67 @@
1 
+var request = new XMLHttpRequest()
2 
+
3 
+/*request.open('GET', 'json/renglones.json', true)
4 
+
5 
+request.onload = function() {
6 
+  // begin accessing JSON data here
7 
+  var info = JSON.parse(this.response)
8 
+
9 
+  var table = document.getElementById("table");
10 
+
11 
+    for (var i = 0; i < info.length; i++) {
12 
+
13 
+            tr = table.insertRow(-1);
14 
+
15 
+            for (var j = 0; j < 2; j++) {
16 
+                var tabCell = tr.insertCell(-1);
17 
+                if (j==0) {
18 
+                    tabCell.innerHTML = info[i].Renglones;
19 
+                }
20 
+                else{
21 
+                    tabCell.innerHTML = info[i].Especificaciones;
22 
+                }
23 
+            }
24 
+        }
25 
+    var divContainer = document.getElementById("showData");
26 
+        divContainer.innerHTML = "";
27 
+        divContainer.appendChild(tr);
28 
+
29 
+}*/
30 
+request.open('GET', 'json/MADERA.json', true)
31 
+
32 
+request.onload = function() {
33 
+  // begin accessing JSON data here
34 
+  var info = JSON.parse(this.response)
35 
+
36 
+  var table = document.getElementById("table");
37 
+
38 
+    for (var i = 0; i < info.length; i++) {
39 
+
40 
+            tr = table.insertRow(-1);
41 
+
42 
+            for (var j = 0; j < 5; j++) {
43 
+                var tabCell = tr.insertCell(-1);
44 
+                if (j==0) {
45 
+                    tabCell.innerHTML = info[i].Nombre;
46 
+                }
47 
+                else if (j==1) {
48 
+                    tabCell.innerHTML = info[i].Especificaciones;
49 
+                }
50 
+                else if (j==2) {
51 
+                    tabCell.innerHTML = info[i]["Teléfono 1"];
52 
+                }
53 
+                else if (j==3) {
54 
+                    tabCell.innerHTML = info[i]["E-mail"];
55 
+                }
56 
+                else{
57 
+                    tabCell.innerHTML = info[i].Municipio
58 
+                }
59 
+            }
60 
+        }
61 
+    var divContainer = document.getElementById("showData");
62 
+        divContainer.innerHTML = "";
63 
+        divContainer.appendChild(tr);
64 
+}
65 
+
66 
+
67 
+request.send()

+ 1
- 0
platforms/browser/www/json/MADERA.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 1
- 0
platforms/browser/www/json/renglones.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 54
- 0
platforms/browser/www/madera.html Переглянути файл 

@@ -0,0 +1,54 @@
1 
+<html>
2 
+    <head>
3 
+        <!--
4 
+        Customize this policy to fit your own app's needs. For more guidance, see:
5 
+            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
6 
+        Some notes:
7 
+            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
8 
+            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
9 
+            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
10 
+                * Enable inline JS: add 'unsafe-inline' to default-src
11 
+        -->
12 
+        <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:;">
13 
+        <!--these three for the calendar-->
14 
+        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
15 
+        <link rel="stylesheet" href="calendar_files/css/demo.css"/>
16 
+        <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
17 
+        <!--this is for the search bar-->
18 
+        <link rel = "stylesheet" href = "css/searchbar1.css">
19 
+
20 
+        <meta name="format-detection" content="telephone=no">
21 
+        <meta name="msapplication-tap-highlight" content="no">
22 
+        <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
23 
+        <link rel="stylesheet" type="text/css" href="css/index.css">
24 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
25 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
26 
+        <script src="lib/OnsenUI/js/onsenui.min.js"></script>
27 
+
28 
+    </head>
29 
+    <body>
30 
+        <br><br><br><br>
31 
+        <ons-page>
32 
+            <ons-toolbar>
33 
+                <div class="left"><ons-toolbar-button><a href="index.html">Home</a></ons-toolbar-button></div>
34 
+                <div class="center">Cultura</div>
35 
+            </ons-toolbar>
36 
+        <div>
37 
+        <ons-scroller>
38 
+                    <table id="table" align="center" border=1>
39 
+                        <tr>
40 
+                            <th>Nombres</th>
41 
+                            <th>Especificaciones</th>
42 
+                            <th>Teléfono</th>
43 
+                            <th>E-mail</th>
44 
+                            <th>Municipio</th>
45 
+                        </tr>
46 
+                    <script type="text/javascript" src="js/test.js"></script>
47 
+                    </table>
48 
+        </ons-scroller>
49 
+            </div>
50 
+        </ons-page>
51 
+        <script type="text/javascript" src="cordova.js"></script>
52 
+        <script type="text/javascript" src="js/index.js"></script>
53 
+    </body>
54 
+</html>

+ 115
- 0
platforms/browser/www/temp/index.html Переглянути файл 

@@ -0,0 +1,115 @@
1 
+<!DOCTYPE html>
2 
+<!--
3 
+    Licensed to the Apache Software Foundation (ASF) under one
4 
+    or more contributor license agreements.  See the NOTICE file
5 
+    distributed with this work for additional information
6 
+    regarding copyright ownership.  The ASF licenses this file
7 
+    to you under the Apache License, Version 2.0 (the
8 
+    "License"); you may not use this file except in compliance
9 
+    with the License.  You may obtain a copy of the License at
10 
+
11 
+    http://www.apache.org/licenses/LICENSE-2.0
12 
+
13 
+    Unless required by applicable law or agreed to in writing,
14 
+    software distributed under the License is distributed on an
15 
+    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
16 
+     KIND, either express or implied.  See the License for the
17 
+    specific language governing permissions and limitations
18 
+    under the License.
19 
+-->
20 
+<html>
21 
+    <head>
22 
+        <!--
23 
+        Customize this policy to fit your own app's needs. For more guidance, see:
24 
+            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
25 
+        Some notes:
26 
+            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
27 
+            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
28 
+            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29 
+                * Enable inline JS: add 'unsafe-inline' to default-src
30 
+        -->
31 
+
32 
+        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
33 
+        <meta name="format-detection" content="telephone=no">
34 
+        <meta name="msapplication-tap-highlight" content="no">
35 
+        <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
36 
+        <link rel="stylesheet" type="text/css" href="css/index.css">
37 
+        <title>Cultura</title>
38 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
39 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
40 
+        <script src="lib/OnsenUI/js/onsenui.min.js"></script>
41 
+    </head>
42 
+    <body>
43 
+
44 
+        <ons-page>
45 
+            <ons-toolbar>
46 
+                <div class="center">Cultura</div>
47 
+            </ons-toolbar>
48 
+
49 
+            <ons-tabbar swipeable position="auto">
50 
+                <ons-tab page="home.html" label="Hogar" active></ons-tab>
51 
+                <ons-tab page="artesania.html" label="Artesanias"></ons-tab>
52 
+                <ons-tab page="ferias.html" label="Ferias"></ons-tab>
53 
+                <ons-tab page="instituto.html" label="Instituto"></ons-tab>
54 
+            </ons-tabbar>
55 
+        </ons-page>
56 
+
57 
+        <template id="home.html">
58 
+            <ons-page id="Hogar">
59 
+                <p style="text-align: center;">
60 
+                    Este es el hogar.
61 
+                </p>
62 
+            </ons-page>
63 
+        </template>
64 
+
65 
+        <template id="artesania.html">
66 
+            <ons-page id="Artesanias">
67 
+                <table id="table" align="center">
68 
+                   <tr>
69 
+                       <th>Renglones</th>
70 
+                       <th>Especificaciones</th>
71 
+                   </tr>
72 
+                   <script type="text/javascript" src="test.js">
73 
+                       table = document.getElementById("table");
74 
+                       for(var i = 0; i < esp.length; i++)
75 
+                            {
76 
+                            // create a new row
77 
+                            var newRow = table.insertRow(table.length);
78 
+
79 
+                            // create a new cell
80 
+                            var cell = newRow.insertCell(0);
81 
+                            // add value to the cell
82 
+                            cell.innerHTML = renglones[i];
83 
+
84 
+                            // create a new cell
85 
+                            var cell = newRow.insertCell(1);
86 
+                            // add value to the cell
87 
+                            cell.innerHTML = esp[i];
88 
+
89 
+                            }
90 
+                   </script>
91 
+                </table>
92 
+            </ons-page>
93 
+        </template>
94 
+
95 
+        <template id="ferias.html">
96 
+            <ons-page id="Ferias">
97 
+                <p style="text-align: center;">
98 
+                    Aqui estan las ferias.
99 
+                </p>
100 
+            </ons-page>
101 
+        </template>
102 
+
103 
+        <template id="instituto.html">
104 
+            <ons-page id="Instituto">
105 
+                <p style="text-align: center;">
106 
+                    Aqui esta la informacion del instituto.
107 
+                </p>
108 
+            </ons-page>
109 
+        </template>
110 
+
111 
+        <script type="text/javascript" src="cordova.js"></script>
112 
+        <script type="text/javascript" src="js/index.js"></script>
113 
+        <script type="text/javascript" src="json/renglones.json"></script>
114 
+    </body>
115 
+</html>

+ 20
- 0
www/css/index.css Переглянути файл 

@@ -105,3 +105,23 @@ h1 {
105 105 
     animation:fade 3000ms infinite;
106 106 
     -webkit-animation:fade 3000ms infinite;
107 107 
 }
108 
+
109 
+a:link {
110 
+  text-decoration: none;
111 
+    color: black;
112 
+}
113 
+
114 
+a:visited {
115 
+  text-decoration: none;
116 
+    color: black;
117 
+}
118 
+
119 
+a:hover {
120 
+  text-decoration: none;
121 
+    color: black;
122 
+}
123 
+
124 
+a:active {
125 
+  text-decoration: none;
126 
+    color: black;
127 
+}

+ 48
- 27
www/index.html Переглянути файл 

@@ -28,7 +28,7 @@
28 28 
             * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
29 29 
                 * Enable inline JS: add 'unsafe-inline' to default-src
30 30 
         -->
31 
-        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
31 
+        <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:;">
32 32 
         <!--these three for the calendar-->
33 33 
         <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
34 34 
         <link rel="stylesheet" href="calendar_files/css/demo.css"/>
 
@@ -47,11 +47,14 @@
47 47 
     </head>
48 48 
     <body>
49 49
50 
+        <ons-navegator id="myNavigator">
50 51 
         <ons-page>
52 
+
51 53 
             <ons-toolbar>
52 54 
                 <div class="center">Cultura</div>
53 55 
             </ons-toolbar>
54 56
57 
+
55 58 
             <ons-tabbar swipeable position="auto">
56 59 
                 <ons-tab page="home.html" label="Hogar" active></ons-tab>
57 60 
                 <ons-tab page="artesania.html" label="Artesanias"></ons-tab>
 
@@ -59,62 +62,79 @@
59 62 
                 <ons-tab page="instituto.html" label="Instituto"></ons-tab>
60 63 
             </ons-tabbar>
61 64 
         </ons-page>
65 
+        </ons-navegator>
66 
+
62 67
63 68 
         <template id="home.html">
64 69 
             <ons-page id="Hogar">
65 70 
                 <p style="text-align: center;">
66 
-			Pantalla Principal
71 
+			     Pantalla Principal
67 72 
                 </p>
68 73 
             </ons-page>
69 74 
         </template>
70 75
71 76 
         <template id="artesania.html">
72 
-            <ons-page>
73 
-                <ons-toolbar>
74 
-                    <title>Artesanias</title>
75 
-                        <div class="center">
76 
-                            Artesanias
77 
-                        </div>
78 
-                </ons-toolbar>
77 
+            <ons-page id="artesania">
78 
+
79 79 
                 <div class="search-bar">
80 80 
                      <p style="text-align: center; margin-top: 10px;">
81 81 
                         <ons-search-input placeholder="Search" onchange="ons.notification.alert('Searched for: ' + this.value)" style="width: 96%; margin: 6px auto 6px auto;"></ons-search-input>
82 82 
                     </p>
83 83 
                 </div>
84 84
85 
+                <div>
85 86 
                 <ons-scroller>
86 
-                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut sem nulla pharetra diam sit amet nisl. Consectetur purus ut faucibus pulvinar elementum integer enim neque volutpat. Mollis nunc sed id semper risus in hendrerit gravida. Non sodales neque sodales ut etiam sit. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis. Auctor elit sed vulputate mi sit amet mauris commodo. Ac tincidunt vitae semper quis lectus. Laoreet id donec ultrices tincidunt arcu. Massa sapien faucibus et molestie ac feugiat sed lectus vestibulum. Vel risus commodo viverra maecenas accumsan lacus. Elit sed vulputate mi sit amet mauris commodo quis. Enim nulla aliquet porttitor lacus. In arcu cursus euismod quis viverra nibh.
87 
-
88 
-                    Aliquet lectus proin nibh nisl. Ut lectus arcu bibendum at varius vel pharetra vel. Viverra justo nec ultrices dui sapien eget. Quis auctor elit sed vulputate mi sit. Varius vel pharetra vel turpis nunc eget lorem dolor. Semper feugiat nibh sed pulvinar proin gravida hendrerit lectus. Nunc aliquet bibendum enim facilisis gravida neque convallis a cras. Magna ac placerat vestibulum lectus mauris ultrices eros. Fermentum iaculis eu non diam phasellus vestibulum lorem. Lacus suspendisse faucibus interdum posuere lorem ipsum. Posuere morbi leo urna molestie. Augue eget arcu dictum varius duis at. Maecenas accumsan lacus vel facilisis volutpat est velit egestas. Consectetur purus ut faucibus pulvinar elementum integer enim neque volutpat. Non curabitur gravida arcu ac.
89 
-
90 
-                    Sagittis nisl rhoncus mattis rhoncus urna neque viverra justo. Ac orci phasellus egestas tellus. Venenatis tellus in metus vulputate eu scelerisque felis imperdiet proin. Nunc scelerisque viverra mauris in aliquam sem fringilla ut. Dis parturient montes nascetur ridiculus. Auctor neque vitae tempus quam pellentesque nec. Ornare aenean euismod elementum nisi quis eleifend quam adipiscing vitae. Commodo ullamcorper a lacus vestibulum sed arcu non. Tincidunt lobortis feugiat vivamus at. Mattis rhoncus urna neque viverra justo. Sagittis purus sit amet volutpat. Dolor morbi non arcu risus. Donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum arcu. Tellus elementum sagittis vitae et leo duis ut diam quam. Tellus mauris a diam maecenas sed.
91 
-
92 
-                    Risus at ultrices mi tempus imperdiet nulla malesuada pellentesque elit. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Non tellus orci ac auctor augue. Consectetur adipiscing elit duis tristique sollicitudin nibh sit amet commodo. Egestas congue quisque egestas diam in arcu cursus euismod quis. Id eu nisl nunc mi ipsum. Ipsum dolor sit amet consectetur adipiscing elit duis. Praesent semper feugiat nibh sed pulvinar proin gravida. Scelerisque eu ultrices vitae auctor eu. Sed enim ut sem viverra aliquet. Ac tincidunt vitae semper quis lectus nulla. Sed vulputate mi sit amet mauris. Massa tincidunt nunc pulvinar sapien et ligula. Imperdiet massa tincidunt nunc pulvinar sapien et. Vulputate odio ut enim blandit volutpat maecenas volutpat. Aliquam nulla facilisi cras fermentum odio. Metus vulputate eu scelerisque felis imperdiet proin.
93 
-
94 
-                    Faucibus et molestie ac feugiat sed. Tristique magna sit amet purus gravida quis blandit turpis cursus. Nulla facilisi nullam vehicula ipsum a arcu cursus vitae. Sed euismod nisi porta lorem. Odio facilisis mauris sit amet massa vitae. Nisl pretium fusce id velit ut tortor pretium viverra. Id semper risus in hendrerit gravida. Velit ut tortor pretium viverra suspendisse potenti nullam. Neque volutpat ac tincidunt vitae semper. Elementum curabitur vitae nunc sed velit dignissim sodales ut eu. Nulla aliquet enim tortor at auctor urna nunc. In egestas erat imperdiet sed euismod nisi porta. Diam sit amet nisl suscipit adipiscing bibendum est. Risus in hendrerit gravida rutrum quisque non tellus orci. Netus et malesuada fames ac turpis. Ultricies tristique nulla aliquet enim tortor at auctor urna. Ante in nibh mauris cursus mattis molestie. Lectus sit amet est placerat in egestas. Donec ultrices tincidunt arcu non sodales neque. Turpis massa sed elementum tempus egestas sed sed.
87 
+                    <!--<table id="table" align="center">
88 
+                        <tr>
89 
+                            <th>Renglones</th>
90 
+                            <th>Especificaciones</th>
91 
+                        </tr>
92 
+                    <script type="text/javascript" src="js/test.js"></script>
93 
+                    </table>     -->
94 
+
95 
+                    <ons-list>
96 
+                    <ons-list-header>Renglones</ons-list-header>
97 
+                    <ons-list-item><a href="madera.html">Madera</a></ons-list-item>
98 
+                    <ons-list-item>Labores en aguja</ons-list-item>
99 
+                    <ons-list-item>Textiles</ons-list-item>
100 
+                    <ons-list-item>Barro</ons-list-item>
101 
+                    <ons-list-item>Instrumentos Típicos</ons-list-item>
102 
+                    <ons-list-item>Juguetes tradicionales</ons-list-item>
103 
+                    <ons-list-item>Fibras</ons-list-item>
104 
+                    <ons-list-item>Caretas</ons-list-item>
105 
+                    <ons-list-item>Cuero</ons-list-item>
106 
+                    <ons-list-item>Metal</ons-list-item>
107 
+                    <ons-list-item>Piedras</ons-list-item>
108 
+                    <ons-list-item>Papel</ons-list-item>
109 
+                    <ons-list-item>Bambú</ons-list-item>
110 
+                    <ons-list-item>Cristal</ons-list-item>
111 
+                    <ons-list-item>Higüera</ons-list-item>
112 
+                    <ons-list-item>Desechos Marinos</ons-list-item>
113 
+                    <ons-list-item>Porcelanicrón</ons-list-item>
114 
+                    <ons-list-item>Tabacos</ons-list-item>
115 
+                    <ons-list-item>Semillas</ons-list-item>
116 
+                    <ons-list-item>Aromatización</ons-list-item>
117 
+                    <ons-list-item>Dulces Típicos</ons-list-item>
118 
+                    </ons-list>
95 119 
                 </ons-scroller>
120 
+                </div>
96 121 
             </ons-page>
97 122 
         </template>
98 123
99 124 
         <template id="ferias.html">
100 125 
             <ons-page id="Ferias">
101 
-                <ons-toolbar>
102 
-                    <div class="center">
103 
-                        Ferias
104 
-                    </div>
105 
-                </ons-toolbar>
106 
-
107 
-                <div id = "caleandar" class = "calendar">
126 
+
127 
+                <div id = "caleandar" class = "calendar" style="margin-top: 50px;">
108 128 
                     <script type="text/javascript" src="calendar_files/js/caleandar.js"></script>
109 129 
                     <script type="text/javascript" src="calendar_files/js/events.js"></script>
110 130 
                 </div>
111 131 
             </ons-page>
112 132 
         </template>
133 
+
113 134 
         <template id="instituto.html">
114 135 
             <ons-page id="Instituto">
115 136 
                 <p style="text-align: center;">
116 137
117 
-
118 138 
 		<h1>Instituto de Cultura Puertorriqueña</h1>
119 139 
 		<h3>Ven, descubre lo que nuestra riqueza cultural puertorriqueña tiene para tí.<br> Disfrútala, es tu identidad.
120 140 
 		</h3>
 
@@ -129,7 +149,8 @@
129 149 
 		Director Ejecutivo<br>
130 150 
 		Instituto de Cultura Puertorriqueña<br>
131 151 
 		<br><br>
132 
-		</body>
152 
+        </body>
153 
+
133 154
134 155 
 		Visita nuestra <a href="https://www.icp.pr.gov/">Página Web</a> o síguenos en nuestras redes sociales:
135 156 
 		<a href="https://twitter.com/icppr"><img src="img/twitter.png" alt="Twitter" style="width:35px;height:35px;border:0;">

+ 67
- 0
www/js/test.js Переглянути файл 

@@ -0,0 +1,67 @@
1 
+var request = new XMLHttpRequest()
2 
+
3 
+/*request.open('GET', 'json/renglones.json', true)
4 
+
5 
+request.onload = function() {
6 
+  // begin accessing JSON data here
7 
+  var info = JSON.parse(this.response)
8 
+
9 
+  var table = document.getElementById("table");
10 
+
11 
+    for (var i = 0; i < info.length; i++) {
12 
+
13 
+            tr = table.insertRow(-1);
14 
+
15 
+            for (var j = 0; j < 2; j++) {
16 
+                var tabCell = tr.insertCell(-1);
17 
+                if (j==0) {
18 
+                    tabCell.innerHTML = info[i].Renglones;
19 
+                }
20 
+                else{
21 
+                    tabCell.innerHTML = info[i].Especificaciones;
22 
+                }
23 
+            }
24 
+        }
25 
+    var divContainer = document.getElementById("showData");
26 
+        divContainer.innerHTML = "";
27 
+        divContainer.appendChild(tr);
28 
+
29 
+}*/
30 
+request.open('GET', 'json/MADERA.json', true)
31 
+
32 
+request.onload = function() {
33 
+  // begin accessing JSON data here
34 
+  var info = JSON.parse(this.response)
35 
+
36 
+  var table = document.getElementById("table");
37 
+
38 
+    for (var i = 0; i < info.length; i++) {
39 
+
40 
+            tr = table.insertRow(-1);
41 
+
42 
+            for (var j = 0; j < 5; j++) {
43 
+                var tabCell = tr.insertCell(-1);
44 
+                if (j==0) {
45 
+                    tabCell.innerHTML = info[i].Nombre;
46 
+                }
47 
+                else if (j==1) {
48 
+                    tabCell.innerHTML = info[i].Especificaciones;
49 
+                }
50 
+                else if (j==2) {
51 
+                    tabCell.innerHTML = info[i]["Teléfono 1"];
52 
+                }
53 
+                else if (j==3) {
54 
+                    tabCell.innerHTML = info[i]["E-mail"];
55 
+                }
56 
+                else{
57 
+                    tabCell.innerHTML = info[i].Municipio
58 
+                }
59 
+            }
60 
+        }
61 
+    var divContainer = document.getElementById("showData");
62 
+        divContainer.innerHTML = "";
63 
+        divContainer.appendChild(tr);
64 
+}
65 
+
66 
+
67 
+request.send()

+ 1
- 0
www/json/MADERA.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 1
- 0
www/json/renglones.json
Різницю між файлами не показано, бо вона завелика
Переглянути файл


+ 54
- 0
www/madera.html Переглянути файл 

@@ -0,0 +1,54 @@
1 
+<html>
2 
+    <head>
3 
+        <!--
4 
+        Customize this policy to fit your own app's needs. For more guidance, see:
5 
+            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
6 
+        Some notes:
7 
+            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
8 
+            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
9 
+            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
10 
+                * Enable inline JS: add 'unsafe-inline' to default-src
11 
+        -->
12 
+        <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:;">
13 
+        <!--these three for the calendar-->
14 
+        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
15 
+        <link rel="stylesheet" href="calendar_files/css/demo.css"/>
16 
+        <link rel="stylesheet" href="calendar_files/css/theme1.css"/>
17 
+        <!--this is for the search bar-->
18 
+        <link rel = "stylesheet" href = "css/searchbar1.css">
19 
+
20 
+        <meta name="format-detection" content="telephone=no">
21 
+        <meta name="msapplication-tap-highlight" content="no">
22 
+        <meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover">
23 
+        <link rel="stylesheet" type="text/css" href="css/index.css">
24 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsenui.css">
25 
+        <link rel="stylesheet" href="lib/OnsenUI/css/onsen-css-components.min.css">
26 
+        <script src="lib/OnsenUI/js/onsenui.min.js"></script>
27 
+
28 
+    </head>
29 
+    <body>
30 
+        <br><br><br><br>
31 
+        <ons-page>
32 
+            <ons-toolbar>
33 
+                <div class="left"><ons-toolbar-button><a href="index.html">Home</a></ons-toolbar-button></div>
34 
+                <div class="center">Cultura</div>
35 
+            </ons-toolbar>
36 
+        <div>
37 
+        <ons-scroller>
38 
+                    <table id="table" align="center" border=1>
39 
+                        <tr>
40 
+                            <th>Nombres</th>
41 
+                            <th>Especificaciones</th>
42 
+                            <th>Teléfono</th>
43 
+                            <th>E-mail</th>
44 
+                            <th>Municipio</th>
45 
+                        </tr>
46 
+                    <script type="text/javascript" src="js/test.js"></script>
47 
+                    </table>
48 
+        </ons-scroller>
49 
+            </div>
50 
+        </ons-page>
51 
+        <script type="text/javascript" src="cordova.js"></script>
52 
+        <script type="text/javascript" src="js/index.js"></script>
53 
+    </body>
54 
+</html>