bzr branch
http://gegoxaren.bato24.eu/bzr/lenasys/trunk
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
1 |
<!DOCTYPE html>
|
2 |
<html> |
|
3 |
<head> |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
4 |
<title>Webbprogrammering DA330G</title> |
5 |
<link rel="stylesheet" href="css/style.css" type="text/css" /> |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
6 |
<script type="text/javascript" src="jquery/jquery-1.8.2.min.js"></script> |
7 |
<script type="text/javascript"> |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
8 |
var menuTopOffset = 40; |
9 |
var menuLeftOffset = 25; |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
10 |
|
11 |
$(document).ready(function() { |
|
12 |
window.onresize = fixMenuLeft; |
|
13 |
//$('#menu').offset({ top: menuTopOffset, left: $('#menu').offset().left }); |
|
14 |
//window.onscroll = moveMenu; |
|
15 |
$('#menuHeader').click(toggleMenu); |
|
16 |
$("a.menuLink").click(function(event) { |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
17 |
event.preventDefault(); |
18 |
event.stopPropagation(); |
|
19 |
var destination = event.target.href.substring(event.target.href.lastIndexOf('/') + 1); |
|
20 |
scrollTo(destination); |
|
21 |
}); |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
22 |
}); |
23 |
|
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
24 |
function fixMenuLeft(ev) { |
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
25 |
//$('#menu').offset({ top: bodyelem.scrollTop()+menuTopOffset, left: -($('#menu').width()-30) }); |
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
26 |
if($('#menu').offset().left != 0) { |
27 |
$('#menu').offset({ top: $('#menu').offset().top, left: -($('#menu').width()-menuLeftOffset) }); |
|
28 |
} |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
29 |
} |
30 |
|
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
31 |
function toggleMenu(ev) { |
32 |
if($('#menu').offset().left == 0) { |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
33 |
$('#menu').animate({ left: -($('#menu').width()-menuLeftOffset) },{duration:900}); |
34 |
$("#menuArrow").addClass("rotateArrowCW"); |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
35 |
} else { |
36 |
$('#menu').animate({ left: 0 },{duration:900}); |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
37 |
$("#menuArrow").removeClass("rotateArrowCW"); |
38 |
} |
|
39 |
} |
|
40 |
|
|
41 |
function moveMenu(ev){ |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
42 |
if($.browser.webkit) { |
43 |
bodyelem = $("body"); |
|
44 |
} else { |
|
45 |
bodyelem = $("html,body"); |
|
46 |
} |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
47 |
$('#menu').offset({ top: bodyelem.scrollTop()+menuTopOffset, left: $('#menu').offset().left }); |
48 |
} |
|
49 |
|
|
50 |
function scrollTo(id){ |
|
51 |
$('html,body').animate({scrollTop: $("#"+id).offset().top},{duration:900}); |
|
52 |
return false; |
|
53 |
} |
|
54 |
</script> |
|
55 |
</head> |
|
56 |
<body> |
|
57 |
<div id="sidebar"> |
|
58 |
<div id="menu"> |
|
59 |
<div id="menuHeader"> |
|
60 |
<h3>Quick links</h3> |
|
61 |
<img id="menuArrow" class="arrow" src="img/menuArrow.png" alt="arrow" /> |
|
62 |
</div> |
|
63 |
<div id="menuItems"> |
|
64 |
<a href="javascript" class="menuLink">JavaScript</a> |
|
65 |
<a href="jquery" class="menuLink">jQuery</a> |
|
66 |
<a href="SVG" class="menuLink">SVG Converter</a> |
|
67 |
<a href="html5" class="menuLink">HTML5</a> |
|
68 |
<a href="ajaxapi" class="menuLink">AJAX API</a> |
|
69 |
<a href="ajaxapiexamples" class="menuLink">API Examples</a> |
|
70 |
</div> |
|
71 |
||
72 |
</div> |
|
73 |
</div> |
|
74 |
<div id="content"> |
|
|
4.3.1
by a11vikob
In "Code Viewer Alt": |
75 |
<div class="group"> |
76 |
<h1>Code examples</h1> |
|
77 |
<h2 id="javascript">JavaScript Examples</h2> |
|
78 |
<div class="container"> |
|
79 |
<div class="info">A couple of short tutorials introducing Firebug</div> |
|
80 |
<a href='Tutorials/Tutorial_Firebug.gif'>Firebug Tutorial</a><br> |
|
81 |
<a href='Tutorials/Tutorial_Firebug_II.gif'>Firebug Tutorial II</a><br> |
|
82 |
<div class="info">Some simple JavaScript code examples</div> |
|
83 |
<a href='Javascript/JavaScriptExample0_setEvent.php'>Example 0: Events, DOM access and console.log</a><br> |
|
84 |
<a href='Javascript/JavaScriptExample1_DOM.php'>Example 1: Adding and removing elements in the DOM</a><br> |
|
85 |
<a href='Javascript/JavaScriptExample2_validateForm.php'>Example 2: Validating form data</a><br> |
|
86 |
<div class="info">Some simple JavaScript demo examples</div> |
|
87 |
<a href='Javascript/Small_Example_Menudiv.html'>Menu with images using divs</a><br> |
|
88 |
<a href='Javascript/Small_Example_DropdownDiv.html'>Dropdown Menu</a><br> |
|
89 |
<a href='Javascript/Small_Example_Expandcontract.html'>Expand and Contract Data</a><br> |
|
90 |
<a href='Javascript/Small_Example_Expandcontract2.html'>Expand and Contract Hierarchical Menu</a><br> |
|
91 |
<a href='Javascript/Small_Example_DragDrop1.html'>Drag and drop start (reading coordinates)</a><br> |
|
92 |
<a href='Javascript/Small_Example_DragDrop2.html'>Drag and drop div (read class or id from clicked div)</a><br> |
|
93 |
<a href='Javascript/Small_Example_DragDrop3.html'>Drag and drop divs (update divs)</a><br> |
|
94 |
<a href='Javascript/Small_Example_Timer.html'>Timer example</a><br> |
|
95 |
<a href='Javascript/Small_Example_TimerClipping.html'>Timer example with Clipping Rectangle</a><br> |
|
96 |
<a href='Javascript/Small_Example_History'>History Example</a><br> |
|
97 |
</div> |
|
98 |
||
99 |
<h2 id="jquery">Examples on jQuery and jQuery UI</h2> |
|
100 |
<div class="container"> |
|
101 |
<div class="info">Some simple examples showcasing jQuery and jQuery UI</div> |
|
102 |
<a href='JqueryDemos/JQueryExample1.html'>jQuery Example 1</a><br> |
|
103 |
<a href='JqueryDemos/JQueryExample2.html'>jQuery Example 2</a><br> |
|
104 |
<a href='JqueryDemos/JQueryExample3.html'>jQuery Example 3</a><br> |
|
105 |
<a href='JqueryDemos/JQueryExample4.html'>jQuery Example 4</a><br> |
|
106 |
<a href='JqueryDemos/JQueryExample5.html'>jQuery Example 5</a><br> |
|
107 |
<a href='JqueryDemos/JQueryExample6.html'>jQuery Example 6</a><br> |
|
108 |
<br> |
|
109 |
<a href='http://jquery.com/'>Offical jQuery website</a><br> |
|
110 |
<a href='http://jqueryui.com/'>Offical jQuery UI website</a><br> |
|
111 |
</div> <!---- End Container div ----> |
|
112 |
||
113 |
<h2 id="SVG">SVG Viewer</h2> |
|
114 |
<div class="container"> |
|
115 |
<div class="info">The SVG converter application converts (many) SVG files to HTML5 code that can be used to draw vector graphics. <i><b>Note!</b> that not all SVG files work.</i></div> |
|
116 |
<a href='SVG'>SVG Converter</a><br> |
|
117 |
<a href='SVG/SVG.rar'>SVG Converter Source Code</a><br> |
|
118 |
</div> <!---- End Container div ----> |
|
119 |
||
120 |
<h2 id="html5">HTML5 Examples</h2> |
|
121 |
<div class="container"> |
|
122 |
<div class="info">Some simple HTML5 code examples</div> |
|
123 |
<a href='HTML5/HTML5Example1_canvas.php'>Example 1: Basic canvas graphics</a><br> |
|
124 |
<a href='HTML5/HTML5Example2_canvas2.php'>Example 2: Canvas Gradients and Transformations</a><br> |
|
125 |
<a href='HTML5/HTML5Example3_canvas3.php'>Example 3: Animation and drawing images</a><br> |
|
126 |
<a href='HTML5/HTML5Example4_canvas4.php'>Example 4: Shadows</a><br> |
|
127 |
||
128 |
<a href='HTML5/HTML5Example5_canvas5.php'>Example 5: Reading mouse coordinates</a><br> |
|
129 |
<a href='HTML5/HTML5Example6_canvas6.php'>Example 6: 2D Tile Map</a><br> |
|
130 |
<a href='HTML5/HTML5Example7_canvas7.php'>Example 7: Isometric Tile Map</a><br> |
|
131 |
<!--simple cookies-->
|
|
132 |
<!--basic localstorage-->
|
|
133 |
<a href='HTML5/HTML5Example8_basiccookies.php'>Example 8: Basic cookies</a><br> |
|
134 |
<a href='HTML5/HTML5Example9_basiclocalStorage.php'>Example 9: Basic localStorage API</a><br> |
|
135 |
||
136 |
<a href='HTML5/HTML5Example10_cookies.php'>Example 10: Cookies</a><br> |
|
137 |
<a href='HTML5/HTML5Example11_localStorage.php'>Example 11: localStorage API</a><br> |
|
138 |
||
139 |
<a href='HTML5/HTML5Example12_history.php'>Example 12: History API</a><br> |
|
140 |
<a href='HTML5/HTML5Example13_draganddrop.php'>Example 13: HTML5 Drag and drop</a><br> |
|
141 |
<a href='HTML5/HTML5Example14_imagezoom.php'>Example 14: Image zoom</a><br> |
|
142 |
<a href='HTML5/HTML5Example15_clipping.php'>Example 15: Canvas clipping region</a><br> |
|
143 |
<a href='HTML5/HTML5Example16_masking.php'>Example 16: Canvas compositing</a><br> |
|
144 |
<a href='HTML5/HTML5Example17_html5video.php'>Example 17: HTML5 Video</a><br> |
|
145 |
<a href='HTML5/HTML5Example18_canvasvideo.php'>Example 18: Canvas video and screenshots</a><br> |
|
146 |
<a href='HTML5/HTML5Example19_contenteditable.php'>Example 19: Contenteditable</a><br> |
|
147 |
<a href='HTML5/HTML5Example20_contenteditable2.php'>Example 20: Rich text editor</a><br> |
|
148 |
<div class="info">Some simple HTML5 demo examples</div> |
|
149 |
<!--<a href='HTML5/localstorage_cookies.html'>Local Storage Cookies</a><br>
|
|
150 |
<a href='HTML5/localstorage_localstorage.html'>Local Storage</a><br>-->
|
|
151 |
<a href='HTML5/canvas_test_curve_0.html'>Canvas Curve Example 1</a><br> |
|
152 |
<a href='HTML5/canvas_test_curve.html'>Canvas Curve Example 2 Simple Detect Click</a><br> |
|
153 |
<!--<a href='HTML5/canvas_test_clock.html'>Canvas Gradient and Transformation Example (Clock)</a><br>-->
|
|
154 |
<a href='HTML5/canvas_test_lines.html'>Lines Example</a><br> |
|
155 |
<!--<a href='HTML5/canvas_test_pattern_II.html'>Patterns Example 1</a><br>
|
|
156 |
<a href='HTML5/canvas_test_pattern_III.html'>Patterns Example 2 With Shadows</a><br>-->
|
|
157 |
<a href='HTML5/canvas_shadowGlow.html'>Shadows for Glow Effect</a><br> |
|
158 |
<a href='HTML5/canvas_test_svgimported.html'>Imported SVG</a><br> |
|
159 |
<a href='HTML5/canvas_test_starso.html'>Particles 1 Starspiral</a><br> |
|
160 |
<a href='HTML5/canvas_test_particles.html'>Particles 2 Fireworks</a><br> |
|
161 |
<a href='HTML5/canvas_3dtest.html'>3D Example 1</a><br> |
|
162 |
<a href='HTML5/canvas_3dtest_II.html'>3D Example 2</a><br> |
|
163 |
<a href='HTML5/canvas_3dtest_III.html'>3D Example 3</a><br> |
|
164 |
<a href='HTML5/canvas_3dtest_IV.html'>3D Example 4</a><br> |
|
165 |
<br> |
|
166 |
<a href='HTML5/Enkelgrafik_Curves.html'>Simple graphics with clickable geometry</a><br> |
|
167 |
<a href='HTML5/Enkelgrafik_Gradients.html'>Simple graphics with gradients</a><br> |
|
168 |
<a href='HTML5/Enkelgrafik_Rasterisering.html'>Simple graphics with DrawImage and Compositing</a><br> |
|
169 |
<a href='HTML5/Enkelgrafik_Transformationer.html'>Simple graphics with transformations</a><br> |
|
170 |
<div class="info">You may also find the quick reference sheet below useful</div> |
|
171 |
<a href='http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html'>Canvas Cheat Sheet</a><br> |
|
172 |
</div> <!---- End Container div ----> |
|
173 |
</div> <!---- End Group div ----> |
|
174 |
||
175 |
<div class="group"> |
|
176 |
<h1>AJAX API documentation & Management</h1> |
|
177 |
<h2 id="ajaxapi">AJAX API Administration</h2> |
|
178 |
<div class="container"> |
|
179 |
<div class="info">Management of resources, customers, bookings, availability</div> |
|
180 |
<a href="admin/editresource.php">Edit resources</a> </br> |
|
181 |
<a href="admin/editcustomers.php">Edit customers</a> </br> |
|
182 |
<a href="admin/editbooking.php">Edit bookings</a> </br> |
|
183 |
<a href="admin/editavailability.php">Edit resource availability</a> </br> |
|
184 |
</div> <!---- End Container div ----> |
|
185 |
<h2 id="ajaxapiexamples">AJAX API Examples & Demos</h2> |
|
186 |
<!--<h2>AJAX API Overview</h2>-->
|
|
187 |
<div class="container"> |
|
188 |
<div class="info">Documentation of parameters and calls</div> |
|
189 |
<a href="calls.html">Overview</a> </br> |
|
190 |
</div> <!---- End Container div ----> |
|
191 |
||
192 |
<div class="container cols"> |
|
193 |
<div class="info">Create and get information about a customer</div> |
|
194 |
<a href="AJAX/AjaxDemoApp1_storeCustomer.php">Creation of Customer</a> |
|
195 |
<a class="demo" href="AJAX/AjaxDemoApp1_storeCustomer.html">demo</a> </br> |
|
196 |
<a href="AJAX/AjaxDemoApp0_getCustomer.php">Get customer information</a> |
|
197 |
<a class="demo" href="AJAX/AjaxDemoApp0_getCustomer.html">demo</a> </br> |
|
198 |
||
199 |
<div class="info">Get information about resources. (create a resource and edit availability in the administration panel)</div> |
|
200 |
<a href="AJAX/AjaxDemoApp3_getResources.php">Get resources</a> |
|
201 |
<a class="demo" href="AJAX/AjaxDemoApp3_getResources.html">demo</a> </br> |
|
202 |
<a href="AJAX/AjaxDemoApp8_getResourceAvailability.php">Get resource availability</a> |
|
203 |
<a class="demo" href="AJAX/AjaxDemoApp8_getResourceAvailability.html">demo</a> </br> |
|
204 |
||
205 |
<div class="info">Make and get information about bookings</div> |
|
206 |
<a href="AJAX/AjaxDemoApp6_makeBookings.php">Make bookings</a> |
|
207 |
<a class="demo" href="AJAX/AjaxDemoApp6_makeBookings.html">demo</a> </br> |
|
208 |
||
209 |
<a href="AJAX/AjaxDemoApp5_showBookings.php">Get bookings</a> |
|
210 |
<a class="demo" href="AJAX/AjaxDemoApp5_showBookings.html">demo</a> </br> |
|
211 |
||
212 |
<a href="AJAX/AjaxDemoApp4_getBookingsForDate.php">Get bookings for date</a> |
|
213 |
<a class="demo" href="AJAX/AjaxDemoApp4_getBookingsForDate.html">demo</a> </br> |
|
214 |
||
215 |
<a href="AJAX/AjaxDemoApp2_getCustomerBookings.php">Get customer bookings</a> |
|
216 |
<a class="demo" href="AJAX/AjaxDemoApp2_getCustomerBookings.html">demo</a> </br> |
|
217 |
||
218 |
<a href="AJAX/AjaxDemoApp7_makeBookingsTimer.php">Make bookings with timer</a> |
|
219 |
<a class="demo" href="AJAX/AjaxDemoApp7_makeBookingsTimer.html">demo</a> </br> |
|
220 |
||
221 |
<div class="info">Make and get clicks</div> |
|
222 |
<a href="javascript:void(0);" onclick="alert('Only demo');">Make clicks</a> |
|
223 |
<a class="demo" href="AJAX/AjaxDemoApp9_makeClick.html">demo</a> </br> |
|
224 |
<a href="javascript:void(0);" onclick="alert('Only demo');">Get clicks</a> |
|
225 |
<a class="demo" href="AJAX/AjaxDemoApp10_getClicks.html">demo</a> </br> |
|
226 |
</div> <!---- End Container div ----> |
|
227 |
<h2>Source Code Download</h2> |
|
228 |
<div class="container"> |
|
229 |
<div class="info">AJAX API source code</div> |
|
230 |
<a href="Bookingsystem_1.3.zip">Source Code (v 1.3) Download</a><br> |
|
231 |
<a href="Bookingsystem_1.2.zip">Source Code (v 1.2) Download</a><br> |
|
232 |
<!--<a href="makebooking_XML.zip">Fixed Version of makebooking_XML.php</a><br>
|
|
233 |
<a href="Bookingsystem_1.1.rar">Source Code (v 1.1) Download</a><br>
|
|
234 |
<a href="Bookingsystem_1.0.zip">Source Code (v 1.0) Download</a><br>-->
|
|
235 |
<a href="Bookingsystem.sql">SQL Source Code for Running Database at Home</a><br> |
|
236 |
</div> <!---- End Container div ----> |
|
237 |
</div> <!---- End Group div ----> |
|
|
1
by Henrik G.
First seed of Lenasys ... Needs to be Organized Further |
238 |
</div> |
239 |
</body> |
|
240 |
</html> |