moveplaces.xhtml
4.04 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:map="http://java.sun.com/jsf/composite/cditools/map"
xmlns:tools="http://java.sun.com/jsf/composite/cditools"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui">
<h:body>
<ui:composition template="#{sessionHandler.template}">
<f:metadata>
<f:event type="preRenderView"
listener="#{mapPlacechangeView.initView()}" />
</f:metadata>
<ui:define name="content">
<h:outputScript target="head" library="seatjs" name="d3.min.js" />
<h:outputScript target="head" library="seatjs" name="d3-tip.js" />
<h:outputScript target="head" library="seatjs" name="seatmap.js" />
<h:outputStylesheet library="seatjs" name="placemap.css" />
<!-- Place slot count -->
<h3>
<h:outputText value="#{i18n['mapView.yourPlaces']}" />
</h3>
<p:fragment id="placeselector">
<h:form>
<p:dataTable id="slottable" tableStyle="width: auto;" var="slot"
value="#{mapPlacechangeView.slots}">
<!-- rowStyleClass="#{mapPlacechangeView.srcPlace.contains(slot.place) ? 'selected' : 'unselected'}" -->
<p:column headerText="#{i18n['mapView.productcount.productname']}">
<h:outputText value="#{slot.src.product.name}" />
</p:column>
<p:column headerText="#{i18n['mapView.productcount.unused']}">
<h:outputText renderer="#{!empty slot.src.place}"
value="#{slot.src.place.name}" />
</p:column>
<p:column headerText="#{i18n['mapView.productcount.selected']}">
<h:outputText renderer="#{!empty slot.moving}"
value="#{slot.moving}" />
</p:column>
<p:column headerText="#{i18n['mapView.productcount.selected']}">
<h:outputText renderer="#{!empty slot.dst}"
value="#{slot.dst.name}" />
</p:column>
<p:column>
<ui:fragment rendered="#{empty slot.dst}">
<p:commandButton
actionListener="#{mapPlacechangeView.selectSlot}"
rendered="#{!slot.isMoving()}"
value="#{i18n['placemove.selectSlotForMove']}"
update="placeselector" />
<p:commandButton
actionListener="#{mapPlacechangeView.unselectSlot}"
rendered="#{slot.moving}" value="#{i18n['placemove.deselect']}"
update="placeselector" />
</ui:fragment>
</p:column>
</p:dataTable>
</h:form>
<script type="text/javascript">
toggleSuccess = #{mapPlacechangeView.toggleSuccess};
</script>
</p:fragment>
<h:form id="placemove">
<p:commandButton
rendered="#{ajaxMapView.canUserBuy()}"
value="#{i18n['mapPlacechange.commitMove']}"
actionListener="#{mapPlacechangeView.commitMove()}" />
</h:form>
<svg id="seatmap" style="margin: auto; border: 1px solid black;"
width="#{ajaxMapView.map.width}px"
height="#{ajaxMapView.map.height}px" />
<h:form>
<p:remoteCommand name="toggleDstPlace"
action="#{mapPlacechangeView.toggleDstPlace()}"
update="placeselector" oncomplete="afterToggle()"></p:remoteCommand>
</h:form>
<script type="text/javascript">
// <![CDATA[
px = placemap({
element: document.getElementById("seatmap"),
moyaurl: "#{request.contextPath}",
map_id: #{ajaxMapView.map.id},
});
px.toggleaction = function(d){
latestPlace = d;
toggleDstPlace([{name:"placeId", value:d.id} ])
};
function afterToggle(){
if(toggleSuccess){
if(latestPlace.state === "F"){
latestPlace.state = "T";
}else {
latestPlace.state = "F";
}
px.update_placeobj([latestPlace]);
}
}
// ]]>
</script>
<map:legend />
</ui:define>
</ui:composition>
</h:body>
</html>