Browse Source

Updated to book version. Mas el algo es de ordenamiento no de busqueda

Luis Albertorio 8 years ago
parent
commit
fad896991a
2 changed files with 55 additions and 41 deletions
  1. 37
    26
      README-en.md
  2. 18
    15
      README-es.md

+ 37
- 26
README-en.md View File

@@ -1,4 +1,4 @@
1
-# Pesky Tourist: Sorting
1
+# Pesky Tourist: Sorting and Nested Loops
2 2
 
3 3
 ![main1.png](images/main1.png)
4 4
 ![main2.png](images/main2-small.png)
@@ -8,11 +8,15 @@ Two common tasks when working with arrays of data is to search for and sort the
8 8
 
9 9
 ##Objectives
10 10
 
11
-Practice sorting arrays by selection and the bubble method.
12
-Practice the use of decision and repetition structures.
13
-Use methods from the `vector` C++ class.
14
-Use the methods of the `QImage` class from `Qt` to manipulate an image’s pixels.
15
-Learn about the median filter for image processing.
11
+1) Practice sorting arrays by selection and the bubble method.
12
+
13
+2) Practice the use of decision and repetition structures.
14
+
15
+3) Use methods from the `vector` C++ class.
16
+
17
+4) Use the methods of the `QImage` class from `Qt` to manipulate an image’s pixels.
18
+
19
+5) Learn about the median filter for image processing.
16 20
 
17 21
 This laboratory experience is an adaptation of the nifty assignment presented by John Nicholson in [1].
18 22
 
@@ -20,11 +24,15 @@ This laboratory experience is an adaptation of the nifty assignment presented by
20 24
 
21 25
 Before arriving at the laboratory you should have:
22 26
 
23
-Reviewed the selection sort and bubble sort algorithms.
24
-Familiarized yourself with the `push_back()`, `at(i)`,  `size()`, `clear()` methods in the C++ `vector` class.
25
-Familiariezed yourself with the `width()`, `height()`, `pixel(i, j)`, `setPixel(i,j, pixel)` methods in the `QImage` class from `Qt`.
26
-Studied the concepts and instructions for the laboratory session.
27
-Taken the Pre-Lab quiz that can be found on Moodle.
27
+1) Reviewed the selection sort and bubble sort algorithms.
28
+
29
+2) Familiarized yourself with the `push_back()`, `at(i)`,  `size()`, `clear()` methods in the C++ `vector` class.
30
+
31
+3) Familiariezed yourself with the `width()`, `height()`, `pixel(i, j)`, `setPixel(i,j, pixel)` methods in the `QImage` class from `Qt`.
32
+
33
+4) Studied the concepts and instructions for the laboratory session.
34
+
35
+5) Taken the Pre-Lab quiz that can be found on Moodle.
28 36
 
29 37
 ---
30 38
 
@@ -38,7 +46,7 @@ The smallest element in an image is called a pixel. This unit consists of a sing
38 46
 
39 47
 ![figure2.png](images/figure2.png)
40 48
 
41
-**Figura 1.** Distribution of bits for the alpha composition and the red, green and blue tones within the ARGB representation. Each tone can have a value between 0x00 (all eight bits on 0), and 0xFF (all eight bits on 1).
49
+**Figure 1.** Distribution of bits for the alpha composition and the red, green and blue tones within the ARGB representation. Each tone can have a value between 0x00 (all eight bits on 0), and 0xFF (all eight bits on 1).
42 50
 
43 51
 ---
44 52
 
@@ -63,7 +71,7 @@ Given three or more images of the same space, a median filter works as follows:
63 71
 
64 72
 ![main2.png](images/main2.png)
65 73
 
66
-**Figura 2.** Illustration of the median filter algorithm for a given pixel. The pixel’s colors are determined in the three images, then the median is calculated. The median of the pixel is used in the corresponding position of the merged image.
74
+**Figure 2.** Illustration of the median filter algorithm for a given pixel. The pixel’s colors are determined in the three images, then the median is calculated. The median of the pixel is used in the corresponding position of the merged image.
67 75
 
68 76
 ---
69 77
 
@@ -118,25 +126,25 @@ The objects of the `QImage` class have the following methods that will be useful
118 126
 
119 127
 ### Examples:
120 128
 
121
-`QRgb myRgb = qRgb(0xff, 0x00, 0xff);`: Assigns to `myRgb` the value `0xff00ff` that represents the color ![figure3.png](images/figure3.png)
129
+1) `QRgb myRgb = qRgb(0xff, 0x00, 0xff);`: Assigns to `myRgb` the value `0xff00ff` that represents the color ![figure3.png](images/figure3.png)
122 130
 
123 131
 Notice that the value of `0xff00ff` represents the values `0xff`, `0x00`, `0xff`, that correspond to the red, green and blue components of `myRgb`.
124 132
 
125
-2. If the following `4 x 4` image of pixels represents the object `originalImage`,
133
+2) If the following `4 x 4` image of pixels represents the object `originalImage`,
126 134
 
127 135
 ![main1.png](images/main1.png)
128 136
 
129 137
 then `originalImage.pixel(2,1)` returns the `rgb` value that represents the color blue (`0x0000ff`).
130 138
 
131
-3. The following instruction assigns the red color to the pixel in position `(2, 3)` in the edited image: 
139
+3) The following instruction assigns the red color to the pixel in position `(2, 3)` in the edited image: 
132 140
 
133 141
 `editedImage.setPixel(2,3,qRgb(0xff,0x00,0x00));`.
134 142
 
135
-4. The following instruction assigns a `greenContent` the value of the green value contained in the pixel `(1, 1)` of the `originalImage`:
143
+4) The following instruction assigns a `greenContent` the value of the green value contained in the pixel `(1, 1)` of the `originalImage`:
136 144
 
137 145
 `int greenContent = qGreen(originalImage.pixel(1,1));`.
138 146
 
139
-5. The following code assigns to the red component of the pixel `(1, 1)` of `editedImage` the average of the values of the red tone that are in pixel `(1, 1)` of `originalImage1` and `originalImage2` and does the same to the green and blue components.
147
+5) The following code assigns to the red component of the pixel `(1, 1)` of `editedImage` the average of the values of the red tone that are in pixel `(1, 1)` of `originalImage1` and `originalImage2` and does the same to the green and blue components.
140 148
 
141 149
 ---
142 150
 
@@ -163,11 +171,14 @@ int main() {
163 171
 ---
164 172
 
165 173
 ---
166
-!INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-01.html"
174
+!INCLUDE "../../eip-diagnostic/pesky-tourist/en/diag-pesky-tourist-01.html"
175
+<br>
167 176
 
168
-!INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-02.html"
177
+!INCLUDE "../../eip-diagnostic/pesky-tourist/en/diag-pesky-tourist-02.html"
178
+<br>
169 179
 
170
-!INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-03.html"
180
+!INCLUDE "../../eip-diagnostic/pesky-tourist/en/diag-pesky-tourist-03.html"
181
+<br>
171 182
 
172 183
 ---
173 184
 
@@ -198,9 +209,10 @@ To find the median of the components of the colors in a pixel, we have to use a
198 209
 
199 210
 #### Instructions
200 211
 
201
-Load the project `PeskyTourist` on to QtCreator by double-clicking on the file `PeskyTourist.pro` in the directory `Documents/eip/Sort-PeskyTourist` on your computer. You can also go to `http://bitbucket.org/raarceupr/sort-peskytourist` to download the folder `Sort-PeskyTourist` to your computer.
212
+1. Load the project `PeskyTourist` on to QtCreator by double-clicking on the file `PeskyTourist.pro` in the directory `Documents/eip/Sort-PeskyTourist` on your computer. You can also go to `https://bitbucket.org/eip-uprrp/sort-peskytourist` to download the folder `Sort-PeskyTourist` to your computer.
213
+
214
+2. The code that we provide creates the interface in Figure 3.
202 215
 
203
-The code that we provide creates the interface in Figure 3.
204 216
     ---
205 217
 
206 218
     ![figure3.png](images/figura3.png)
@@ -219,9 +231,9 @@ The code that we provide creates the interface in Figure 3.
219 231
 
220 232
 #### Instructions
221 233
 
222
-Complete the `Median` function that receives a vector of integers. The `Median` function should invoke the `Sort` function to order the integers and calculate the median. The function returns the calculated median.
234
+1. Complete the `Median` function that receives a vector of integers. The `Median` function should invoke the `Sort` function to order the integers and calculate the median. The function returns the calculated median.
223 235
 
224
-Create a unit test to validate the `Median` function and invoke it from the `RemoveNoise` function.
236
+2. Create a unit test to validate the `Median` function and invoke it from the `RemoveNoise` function.
225 237
 
226 238
 ### Exercise 3: Calculate the median of each pixel
227 239
 
@@ -259,4 +271,3 @@ Use "Deliverables" in Moodle to upload the `Filter.cpp` file that contains the f
259 271
 ##References
260 272
 
261 273
 [1] John Nicholson, http://nifty.stanford.edu/2014/nicholson-the-pesky-tourist/
262
-

+ 18
- 15
README-es.md View File

@@ -94,9 +94,9 @@ El método que usaremos en esta experiencia de laboratorio para hallar la median
94 94
 ####Ejemplo: 
95 95
 Supón que debemos hallar la mediana de los tres píxeles con valores `0xff223344`, `0xff112233`, `0xff001155`.
96 96
 
97
-* La mediana del componente rojo es 0x11 (dado que los componentes rojos son `0x22`, `0x11` y `0x00`.
98
-* La mediana del componente verde es 0x22 (dado que los componentes verdes son `0x33`, `0x22` y `0x11`.
99
-*  La mediana del componente azul es 0x44 (dado que los componentes azules son `0x44`, `0x33` y `0x55`.
97
+* La mediana del componente rojo es 0x11 (dado que los componentes rojos son `0x22`, `0x11` y `0x00`).
98
+* La mediana del componente verde es 0x22 (dado que los componentes verdes son `0x33`, `0x22` y `0x11`).
99
+*  La mediana del componente azul es 0x44 (dado que los componentes azules son `0x44`, `0x33` y `0x55`).
100 100
 
101 101
 Por lo tanto, la mediana de los píxeles sera `0xff112244`, compuesto por las medianas de los componentes de colores rojo, verde y azul.
102 102
 
@@ -143,27 +143,27 @@ Los objetos de clase `QImage` tienen los siguiente métodos que serán útiles p
143 143
 
144 144
 ### Ejemplos:
145 145
 
146
-1. `QRgb myRgb = qRgb(0xff, 0x00, 0xff);`: Asigna a `myRgb` el valor `0xff00ff` que representa el color ![figure3.png](images/figure3.png)
146
+1) `QRgb myRgb = qRgb(0xff, 0x00, 0xff);`: Asigna a `myRgb` el valor `0xff00ff` que representa el color ![figure3.png](images/figure3.png)
147 147
 
148
-    Nota que el valor `0xff00ff` representa los valores `0xff`, `0x0`, `0xff`, que corresponden a los componentes rojo, verde y azul de `myRgb`.
148
+   Nota que el valor `0xff00ff` representa los valores `0xff`, `0x0`, `0xff`, que corresponden a los componentes rojo, verde y azul de `myRgb`.
149 149
 
150
-2. Si la siguiente imagen `4 x 4` de píxeles representa el objeto `originalImage`,
150
+2) Si la siguiente imagen `4 x 4` de píxeles representa el objeto `originalImage`,
151 151
 
152
-      ![main1.png](images/main1.png)
152
+   ![main1.png](images/main1.png)
153 153
 
154
-     entonces `originalImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
154
+   entonces `originalImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
155 155
 
156
-3. La siguiente instrucción asigna el color rojo al píxel en posición `(2,3)` en la imagen editada:
156
+3) La siguiente instrucción asigna el color rojo al píxel en posición `(2,3)` en la imagen editada:
157 157
 
158
-    `editedImage.setPixel(2,3,qRgb(0xff,0x00,0x00));`.
158
+   `editedImage.setPixel(2,3,qRgb(0xff,0x00,0x00));`.
159 159
 
160 160
 
161
-4. La siguiente instrucción le asigna a `greenContent` el valor del tono de verde que contiene el pixel `(1,1)` de  `originalImage`:
161
+4) La siguiente instrucción le asigna a `greenContent` el valor del tono de verde que contiene el pixel `(1,1)` de  `originalImage`:
162 162
 
163
-    `int greenContent = qGreen(originalImage.pixel(1,1));`.
163
+   `int greenContent = qGreen(originalImage.pixel(1,1));`.
164 164
 
165 165
 
166
-5. El siguiente código le asigna al componente rojo del píxel `(1,1)` de  `editedImage` el promedio de los valores del tono de rojo que contiene el píxel `(1,1)` de  `originalImage1` y  `originalImage2` y lo mismo hace con los componentes verde y de azul.
166
+5) El siguiente código le asigna al componente rojo del píxel `(1,1)` de  `editedImage` el promedio de los valores del tono de rojo que contiene el píxel `(1,1)` de  `originalImage1` y  `originalImage2` y lo mismo hace con los componentes verde y de azul.
167 167
 
168 168
 ---
169 169
 
@@ -192,10 +192,13 @@ int main() {
192 192
 ---
193 193
 
194 194
 !INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-01.html"
195
+<br>
195 196
 
196 197
 !INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-02.html"
198
+<br>
197 199
 
198 200
 !INCLUDE "../../eip-diagnostic/pesky-tourist/es/diag-pesky-tourist-03.html"
201
+<br>
199 202
 
200 203
 ---
201 204
 
@@ -233,7 +236,7 @@ Para hallar la mediana de los componentes de colores de los píxeles, debemos co
233 236
 #### Instrucciones
234 237
 
235 238
 
236
-1. Carga a QtCreator el proyecto `PeskyTourist`  haciendo doble "click" en el archivo `PeskyTourist.pro` en el directorio `Documents/eip/Sort-PeskyTourist` de tu computadora. También puedes ir a `http://bitbucket.org/eip-uprrp/sort-peskytourist` para descargar la carpeta `Sort-PeskyTourist` a tu computadora.
239
+1. Carga a QtCreator el proyecto `PeskyTourist`  haciendo doble "click" en el archivo `PeskyTourist.pro` en el directorio `Documents/eip/Sort-PeskyTourist` de tu computadora. También puedes ir a `http://bitbucket.org/raarceupr/sort-peskytourist` para descargar la carpeta `Sort-PeskyTourist` a tu computadora.
237 240
 
238 241
 2.  El código que te proveemos crea la interfaz de la Figura 3.
239 242
 
@@ -299,4 +302,4 @@ Utiliza "Entrega" en Moodle para entregar el archivo `Filter.cpp` que contiene l
299 302
 
300 303
 ##Referencias
301 304
 
302
-[1] John Nicholson, http://nifty.stanford.edu/2014/nicholson-the-pesky-tourist/
305
+[1] John Nicholson, http://nifty.stanford.edu/2014/nicholson-the-pesky-tourist/