Transact-SQL (Tiempo Aproximado 30 Min) SQL 2008

1) Completar los espacios en blanco de la siguiente consulta para que su resultado

sea el siguiente:

SELECT P.ProductID, P.Name, M.Name

FROM SalesLT.Product __as P_ (Tip “Alias”)
INNER JOIN SalesLT.ProductModel AS M on
M.ProductModelID=P._ProductModelID (Tip “Primary Key”)
WHERE P.Color LIKE _’%red%’____ (Tip “Like”) ORDER BY
P.ProductID _DESC____ (Tip “Order”)
Asp.Net (Visual Basic Aproximando 60 Minutos)

Desarrolle una Aplicación Web en ASP.NET con las siguientes características,

(Recomendablemente en Visual Basic con Framework 4.0 en adelante.)

1. Cree una tabla de datos (puede ser utilizar alguno de los controles DataList,
DetailsView, FormView, GridView, ó Repeater) que muestre los siguientes
campos (Ver imagen Tabla.1):
a. ID (ProductID)
b. Nombre Producto (Name)
c. Numero. Producto (ProductNumber)
d. ID Categoría (ProductCategoryID)
e. Nombre Categoría (Name)
f. Precio unidad (UnitPrice)
g. Cantidad (OrderQty)
Tabla.1
 2. Haga que la columna de Cantidad Inventario sea editable (puede usar un
TextBox)

3. Ponga un botón en cada fila que actualice la cantidad de productos en la base de

datos. Esta cantidad será el valor que ingrese el usuario en el campo de texto.
El UPDATE se debe hacer sobre la tabla SalesLT.SalesOrderDetail

4. Haga un formulario adicional de Login que capture un Usuario y Password. Al

ingresar el usuario establecerá una sesión. (debe crear una tabla en la Base de
datos para esta información.)

5. Realice una restricción para que se pueda actualizar los datos de cantidades de
inventario solo cuando el usuario haya establecido una sesión.

6. Data Source=marisol;Initial Catalog=AWLT2008;Integrated Security=True

Google Maps Api V3 (Tiempo Aproximado 60 Minutos)

1. Cree una página nueva dentro de la misma solución creada anteriormente y

utilice la librería de Google Maps api V3 Librería DrawinManager, debe realizar
lo siguiente:
1.1. Dibujar un circulo Editable
1.2. Asignarle el color rojo como lo muestra la imagen de muestra.
1.3. Debe capturar el radio del circulo cuando se completa el dibujo
1.4. Debe capturar la Latitud y Longitud del circulo
 1.5. Al mover el Circulo de posición se debe evidenciar el cambio de longitud
latitud
1.6. Al cambiar el tamaño del Círculo se debe evidenciar el cambio del radio.

Enlaces de interés

https://developers.google.com/maps/documentation/javascript/overlays?hl=es-
ES#drawing_tools

https://developers.google.com/maps/documentation/javascript/examples/drawing-tools?
hl=es-ES

CSS3, CSS (Tiempo Aproximado 30 Minutos)

La siguiente tabla muestra las propiedades del objeto String.

1. Establecer la fuente del documento a Tahoma,Arial 12px;

2. CSS: establecer la orientación del texto de las celdas a la izquierda.
3. CSS: hacer que la primera columna de cada tabla tenga un ancho de 100px.
4. CSS: hacer que las filas pares de cada tabla se pinten con el background
#F9EEFF.
5. CSS: hacer que las celdas tengan un padding arriba-debajo:3px y a los
lados:5px
6. CSS: los table header(th) deben tener padding de 8px y background
#F5F5E2;
7. CSS: hacer los bordes de la tabla y que las esquinas sean redondeadas en
5px;
8. Hacer un buscador de texto con un botón y que los resultados se resalten en
color rojo.

Tip: Puede usar los métodos html wrapper.

9. Si la caja de texto está vacía, se debe mostrar el texto original de la tabla.
(Sin resaltados)

Links de estudio para los temas propuestos:

Respecto a javascript puede ir estudiando los siguientes enlaces:
 http://www.w3schools.com/jsref/jsref_obj_string.asp (String Object)
 http://javascript.espaciolatino.com/lengjs/jsgram/expregulares.htm (Regular
Expressions)
 http://www.w3schools.com/jsref/jsref_obj_regexp.asp (Regular Expressions)

Respecto a jQuery puede ir estudiando los siguientes enlaces (Se recomienda

estudiarlos en orden):

 http://www.maestrosdelweb.com/editorial/javascript-facil-y-rapido-con-jquery/
(Fácil: Tutorial Básico)
  http://api.jquery.com/category/events/ (Fácil: Eventos)
 http://api.jquery.com/category/selectors/ (Fácil: Selectores)
 http://docs.jquery.com/Tutorials:How_to_Get_Anything_You_Want (Fácil:
Selectores: Demo)
 http://webdesignerwall.com/tutorials/jquery-tutorials-for-designers (Fácil:
Tutorial Básico)
 http://librojquery.com/ (Avanzado)

Respecto a CSS3 puede ir estudiando los siguientes enlaces:

 http://www.w3.org/TR/css3-selectors/#selectors (Selectores)
 http://www.456bereastreet.com/archive/200601/css_3_selectors_explained/
(Selectores)

Las siguientes son las expresiones regulares que servirán para la implementación del
buscador de texto.

//Formatea los caracteres especiales que serán buscados en el documento

     sBuscar = sBuscar.replace(/([\-\.\*\+\?\^\$\|\/\{\}\(\)\[\]\\])/gi, "\\$1");
     //Expresión regular que busca el texto en el documento
     var pattern = new RegExp('(>[^<.]*)(' + sBuscar + ')([^<.]*)', "ig");
     //Envuelve el texto encontrado en un span con la clase highlight
     sHtmlOriginal.replace(pattern, '$1<span class="highlight">$2</span>$3');

Muestra de la tabla
HTML BÁSICO PARA LOS EJERCICIOS PROPUESTOS

<h2>String Object Methods</h2>

<table>
<thead>
<tr>
<th>Method</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="javascript:void(0)">charAt()</a></td>
<td>Returns the character at the specified index</td>
</tr>
<tr>
<td><a href="javascript:void(0)">charCodeAt()</a></td>
<td>Returns the Unicode of the character at the specified
index</td>
</tr>
<tr>
<td><a href="javascript:void(0)">concat()</a></td>
<td>Joins two or more strings, and returns a copy of the joined strings</td>
</tr>
<tr>
<td><a href="javascript:void(0)">fromCharCode()</a></td>
<td>Converts Unicode values to characters</td>
</tr>
<tr>
<td><a href="javascript:void(0)">indexOf()</a></td>
<td>Returns the position of the first found occurrence of a specified value in a
string</td>
</tr>
<tr>
<td><a href="javascript:void(0)">lastIndexOf()</a></td>
<td>Returns the position of the last found occurrence of a specified value
in a string</td>
</tr>
<tr>
<td><a href="javascript:void(0)">match()</a></td>
<td>Searches for a match between a regular expression and a string,
and returns the matches</td>
</tr>
<tr>
<td><a href="javascript:void(0)">replace()</a></td>
<td>Searches for a match between a substring (or regular
expression) and a string, and replaces the matched substring with a new
substring</td>
</tr>
<tr>
<td><a href="javascript:void(0)">search()</a></td>
<td>Searches for a match between a regular expression and a string,
and returns the position of the match</td>
</tr>
<tr>
<td><a href="javascript:void(0)">slice()</a></td>
 <td>Extracts a part of a string and returns a new string</td>
</tr>
<tr>
<td><a href="javascript:void(0)">split()</a></td>
<td>Splits a string into an array of substrings</td>
</tr>
<tr>
<td><a href="javascript:void(0)">substr()</a></td>
<td>Extracts the characters from a string, beginning at a specified start
position, and through the specified number of character</td>
</tr>
<tr>
<td><a href="javascript:void(0)">substring()</a></td>
<td>Extracts the characters from a string, between two specified indices</td>
</tr>
<tr>
<td><a href="javascript:void(0)">toLowerCase()</a></td>
<td>Converts a string to lowercase letters</td>
</tr>
<tr>
<td><a href="javascript:void(0)">toUpperCase()</a></td>
<td>Converts a string to uppercase letters</td>
</tr>
<tr>
<td><a href="javascript:void(0)">valueOf()</a></td>
<td>Returns the primitive value of a String object</td>
</tr>
</tbody>
</table>