Project

General

Profile

metacat / lib / style / skins / sanparks / spatial / pma.html @ 3432

1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
2

    
3

    
4
<html>
5
<head>
6
<title>Metacat Spatial Option Demo</title>
7

    
8
<link rel="stylesheet" href="/style.css" type="text/css"/>
9
<link rel="stylesheet" href="./html.css" type="text/css"/>
10

    
11
<link href="../sanparks.css" type="text/css" rel="stylesheet"/>
12
<script src="../sanparks.js" type="text/JavaScript" language="Javascript"></script>
13

    
14
<link href="./map.css" type="text/css" rel="stylesheet"/>
15

    
16
<script src="../../../common/prototype.js" type="text/JavaScript" language="Javascript"></script>
17
<script src="../../../common/effects.js" type="text/JavaScript" language="Javascript"></script>
18

    
19
<script language="JavaScript">
20
          function submitform(action,form_ref) {
21
            form_ref.action.value=action;
22
            form_ref.sessionid.value="";
23
            form_ref.qformat.value="sanparks";
24
            form_ref.submit();
25
          }
26
</script>
27

    
28
<script type="text/javascript">
29
  var mbConfigUrl="africa_frame_config.xml";
30
</script>
31
<script type="text/javascript" src="../../../../spatial/mapbuilder/lib/Mapbuilder.js"></script>
32

    
33

    
34
<script language="JavaScript">
35
function show_map() {
36
        Element.show('mapControlHide')
37
        Element.hide('mapControlShow')
38

39
        // reset the map position in the iframe
40
        $("mapContainer").setAttribute("style", "right:-212px;");
41

42
        // expand the iframe
43
        var frm = top.getMapFrame();
44
        frm.setAttribute("style", "width:295px;right:0;");
45

46
        var element = $('mapContainer')
47
        new Effect.Move(element, { x: -212, y: 0, duration: 0.2})
48

49
        //setTimeout('$("mapContainer").setAttribute("style", "position:absolute;left:0;")', 300);
50

51
        //alert('moved');
52
        //do_move_anim(-260);
53
}
54

55
/*
56
 * Don't animate.  Just shrink the outer frame and make left:0.
57
 */
58
function hide_map() {
59
        Element.show('mapControlShow')
60
        Element.hide('mapControlHide')
61
        var element = $('mapContainer')
62
        //new Effect.Move(element, { x: 260, y: 0, duration: 0.1})
63
        $("mapContainer").setAttribute("style", "left:0px;");
64

65

66

67
        //alert('moved');
68
        //setTimeout('getElementsByClassName(top.document, "iframe", "iframeMap")[0].setAttribute("style", "width:35px;right:0;")', 200);
69

70
        // shrink the iframe
71
        var frm = top.getMapFrame();
72
        frm.setAttribute("style", "width:35px;right:-3px;");
73

74

75
        //alert('closed');
76
        //alert('now');
77
        //setTimeout('$("mapContainer").setAttribute("style", "left:0;")', 400);
78
        //$("mapContainer").setAttribute("style", "right:-212px;");
79
        //alert($("mapContainer").getAttribute("style"));
80
        //alert('adjusted');
81

82
        //do_move_anim(260);
83
}
84

85

86
//
87
// animate the drawer
88
//
89
function do_move_anim(xdelta) {
90

91
        var element = $('mapContainer')
92
        var old_right = Element.getStyle(element, 'right')
93
        //alert("right:" + old_right);
94
        old_right = old_right.substring(0,old_right.indexOf("px"));
95
        var new_right = old_right + xdelta;
96
        new_right = new_right + "px";
97
        new_right = "0px";
98
        var new_left;
99

100
        if (xdelta > 0) {
101
                // hide
102
                new_left = "0px";
103
                new_right = "0px";
104
        } else {
105
                // show
106
                new_left = "0px";
107
                new_right = "0px";
108
        }
109

110
        var newStyle = {
111
                left: new_left,
112
                right: new_right};
113
        Element.setStyle(element, newStyle);
114
                
115

116
        //alert(xdelta + ": " + Element.getStyle(element, 'left') + "=l R=" + Element.getStyle(element, 'right'));
117
/*
118
*/
119
        //new Effect.Move(element, { x: xdelta, y: 0, duration: 0.3})
120

121
        /*
122
        new Effect.Move(element, { x: xdelta, y: 0, duration: 0.3, 
123
                afterFinishInternal: function(effect) { with(Element) {
124
                        undoPositioned(effect.element); setStyle(effect.element, newStyle);        }}})
125
        new Effect.Move(element, { x: xdelta, y: 0, duration: 0.3, 
126
                afterFinishInternal: function(effect) { with(Element) {
127
                        setStyle(effect.element, newStyle);        }}})
128
                        */
129

130
        //Element.setStyle(element, newStyle);
131

132

133

134
        //alert(Element.getStyle(element, 'left') + "=l R=" + Element.getStyle(element, 'right'));
135
}
136

137
function getElementsByClassName(oElm, strTagName, strClassName){
138
    var arrElements = (strTagName == "*" && document.all)? document.all : oElm.getElementsByTagName(strTagName);
139
    var arrReturnElements = new Array();
140
    strClassName = strClassName.replace(/\-/g, "\\-");
141
    var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
142
    var oElement;
143
    for(var i=0; i<arrElements.length; i++){
144
        oElement = arrElements[i];      
145
        if(oRegExp.test(oElement.className)){
146
            arrReturnElements.push(oElement);
147
        }   
148
    }
149
    return (arrReturnElements)
150
}
151

    
152

    
153

    
154
</script>
155
</head>
156
<!--
157
 <body onload="document.location='/wms/GetCapabilities'">
158
 -->
159
<body onload="mbDoLoad()" style="background: #FFFFFF;">
160

    
161
<div id="mapContainer">
162

    
163
<table border="0" cellpadding="0" cellspacing="0" style="background: #FFFFFF;">
164
        <tr>
165
            <td valign="top">
166
                        <table border="0" style="border: 1px solid #525d76;">
167
                        
168
                                <tr>
169
                                        <td colspan="1">
170
                                                <div id="mainMapPane" style="background-color:white;" />
171
                                                <div id="loading">
172
                                                        <p> Loading Map
173
                                                        <img src="../../../../spatial/mapbuilder/lib/skin/default/images/Loading.gif"/>
174
                                                        </p>
175
                                                </div>
176
                                                
177
                                        </td>
178
                                <!-- -->
179
                                </tr>
180
                                <tr align="left">
181
                                <!-- -->
182
                                        <td>
183
                                                 
184
                                                <table border="0">
185
                                                        <tr> <td id="locatorMap" style="display:none"/> </tr>
186
                                                        <tr> <td id="mainButtonBar" />  </tr>
187
                                                        <tr> <td id="legend" valign="top"/> </tr> 
188
                                                        <tr> <td colspan="3" id="featureList" /> </tr>
189
                                                </table>
190
                                                
191
                                        </td>
192
                                        
193
                                </tr>
194
                                
195
                        </table>
196
                </td>
197
        </tr>
198
</table>
199
</div>
200

    
201
<div id="debug"></div>
202

    
203
</body>
204
</html>