Scripting multimedia web pages

Chapter 07: Scripting multimedia web pagesSCRIPTING MULTIMEDIA WEB PAGES LEARNING OUTCOMEUpon the completion of this chapter you should be able to:Understand assorted scripting methods used for web page designing.Know the different types of scheduling linguistic communications.Know the OOP paradigm and Java book.Know OOP paradigm and slangUnderstand the Java 3D theoretical account.Know the assorted multimedia formats.7.1 Scripting multimedia web pagesMultimedia would be lifeless without scripting. Multimedia becomes synergistic when scripting is added to it. The interaction characteristics such as doing a bill of fare button, alteration of colour on axial rotation over of mouse, signifier filling on a web page and compilation and directing that information to another topographic point ; opening a new browser window when choosing a hyperlink ; triping a new sequence when an image is selected or even doing simple games.7.1.1 Types of scheduling linguistic communicationsMachine codification is the most basic type of scheduling.Machine codification is merely one typeIt is composed merely of the two binary figures: 0 and 1.Interpretation of the machine codification depends on the hardware running in the computing machine.Programing linguistic communications are of many types. The most of import linguistic communications are:General-purpose scheduling linguistic communicationScripting scheduling linguistic communicationObject-oriented scheduling linguistic communicationGeneral-purpose scheduling linguistic communications include Java, C and C++ . These linguistic communications are to be compiled by a compiler plan. A compiler is a plan which translates beginning codification written in a peculiar scheduling linguistic communication into computer-readable machine codification that can be executed on its ain. JavaScript, Flash ActionScript and Lingo come under Scripting linguistic communications ; nevertheless it uses Object-oriented linguistic communication every bit good. General characteristics of scripting linguistic communications are:Easy to larn and utilizeNeed non be compiledBy and large interpreted at run-timeAssociated with a diverse scope of bing computing machine constituentsAble to pass on with other scheduling and scripting linguistic communications.7.1.2 Basic control constructionsPrograming linguistic communications have control constructions that direct the flow of information. The three basic control constructions are:sequencechoicerepeatConsecutive control construction:The stairss from start to complete are absolutely carried out one after another, without any break. Selection control construction:These are statements where a true/false pick is made. The ‘ if ‘ statement:If the status is true, so a certain action or actions can be triggered ; if false, so they are ignored. These types of statements are normally known as an ‘if ‘ statement. The ‘if/else ‘ statement:If the status is true, so a certain action or actions can be triggered ; if false, so a certain action or actions can be triggered. Repetition control construction:These are statements that are often acted upon while a peculiar status remains true. While the status is true, the needed actions will be carried out. Equally shortly as the needed status is false, so the cringle will be ignored. It is of import to observe that there must ever be some manner to do a status false. The basic control constructions can besides work together in a sequence or nested within each other to quite complex statements.7.1.3 The OOP paradigmThe scripting languages belong to a set called Object Orientated Programming, or OOP that incorporates Lingo, ActionScript and JavaScript. OOP breaks the sequence of stairss from top to bottom into separate parts called objects that interact with each other in a non-linear manner. OOP is based on grouping scripting information into categories. From a category, multiple cases can be made and used. These cases are referred to as objects. Each object has belongingss and methods. These programming objects are same as existent universe objects. All the objects such as frames, movieClips, films, cast members, buttons, text Fieldss, etc. are merely objects made with codification. They are seeable because they have belongingss such as size, colour, place, etc. and the user can utilize them as they have methods such as drama, halt, edit, etc.Puting up for codificationJavaScript, ActionScript and Lingo have different scripting environments.JavaScript is by and large bound to net pages.ActionScript is inside the frames of a timeline and on objects such as buttons and movieClips.Lingo is like ActionScript, but has different types of books depending on where it is used.Event animal trainersAn event occurs when the mouse is moved or the mouse button is clicked, a key is pressed or a web page is loaded. It is a individual happening though it may be repeated many times a 2nd, such as enterFrame in ActionScript and Lingo. The animal trainer is the piece of codification that every book linguistic communication contains to observe the events. Some event animal trainers are common to JavaScript, ActionScript and Lingo, and some are specific to certain scripting linguistic communication. Common event animal trainers are mouseup, mouseDown and enterFrame JavaScript and ActionScript allow books to be triggered without the event animal trainer, In JavaScript, any codification that is decently added between the book ticket is carried out when loaded into the browser. In ActionScript, any codification that is right added to an single frame in any timeline will be executed when the playhead enters that frame. In Lingo, codification must be with in an event animal trainer.7.1.4 OOP and JavaScriptAll the scripting linguistic communications have default and user defined objects. Default objects are built in the scripting linguistic communication and User defined objects are 1s that are made by you. In scripting linguistic communications like JavaScript, you can hold every bit many cases of a peculiar object category as you like. Your scripting linguistic communication should cognize the specific object case you target and the belongings or method you want to command. One of the most critical belongingss is calling single object cases. In JavaScript, the ‘name ‘ property is added to the HTML elements ticket. For illustration, to call the signifier ‘loginForm ‘ in an HTML use the undermentioned codification:& lt ; signifier name= † loginForm † & gt ;Objects in JavaScript are called the Document Object Model ( DOM ) . DOM is a hierarchy of objects that are contained in each HTML page. These objects are chiefly categorized into three types Window object, papers object and signifier object. Window object is at the top of the hierarchy. Document and form objects are largely manipulated. The signifier object is ever in the papers object. DOM illustration: Text field for login To entree the text in a text field i.e ‘username ‘ located in a signifier called ‘loginForm ‘ on a web page: document.loginForm.userName.value ( read this from right to left ) Here the scripting statement entree the ‘value ‘ belongings of the text field object called ‘userName ‘ that is in the signifier object called ‘loginForm ‘ , which is in bend is in the web page ‘s papers object. The terminal consequence of this statement is text threading value.Properties and methods in JavaScriptProperties Properties are by and large linked to the physical visual aspect of scripting objects. In existent life, objects besides have belongingss. Some belongingss of object are read-only, that is the belongings ‘s value can be retrieved but can non be changed. Other object belongingss can be retrieved and changed. These characteristics are referred to as proving or puting a belongings ‘s value. Example 1: sentence structure: JavaScript – proving a image ‘s width belongingsdocument.greenHondaCRX.width In this illustration, the scripting statement entree the value of the ‘width ‘ belongings of the image object called ‘greenHondaCR ‘ , that is in web page ‘s papers object. Example2: sentence structure: JavaScript – puting a image ‘s width belongingsdocument.greenHondaCRX.width = â€Å" 257 † In this illustration, the scripting statement is puting the value of the ‘width ‘ belongings of the image object called ‘greenHondaCR ‘ to ‘257 ‘ . The ‘greenHondaCR ‘ image object is in web page ‘s papers object. Methods Methods are linked to the intent and actions of an object. Real life objects can besides hold methods/actions. Methods require excess information for the object to transport out the action right. In scripting linguistic communications this excess information is referred to as a methods parametric quantities or statements. Example 3: sentence structure: JavaScript – utilizing the history objecthistory.go ( -1 ) In this illustration, the scripting statement is utilizing the ‘go ‘ method of the history object. Methods are typically recognized by the usage of brackets â€Å" ( ) † after the methods name. The brackets are used to envelop any parametric quantities that you send to the method. In the above illustration, we are directing negative one ( -1 ) , which instructs the ‘go ‘ method of the ‘history ‘ object to lade the old web page.7.1.5 OOP and ActionScriptIn ActionScript, select the object case on phase and enter an case name in the Properties panel. This is same as appellative variables. ActionScript uses aim waies to maintain path of object cases. These waies are laid out like a route map and object should hold a name to look on this route map. This route map is a hierarchy, with the chief timeline at its base. ActionScript shows the object hierarchy in a file by snaping the ‘insert mark way ‘ button situated in the ActionScript Panel. Let us take an illustration â€Å" Target way ‘road map ‘ : Text field and button for login, † where we have two objects a film cartridge holder with a text field in it and a button. They are in the root timeline. Select each point and verify its name in the Properties Panel.The movieClip has the name ‘loginClip ‘ .The text filed in the movieClip is named ‘userName ‘ .The button is name ‘ btnLogin ‘ .Choose the button in the root timeline and open the ActionScript Panel in ‘Expert Mode ‘ Click the ‘Insert a mark way † button.The ‘Insert Target Path ‘ duologue box opens and shows a ocular representation of the ‘road map ‘ of objects presently accessible from the timeline that we are in.In the ‘Insert Target Path ‘ duologue box, choice ‘Dots ‘ and ‘Absolute ‘ options.Click the little plus gestural ‘+ ‘ following to the movieClip icon nam e ‘loginClip ‘ to demo the text field object in it.The existent mark way of the selected movieClip object ‘loginClip ‘ appears.Click the text filed icon ‘userName ‘ , the mark way alters.In ActionScript, absolute mark waies ever start from the _root timeline of the file. Relative mark waies start with the current object selected on phase.Click on the option ‘Relative ‘ .Click on the little plus gestural ‘+ ‘ following to the movieClip icon name ‘loginClip ‘ and select the ‘userName ‘ text field.The mark way alters. Alternatively get downing with ‘_root ‘ it now starts with ‘this ‘ , bespeaking the objects that are presently selected on phase.We have a mark way from the point we have originally selected on phase, the ‘btnLogin ‘ button, to the text field ‘userName ‘ that resides in the movieClip ‘loginClip ‘ .7.1.6 OOP and LingoIn Lingo, the most normally used objects are cast members, and cast member object cases are sprites. In Director the objects must be in the film ‘s dramatis personae to look on the phase. All cast members that are placed in the mark have a default dramatis personae member figure and a alone dramatis personae member name. Through these two dramatis personae member belongingss, Lingo communicates to specific dramatis personae members and its associated sprites. To pass on to single sprite cases in the mark, Lingo uses the fairy ‘s figure. Sprite Number Example In Director, everything that is on the phase goes into a channel in the mark. Merely one fairy can busy a channel. For illustration the fairy ‘s figure is four, the sentence structure to entree the width belongings of this fairy would be:fairy ( 4 ) .widthorthe breadth of sprite 4 Lingo has two types of sentence structure: The first codification sample uses ‘dot ‘ sentence structure, which is in broad usage now. The 2nd illustration is what Lingo calls ‘verbose ‘ sentence structure. Almost any Lingo statement can be written with either dot sentence structure or verbose. In the first ‘dot ‘ syntax illustration, the scripting statement is aiming the fairy object that is in channel four of the mark and accessing its ‘width ‘ belongings. To Lingo, this whole complete line of codification represents one whole number value stand foring the fairy ‘s current breadth in pels. Cast member Name Example In Director, everything that is created or imported into the dramatis personae is allocated a dramatis personae member figure and a alone dramatis personae member name. Choose a dramatis personae member and enter its name in the ‘Cast Member Name ‘ text field. For illustration, a dramatis personae member 2, which its name â€Å" green square † :member ( â€Å" green square † )member ( 2 ) It is standard industry pattern to utilize cast member ‘s name instead that its figure. In some particular fortunes the usage of cast member Numberss would be effectual. For the sprite illustration in Lingo codification, the sentence structure for aiming cast member objects can be written in both ‘dot ‘ and ‘verbose ‘ sentence structure. In the first ‘dot ‘ sentence structure, the scripting statement is aiming the dramatis personae member named â€Å" green square † and accessing its ‘width ‘ belongings. To Lingo, this whole complete line of codification represents one whole number value stand foring the dramatis personae member current breadth in pels.Self cheque 7.11. If more than one dramatis personae member has the same name, what will Lingo make if that name is used in book?7.2 Java 3DJava 3D is a set of criterions that have been broaden under Java 2 for making 3D artworks. Java 3D is a scene graph-based 3D application programming interface ( API ) for the Java platform. It runs on top of either OpenGL or Direct3D.Advantages of Java 3D:Platform Mugwump:It is platform independent as it is an API extension of Java. Object-oriented 3D Artworks:It is carried out by utilizing a scene graph-based 3D artworks theoretical account. Optimized Speed:During runtime, the scene graph of the fastest possible renders is optimized by utilizing the rendition capableness spots. This facilitates the Java 3D to be used in synergistic artworks environments every bit good as high quality artworks. Rise of 3D stevedores:Free handiness of Java 3D VRML97 file stevedore and browser, with their codifications. Support Exotic Devicess:The com.sun.j3d.utils.trackers package provides Fake infinite, Logitech, and Polhemus devices.Disadvantages of Java 3D:Standard Extension API:Java 3D is a standard extension API to the Java2 platform, which is regarded as a hazard factor as it may restrict the portability of Java 3D codification across platforms. Availability Limitation:Sun is the lone key seller that is back uping Java 3D through Solaris and Win32. The cross-platform portability is a serious issue for Java 3D. Concealment of Rendering Pipeline inside informations:Java 3D a high degree API, deliberately hides inside informations of the rendering grapevine from the developer therefore doing it incompatible for applications where such inside informations are required. Heavyweight constituents:Java 3D, being heavyweight, carries out the rendering through native non-Java equal. In general the lightweight and heavyweight constituents of Java do non blend good when placed together in one object or window.7.2.1 Key differences between Java 3D and VRMLProgram attack: In making 3D universes, VRML adopts a content-centric attack and Java 3D adopts a program-centric attack. Flexibility:Java 3D is more lissome in footings of programming manner and the maps available. The better figure of available maps makes Java 3D a better tool in making specific and modified behaviour and applications. Java 3D provides extended support for behaviours, interpolators, niping and hit sensing. Application complexness:VRML is more suited for simple artworks applications where as Java 3D is more suited for making the content or 3D universe applications. File format:VRML has a standardized file format. Java 3D, has capableness to back up compiled codification of low degree API for faster 3D artworks rendering. Compatibility:Java 3D supports VRML objects through the VRML97 stevedore but VRML can non run Java 3D plans. Dynamic fluctuation of scene graph:The scene graph that describes the practical 3D universe created in Java 3D can be changed dynamically but in VRML it is non executable. Vendor support:Most of the sellers support VRML than Java 3D. Some portion of Java 3D is basically evolves from OpenGL. OpenGL is non good suited for developing complicated 3D artworks applications due to programming, debugging, and care attempts.FeaturesMultithreaded scene graph constructionGeneric Real-time API, useable for both visual image and gamblingSupport for retained, compiled-retained, and immediate manners renderingIncludes hardware-accelerated JOGL, OpenGL and Direct3D renderers ( depending on platform )Platform independentNative support for head-mounted showCAVE ( multiple screen projectors )3D spacial soundcomplicated virtual-reality-based position theoretical account with clasp for stereoscopic rendition and complex multi-display constellationsProgrammable shaders, back uping both GLSL and CGImporters for most mainstream formats, like 3DS, OBJ, VRML, X3D, NWN, and FLTStencil bufferSelf cheque 7.21. List out the advantages and disadvantages of java3D7.3 Multimedia FormatsMultimedia elements like sound or pictures are stored in med ia files. Detect the file extension to place the media type. If the file is an HTML page, the browser spots the file extensions as.htm or.html. If it is an XML file, the browser spots it as.xml extension and the manner sheet is spotted as.css. Image formats are identified by extensions like.gif and.jpg.Windows Multimedia Formats:Windows media files have the extensions like.asf, .asx, .wma, and.wmv. Advanced Streaming Format ( ASF ) ASF is peculiarly designed to run over the Internet. ASF files include audio, picture, slide shows, and synchronised events. These files should be good compressed and are delivered as a changeless flow of informations. The file size is non restricted but should be good compressed to fit assorted bandwidths. Advanced Stream Redirector Format ( ASX ) ASX files are metafiles that provide information about files used to depict multimedia content. These are field text files Windows Media Audio Format ( WMA ) WMA format is developed by Microsoft to manage all types of audio content. Similar to ASF arrange these files excessively should be good compressed and are delivered as a changeless flow of informations. The file size is non restricted but should be good compressed to fit assorted bandwidths. Windows Media Video Format ( WMV ) WMV format is developed by Microsoft to manage all types of picture content. Similar to ASF arrange these files excessively should be good compressed and are delivered as a changeless flow of informations. The file size is non restricted but should be good compressed to fit assorted bandwidths. Windows Media Audio Redirector Format ( WAX ) WAX files are similar to ASX files, but designed to depict audio files. Windows Media Player Format ( WMP ) WMP files and WMX are reserved file types for future usage by Windows. Multimedia elements like sound or picture besides have their ain file formats with different extensions.General-purpose FormatsMatroska File Format:which aims to be an all-enclusive, unfastened multimedia container format. Acorn Replay File Format:Acorn Replay ( RPL ) file format used on RISC OS machines. The format is frequently seen on Eidos games, but is designed as a all-purpose format.Self cheque 7.31. List out assorted multimedia formats and their utilizations.7.4 SummaryThis is the 7th faculty for the multimedia web development class. This faculty explains about the different types of programming linguistic communications such as General-purpose scheduling linguistic communication, Scripting programming linguistic communication and Object-oriented scheduling linguistic communication.In this chapter you have learnt about control constructions that direct the flow of information in scheduling linguistic communication. Additionally you have learnt the different types of control construction such as sequence, choice and RepeatIn add-on, this faculty pointed out the OOP paradigm and JavaScript. Further you have learnt about Properties and methods in JavaScript.It besides explained the Java 3D, a scen e graph-based 3D application programming Interface.Finally you have learnt about the advantages and disadvantages of Java 3D and the cardinal differences between Java 3D and VRMLCardinal TERMSDOM – Document Object Model ASF – Advanced Streaming Format ASX – Advanced Stream Redirector Format WMA – Windows Media Audio Format WMV – Windows Media Video Format WMP – Windows Media Player Format WAX – Windows Media Audio Redirector Format MentionDavid Miller ( 1996 ) : Web multimedia development – pages 649 ; ISBN1562056832, 9781562056834 Timothy Paul Garrand ( 2001 ) : Writing for multimedia and the web – Pages 341 ; ISBN0240803817, 9780240803814 Stephen McGloughlin ( 2009 ) : Multimedia on the Web – Pages 193 ; ISBN1575766485, 9781575766485 Timothy Paul Garrand ( 2006 ) : Writing for multimedia and the Web: a practical usher to content development for synergistic media – Pages 478 ; ISBN0240808223, 9780240808222 ActivityA. True/False Questions 1. Machine codification is composed merely of the two binary figures 0 and 1. ( TRUE/FALSE ) 2. Multimedia would be lifeless without scripting. ( TRUE/FALSE ) 3. Programing linguistic communications do non hold control constructions to direct the flow of information. ( TRUE/FALSE ) 4. OOPs is based on grouping scripting information into categories. ( TRUE/FALSE ) 5. In OOP ‘s each object does non hold belongingss and methods. ( TRUE/FALSE ) 6. An event will non happen when the mouse is moved or the mouse button is clicked. ( TRUE/FALSE ) 7. ActionScript uses aim waies to maintain path of object cases. ( TRUE/FALSE ) 8. Java 3D is a scene graph-based 3D application programming interface ( TRUE/FALSE ) 9. Java 3D is platform dependant. ( TRUE/FALSE ) 10. WMV format is developed by Microsoft to manage all types of picture content. ( TRUE/FALSE ) B. Multiple Choice1. The different types of scheduling linguistic communications are __________ A ) General-purpose scheduling linguistic communication B ) Scripting programming linguistic communication C ) Object-oriented scheduling linguistic communication D ) All the above 2. In _____________ the stairss from start to complete are absolutely carried out one after another, without any break. A ) Sequential control construction B ) Selection control construction C ) Repetition control construction D ) None of the above 3. The OOP stands for A ) Object Operating Programing B ) Original Orientated Programming C ) Object Orientated Programming D ) Object Orientated Patch 4. Which of The followers is a basic control constructions? A ) sequence B ) choice C ) A & A ; B D ) None of the above 5. In OOPs the cases are referred to as ________ A ) Properties B ) Objects C ) Methods D ) None of the above 6. Objects in JavaScript are called the ____________- A ) Document Oriented Model B ) Document Object Model C ) A & A ; B D ) None of the above 7. ____________ shows the object hierarchy in a file by snaping the ‘insert mark way ‘ button A ) ActionScript B ) OOP C ) Lingo D ) All the above 8. In making 3D universes, VRML adopts a _________________ and Java 3D adopts a __________________ A ) content-centric attack, program-centric attack. B ) program-centric attack, content-centric attack C ) program-centric attack, program-centric attack D ) None of the above 9. Extensions used by Windows media files are A ) .asf B ) .asx C ) .wma, D ) All the above 10. __________files are metafiles that provide information about files used to depict multimedia content. A ) WMA B ) WMV C ) ASX D ) All the above Chapter 7: Answers ( True/False Questions ) 1. T 2. Thymine 3. F 4. Thymine 5. F 6. F 7. T 8. Thymine 9. F 10. Thymine Answer ( Multiple Choice Questions ) 1. D 2. Angstrom 3. C 4. C 5. B 6. Bacillus 7. A 8. Angstrom 9. D 10. C