Introduction TAMZ 1. Lab 1

Transcription

1 Introduction TAMZ 1 Lab 1

2 Safety Precautions for A1028 Valid safety training for University laboratories Safety training for A1028 lab Compulsory signature on the safety protocol. Random persons are asked to check the knowledge of the safety regulations. Laboratory operating rules

3 Basic Information Network connection (plugs) University network plugs RD5 Laboratory (local only) plugs RD1-4 (will not be used, terminated in the local racks) Ubuntu Normal user: cnap (password: cisco) Administrator (usually not needed): substitute current user su (password: cisco) All locally saved files and cookies are temporary, all changes are lost after the reboot!!! It is recommended to use USB drive

4 Development Tools IDE Netbeans 7.3+ (Ubuntu 7.4) HTML5, PHP (Download: ALL/PHP) Requires JDK 1.7 Recommended IDE Eclipse + plugin (!) Aptana Studio Installation of AS3 may crash on new Linux distributions Visual Studio, Geany, gedit, vim,

5 Running and Debugging Integrated Browser WebKit (NB) Changes in code are immediately visible Predefined device sizes Integrated Debugging Console Not the best support for HTML5 Google Chrome/Chromium Plugins: NetBeans Connector Web Developer Xdebug Helper CollorZilla

6 Running and Debugging Android Emulator Android SDK (the address may have to be changed to manually) Genymotion (requires registration) Device running Android (requires Android SDK) Favorite Browser Small snippets of code on-line (e.g. W3School

7 GUI Creation for jquery Mobile Manually Full control of page design Harder for remembering parts Faster results Rapid Interface Builder (Chrome) Chrome/-ium must be run with --allow-file-access-from-files --enable-file-cookies Since 2012 no updates, recommended for beginners, supports only export Sometimes generates deprecated code

8 GUI Creation for jquery Mobile Manually Full control of page design Harder for remembering parts Faster results Rapid Interface Builder (Chrome) Local use: Chrome/-ium must be run with --allow-file-access-from-files enable-file-cookies ZIP: Since 2012 no updates, recommended for beginners, supports only export Sometimes generates deprecated /legacy code

9 Rapid Interface Builder

10 Rapid Interface Builder

11 Rapid Interface Builder Extract.zip to public_html (Netbeans project folder)

12 Netbeans: New Project

13 jquery Mobile Template Local template CDN hosted (remote) template

14 Hello World

15 Hello World Page Page including page definition (ID, appearance) Button including link, icons (from default set) and target (#ID) Color scheme: a light (default) b dark c-z user-defined

16 Generic Page Template Templates including Hello World are available on:

17 Buttons <a href="#" data-role="button">hello world</a> <a href="#" data-role="button" data-icon="check" data-iconpos="right">hello world icon</a> <div data-role="controlgroup" data-type="horizontal"> <a href="#anylink" data-role="button">button 1</a> <a href="#anylink" data-role="button">button 2</a> <a href="#anylink" data-role="button">button 3</a> </div>

18 Example 2 Dynamic......

19 Corresponding greeter.js After the page creation Register click action on button greeting After the click, check whether fullname is not empty If empty, prevent showing dialog and display alert Otherwise, display the dialog with entered name