Mark Dixon, SoCCE SOFT 131Page 1 03 – Information Processing: Expressions, Operators & Functions

Mark Dixon, SoCCE SOFT 131Page 2 Questions: Events Consider the following code: a) How many unique events does it contain? b) Name the event(s). Sub btnAns_OnClick() document.bgcolor = "yellow" lblComment.innertext = "Correct, well done!" document.bgcolor = "cyan" lblComment.innertext = "Sorry, try again" End Sub 1 Click OnClick

Mark Dixon, SoCCE SOFT 131Page 3 Questions: Properties Consider the following code: a) How many unique properties does it contain? b) Name the properties. Sub btnAns_OnClick() document.bgcolor = "yellow" lblComment.innertext = "Correct, well done!" document.bgcolor = "cyan" lblComment.innertext = "Sorry, try again" End Sub 2 bgcolor, innertext

Mark Dixon, SoCCE SOFT 131Page 4 Questions: Keywords Consider the following code: a) How many unique keywords does it contain? b) Name the keywords. Sub btnAns_OnClick() document.bgcolor = "yellow" lblComment.innertext = "Correct, well done!" document.bgcolor = "cyan" lblComment.innertext = "Sorry, try again" End Sub 2 Sub End

Mark Dixon, SoCCE SOFT 131Page 5 Session Aims & Objectives Aims –Introduce you to main processing concepts, i.e. expressions, operators and functions Objectives, by end of this week’s sessions, you should be able to: –evaluate expressions –assign a value to a object's property, using combination of literal values, operators, functions, and identifiers

Mark Dixon, SoCCE SOFT 131Page 6 Meet George Common Boa Constrictor –boa constrictor imperator Native to Central & South America No venom (no poison)

Mark Dixon, SoCCE SOFT 131Page 7 Looking after George Problem: –Difficult to keep –Require temperature and humidity controlled environment –Much of the literature is from the US Temperature in Fahrenheit: 80-85F day, 78F minimum at night (P Vosjoli 1998) Solution –Need a program to convert from Celsius to Fahrenheit

Mark Dixon, SoCCE SOFT 131Page 8 Example: Temp User Requirements –describe user's objectives no mention of technology Software Requirements –Functional list facilities to be provided (often numbered) –Non-functional list desired characteristics (often more subjective) SPECIFICATION User Requirements –help snake keeper convert from fahrenheit to celcius Software Requirements –Functional: –enter fahrenheit value –display celsius value –Non-functional should be quick and easy to use

Mark Dixon, SoCCE SOFT 131Page 9 Information Processing All computing problems: –involve processing information/data information has meaning (e.g. 5lb 3.3kg 18 years) data has no meaning (e.g ) –following this pattern: For example: –to add two numbers: = 16 Input DataProcessOutput Data

Mark Dixon, SoCCE SOFT 131Page 10 Information Processing (cont.) Hence, to solve any computing problem ask: –what information goes in –what processing is done to it –what information comes out

Mark Dixon, SoCCE SOFT 131Page 11 Example: Temp (User Interface) Temperature Fahrenheit: 0

Mark Dixon, SoCCE SOFT 131Page 12 To convert from Fahrenheit to Celsius: e.g. Fahrenheit is: Example: Temp (processing) c = 10 FahrenheitProcessCelsius 50

Mark Dixon, SoCCE SOFT 131Page 13 Operators Sit between the data = assignment operator addition operatorresult is subtraction operatorresult is 3 5 * 2 multiplication operatorresult is 10 5 / 2 division operatorresult is 2.5 convert mathematical symbols into operators: c = ((f – 32) * 5) / 9

Mark Dixon, SoCCE SOFT 131Page 14 Symbolic Representation Symbols (names) represent data txtFah.Value = 50 replace mathematical symbols with objects: parCel.innertext = ((txtFah.value - 32) * 5) / 9 Puts 50 into txtFah.Value The symbol txtFah.Value now represents 50

Mark Dixon, SoCCE SOFT 131Page 15 The following assignment statement: parCel.innertext = ((txtFah.value - 32) * 5) / 9 contains an expression Expressions Given: txtFah.Value = "68" can evaluate expression: parCel.innertext = ((txtFah.value - 32) * 5) / 9 (from above) parCel.innertext = (( ) * 5) / 9 (substitute) lblResult.InnerText = 20 (calculate)

Mark Dixon, SoCCE SOFT 131Page 16 Example: Temp (code) Untitled Page Sub btnCalc_OnClick() parCel.innertext = ((txtfah.value - 32) * 5) / 9 End Sub Fahrenheit: 0

Mark Dixon, SoCCE SOFT 131Page 17 Expression Evaluation

Mark Dixon, SoCCE SOFT 131Page 18 Expression Errors txtNum1.Value * * 12 + txtNum1.Value d o o d o d txtNum1.Value + 1 – d o d o d d many people instinctively know these are wrong data operator data operator

Mark Dixon, SoCCE SOFT 131Page 19 Example: Ball Char (v2) Functional Decomposition Incremental Development Get ball char to move automatically: –get ball char to appear on left of page –get ball char to move right on page

Mark Dixon, SoCCE SOFT 131Page 20 Client-side Object Model window object – properties include: –.status: get/set status bar window.status = “Hello” –.close: close current window window.close –.SetInterval: allow timed actions document object – properties include: –.title: get/set title of page –.write: write text to page –.bgColor: get/set background colour of page –.location: get/set current location of browser

Mark Dixon, SoCCE SOFT 131Page 21 Example: Ball Char (v2) Ball Char v2 Sub window_OnLoad () window.SetInterval "MoveBallRight", 50 End Sub Sub MoveBallRight () picBall.hspace = picBall.hspace + 5 End Sub Procedure name Interval (in milliseconds: 1000 = 1s)

Mark Dixon, SoCCE SOFT 131Page 22 Functions & Operators Used to: –process (manipulate) data Both Functions & Operators: –take input data/parameters (1 or more item) –process it –return a result which replaces the expression (substitution) Parameter(s) Result SQR Function (16)4

Mark Dixon, SoCCE SOFT 131Page 23 Functions (cont.) Functions: come before the data (which is in brackets) Sqr(16) square rootresult is 4 Abs(-23) absolute valueresult is 23 Int(2.543) integerresult is 2 Sin(3.1) sineresult is Cos(0) cosineresult is 1

Mark Dixon, SoCCE SOFT 131Page 24 Questions: Expressions a)What is the result of: Int(12.93) / 2 b)What is the result of: 1 + Int( ) + Sqr(Int(9.4523)) c)Write an expression to: give the square root of 9 d)Write an expression to: give the integer value of = 9 Sqr(9) Int( )

Mark Dixon, SoCCE SOFT 131Page 25 Absolute Positioning change properties – change position picBall.style.pixeltop picBall.style.pixelleftpicBall.width picBall.height document.body.clientwidth

Mark Dixon, SoCCE SOFT 131Page 26 Example: Space v1 Space Explorer Sub window_OnLoad() Randomize imgAstr.style.pixeltop = 100 End Sub Sub btnRand_OnClick() imgAstr.style.pixelleft = CInt( Rnd() * 300) parRand.innertext = imgAstr.style.pixelleft End Sub Shuffles random number generator Picks random number between 0 and 1

Mark Dixon, SoCCE SOFT 131Page 27 Example: Navigation Survey ship –mapping sea bed –must avoid oil rigs –8km of streamers (with hydrophones) –7-9 hours to turn know –cable length (500m) –cable angle work out –how far out

Mark Dixon, SoCCE SOFT 131Page 28 Example: Navigation Need to ensure horizontal distance –between ship and outer bouy (a) is less than –between ship and oil rig (b) bouy moves with current sensor equipment worth ~£30 million impossible to replace quickly a b

Mark Dixon, SoCCE SOFT 131Page 29 Trigonometry: Triangles hypotenuse (H) =500m opposite (O) adjacent (A) SOH CAH TOA Sin(ang) = O/H O = Sin(ang) * H Cos(ang) = A/H A = Cos(ang) * H Tan(ang) = O/A angle (ang)

Mark Dixon, SoCCE SOFT 131Page 30 Trigonometry: Radians Radians used by computers instead of degrees: 0 or 360 deg (0 or 6.2 rad) 90 deg (1.55 rad) 180 deg (3.1 rad) (4.65 rad) 270 deg rad = (deg/180) * 3.1 π π/2

Mark Dixon, SoCCE SOFT 131Page 31 Example: Navigation Navigation Sub Window_OnLoad() imgShip.style.left = 100 imgShip.style.top = 200 imgOilR.style.left = 150 imgOilR.style.top = 100 End Sub Angle:

Mark Dixon, SoCCE SOFT 131Page 32 Tutorial Exercises: Temperature LEARNING OBJECTIVE: to assign a value to a object's property, using combination of literal values, operators, functions, and identifiers Task 1: get the temperature example working Task 2: modify the temperature example so that it has two extra buttons – a plus and minus to increase and decrease the temperature

Mark Dixon, SoCCE SOFT 131Page 33 Tutorial Exercises: Exchange LEARNING OBJECTIVE: to assign a value to a object's property, using combination of literal values, operators, functions, and identifiers Task 1: create a new page that helps the user covert from Pounds to Dollars use the web to find the current exchange rate Task 2: Use the FormatNumber function to display the result to 2 decimal places. HINT: FormatNumber( , 3) gives

Mark Dixon, SoCCE SOFT 131Page 34 Tutorial Exercises: Ball Char LEARNING OBJECTIVE: to assign a value to a object's property, using combination of literal values, operators, functions, and identifiers Task 1: get the ball char (v2) example working Task 2: add a button that resets the ball char's horizontal position to 0 Task 3: add a text box that allows the user to enter the rate of increase Task 4: add a button that stops the ball char moving. HINT: button should put 0 into the text box Task 5: add two buttons – one for fast and one for slow Task 6: add two more buttons – one for fast backwards and one for slow backwards Task 7: use the properties window to hide the speed text box. Task 8: change the page to use absolute positioning.

Mark Dixon, SoCCE SOFT 131Page 35 Tutorial Exercises: Navigation LEARNING OBJECTIVE: to assign a value to a object's property, using combination of literal values, operators, functions, and identifiers Task 1: get the Navigation example working when the user clicks the Calc button, your program should calculate the angle in radians, and use this to re-position the bouy Task 2: modify the Navigation example so that the plus and minus buttons change the number of degrees by a value of 5