Subversion-Projekte lars-tiefland.prado

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
1 lars 1 
<com:TContent id="body">
2 
<style>
3 
.cart {
4 
	border: 1px solid #E8A400;
5 
	background-color: white;
6 
	padding: 8px;
7 
	width: 500px;
8 
	height: 150px;
9 
}
10 
 
11 
.cart-hover {
12 
	background-color: #E8A400;
13 
}
14 
 
15 
.cart-items {
16 
	width: 30px;
17 
	height: 30px;
18 
}
19 
 
20 
.products {
21 
	float: left;
22 
	width: 100px;
23 
	height: 100px;
24 
	margin-right: 10px;
25 
}
26 
 
27 
.draggable {
28 
	cursor: move
29 
}
30 
 
31 
.removable {
32 
}
33 
 
34 
.trash {
35 
	width: 50px;
36 
	height: 50px;
37 
	border: 1px solid black;
38 
}
39 
 
40 
.trash-hover {
41 
	background-image: url(<%~ assets/trash.png%>);
42 
}
43 
 
44 
</style>
45 
<h1>Drag &amp; Drop demo !</h1>
46 
 
47 
<h2>Product List :</h2>
48 
 
49 
<div style="margin-bottom: 20px; height: 120px">
50 
 
51 
<com:TRepeater Id="ProductList" DataKeyField="ProductId">
52 
	<prop:ItemTemplate>
53 
		<com:TDraggable CssClass="products draggable" >
54 
		<com:TImage ImageUrl=<%#$this->Data['ProductImageUrl']%> />
55 
		</com:TDraggable>
56 
	</prop:ItemTemplate>
57 
</com:TRepeater>
58 
</div>
59 
<h2>Your shopping cart :</h2>
60 
<com:TDropContainer CssClass="cart" Id="cart"
61 
	AcceptCssClass="draggable"
62 
	HoverCssClass="cart-hover"
63 
	OnDrop="addItemToCart"
64 
	OnCallback="redrawCart"
65 
	>
66 
	<com:TRepeater id="ShoppingList" DataKeyField="ProductId">
67 
		<prop:EmptyTemplate>
68 
			Your shopping cart is empty, please add some items !
69 
		</prop:EmptyTemplate>
70 
		<prop:ItemTemplate>
71 
			<com:TDraggable CssClass="removable"
72 
				Revert="true"
73 
				Handle="<%=$this->itemImage->ClientId%>"
74 
				Ghosting=<%#($this->Data['ProductCount'] > 1)%>
75 
				>
76 
			<com:TImage id="itemImage" CssClass="cart-items" Style="cursor:move" ImageUrl=<%#$this->Data['ProductImageUrl']%>/>
77 
			<com:TLabel id="itemTitle" Text=<%#$this->Data['ProductTitle']%>/>
78 
			<com:TLabel id="itemCount" Text="(<%#$this->Data['ProductCount']%>)" />
79 
			</com:TDraggable>
80 
		</prop:ItemTemplate>
81 
	</com:TRepeater>
82 
</com:TDropContainer>
83 
<h2>Remove Items from cart by dropping them here</h2>
84 
<com:TDropContainer CssClass="trash" id="trash"
85 
	AcceptCssClass="removable"
86 
	OnDrop="removeItemFromCart"
87 
	OnCallback="redrawCart"
88 
	HoverCssClass="trash-hover"
89 
/>
90 
</com:TContent>