volii class – xii 2015-16 - SelfStudys

Manualon

INFORMATIONTECHNOLOGY

(ITAPPLICATION)

VOLIICLASS–XII2015-16

STATECOUNCILOFEDUCATIONALRESEARCH&TRAININGVarunMarg,DefenceColony,NewDelhi-110024

©SCERT,DelhiNo.ofCopies:200CopiesDecember,2015ISBNNo:978-93-85943-14-0

ChiefAdvisor

Ms.AnitaSatia,Director,SCERTGuidance

Dr.PratibhaSharma,JointDirector,SCERTConceivedCoordinatedandEditedby

NareshKapoorContributorsNareshKapoorRajeshB.WaldeMamurAliShailenderBhushanSanjeetKumarDeepaSharma

PublicationIncharge

Ms.SapnaYadavPublicationTeam

NavinKumar,MsRadhaandJaiBhagwanPublishedby

StateCouncilofEducationalResearchandTraining,DelhiDesign&Printedby:

STARFORMS,8710,RahatGanj,RoshanaraRoad,Delhi-110007

Contents

1. Curriculum:ClassXI-NSQFITLEVEL3(CLASS-XI):ITTOOLS(795)15

2. Curriculum:ClassXI-NSQFITLevel3(CLASS-XI):WebApplications-I(796)16

3. Curriculum:ClassXIINSQFITLevel4(CLASS-XII):DataManagementApplications17(Code:795)

4. Curriculum:ClassXIINSQFITLevel4(CLASS-XII):WebApplicationsII(Code:796)18

5. CircularofCBSEregardingImplementationofSkillCompetencyBasedVocational22CoursesinSchools

6. SchemeofStudies24

7. Chapter-1:ITDC-401DatabaseConcepts–RDBMSTool25

8. Chapter-2:ITDC-402OperatingWebBasedApplications49

9. Chapter-3:ITDC-403FundamentalsofJavaProgramming101

10. Chapter-4:ITDC-404WorkIntegratedLearningIT-DMA179

11. Chapter-5:ITDC-410MovieEditingTools(WithWindowsMovieMaker)183

12. Chapter-6:ITDC-411CustomizingandEmbeddingMultimediacomponents227inWebPages

13. Chapter-7:ITDC-412WebScripting–JavaScript271

14. Chapter-8:ITDC-413WorkIntegratedLearningIT–WA-II311

15. Annexure1-ITDC-410MovieEditingTools(withPremierPro)317

16. Annexure2-NewApplications387

17. Annexure3-Career/FurtherStudiesOptions395

18. Annexure4:ImportantLinks397

19. References

Foreword…Generalorvocationaleducation?This isa“toughchoice” formanystudents. In thehumancapital framework,generaleducationcreates

‘generalhumancapital’andvocationalandtechnicaleducation‘specifichumancapital’(Becker,1964).Theformerisportableacrossone’slifeandfromjobtojob,whilethelaferisnotandhencemanyadvocategeneraleducation,asmoresuitabletotheflexiblelabourforcethatcanchangetaskandeventhetypeofwork;butthelaferhasanadvantage,imbibingspecificjob-relevantskills,thatcanmaketheworkermorereadilysuitableforagivenjobandwouldmakehim/herthusmoreproductive.Hencebothareimportant.VocationaleducationcoursesofferedinschoolsatGrades11and12areaimedatdevelopingskillstopreparetheworkforcethatcancontributetotheeconomy.Theypreparestudentsforwageemploymentorselfemployment.CBSEisofferingSkillCompetencyBasedVocationalCoursesinSchoolsatSeniorSecondaryLeveltocreateskilledmanpowerfortheindustry.Overwhelmingly,studentswhogetthroughthevocationalstreamwanttoproceedtofurthereducationtoimprovetheirjobprospects.The few rigorous evaluation of the impact of the programme, that have been undertaken, point to low levels of gainful employment of thesestudents.Formakingtheexistingvocationaleducationsystemrelevanttomarketneeds,amajorrestructuringofthesystemandhowitismanagedisneeded.Itisalsoimportanttoensureprivatesectorparticipationtocreatelabourmarketforthetrainees.However,itisalsoimportanttoprovidequalityeducationandtrainingtostudentsatbothpre-vocationalaswellasvocationallevelbasedonthedemandsoftheindustry/employers.Thisdemandsexcellentcompetencylevelsoftheirtrainers–thevocationalstreamteachers.Intheyear2007-08,SCERTtookupthetaskoftrainingvocationalstreamteachers/trainersofofficemanagementandstenographywithfocusonimpartingtheknowledgeandskillsrequiredtomeetthedemandsofthefastgrowingindustry,publicsectorandeventhegovernment,whichiscompetingwiththeindustrytorecruitthebesttalent.

There isaneedtodevelopappropriateandrelevantskills inthestudentstoenablethemtousestateof theart technologyandcompetegloballyasworkforce.Thiswillequipthemtocontributetotheeconomicdevelopmentofthecountry.Skilldevelopmentshouldbealignedtotheneeds of the industry. There is a need to continually upgrade the skills of theworkforce to enable them to keep pacewith rapid technologicaladvancements. There is a need for the industry to partner educational institutions in designing competency based, industry relevant curricula,organizingonthejobtrainingforstudentssothattheycangetpracticalexperienceintheactualenvironment.

Tomeetthedemandsoftheindustry,theInformationTechnologyvocationalstream5

curriculumhasbeenrevisedbyCentralBoardof secondaryEducation from theacademicsession2013-14.Thecourseintends to develop skillsrelatedtowebapplicationsandadvancedwebdesigning.Knowledgeofnetworksafetyandsecurity,digitaldesigning,multimediaauthoring,webcontentcreation, interactivewebpagecreatingandtroubleshootingwillbetaught.Thecurriculumisdesignedtodevelop appropriate technicalknowledgeaswellastheprofessionalskillsofthestudents,sothattheyareequippedtotakegainfulemploymentinthesaidvocation.

Thismanualisbasedonthecurriculumofvocationalcourse:InformationTechnology(ITApplication)[NSQFITLevel4]forClassXII.Itis developed to impart knowledge and skills in the areas of database concepts, operating web based applications, fundamentalsofjavaprogramming,movieeditingtools,customizingandembeddingmultimediacomponentsinwebpages,webscripting-Javascript,etc. inthevocationalcourseonInformationTechnology.WhileitisprimarilyaimedatvocationalteachersteachingthissubjectatClassXII , itshallalsobenefitstudentsofthisstreamapartfromotherteachers,students,educatorsandotherswhowishtoupgradetheirknowledgeandskillsintheseareas.TheManualspecifiesthestepsforeachactivity. It is illustrative,simpleandeasytofollow.It iswrifen inaself learningformat.Thematerial isfollowedbyquestionsandactivities.ManualonInformationTechnology(ITApplication)Vol-IIClass–XII2015-2016hasbeenwrifenbyateamofexpertsheadedbyShriNareshKapoor.Weappreciateandacknowledge thecontributionofShriNareshKapoorand the teamof contributors forbringingoutthismanual.

Theuntiringeffortsof thefacultyofWorkExperience&VocationalEducation(Area:ICT)ShriNareshKapoor, in thepreparationof themanualandthatoftheofficersandstaffofPublicationDepartmentaswellasotherconcernedofficersandstaffareappreciatedandacknowledged.Weacknowledgeallthewebsitesandthematerialwhichwereconsultedandusedfortheirhighacademicvalueandrelevance.Thismaterial issolelyforeducationalpurposestobeusedbyteachersandstudentsandnotforanycommercialuse.

Thismanual shares with the teachers the knowledge and skills required to be imparted in the area of vocational course : InformationTechnology[NSQFITLevel 4] for ClassXII .This manual covers the syllabus laid down by Central Board of Secondary Education. LatestdevelopmentsintheareaofITandmaterialonfurthereducation/careeropportunitiesavailableafterstudyingthissubjectanddevelopingtheskillsaswellasthescopeofthesubjectindustryhavealsobeenincorporated.

It is hoped that the manual helps bring about qualitative improvements in transaction in the area of vocational course : InformationTechnologyandmeetstheneedsoftheteachers.

Director,SCERT6

ForTeachers…………Nowadays the termICTs(Informationand Communication Technologies) is used in place of computer becauseICThas a wider scope and

application than just computer. ICTsstand for information and communication technologies and are defined as a “diverse set oftechnologicaltoolsandresourcesusedtocommunicate,andtocreate,disseminate,store,andmanageinformation.”The“informationand communication technologies”(ICTs)includes technologies such as radio, television, video,DVD, telephone (both fixed line andmobile phones), satellite systems, and computer and network hardware and sohware, aswellastheequipmentandservicesassociatedwith thesetechnologies,suchasvideoconferencing, e-mail andblogs. ICT has enormous potential to make teaching learningmore interesting, interactive, illustrative, and participatory.ICTfacilitates development of user friendly learning material accessible to allirrespective of age, grade, geographical distance, cultural diversity,etc. It can be used to give such experiences to learners thatwill help himlearn.ICTcanbeusedtodevelophigherorderthinkingskills.Itcanbeusedtoprovideanopportunitytolearnerstoconstructtheirknowledge.ICTcanbeusedtoconnectto,share,interactwithalargenumberofpeoplesimultaneously.ICTopensawindowtotheuniverse.Theprofileoflearnerscan be developed and their needs can be assessed using ICT.This will help the teacher to identify appropriate pedagogy and plan histeaching.ICTprovidestoolstotheteacherstowrite,edit,format,makeatable,plotdataonagraph,preparepresentation,preparedatabase,makeandeditaudios,videos,drawandeditapicture,performcomputationsondataandstoretheresultforfuturereferenceoruse,etc.ICTprovidesaccessto immensestorehouseofknowledgewhichisconstantlybeingupdatedandiseverexpanding.Theinformationandmaterialprovidedbypeople,issuesraisedbythem,theirviewsandsuggestions,etc.relatingtoathemecancollectedandcollatedtimelyandusedtoenhancelearningmaterialusingICT.ICThasimmensepotentialwhichneedstobeexploitedbytheteacher.

Itissaidthatschoolsmustpromote“learningtolearn,”:i.e.,theacquisitionofknowledgeandskillsthatmakepossiblecontinuouslearningoverthelifetime.“Theilliterateofthe21stcentury,”accordingtofuturistAlvinToffler,”willnotbethosewhocannotreadandwrite,butthosewhocannotlearn,unlearn,andrelearn.”

ICTcanbeveryeffectivelyusedtofacilitatetheacquisitionofknowledgeandskillsthat7

enablecontinuous learningThe teachercanuseLCDProjector, interactivewhiteboardsaspresentation tools in theclassroomtoorganiseclassroomdiscussionsandindividual/smallgroupwork.Thiswillreinforceknowledge,enhanceunderstandingofabstractconcepts.

Teacherscansharedigital resourcesandeducational toolswith students to support learning.Usingsimulation theabstract conceptsandprocesses can be concretised and explained to the students.Teacherscan make up to date knowledge accessible to students.Teachers designactivitiesforstudentsusingICTthatwillchallengetheirunderstandingandthinking.

ThedevelopmentofICT/computertechnologyskillshasanenablingroleintheteachingandlearningprocess.Inordertobeabletotapthepotentialofcomputerandutiliseiteffectivelyineducation,theteachersmusthaveadequateICTskillsandmustknowtouseICTstoperformvarioustasksefficiently.HencecontinuedprofessionaldevelopmentandcapacitybuildingofteachersinICTsassumesgreatimportance.

TofacilitatetheuseofICTbyteachers,itisimperativethattheteachersbecontinuallytrainedinICTtoenrichandupdatetheirICTskills.SoftwarearebeingupdatedandnewertoolsarebeingevolvedwhichfurthernecessitatecontinuousprofessionaldevelopmentofteachersinICT.Training must be contextualised to the National Curriculum Framework forTeacherEducation(NCFTE,2009), National CurriculumFramework(NCF2005),subjectcurriculum,trainingneedsoftheteachersandtheenvironment.

It is very important here to mention National Curriculum Framework forTeacherEducation. ‘This National Curriculum FrameworkforTeacherEducation elaborates the context,concerns and vision underscoring that teacher education and school education have a symbioticrelationshipanddevelopmentsinboththesesectorsmutuallyreinforcetheconcernsnecessaryforqualitativeimprovementsoftheentirespectrumofeducation includingteachereducationaswell. The new concerns of school curriculum and the expected transactionalmodalities have beenemphasized indesigning thisFramework forall stagesofschooleducation. Issuesrelated to inclusiveeducation,perspectives forequitableandsustainabledevelopment,genderperspectives, roleofcommunityknowledge ineducationandICTinschoolingaswell aselearningbecome thecentre-stageintheFramework…..ICTcanbeimaginativelydrawnuponforprofessionaldevelopmentandacademicsupportofthepre-serviceand in-serviceteachers’(NCFTE,2009)NCFTEfurtherhighlightstheuseofICTincludingTV,radio,telephonyandinternetasadistancemediaprovidingaccesstoideasorforthewiderdisseminationofinformation.

8

TheNationalFocusGrouponEducational Technology has suggested ‘Recognise the potential ofICT and the Internet, promote universalaccess, facilitate participatory forums, and developcommunitiesandinterest groups’…‘Worktowards transformingallschools intoICT-richenvironments’….‘Createopportunitiesforadministratorsandeducational leaders intheschoolsystemtobecomeETsavvyandtobeabletouseICTscompetently’…’EncourageICTliteracyforofficialandpersonalusetobuildcomfortand latercreativity ineducationalwork’….(ThePositionPaperNationalFocusGrouponEducationalTechnology,NCERT,2006)National Skills Qualification Framework (NSQF) has been brought out byGovt. of India. Itorganizesqualificationsaccording to a series of levels of knowledge, skills and aptitude. These levels are defined in terms oflearningoutcomeswhichthelearnermustpossessregardlessofwhethertheywereacquiredthroughformal,non-formalor informal learning.Inthatsense,theNSQFisaqualityassuranceframework.It is,therefore,anationally integratededucationandcompetencybasedskill frameworkthatwillprovideformultiplepathways,horizontalaswellasvertical,bothwithinvocationaleducationandvocationaltrainingandamongvocationaleducation,vocationaltraining,generaleducationandtechnicaleducation,thuslinkingoneleveloflearningtoanotherhigher level.Thiswillenableapersontoacquiredesiredcompetencylevels,transittothejobmarketand,atanopportunetime,returnforacquiringadditionalskillstofurtherupgradetheircompetencies.TheteachersmaybrowsethewebfordetailsonNSQF.

This manual is based on the curriculum of vocational stream : ‘Information Technology’(IT Application) forClassXII[NSQFITLevel4].ThepurposeofthismanualistoprovideInformationTechnologyskillstoempowertheteacherandthestudenttousethem for education and for life. The scope of this manual is database concepts, operating web based applications, fundamentals of javaprogramming,movieeditingtools,customizingandembeddingmultimediacomponentsinwebpages,webscripting-Javascript,etc.Theaimofthismanual is toequip the teacherswithup todateknowledgeandskills in theareaof InformationTechnologyso that theycan transact themeffectively using appropriate pedagogy. The objective of this manual is also to adequately prepare the students for self employment or wageemploymentintheareaofInformationTechnology.TheNationalCurriculumFrameworkforTeacherEducation (NCFTE,2009),NationalCurriculumFramework (NCF 2005), National Policy on Information and CommunicationTechnology(ICT) in School Education, 2010 (Revised Draß 24-02-2011.)havealsobeenreferredandkeptinmindwhilepreparingthismanual.Besidesfulfillingtheaboveobjectivesitisalsohopedthatthemanualshallenabletheteachersandotherlearnerstousecomputerseffectivelyforteachinglearning,administrativeworkandotherdaytodayactivities.

9

This manual not only explains the various theoretical concepts but also elaborates the procedure for carrying out tasks using varioussoftwareoncomputervisually.Themanualmaybeusedtoapprisethelearnerswiththeinterface,thefeatures,tools,applications,etc.Themanualmaybeusedtodeveloptheskillstoenablethelearnertoperformtasksandcarryoutjobsinrealworld.Themanualincludesanumberofactivities.Thelearnermayexecute the various commandsand try touse the various features and tools covered in themanual.The learnermay carryoutvariousactivitiesgiveninthemanual.Themanualalsoincludesquestionstoassessthecontentknowledgeandskillsofthelearner.Themanualiswrifennotonlyforvocationalteachersbutalsootherteachers,educationaladministrators,otherstaff,studentsandotherpeoplewhowishtolearncomputer, update their knowledge and skills and use it to carry out various tasks that will facilitate their work. They may upgrade theirITknowledgeandskillsintheareascoveredbysurfingthewebandreferringothersupplementarymaterial.

NARESHKAPOORCOORDINATORSENIORLECTURERSCERT9810724310

[email protected],[email protected]

Curriculum:InformationTechnology

–VocationalStream(CentralBoardofSecondaryEducation)

1112

ITApplication(XIth&XIIthNew)IntroductiontoComputerApplications

I. PreambleComputer is now affecting energy sphere of human activity. It is instrumental in bringing revolutionary changes in industry, scientific

researchandeducation.Thisisnotonlythedemandoftimebutalsothedemandofalmosteachandeverysubjecttohaveanassociatedcomputerlearningtoequipastudentwithstart-of-arttechnologytoprovehimself/herselfabefercandidatethanthosewithoutcomputerknowledge.

SincetheCBSEhasbeenforemostingivingbesttoitsclientele,asinglepaperasperrequirementofindustryhasbeendesignedinsuchawaythatitcanbetakenasanindependentsubjectalongwithanycombinationofvocationalpackages.

Thispaperhasbeendesignedkeepinginviewtheneedanddemandofcomputerindustry.II. Objectives

Thecourseisdesignedtofulfillthefollowingobjectives:—(i) Familiarisationwithcomputer-dominatedtechnologicalworld.(ii) ToimpartadequateknowhowtothestudentstobeabletotakeupentryleveljobsintheareaofDataProcessing.(iii) Exposureofutilityandapplicationsofcomputers.(iv) TogetacquaintancewiththebasicsofComputerScienceandlayfoundationforhighereducation/careersincomputersinconformancewithindustryrequirements.

(v) Applicationofcomputersinthespecificareassuchasaccounting&auditing,storesaccounting,officemanagement&secretarialpractice,textiledesigningetc.

(vi) Algorithmicapproachtoproblemsolving.(vii)TousecomputereffectivelyandefficientlybyacquiringworkingknowledgeofPCsoftwares.(viii)FamiliarisationwithDataProcessingenvironmentandDataProcessingterminology.

III. CareerOpportunities1. FieldServiceTechnician2. ITSupportSpecialist

13

3. Executive(WebDevelopment)4. DataProcessingAssistant/DocumentationAssistant5. ProgrammingAssistant

TherapidchangesintheareaofInformationTechnologyhavesignificantlyaffectedthefieldsofbusiness,finance,trade,governanceandcommunications which have not only resulted in global competitiveness invarious fields but simultaneously have pushed the global technicaladvancements.Thefeasibilityofeasyaccesstoinformation,dataprocessingandmodesofcommunicationhasmadevisiblechangesinthemodesofadministrationat all levels.Due to the increasingdemands for adeeperunderstandingof information technology, computer aided learninghasnecessitatedcurricularreformsincorporatingbasiccompetencyandskillsinthefieldsofinformationtechnology.

Thecourse intendstodevelopskillsrelatedtowebapplicationsandadvancedwebdesigning.Knowledgeofnetworksafetyandsecurity,digitaldesigning,multimediaanchoring,webcontentcreation,interactivewebpagecreatingandtroubleshootingwillbeimparted.Thecurriculumisdesignedtodevelopappropriatetechnicalknowledgeaswellastheprofessionalskillsofthestudents,sothattheyareequippedtotakegainfulemploymentinthesaidvocation.

14

INFORMATIONTECHNOLOGY(CLASS-XI)[NSQFITLEVEL3]NSQFITLEVEL3(CLASS-XI)ITTOOLS(795)

(Paper-I)TotalMarks:100(Knowledge-50:Practical-50)

UnitCode

UnitTitle TotalHours

ITDC-301

ComputerOrganization&OS:UserperspectiveUnderstandingofHardwareBasicsofOperatingSystem

15

ITDC-302

NetworkingandinternetNetworkSafetyconcernsNetworkSecuritytoolsandservicesCyberSecuritySafepracticesonSocialnetworking

10

ITDC-303

Officeautomationtools:SpreadsheetWordprocessingPresentation

40

ITDC-304

MultiMediaDesign:(OpenSourceDesignTools)InterfaceandDrawingToolsinGIMPApplyingFiltersCreatingandhandlingmultiplelayersUsingStampingandSmudgingtoolsImportingpictures

35

ITDC-305

Troubleshooting:Hardware,SohwareandNetworking

Commonlyencounteredproblems(Monitor:Nodisplay,KB/Mousenotresponding,monitorgivingbeeps,printernotresponding,checkforvirus,Deletetemporaryfilesifsystemisslow,adjustmousespeed)

10

ITDC-306

WorkIntegratedLearningIT-ISMIdentificationofWorkAreasWorkExperience

14

12415

NSQFITLEVEL3(CLASS-XI):WEBAPPLICATIONS-I(796)(Paper-II)TotalMarks:100

(Knowledge—50:Practical—50)

UnitCode


ITDC-310

MultimediaAuthoring-AnimationToolsAnimationConceptsFramesandLayersMotionandShape,TweeningImportingAVFilesPublishing

30

ITDC-311

DigitalContentCreation-AddingStylestoWebPages(CSS)

ReviewofHTMLAddingStyleSheetsExternalstylesheetsCSSProperties-border,box,font,margin,paddingCSSclasses

30

ITDC-312

WebScripting-JavaScriptCreatinginteractiveWebPageswithscriptsVariablesandOperatorsDecisionmakingusingifandswitchIterations-loopsWindowObjectLocationObjectHistoryObjectPopupBoxes-alert,confirm

50

ITDC-313

WorkIntegratedLearningIT-WA-IIdentificationofWorkAreasWorkExperience

14

124

16

NSQFITLEVEL4(CLASS-XII):DATAMANAGEMENTAPPLICATIONS(CODE:795)

Paper-ITotalMarks:-100(Knowledge—50:Practical—50)

UnitCode


ITDC-401

DatabaseConcepts-RDBMSToolBasicsofRDBMSSQL-CreatingandOpeningDatabaseCreatingandpopulatingtablesModifyingthecontentandstructureoftableOrderingandGroupingOperatingwithmultipletables

50

ITDC-402

OperatingWebBasedApplicationsOnlineReservationSystemsE-GovernanceOnlineShoppingandBillpaymentsOnlineTutorialsandTestsProjectManagement-WebBasedApplicationdevelopmentProjectessentialsandtipsCaseStudy-OnlineGameCaseStudy-OnlineQuizCaseStudy-OnlineBillCalculator

30

ITDC-403

FundamentalsofJavaprogramming,IntroductiontoJava,ObjectOrientedProgramming,JavaLanguageElements,Operators,ControlFlow,Array,ClassDesign,ExceptionHandling,Assertions,Threads,WrapperClasses,StringManipulation

30

ITDC-404

WorkIntegratedLearningIT-DMAIdentificationofWorkAreasWorkExperience

14

124

17

NSQFITLEVEL4(CLASS-XII):WEBAPPLICATIONSII(CODE:796)Paper-IITotalMarks:-100(Knowledge-50:Practical-50)

UnitCode


ITDC-410

MovieEditingToolsFamiliarizationofinterfacecomponentsImportingpicturesImportingAudioandVideoFilesSplifingandJoiningMovieClipsAddingTitlesandpublishing

40

ITDC-411

CustomizingandEmbeddingMultimediacomponentsinWebPages

CompatibleMultimediafileformatsforWebPagesEmbeddingAudiofileEmbeddingVideofileEmbeddingFlashfile

40

ITDC-412

WebScripting-JavaScriptJavaScriptreviewFunctions-userdefinedStringObjectMathObjectArrayObjectEventsCaseStudies

30

ITDC-413

WorkIntegratedLearningIT-WA-IIIdentificationofWorkAreasWorkExperience

14

124Note:Practicalwillbebasedonaforesaidtheorypaper.

18

PRACTICALASSESSMENT

NSQFITLEVEL3(CLASS-XI):ITTOOLS(CODE:795)

Paper-I-Practical—50)

Details MarksDistribution

Programs/PracticalQuestions-Spreadsheets,Word,Presentation(15Marks)

-MultimediaDesign(10Marks)

-Troubleshooting(5Marks)

30Marks

Project/PracticalFile 10Marks

VivaVoce 10Marks

Total 50Marks

NSQFITLEVEL3(CLASS-XI):WEBAPPLICATIONS(CODE:796)

Paper-II(Practical-50)


Programs/PracticalQuestions-AnimationTools(15Marks)

-HTML(10Marks)

-WebScripting-JavaScript(5Marks)

30Marks


VivaVoce 10Marks

Total 50Marks

19

NSQFITLEVEL4(CLASS-XII):DATAMANAGEMENTAPPLICATIONS(CODE:795)

Paper-I-Practical—50)


Programs/PracticalQuestions-SQLQueries(15Marks)

-JAVAPrograms(10Marks)

-OperatingWebBasedApplications(5Marks)

30Marks


VivaVoce 10Marks

Total 50MarksNSQFITLEVEL4(CLASS-XII):WEBAPPLICATIONSII(CODE:796)

Paper-II(Practical-50)


Programs/PracticalQuestions-MovieEditingTools(15Marks)

-CustomizingandEmbeddingMultimediacomponentsinWebPages(10Marks)

-WebScripting-JavaScript(5Marks)

30Marks


VivaVoce 10Marks

Total 50Marks20

SUGGESTEDLISTOFBOOKS1. InformationTechnology(IT)StudentHandbookforlevelI,PublishedbyCBSE2. DatabaseSystems:Design,ImplementationAndManagementbyPeterRob,CarlosCoronel3. IntroductiontoInformationTechnologybyEfraimTurban(Author),R.KellyRainer(Author),RichardE.Pofer(Author)4. IntroductiontoInformationTechnologybyITLEducationSolutionsLimited5. JavaScript,ABeginner’sGuidebyMcGraw-HillOsborneMedia,20096. HTMLandCSS:DesignandBuildWebsitesbyWiley(ISBN-10:1118008189,ISBN-13:978-1118008188),20117. TheBookofGIMP:ACompleteGuidetoNearlyEverythingbyNoStarchPress(ISBN-10:1593273835,ISBN-13:978-1593273835),2013

8. GIMPforabsolutebeginnersbyApressPublishers(ISBN-10:1430231688,ISBN-13:978-1430231684),20139. MicrosoftWindowsMovieMakerForDummiesbyKeithUnderdahl10. GefingStartEDwithWindowsLiveMovieMakerbyJamesFloydKelly11. MicrosoftWindowsMovieMaker2byJanOzer12. MicrosoftWindowsMovieMakerHandbook(Book&CD-ROM)byBillBirney13. FilmmakingForDummiesbyBryanMichaelStoller

COURSECOMMITTEEMEMBERS1. Dr.BiswajitSaha,AssociateProfessorandProgrammeOfficer,(Voc.Education),CBSE.2. Ms.SwatiGupta,AssistantProfessorandAssistantProgrammeOfficer,(Voc.Education),CBSE.3. Dr.OmVikas,SeniorDirector,DOEElectronicNiketan.4. ProfessorRanjitBiswas,HeadoftheDepartments,JamiaHamdardUniversity5. Dr.P.VenkataSuresh,AssociateProfessor,IGNOU6. Dr.SudhanshSharma,AssistantProfessor,IGNOU7. Dr.NaveenKumar,AssociateProfessor,DelhiUniversity8. Mr.ManojKumar,HeadoftheDepartments,AmbedkarinstituteofTechnology9. Mr.YogeshKumar,ITDepartmentHead,MiraModelSchool10. Mr.G.NateshSharma,BusinessDevelopment,AptechLtd.11. Mr.ChandrakantSHarne,TechnicalHead,HCLinfosystemsLtd.12. Mr.SabornibBahfacharya,Manager,AptechLtd.

Note:Practicalwillbebasedonaforesaidtheorypaper.21

Email:[email protected].:-011-22527184Website:www.cbseacademic.in

CENTRALBOARDOFSECONDARYEDUCATION

(AnautonomousOrganisationundertheUnionMinistryofHumanResourceDevelopment,Govt.ofIndia)“SHIKSHAKENDRA”2,COMMUNITYCENTER,PREETVIHAR,DELHI-110092

CBSE/PO/2013

ToTheHeadsofInstitutionsAffiliatedtoCBSE

17thJanuary,2013CircularNo.Acad-07/2013

Sub:ImplementationofSkillCompetencyBasedVocationalCoursesinSchoolsatSeniorSecondaryLevelforAcademicSession2013-14

DearPrincipalAsyoumightbeaware that theBoard isoffering40VocationalCourses indifferent sectorsatSeniorSecondaryLeveland4vocational

coursesatsecondarylevel;manyofthesecoursesareofferedincollaborationwiththeprofessionalorganisationstocreateskilledmanpowerfortheindustry, in order to upgrade the skills and proficiency of the younger generation and also to provide knowledge and awareness about variouscareeroptions.Astudentcanchoosetoavailcompetencybasedskill learningalongwithgeneraleducation inordertoenhancetheskills inthechosen field. Also, these courses allow them to explore new avenues/ options available along with imparting the skills required to pursue aparticularcourse.

Thevocational educationenvisions imparting theprocedural knowledgeand skills to the students thatwill enable students toexcel andemergesuccessfulinreallifesituationofbothworkandlife.Itworkstowardsimpartinganeducationthatisholistic,meaningfulandskillorientedwhichinstilsamongtheyouthasenseofusefulnessandresponsibility.BoardaimstoprepareourfuturegenerationtobecomeglobalcitizensandtomakeIndiaagloballeader.Indiahasonly5percentskilledworkersinitstotalworkforce.Itisprojectedthatthelabourforcewillgrowbycloseto2percentorsome7millionormoreayearoverthenextfewyears.Theclearobjectivewiththisinitiativeistoteachreallifeapplicationsatanearlystagesothattherequiredtalentcanbedevelopedforabeferfuture.Thiswillgoalongwayinbuilding22

uptheskilledpersonnelthatisrequiredforIndia.Keepingthisinview,thecurriculumdesignedforclassesXIandXII•IsIndustryoriented

•Focusesfromacademicstoemployability

•Willprovideexcellentopportunitiesforhighereducationinthespecificareathroughdegreeanddiplomacourse

•Willprovideemploymentpotentialinallsectors

TheBoardispufingcontinualeffortsforimprovisingtheexistingcoursesanddevisingnewcoursesthatarerelevanttothecurrenteconomy.ToachievethepurposeofqualityeducationtheBoardhascollaboratedwithvariousorganizationslikeROLTAIndiaLtd,NIFT,WWI,CII,NHMIT,MedvarsityOnlineEducation,Inteletc.

Also,BoardhaspartneredwithCentralInstituteofTechnology,AustraliaforintroducingnewvocationalcoursesofCITintheaffiliatedschools.ItisalsotomentionherethatteacherswillbetrainedonbyCBSEanditsindustrypartners,throughouttheyeartoenhancethetrainingskillsoftheteacherstoensureeffectivecurriculumtransaction.

Therefore,youarerequestedkindlytochooseandofferoneormoreofthesecompetencybasedcourses(listenclosed)inyouresteemschoolonprioritybasisfromtheacademicsession2013-14.Filledinproformaalongwithrequisitefeeinfavourofsecretary,CBSE,DelhimaybesenttotheofficeoftheundersignedwithinMarch15,2013,WithRegards

YoursSincerely

Dr.BiswajitSahaAssociateProfessor&ProgrammeOfficer(Vocational)

Enclosures:a. ListofVocationalCoursesb. Teacher’sQualificationc. SchemeofStudiesd. ProformaforAffiliatione. Affiliationfeedetails

23

SchemeofStudiesVocationalCoursesCBSECircularJan13

S.No.

Nameofthesubject Period/week MarksDistribution Marks

Theory Practical1. LanguageI(English) 7 100

-100

2. TwoSubjectsfromAcademicstream(ScienceCommerceHumanities)

7+7 100oraspersubjectconcerned7030

100each

3. Twopapersfromanyof34vocationalcourses 8+8 605030

405070

100each

4. OneOptionalAdditionalsubjectfromacademicstream(Science/Commerce/Humanities)orvocationalstream

7 100or

70:30Or

60:40

100

5. Workintegratedlearning Onthejobexposurefor60hrs.(level1&2)=10days120hrs.(Level3&4)=20daysMin6hrs.perday

6. PersonalityDevelopmentandSoftSkills 2

7. Total 46 500+100(optionaladditional)

24

ChapterOneITDC-401

DatabaseConcepts-RDBMSTool•BasicsofRDBMS•SQL-CreatingandOpeningDatabase•Creatingandpopulatingtables•Modifyingthecontentandstructureoftable•OrderingandGrouping•Operatingwithmultipletables

OutlineoftheChapter•Introduction •DatabaseManagementSystem(DBMS)•BasicElementsofDatabase •TheAdvantagesofaDBMS•TheDisadvantagesofaDBMS•TypesofDBMS

HierarchicalDatabaseManagementSystem(HDBMS)NetworkDatabaseManagementSystem(NDBMS)RelationalDatabaseManagementSystem(RDBMS)Object-OrientedDatabaseManagementSystem(OODBMS)

•ManipulationAndQueryLanguages•StructuredQueryLanguage(SQL)25

INTRODUCTION

In thepresent age, databasesplay a critical role in almost all areaswhere computers are used includingbusiness, engineering,medicine, law,education,libraryscienceetc.Forexample,ifwegotothebanktodepositorwithdrawmoney;ifwemakeahotelortrainreservation;ifweaccessacomputerizedlibrarycatalog,chancesarethatouractivitieswillinvolvesomeoneaccessingadatabase.

Adatabaseisacollectionofrelateddatai.e.knownfactsthatcanberecordedandhaveimplicitmeaning.Thedatarelatedtosomeorganizationmaybeunderconsideration.Forexample,aschoolhasrecordedthestudents’name,addressandphonenumbersinanindexedaddressbookorhavestoreditonCD/DVDusingapersonalcomputerandsoftwaresuchasMicrosoftAccessorDBASE.

Itcanalsobedefinedasacollectionof logicallyrelateddata.A telephonedirectoryconsistingnames,addressesandtelephonenumbers isoneexample.Adatabasemaybecomputerizedaswellasmanuallygenerated.Forexample,thedatabaseforlibrarycardcatalogmaybemanipulatedmanuallyaswellasitmaybecomputerized.Atthesametime,adatabasemayconsistseveralrelatedbutseparatedatabases.Forexample,alibrarydatabasemightincludedatabaseofbookdetails,databaseofbooksonorder,databaseofbookscheckedoutetc.BasicsofRDBMSDATABASEMANAGEMENTSYSTEM(DBMS)DBMS is a software system that facilitates the processes of defining, constructing and manipulating database. Defining a database involvesspecifyingthedatatypes,structures,andconstraintsforthedatatobestoredinthedatabase.Constructingthedatabaseistheprocessofstoringthe data on a storagemedium such as CD, DVD or computer Hard disk.Manipulating a database includes functions such as retrieving data,updatingdatabaseandgeneratingreportsetc.

Letusdiscussoneexample,aSCHOOLdatabaseformaintaininformationrelatedtostudents,courses,teachers,examinationsandresultsetc.

Todefinethisdatabase,onewillspecifythestructureoftherecordsofeachfilebyspecifyingthedifferenttypesofdataelementstobestoredineachrecord.

26

BASICELEMENTSOFDATABASEAcomputercannotprocessdataunlessitisorganizedinspecialways;intocharacters,fields,records,filesanddatabases.

CharacterAcharacteristhemostbasicelementofdatathatcanbeobservedandmanipulated.Behinditaretheinvisibledataelementswecallbitsandbytes,referring to physical storage elements used by the computer hardware. A character is a single symbol such as a digit, lefer of other specialcharacter.

FieldAfieldcontainsanitemofdatasuchasacharacter,orgroupofcharactersthatarerelated.Forinstance,agroupingofrelatedtextcharacterssuchas “Mohd Rashid” makes up a name in the name field. Let’s look at another example. Suppose ‘The Times of India’ action group advocatingeducationinNewDelhiandcompilingthenamesandaddressesofpotentialvolunteersforthecause.Foreachperson,theymustidentifythename,address, city, state,pincodeand telephonenumber.A fieldwouldbeestablished foreach typeof information in the list.Thename fieldwouldcontainallofthelefersofthefirstandlastname.Thepincodefield

27

wouldholdallofthedigitsofaperson’spincode,andsoon.Insummary,afieldmaycontainanafribute(e.g.,employeesalary)orthenameofanentity(e.g.,person,place,orevent).

Itisthesmallestunitofthedatathathasmeaningtoitsusersandisalsocalleddataitemordataelement.Name,AddressandTelephonenumberareexamplesoffields.Thesearerepresentedinthedatabasebyavalue.

Field

RecordArecordiscomposedofagroupofrelatedfields.Asanotherwayofsayingit,arecordcontainsacollectionofafributesrelatedtoanentitysuchasapersonorproduct.Lookingatthelistofpotentialguncontrolsupporters,thename,address,pincodeandtelephonenumberofasingleindividualwouldconstitutearecord.

28

Record

DatabaseFileAswemoveuptheladder,adatabasefileisdefinedasacollectionofrelatedrecords.Adatabasefileissometimescalledatable.Afilemaybecomposedofacompletelistofindividualsonamailinglist,includingtheiraddressesandtelephonenumbers.Filesarefrequentlycategorizedbythe purpose or application for which they are intended. Some common examples includemailing lists, quality control files, inventory files, ordocumentfiles.Filesmayalsobeclassifiedbythedegreeofpermanencetheyhave.Transitionfilesareonlytemporary,whilemasterfilesaremuchmorelong-lived.THEADVANTAGESOFADBMSThemainadvantagesofusingaDatabaseManagementSystemaresuchas:InformationAvailabilityEnhancementThemeaningofInformationAvailabilityEnhancementisthatthesameinformationcanbemadeavailabletodifferentusers.

29

RedundancyDecrementThedataredundancy,thatistherepetitionofdata,maybeminimizedbyusingDBMS.Thereforethecostofstoringdataonharddrivesorotherstoragedevicescanbesignificantlyreduced.

AccuracyAsweknow thatmanual database requires changes in several different places to changeor update a recordwhile updates and changes to datainDBMS,onlyhavetobemadeinoneplace.Therefore,thechancesofmakingmistakesarelessorinDBMSandthedataintegrityisfostered.

ProgramandFileConsistencyFileformatsandsystemprogramsarestandardizedinDBMS.Themaintenanceofdatafilesareeasierbecauseofsamerulesandguidelinesacrossalltypesofdata.Eveninthecaseofmultipleprogrammers,thelevelofconsistencyoffileandprogramsaremaintained.

User-friendlyAccessandmanipulatingdataismucheasierfortheuserswithaDBMSascomparedtomanualDatabasemanagement.

SecurityDBMSprotectsandmakessecuredthedatathroughtheuseofpasswordsandrestrictsthedataaccesstoonlythosewhoshouldaccessit.Itmeansitcanminimizetherisksfortheorganizations.THEDISADVANTAGESOFADBMSTherearebasicallytwomajordownsidestousingDBMSsCost:ImplementationofaDBMSmaybeexpensiveandtime-consuming,especiallyinlargeorganizations.AndtheTrainingoftheDBMSpersonalcanbequitecostly.

Security:ThoughaDBMSishavingsafeguardsofpasswordandcontrolledaccesstousers,thereisapossibilitythatsomeunauthorizedusersmayaccessthedatabase.Onceanunauthorizedusergetsintothedatabase,theyhaveaccesstoallthefilesthatwillposeathreattoindividualprivacy.

30

TYPESOFDBMSTherearefourstructuraltypesofdatabasemanagementsystems:hierarchical,network,relational,andobject-oriented.HierarchicalDatabaseManagementSystem

HierarchicalDatabases(DBMS),isoneoftheoldestmethodsoforganizingandstoringdata.Someorganizationsarestillusingit.Itisorganisedlikethebranchesofatreeshowninthefigureabove.Relatedfieldsandrecordsaregroupedtogethertomakehigher-levelrecordsandlower-levelrecordsjustliketheparentandchildinafamilytreerespectively.Here,itmustberememberedthatachildrecordhasonlyoneparentrecordtowhichitislinkedwhileaparentrecordmayhavemorethanonechildrecordlinkedtoit.Ifonesearchesa record,he/she startsat the topandmovesdown through the tree fromparent tochilduntil theappropriatechildrecordisfound.

Theadvantageofhierarchicaldatabases is that theycanbeaccessedandupdated rapidlybecause the tree-like structureand therelationshipsbetweenrecordsaredefinedinadvance.

Thistypeofdatabasestructureishavingadisadvantagethatis,eachchildinthetreemayhaveonlyoneparent,andrelationshipsorlinkagesbetweenchildrenarenotpermifed.AddinganewfieldorrecordinHierarchicaldatabasesrequiresthattheentiredatabasemustberedefined.

31

NetworkDatabaseManagementSystem

Similartohierarchicaldatabases,Networkdatabasesalsohaveahierarchicalstructure.Anetworkdatabaselooksmorelikeacobwebor interconnected network of records. In network databases, similar to hierarchical databases, children are calledmembers andparentsarecalledowners.Buttheimportantdifferenceisthateachchildormembercanhavemorethanoneparent(orowner).

Sincemore connections can bemade between different types of data, network databases are consideredmore flexible. Similar tohierarchicaldatabases,networkdatabasesmustbedefinedinadvance.Thereisalsoalimittothenumberofconnectionsthatcanbemadebetweenrecords.RelationalDatabaseManagementSystem(RDBMS)

32

In relational databases,the relationship between data files is relational, not hierarchical. Relational databases connect data indifferentfilesbyusingcommondataelementsorakeyfield.Tablesareusedtostoredatainrelationaldatabases.EachTablehasakeyfieldthatuniquelyidentifieseachrow.Inrelationaldatabases,tablesorfilesareknownasrelations,aroworrecordcalledtuples,andcolumnsarereferredtoasafributesorfields.

Akeyfield(s)thatuniquelyidentifies(s)eachrowcanbeusedtoconnectonetableofdatatoanother.Forexample,atable‘customer’mighthavearowconsistingofacustomeraccountnumberasthekeyfieldalongwithaddressandtelephonenumber.Thecustomeraccountnumberinthistablecouldbelinkedtoanothertableofdatathatalsoincludescustomeraccountnumber(akeyfield),butinthiscase,containsinformationaboutproductreturns,includinganitemnumber(anotherkeyfield).Thiskeyfieldcanbelinkedtoanothertablethatcontainsitemnumbersandotherproductinformationsuchasproductionlocation,color,qualitycontrolperson,andotherdata.

The advantages of the relational database are that it can be usedwith lifle or no training and database entries can bemodifiedwithoutredefiningtheentirestructure.Thedownsideofusingarelationaldatabaseisthatsearchingfordatacantakemoretimethanifothermethodsareused.Object-orientedDatabases(OODBMS)Object-oriented database is capable to handle many new data types, including graphics, photographs, audio, and video, whileHierarchical andnetworkdatabases areall designed tohandle structureddata; that is, data that fitsnicely into fields, rows, andcolumns.Anobject-orienteddatabasecanalsobeusedtostoredatafromavarietyofmediasources,suchasphotographsandtext,andproducework,asoutput,inamultimediaformat.

Object-orienteddatabasesusesmall,reusablechunksofsoftwarecalledobjectsthatarestoredintheobject-orienteddatabase.Eachobjectconsistsoftwoelements:1)apieceofdata(e.g.,sound,video,text,orgraphics),and2)theinstructions,orsoftwareprogramscalledmethods, for what to do with the data. For example, test scores would be within the object as would the instructions forcalculatingaveragetestscore.

The object-oriented databases have the ability to mix and match reusable objects that further provides incredible multimediacapability.Healthcareorganizations,forexample,canstore,track,andrecallCATscans,X-rays,electrocardiogramsandmanyotherformsofcrucialdata.

33

Thedevelopmentofthesedatabasesismorecostly.MANIPULATIONANDQUERYLANGUAGESThedatacanbemanipulatedintwowaysbyusingdatabasesoftware.Oneapproachisthataspeciallanguagecalledaquerylanguageisused to interactdirectlywith theDBMS.In thesecondapproach,auser interactswith theapplicationprogram.TheapplicationprogramsendsinstructionstotheDBMS,whichthencarriesouttheactionsspecifiedbytheprogram.

QueryLanguageToperforminformation-processingtasksusingdata,Querylanguageallowstheusertointeractdirectlywiththedatabasesoftware.This language relies on basic words such as SELECT, DELETE, orMODIFY. To retrieve data from a database or update data in adatabase,theuserentersthesecommandsthatinstructtheDBMS.SQL-CreatingandOpeningDatabaseStructuredQueryLanguage(SQL)It is one of the widely used query language to perform operations using relational databases.Originally,SQLwascalledSEQUEL(StructuredEnglishQUEryLanguage)andwasdesigned and implemented atIBMin 1974.SQLis nowthestandardlanguageforcommercialrelationalDBMSs.Asweknowthatrelationaldatabasesarecomposedoftableswithrowsandcolumns,SQLcanbeusedtoretrieveinformationfromrelatedtablesinadatabaseortoselectandretrieveinformationfromspecificrowsandcolumnsinoneormoretables.

AtypicalSQLquerycontainsthreekeyelements:SELECT(thecolumnnamestobedisplayed)FROM(indicatesthetablenamefromwhichcolumnnameswillbederived)WHERE(describestheconditionforthequery)AnExampleofSQLAssumeaprincipalofaninstitutionwishestoqueryarelationaldatabasecontaining34

informationaboutstudents.Ifhewantstoknowthenameandaddressofallstudentswhogotaggregatemarkspercentagemorethan75,thefollowingquerymightbeused:SELECTName,AddressFROMStudentWHEREAggmarks>75Oncethiscommandhasbeenexecuted,thecomputerwilldisplayalistofstudentsthatmeetsthepredefinedcriteria.Inthiscase,allofthedataareextractedfromasingletable.Similarqueriescanbemadetoextractdatafrommultipletables.Suchastrategymightbeusedtoanalyzecustomer information involvingbillingdataandorderdata,usingtwoseparate tables. In thiscase, theFROMcommandwouldlistthenamesofthetwotablesinvolved.

SQLcanbedividedintotwoparts:TheDataManipulationLanguage(DML)andTheDataDefinitionLanguage(DDL).

TheDDLpartofSQLincludesthecreationandmodificationofdatabase.Italsocreatestable,modifiesanddeletesatable.ThemostimportantDDLstatementsinSQLare:CREATEDATABASE–createsanewdatabaseALTERDATABASE–modifiesadatabaseCREATETABLE–createsanewtableALTERTABLE–modifiesatableDROPTABLE–deletesatableCreatingaDatabaseInSQL,thereisaspecificcommandCREATEDATABASEtocreateadatabase.Thesyntaxofthecommandisasfollows:CREATEDATABASEdatabase_nameExample:supposewewanttocreateadatabasecalled“school_database”.CREATEDATABASEschool_databaseCreatingandpopulatingTablesOpeningaDatabase

35

CreatingaTableTheCREATETABLE command is used to specify anew table by giving it a nameand specifying its afributes. The afributes arespecifiedfirst,andeachafributeisgivenaname,adatatypetospecifyitsdomainofvalues.

SyntaxCREATETABLEtable_name(column_name1 data_type, column_name2 data_type,column_name3data_type,….)Thedatatypespecifieswhattypeofdatathecolumncanhold.Example1Nowwewanttocreateatablecalled“Persons”thatcontainsfivecolumns:P_Id,LastName,FirstName,Address,andCity.

WeusethefollowingCREATETABLEstatement:CREATETABLEPersons(P_Idint,LastNamevarchar(255),FirstNamevarchar(255),Addressvarchar(255),Cityvarchar(255))TheP_Idcolumnisoftypeintandwillholdanumber.TheLastName,FirstName,Address,andCitycolumnsareoftypevarcharwithamaximumlengthof255characters.

Theempty“Persons”tablewillnowlooklikethis:36

P_Id LastName FirstName Address City

TheemptytablecanbefilledwithdatawiththeINSERTINTOstatement.TheCREATETABLEcommandmayalsospecifyitsafributeswithsomeconstraints.Theafributesarespecifiedfirst,andeachafributeisgivenaname,adatatypetospecifyitsdomainofvaluesandconstraints.

Syntax:CREATETABLEtable_name(Afribute_name1data_typeconstraint_if_anyAfribute_name2data_typeconstraint_if_any,…..Afribute_namendata_typeconstraint_if_any)

Example:CREATETABLEEMPLOYEE(FNAMEVARCHAR(15)NOTNULL,LNAMEVARCHAR(15)NOTNULL,SSNCHAR(9)NOTNULL,

BDATEDATESEXCHARSALARYDECIMAL(10,2))ModifyingthecontentandstructureoftableAlteringTable

The possible alter table actions include adding or dropping an afribute(column), changing a column definition, and adding ordropping table constraints. For example, to add an afribute for keeping track of jobs of employees to theEMPLOYEEtable intheSCHOOLdatabase,followingcommandwillbeused:ALTERTABLESCHOOL.EMPLOYEEADDJOBVARCHAR(10);

37

DATAMANIPULATIONLANGUAGESQLprovidesbasicDataManipulationstatements:select,update,deleteandinsert.SelectStatementThebasicformoftheSELECTstatementisformedofthethreeclausesSELECT,FROM,andWHERE.

Syntax:TheSELECT-FROM-WHEREstatementhasthefollowingsyntax:SELECTafributelistFROMtablelistWHEREcondition;Example:ThetableEMPLOYEEisgivenbelow

S_Id LastName FirstName Address City

1 Yadav Ramesh Kishangarh NewDelhi

2 John Adam Bandra Mumbai

3 Kuller Daljeet KritiNagar NewDelhi

4 Rizvi Akram KhanRoad Kolkata

5 Rizvi Akram Laban Shillong

Retrievetheaddressandcityoftheemployee(s)whosenameis“AkramRizvi”,theSQLcommandis—SELECTADDRESS,CITYFROMEMPLOYEEWHEREFNAME=”Akram”ANDLNAME=”Rizvi”;Theresult-setwilllooklikethis:

38

Address City

KhanRoad Kolkata

Laban Shillong

Heretheresultmayhaveduplicaterecords,ifexists.Toeliminateduplicaterecords,theDISTINCToptionisusedwithSELECTcommand.

SELECTDISTINCTADDRESS,CITYFROMEMPLOYEEWHEREFNAME=”Akram”ANDLNAME=”Rizvi”;Theresult-setwilllooklikethis:

Address

KhanRoad

Laban

AmissingWHEREclauseindicatesnoconditionsonrecords(alsocalledtuples)selection.Hence,allrecordsofthespecifiedtableintheFROMclausewillbeshownintheresultofthequery.

Example:RetrievetheaddressesandcityofallemployeesintheEMPLOYEEtableSELECTADDRESS,CITYFROMEMPLOYEE;

Theresult-setwilllooklikethis:

Address City

Kishangarh NewDelhi

Bandra Mumbai

KritiNagar NewDelhi

KhanRoad Kolkata

Laban Shillong

39

Toretrievealltheafributevaluesoftheselectedtable,wedonothavethelistofafributenames.Wejustspecifyanasterisk(*),whichstandsforalltheafributes.

Example:RetrievealltheafributevaluesofthetableEMPLOYEE.SELECT*FROMEMPLOYEE;Theresult-setwilllooklikethis:






5 Rizvi Akram Laban Shillongi

TheINSERTCommandInitssimplestform,INSERTisusedtoaddasingletuple(record)inatable.WemustspecifythetablenameandalistofvaluesfortherecordinthesameorderinwhichthecorrespondingafributeswerespecifiedintheCREATETABLEcommand.

Example:ToaddanewtupletotheEMPLOYEEtableINSERTINTOEMPLOYEEVALUES(‘Mohd’,‘Ali’,‘000100240’,‘1977-3-12’,‘M’,‘45000’);Ifatable(relation)hasmanyafributes,butonlyafewofthoseafributesareassignedvaluesinthenewtuple,asecondformofINSERTstatementisused.

INSERTINTOEMPLOYEE(FNAME,LNAME,SALARY)VALUES(‘Shradha’,‘Vasisht’,‘50000’);TheDELETECommandTheDELETEcommandremovesthetuplesfromarelation.ItincludesaWHEREclausetoselectthetuplestobedeleted.AmissingWHEREclausespecifiesthatalltuplesinthetable40

aretobedeleted;howeverthetableremainsinthedatabaseasanemptytable.DELETEFROMEMPLOYEEWHERELNAME=”Ali”;

DELETEFROMEMPLOYEE;TheUPDATECommandTheUPDATEcommandisusedtomodifyafributevaluesofoneormoreselectedtuples.TheWHEREclauseselectsthetuplestobemodified.

Example:Tochangethesalaryofanemployeewhosefirstnameis‘Mohd’as‘70000’UPDATEEMPLOYEESETSALARY=‘70000’WHEREFNAME=‘Ali’;OrderingandGroupingTheORDERBYkeywordisusedtosorttheresult-setbyaspecifiedcolumn.TheORDERBYkeywordsorts therecords inascendingorderbydefault.Ifyouwanttosorttherecordsinadescendingorder,youcanusetheDESCkeyword.

SyntaxSELECTColumn_name(s)FROMtable_nameORDERBYcolumn_name(s)ASC/DESCExampleThe“Student”table:






41

Nowwewanttoselectallthepersonsfromthetableabove,however,wewanttosortthepersonsbytheirlastname.

WeusethefollowingSELECTstatement:SELECT*FROMPersonsORDERBYLastNameTheresult-setwilllooklikethis:

P_Id LastName FirstName Address City





GroupingTheGROUPBYstatementisusedinconjunctionwiththeaggregatefunctionstogrouptheresult-setbyoneormorecolumns.

SQLGROUPBYSyntaxSELECTcolumn_name,aggregate_function(column_name)FROMtable_nameWHEREcolumn_nameoperatorvalueGROUPBYcolumn_name

SQLGROUPBYExampleWehavethefollowing“ORDERS”tableconsistingthedetailsoftheordersgivenbytheteacherstopurchasebooks

42

O_Id OrderDate OrderPrice Teacher

1 2008/11/12 1000 Hari

2 2008/10/23 1600 Neelam

3 2008/09/02 700 Hari

4 2008/09/03 300 Hari

5 2008/08/30 2000 Naved

6 2008/10/04 100 Neelam

Nowwewanttofindthetotalsum(totalorder)ofeachteacher.WewillhavetousetheGROUPBYstatementtogroupthecustomers.WeusethefollowingSQLstatement:SELECTTeacher,SUM(OrderPrice)FROMORDERSGROUPBYTeacherTheresult-setwilllooklikethis:

Teacher SUM(OrderPrice)

Hari 2000

Neelam 1700

Naved 2000

Let’sseewhathappensifweomittheGROUPBYstatement:SELECTTeacher,SUM(OrderPrice)FROMORDERSTheresult-setwilllooklikethis:

43

Customer SUM(OrderPrice)

Hari 5700

Neelam 5700

Hari 5700

Hari 5700

Naved 5700

Neelam 5700

Theresult-setaboveisnotwhatwewanted.Explanation of why the aboveSELECTstatement cannot be used: TheSELECTstatement above has two columnsspecified(TeacherandSUM(OrderPrice).The“SUM(OrderPrice)”returns a single value (that is the total sum of the “OrderPrice”column),while“Teacher”returns6values(onevalueforeachrowinthe“Orders”table).Thiswillthereforenotgiveusthecorrectresult.However,youhaveseenthattheGROUPBYstatementsolvesthisproblem.OperatingwithMultipleTablesSELECTStatementTheSELECTcommandcanalsobeusedtogetdatafrommorethanonetable.Wehavetablesnamely“EMPLOYEE”and“ORDERS”consistthedetailsoftheteachersandordersgivenbytheteacherstopurchasebooks.

EMPLOYEETABLE

E_Id LastName City

E1 Yadav NewDelhi

E2 John Mumbai

E3 Kuller NewDelhi

44

ORDERSTABLE

O_Id OrderDate OE_Id

O1 2008/09/13 E1

O2 2008/08/30 E3

O3 2008/10/04 E1SELECT*FROMEMPLOYEE,ORDERS;Theresult-setwilllooklikethis:

E_Id LastName City O_Id OrderDate OE_Id

E1 Yadav NewDelhi O1 2008/09/13 E1



E2 John Mumbai O1 2008/09/13 E1



E3 Kuller NewDelhi O1 2008/09/13 E1



SELECT*

FromORDERS,EMPLOYEEWHEREOE_Id=E_Id

45


E_Id LastName City O_Id OrderDate OE_Id




SELECTLastName,City,OrderDateFromORDERS,EMPLOYEEWHEREOE_Id=E_Id


LastName City OrderDate

Yadav NewDelhi 2008/09/13

Yadav NewDelhi 2008/10/04

Kuller NewDelhi 2008/08/30

46

KnowledgeCheckPoints.1.DBMSstandsfor

a)DataBaseManipulationScheme

b)DataBaseMarginalSystem

c)DataBaseManagementSystem

d)DirectoryBaseManagementSystem

.2.InaDatabase,eachrowiscalleda)Recordb)Informationc)Horizontaldatad)Noneofthese

.3.SQLstandsfora)SequentialQueryLanguageb)StructuredQueryLanguagec)StandardQueryLanguaged)StructureQuestionLiterature

.4.Whichofthefollowing(s)is/aretheelement(s)ofadatabasea)Relationsb)Datac)Constraintsd)Allofthese

.5.Whatisdatabaseordatabasemanagementsystems(DBMS)?

.6.What’sthedifferencebetweenfileanddatabase?

.7.WhatisSQL?

.8.What’sdifferencebetweenDBMSandRDBMS?

.9.WhatareDMLandDDLstatements?Givetwoexamplesforeach.Q.10.Howdoweselectdistinctvaluesfromatable?Q.11.CanyouexplainInsert,UpdateandDeletequery?Q.12.Whatisorderbyclause?Q.13.Whatis”Groupby”clause?

47

SkillCheckPoints

Q.1.WritetheSQLstatements(commands)tocreatethetableandtoinsertthedataintothetablegivenbelow:COURSE

CourseName CourseNo CreditHours Department

TeacherEducation ED1210 6 EDU

ElementaryEducation ED1211 4 EDU

ComputerNetwork CS3101 4 CS

IntroductiontoDBMS

CS3102 4 CS

Q2.InthetablegiveninQ14,insertanewcourse<‘EducationTechnology’,‘ED1213’,‘4’,‘EDU’>inthetableCOURSE..3.WhatistheresultofthefollowingSQLstatements:

(i)SELECTCourseNameFROMCOURSEWHEREDepartment=”EDU”;(ii) SELECTCourseNoFROMCOURSE;(iii)SELECTCourseName,SUM(Credit)FROMCOURSEGROUPBYDepartment

48

ChapterTwo

ITDC-402OperatingWebBasedApplications

•OnlineReservationSystems•E-Governance•OnlineShoppingandBillPayments•OnlineTutorialsandTests•ProjectManagement-WebBasedApplicationDevelopment•Projectessentialsandtips•CaseStudy–OnlineQuiz•CaseStudy–OnlineGame•CaseStudy–OnlineBillCalculator

49

IntroductionWebservices are open standard (XML,SOAP,HTTPetc.) basedWebapplications that interact with other web applications for thepurposeofexchangingdata.Webservicesmaybedefinedasfollows:-

•Awebservice isanypieceofsoftwarethatmakes itselfavailableoverthe internetandusesastandardizedXMLmessagingsystem.XM Lisusedtoencodeallcommunications to a web service. For example, a client invokes a web service by sendinganXMLmessage,thenwaitsforacorrespondingXMLresponse.Becauseallcommunication is inXML,webservicesarenot tiedto any one operating system or programming language—Java can talk with Perl; Windows applications can talk with Unixapplications.•Web Services are self-contained, modular, distributed, dynamic applications that can be described, published, located, orinvokedoverthenetworktocreateproducts,processes,andsupplychains.Theseapplicationscanbelocal,distributed,orWeb-based.WebservicesarebuiltontopofopenstandardssuchasTCP/IP,HTTP,Java,HTML,andXML.•WebservicesareXML-basedinformationexchangesystemsthatusetheInternetfordirectapplication-to-applicationinteraction.Thesesystemscanincludeprograms,objects,messages,ordocuments.•A web service is a collection of open protocols and standards used for exchanging data between applications or systems.Software applications wrifen in various programming languages and running on various platforms can use web services toexchange data over computer networks like the Internet in a manner similar to inter-process communication on a singlecomputer.Thisinteroperability(e.g.,betweenJavaandPython,orWindowsandLinuxapplications)isduetotheuseofopenstandards.

Tosummarize,acompletewebserviceis,therefore,anyservicethat:•Is available over theInternet or private(intranet)networks

•Uses a standardizedXML messagingsystem

•Isnottiedtoanyoneoperatingsystem or programminglanguage

•Is self-describing viaa common XMLgrammar

•Isdiscoverableviaasimple findmechanism

50

ONLINESHOPPINGOnlineshoppingmadethingsmucheasierintermsoftime.Gototheinternetpage,choosetheproductyouwantandbuyit.Whateveryoubuyitwillbeinfrontofyourdooraftersometime.Ifyouarenotabletogooutanymoreforanyreason,goforonlineshoppingandyoucanbuyfoodaswellasthingsyouneedinthehousehold.Youcangeteverythingyouneedontheinternetshop.Anothergoodopportunityinonlineshoppingisthatyoucancomparepriceseasily.

Theweaknessofonlineshoppingisthatyouhavetobereallycarefulinchoosingthesiteyouwanttobuythethingsyouneed.Somesitesarefakeinthesensethattheyaskyouformoneyandwon’tgiveyouanything.Anotherbigproblemisthequalityofthethingsyouget.Onlineshoppingisalwaysquitetricky,youhavetolookatthepricesandcomparethemtotheothersitestobesureyouarenotpayingmuchforthegoodsyouwant.

Internetshoppingisfaster,convenient,andgeneratesbeferdeals.Internetshoppinghasevenhelpedcertaincompaniesinachievingcompetitive advantagesbecause it enables them toget rid of intermediaries and sell directly to the customers. There is ahigherprobabilityoffindingbeferpricesontheinternetthaninshoppingmalls.Manyinternetcompaniesoperateasonlineretailersonlywhichmeanstheydon’thavetopayanyintermediariessuchasdistributorsandtheydon’thavetohiresalespeople.Thus,theycanpasssomeofthesavingstothecustomersbyofferingreducedprices.Internetalsoenablesthecustomerstodopricecomparisonsinaninstant,thus,theycanbuyfromtheonlineretailerthatoffersthebestprices.Internetcompaniesareawareofthisthus,theypricetheirinventorycompetitively.

Internetalsoenablesshoppingontheinternationalwebsitesthatstocklocalproducts.Foreignproductsmaynotbeavailableinmostshoppingmallsbecause the levelofdemanddoesn’t justify the stockingof suchproducts. Internet isnot limitedby internationalboundariesandmakesitpossibletobuyproductsfromothercountrieswithoutactuallyhavingtogothere.

Therearenumberofwebsiteswhichprovidethefacilityofonlineshopping.Someofthemarewww.snapdeal.com, www.flipcart.com,www.amazon.com,www.ebay.com,etc.

51

Example:Foronlineshopping,onecanlogontowww.flipkart.com.Thehomepageofthewebsiteisasbelow:

52

Ifyouwanttopurchasesomebooksonflipkart,gototheoptionAllCategoriesBooksClickononeofthecategory/subject

Forexample,ifyouclickonthecategory“AcademicandProfessional”undertheheadof“Education”,youwillgetalistofbooksunderthiscategory.

53

Topurchaseabook,clickonoption“BuyNow”.

54

ONLINERESERVATIONOnlinereservationsystemhasanumberofbenefitsthatmakestheuseofonlinereservationpreferableforarrangingatrip.Onlinereservation system provides the customer all required information and the customers get reservation wherein it saves time andenergy.Socustomersareabletobookorreserveallthattheydeserveandbeabletoplantheirreservationquicklywithoutleavingtheirhome.The systemkeeps thebest alternative solution toonce stagnantmethod formanual operation.Thisprocessmutuallyenhancesthetechnicalcapabilityoftheresortinthepursuitofthebusinessworld.

Forexampleoneisbookingtherailwayticketonline.Thefollowingstepswillbe-Gotowebsitewww.irctc.co.in.Thehomepagewillbedisplayedsuchas:Ifyouhaveanaccount,enteryouruseridinthecolumn“username”andenterpassword.Clicklogin.Thenewwindowwillbedisplayedasbelow:

57

Nowyoucanenterthecodeofboththestations(departureanddestination)inthefromandTocolumnsrespectively.

58

Thenextwebpagewillshowthelistofthetrains59

ONLINERESERVATIONofBUS

63

ONLINEMOVIETICKETS

64

EGovernanceTheNationale-GovernancePlan(NeGP)hasbeenformulatedbytheDepartmentofElectronicsandInformationTechnology(DEITY)and Department of Administrative Reforms and Public Grievances (DARPG). The NeGP approved by the Union Government,comprisingof27MissionModeProjects(MMPs)and10componentsonMay18,2006.

TheNeGPaimed at improving delivery of Government services to citizens and businesses. The vision of the NeGP:“Make allGovernmentservicesaccessibletothecommonmaninhis locality, throughcommonservicedeliveryoutletsandensureefficiency,transparency&reliabilityofsuchservicesataffordablecoststorealisethebasicneedsofthecommonman.”

AboutNeGPCentralGovernmentaswellasvariousStateGovernmentshasbeentakenalargenumberofinitiativesfore-Governance.Sustainedeffortshavebeenmadeatmultiplelevelstoimprovethedeliveryofpublicservicesandsimplifytheprocessofaccessingthem.

e-GovernanceinIndiahassteadilyevolved fromcomputerizationofGovernmentDepartments to initiatives that encapsulate the finerpointsofGovernance,suchascitizencentricity,serviceorientationandtransparency.Theprogressivee-Governancestrategyisbeingshapedinthecountry.Itisnoticedtospeedupe-Governanceimplementationacrossthe65

variousarmsofGovernmentatNational,State, andLocal levels, aprogrammeapproachneedstobe adopted, guided by commonvision and strategy. This approach has the potential of enabling huge savings in costs through sharing of core and supportinfrastructure,enablinginteroperabilitythroughstandards,andofpresentingaseamlessviewofGovernmenttocitizens.

TheNationale-GovernancePlan(NeGP),takesaholisticviewofe-Governanceinitiativesacrossthecountry,integratingthemintoacollectivevision,asharedcause.Aroundthisidea,amassivecountrywideinfrastructurereachingdowntotheremotestofvillagesisevolving,andlarge-scaledigitizationofrecordsistakingplacetoenableeasy,reliableaccessovertheinternet.Theultimateobjectiveistobringpublicservicescloserhometocitizens,asarticulatedintheVisionStatementofNeGP.

“MakeallGovernmentservicesaccessible to thecommonman inhis locality, throughcommonservicedelivery outlets, and ensureefficiency,transparency,andreliabilityofsuchservicesataffordablecoststorealisethebasicneedsofthecommonman”

The Government approved the National e-Governance Plan (NeGP), comprising of 27 Mission Mode Projects (MMPs) and 8components, on May 18, 2006. The Government has accorded approval to the vision, approach, strategy, key components,implementationmethodology, andmanagement structure forNeGP. The existing or ongoing projects in theMMP category, beingimplementedbyvariousCentralMinistries,States,andStateDepartmentswouldbesuitablyaugmentedandenhancedtoalignwiththeobjectivesofNeGP.

OnlinePassportOnlinePassportisaMissionModeProjectofGovernmentofIndia.Theprocessofgefingpassportonlineisasfollows:

66

ONLINEBILLPAYMENTOnlinebillpaymentisasystemofpayingbillsusingtheInternet.Forexampleifyouwantto pay the electricity bill online inNewDelhi,youhavetogotothewebsite www.bsesdelhi.com.As youwill enter this URL in the address bar and enter, youwill get thehomepageofBSESwebsite.

67

Clickontheoption“Paymentoption”.Youwillgetthewebpageasbelow:ClickonPayNow

EnterCANo.

68

AndclickGoThenextpage…

Thewebpageshowsthedetailsofthebill.Topaytheamountofthebill,selectthemodeofpayment.Clickon“PayNow”.

69

ONLINETUTORIALSANDTESTSOnlinetutoringisanonline,virtualenvironmentornetworkedenvironmentinwhichteachersandlearnersareseparatedbytimeandspace.Online tutoring, as a reflection of the diversity of thewider Internet, is practiced usingmany different approaches and isaddressed to distinct sets of users. The distinctions are in online content and interface, aswell as in tutoring and tutor-trainingmethodologies. Definitions associated with online tutoring vary widely, reflecting the ongoing evolution of the technology, therefinement and variation in online learning methodology, and the interactions of the organizations that deliver online tutoringservices with the institutions, individuals, and learners that employ the services. This form of Internet service is a classicalmicropublishingsituation.

OnlineenvironmentsappliedineducationusuallyinvolvetheuseoflearningmanagementsystemsorVirtualLearningEnvironmentssuchasMoodle,Sakai,WebCT,Blackboard.Onlinetutoringmaybeofferedeitherdirectlythroughthevirtuallearningenvironmentofatutoringserviceorviaalinkinalearningmanagementsystem.

MoodleMoodle(abbreviationforModularObject-OrientedDynamicLearningEnvironment)isafreesourceelearningsoftwareplatform,alsoknown as a Learning Management System, orVirtualLearningEnvironment(VLE).MoodlewasoriginallydevelopedbyMartinDougiamas to help educators create online courses with a focus oninteractionandcollaborativeconstructionofcontent,andisincontinualevolution.

YouwillfindaccesstoMoodlefromtheaddress:hfp://www.moodle.aau.dk/andthenchoosetheschool/studyyouwanttoenter.ItmayalsobepossibletofindalinktoMoodlefromthehomepageofyourstudy.

LoginFromthefrontpageofMoodleyouhavethepossibilitytologonviayourAAUe-mailaddress,andthepasswordbelongingtothis.

70

InordertogetaccesstoyourpageinMoodle(MyMoodle)whereyoufindanoutlineofyourroomsinMoodle,itisimportantthatyoulogontoMoodleviayourAAUmailaddressandthematchingpasswords.

Furthermore you must be logged into Moodle to receive information sent from secretaries and teachers, as this is beingcommunicatedvia fora inMoodle,andtohaveaccess tomaterialbeingavailable fromteachers in theso-calledcourseroomsandprojectrooms.

RoomsinMoodleMoodleuses3kindsofrooms:Semesterroom,CourseroomandProjectroom.Inconnectionwiththedifferentrooms3lefersarementionedinbracketsafterthestudyprogram,asshownbelow:

71

Exercise.1.MOODLEstandsfor

a)MultiObject-OrientedDynamicLearningEnvironment

b)ModularObject-OrientedDynamicLearningEnvironment

c)ModularObject-OrientedDirectLearningEnvironment

d)MultiObject-OrientedDirectLearningEnvironment

.2.Whatdoyoumeanbywebservices?Howarethesewebserviceshelpfulforhumanbeingintheirdailylife?Explainwithexamples.

.3.NeGPstandsfora)Nationale-GovernancePlanb)NewGovernancePlanc)NationalElectronicGovernancePland)Newe-GovernancePlan

.4.WhatdoyoumeanbyOnlineReservation?Explainwithsuitableexamples.

.5.Whataretheadvantagesofe-Governance?Illustratewithsuitableexamples..6.Usingtheonlinereservationservice,followthestepstobookatrainticketexceptthebillpaymentsteps..7.Usingtheonlineshoppingservice,followthestepstopurchaseanitemexceptthebillpaymentsteps.

Q8.DiscusshowMOODLEcanbeusedusedforlearningmathematicsatelementarylevel?72

PROJECTMANAGEMENT

-WEBBASEDAPPLICATIONDEVELOPMENTWhatisProject?

1. AProject is a set of things that an organization decides to do to achieve its vision andgoals aswell as to enhancerevenuesandprofits.

2. Eachprojecthasadefinitebeginninganddefiniteendingtime.3. Eachprojecthastobeexecutedundercertainconstraints.Theseconstraintsmaychangewithtimeandthatisapartof

projectdynamics.Exampleof suchconstraintscouldbe:availabilityofmanpower,capitalbudget,durationofproject,targetdateofprojectetc.

SohwareDevelopmentlifecycleAtypicalSoftwareDevelopmentlifecycleconsistsofthefollowingstages:

1. Stage 1:Planningand Requirement Analysis :Requirement analysis is the most important and fundamental stage inSDLC.Itisperformedbytheseniormembersoftheteamwithinputsfromthecustomer,thesalesdepartment,marketsurveysanddomainexperts in the industry.This information is thenused toplan thebasicprojectapproachand toconductproductfeasibilitystudyintheeconomical,operational,andtechnicalareas.

2. Stage2:DefiningRequirements:Oncetherequirementanalysisisdonethenextstepistoclearlydefineanddocumenttheproductrequirementsandgetthemapprovedfromthecustomerorthemarketanalysts.Thisisdonethrough‘SRS’– Software Requirement Specification document which consists of all the product requirements to be designed anddevelopedduringtheprojectlifecycle.

3. Stage3:Designingtheproductarchitecture:SRS is the reference for product architects to come outwith the bestarchitecture for the product to be developed. Based on the requirements specified in SRS, usually more than onedesignapproachfor theproductarchitecture isproposedanddocumented inaDDS-DesignDocumentSpecification.ThisDDSis reviewedbyall the important stakeholdersandbasedon variousparametersas riskassessment,productrobustness,designmodularity,budgetandtimeconstraints,thebestdesignapproachisselectedfortheproduct.

4. Stage4:BuildingorDevelopingtheProduct:InthisstageofSDLCtheactualdevelopmentstartsandtheproductisbuilt.TheprogrammingcodeisgeneratedasperDDSduringthisstage.Ifthedesignisperformedinadetailedandorganizedmanner,

73

codegenerationcanbeaccomplishedwithoutmuchhassle.Developershavetofollowthecodingguidelinesdefinedbytheirorganizationandprogrammingtoolslikecompilers,interpreters,debuggersetcareusedtogeneratethecode.DifferenthighlevelprogramminglanguagessuchasC,C++,Pascal,Java,andPHPareusedforcoding.Theprogramminglanguageischosenwithrespecttothetypeofsoftwarebeingdeveloped.

5. Stage5:TestingtheProduct:ThisstageisusuallyasubsetofallthestagesasinthemodernSDLCmodels, the testingactivities aremostly involved in all the stages ofSDLC. However this stage refers to the testing only stage of theproduct where products defects are reported, tracked, fixed and retested, until the product reaches the qualitystandardsdefinedintheSRS.

6. Stage6:DeploymentintheMarketandMaintenance:Oncetheproductistestedandreadytobedeployeditisreleasedformallyintheappropriatemarket.Sometimeproductdeploymenthappensinstagesaspertheorganizations’businessstrategy.Theproductmayfirstbereleasedinalimitedsegmentandtestedintherealbusinessenvironment(UAT-Useracceptancetesting).

7. Thenbased on the feedback, theproductmaybe released as it is orwith suggested enhancements in the targetingmarketsegment.Aftertheproductisreleasedinthemarket,itsmaintenanceisdonefortheexistingcustomerbase.

ProjectEssentials&tips:TheessentialsofwritinghighqualityJavaScriptneedhabitsandbestpractices.Thesehabitsandbestpracticescanhelpyouwritebefer,moreunderstandable,andmaintainablecode-codetobeproudof(andbeabletofigureout)whenrevisitingitmonthsandyearsdowntheroad.Theyare:

1. WritingMaintainableCodeMaintainablecodemeanscodethat:

•Isreadable•Isconsistent•Ispredictable•Looksasifitwaswrifenbythesameperson•Isdocumented2. MinimizingGlobals

JavaScriptusesfunctionstomanagescope.Avariabledeclaredinsideofafunctionislocalto74

thatfunctionandnotavailableoutsidethefunction.Ontheotherhand,globalvariablesarethosedeclaredoutsideofanyfunctionorsimplyusedwithoutbeingdeclared.TheproblemwithglobalvariablesisthattheyaresharedamongallthecodeinyourJavaScriptapplicationorwebpage.Theyliveinthe sameglobal namespace and there is always a chance of naming collisions -when two separate parts of an applicationdefineglobalvariableswiththesamenamebutwithdifferentpurposes.

3. SinglevarPaflernUsingasinglevarstatementatthetopofyourfunctionsisausefulpaferntoadopt.Ithasthefollowingbenefits:

•Provides a single place to look for allthe local variables needed by thefunction

•Prevents logical errors when avariable is used before it’sdefined

•Helps you remember to declarevariables and therefore minimizeglobals

•Islesscode(totypeandto transfer over thewire)

JavaScriptenablesyoutohavemultiplevarstatementsanywhereinafunction,andtheyallactasifthevariablesweredeclaredatthetopofthefunction.Thisbehaviorisknownashoisting.Thiscanleadtologicalerrorswhenyouuseavariableandthenyoudeclareitfurtherinthefunction.

4. forLoopsInforloopsyouiterateoverorarray-likeobjectssuchasargumentsandHTMLCollectionobjects.Theusualforlooppafernlookslikethefollowing://sub-optimalloop

for(vari=0;i<myarray.length;i++){//dosomethingwithmyarray[i]

}

A problem with this pafern is that the length of the array is accessed on every loop iteration.Thiscanslow down yourcode,especiallywhenmyarrayisnotanarraybutanHTMLCollectionobject.The troublewithcollections is that theyare livequeriesagainsttheunderlyingdocument(theHTMLpage).Thismeansthateverytimeyouaccessanycollection’slength,you’requeryingtheliveDOM,andDOMoperationsareexpensiveingeneral.That’s why a befer pafern for for-loops is to cache the length of the array (or collection) you’re iterating over, as shown in thefollowingexample:for(vari=0,max=myarray.length;i<max;i++){

75

//dosomethingwithmyarray[i]

}

Thiswayyouretrievethevalueoflengthonlyonceanduseitduringthewholeloop.CachingthelengthwheniteratingoverHTMLCollectionisfasteracrossallbrowsers.

5. switchPaflernYoucanimprovethereadabilityandrobustnessofyourswitchstatementsbyfollowingthispafern:

varinspect_me=0,result=”;switch(inspect_me){case0:

result=“zero”;break;case1:

result=“one”;break;default:

result=“unknown”;

}

Thestyleconventionsfollowedinthissimpleexampleare:•Aligningeachcasewithswitch(anexceptiontothecurlybracesindentationrule).•Indentingthecodewithineachcase.•Endingeachcasewithaclearbreakstatement.•Avoiding fall-throughs (whenyouomit thebreak intentionally). If you’reabsolutelyconvinced thata fall-through is thebestapproach,makesureyoudocumentsuchcases,becausetheymightlooklikeerrorstothereadersofyourcode.•Endingtheswitchwithadefaulttomakesurethere’salwaysasaneresultevenifnoneofthecasesmatched.

6. AvoidingImpliedTypecastingJavaScriptimplicitlytypecastsvariableswhenyoucomparethem.That’swhycomparisonssuchasfalse==0or“”==0returntrue.Toavoidconfusioncausedbytheimpliedtypecasting,alwaysusethe===and!==operatorsthatcheckboththevaluesandthetypeoftheexpressionsyoucompare:76

varzero=0;if(zero===false){

//notexecutingbecausezerois0,notfalse

}

//antipafernif(zero==false){

//thisblockisexecuted…

}

7. NumberConversionswithparseInt()UsingparseInt()youcangetanumericvaluefromastring.Thefunctionacceptsasecondradixparameter,whichisoftenomifedbutshouldn’t be. Theproblems occurwhen the string to parse startswith 0: for example, a part of a date entered into a form field.Strings that startwith 0 are treated as octal numbers ( base 8 ) inECMAScript 3; however, thishas changed inES5.To avoidinconsistencyandunexpectedresults,alwaysspecifytheradixparameter:varmonth=“06”,

year=“09”;month=parseInt(month,10);year=parseInt(year,10);

Inthisexample,ifyouomittheradixparameterlikeparseInt(year),thereturnedvaluewillbe0,because“09”assumesoctalnumber(asifyoudidparseInt(year,8))and09isnotavaliddigitinbase8.

8. IndentationCodewithoutindentationisimpossibletoread.Theonlythingworseiscodewithinconsistentindentation,becauseitlookslikeit’sfollowingaconvention,butitmayhaveconfusingsurprisesalongtheway.It’simportanttostandardizetheuseofindentation.Somedevelopersprefer indentationwith tabs,becauseanyonecan tweak their editor todisplay the tabswith the individuallypreferrednumberofspaces.Somepreferspaces-usuallyfour.Itdoesn’tmaferaslongaseveryoneintheteamfollowsthesameconvention.Andwhatshouldyouindent?Theruleissimple-anythingwithincurlybraces.Thismeansthebodiesoffunctions,loops(do,while,for, for-in), ifs, switches, and objects properties in the object literal notation. The following code shows some examples of usingindentation:functionouter(a,b){

77

varc=1,d=2,inner;if(a>b){inner=function(){return{

r:c-d

};

}else{

};

inner=function(){return{r:c+d

};

};

}

returninner;

}

9. CurlyBracesCurlybracesshouldalwaysbeused,evenincaseswhentheyareoptional.Technically,ifyouhaveonlyonestatementinaniforafor,curly braces are not required, but you should always use them anyway. Itmakes the codemore consistent and easier to update.Imagineyouhaveaforloopwithonestatementonly.Youcouldomitthebracesandtherewillbenosyntaxerror://badpractice

for(vari=0;i<10;i+=1)alert(i);Butwhatif,lateron,youaddanotherlineinthebodyoftheloop?

//badpracticefor(vari=0;i<10;i+=1)alert(i);

alert(i+”is”+(i%2?“odd”:“even”));Thesecondalertisoutsidetheloopalthoughtheindentationmaytrickyou.Thebestthingtodointhelongrunistoalwaysusethebraces,evenforone-lineblocks://befer

78

for(vari=0;i<10;i+=1){alert(i);

}

Similarlyforifconditions://badif(true)

alert(1);else

alert(2);//beferif(true){

alert(1);}else{

alert(2);

}

10. OpeningBraceLocationDevelopersalsotendtohavepreferencesaboutwheretheopeningcurlybraceshouldbe-onthesamelineoronthefollowingline?

if(true){alert(“It’sTRUE!”);

}

if(true)

{

OR:

alert(“It’sTRUE!”);

}

Inthisspecificexample,it’samaferofpreference,buttherearecasesinwhichtheprogrammightbehavedifferentlydependingonwherethebraceis.Thisisbecauseofthesemicoloninsertionmechanism-JavaScriptisnotpickywhenyouchoosenottoendyourlinesproperlywithasemicolonandaddsitforyou.Thisbehaviorcancausetroubleswhenafunctionreturnsanobjectliteralandtheopeningbraceisonthenextline://warning:unexpectedreturnvaluefunctionfunc(){

return79

//unreachablecodefollows

{

name:“Batman”

}

}

If you expect this function to return an object with a name property, you’ll be surprised. Because of the implied semicolons, thefunctionreturnsunderfined.Theprecedingcodeisequivalenttothisone://warning:unexpectedreturnvaluefunctionfunc(){

returnundefined;//unreachablecodefollows

{

name:“Batman”

}

}

Inconclusion,alwaysusecurlybracesandalwaysputtheopeningoneonthesamelineasthepreviousstatement:functionfunc(){return{

name:“Batman”

};

}

11. WhiteSpaceTheuseofwhitespacecanalsocontributetoimprovedreadabilityandconsistencyofthecode.InwrifenEnglishsentencesyouuseintervalsaftercommasandperiods.InJavaScriptyoufollowthesamelogicandaddintervalsafterlist-likeexpressions(equivalenttocommas) and end-of-statements (equivalent to completing a “thought”). Good places to use a white space include: After thesemicolonsthatseparatethepartsofaforloop:forexample,for(vari=0;i<10;i+=1){…}Initializingmultiplevariables(iandmax)inaforloop:for(vari=0,max=10;i<max;i+=1)

{…}Afterthecommasthatdelimitarrayitems:vara=[1,2,3];80

After commas in object properties and after colons that divide property names and their values:var o = {a: 1, b: 2}; Delimitingfunctionarguments:myFunc(a,b,c);Beforethecurlybracesinfunctiondeclarations:functionmyFunc(){}After function inanonymous functionexpressions:varmyFunc= function () {};Anothergoodusefor white space is to separate alloperatorsandtheiroperandswithspaces,whichbasicallymeansuseaspacebeforeandafter+,-,*,=,<,>,<=,>=,===,!==,&&,||,+=,andsoon://generousandconsistentspacing

//makesthecodeeasiertoread//allowingitto“breathe”vard=0,

a=b+1;if(a&&b&&c){d=a%c;

a+=d;

}

//antipafern//missingorinconsistentspaces//makethecodeconfusingvard=0,

a=b+1;if(a&&b&&c){d=a%c;

a+=d;

}

Andafinalnoteaboutwhitespace-curlybracesspacing.It’sgoodtouseaspace:•Beforeopeningcurlybraces({)infunctions,if-elsecases,loops,andobjectliterals•Betweentheclosingcurlybrace(})andelseorwhile

Acaseagainstliberaluseofwhitespacemightbethatitcouldincreasethefilesize,butminificationtakescareofthisissue.81

12. CodingandNamingConventionsIt’simportanttoestablishandfollowcodingconventions-theymakeyourcodeconsistent,predictable,andmucheasiertoreadandunderstand.Anewdeveloperjoiningtheteamcanreadthroughtheconventionsandbeproductivemuchsooner,understandingthecodewrifenbyanyotherteammember.Anotherwaytomakeyourcodemorepredictableandmaintainableistoadoptnamingconventions.Thatmeanschoosingnamesforyourvariablesandfunctionsinaconsistentmanner.

13. CapitalizingConstructorsJavaScriptdoesn’thaveclassesbuthasconstructorfunctionsinvokedwithnew:varadam=newPerson();Because

constructorsarestilljustfunctions,ithelpsifyoucantell,justbylookingatafunctionname,whetheritwassupposedtobehaveasaconstructororasanormalfunction.Namingconstructorswithacapitalfirstleferprovidesthathint.Usinglowercaseforfunctionsandmethodsindicatesthattheyarenotsupposedtobecalledwithnew:functionMyConstructor(){…}functionmyFunction(){…}

14. SeparatingWordsWhenyouhavemultiplewordsinavariableorafunctionname,it’sagoodideatofollowaconventionastohowthewordswillbeseparated. A common convention is to use the so-called camel case. Following the camel case convention, you type the words inlowercase,onlycapitalizingthefirstleferineachword.Foryourconstructors,youcanuseuppercamelcase,as inMyConstructor(),andforfunctionandmethodnames,youcanuselowercamelcase,asinmyFunction(),calculateArea()andgetFirstName().Andwhataboutvariablesthatarenotfunctions?Developerscommonlyuselowercamelcaseforvariablenames,butanothergoodideaistousealllowercasewordsdelimitedbyanunderscore:forexample,first_name,favorite_bands,andold_company_name.Thisnotationhelpsyouvisuallydistinguishbetweenfunctionsandallotheridentifiers-primitivesandobjects.

15. OtherNamingPaflernsSometimesdevelopersuseanamingconventiontomakeuporsubstitutelanguagefeatures.

82

Forexample,thereisnowaytodefineconstants in JavaScript (although there are some built-in such asNumber.MAX_VALUE),sodevelopershaveadopted theconventionofusingall-capsfornamingvariablesthatshouldn’t change values during the life of theprogram,like://preciousconstants,pleasedon’ttouchvarPI=3.14,

MAX_WIDTH=800;There’sanotherconventionthatcompetesfortheuseofallcaps:usingcapitallefersfornamesofglobalvariables.Namingglobalswithallcapscanreinforcethepracticeofminimizingtheirnumberandcanmakethemeasilydistinguishable.

16. WritingCommentsYouhavetocommentyourcode,evenif it’sunlikelythatsomeoneotherthanyouwillevertouch it.Oftenwhenyou’redeepintoaproblem you think it’s obvious what the code does, but when you come back to the code after a week, you have a hard timerememberinghowitworkedexactly.Youshouldn’tgooverboardcommentingtheobvious:everysinglevariableoreverysingleline.Butyouusuallyneedtodocumentallfunctions,theirargumentsandreturnvalues,andalsoanyinterestingorunusualalgorithmortechnique.Think of the comments as hints to the future readers of the code; the readers need to understandwhat your code does withoutreadingmuchmorethanjustthecommentsandthefunctionandpropertynames.Whenyouhave,forexample,fiveorsixlinesofcodeperformingaspecifictask,thereadercanskipthecodedetailsifyouprovideaone-linedescriptiondescribingthepurposeofthecodeandwhyit’sthere.There’snohardand fast ruleor ratioof comments-to-code; somepiecesof code (think regular expressions)mayactually requiremorecommentsthancode.

83

CaseStudy1-OnlineQuiz84

quiz.html<HTML><HEAD><styletype=“text/css”>.bgclr

{

background-color:white;color:black;font-weight:bold;

}

</style><scripttype=“text/javascript”src=“quiz.js”></script></HEAD><BODY><h3>OnlineQuiz</h3><FORMname=“quiz”>

1. WhatdoesHTMLstandfor?<ulstyle=“margin-top:1pt”><li><inputtype=“radio”name=“q1”value=“HyperTextMachineLanguage”>HyperTextMachineLanguage</li><li><inputtype=“radio”name=“q1”value=“HyperTextMarkupLanguage”>HyperTextMarkupLanguage</li><li><inputtype=“radio”name=“q1”value=“HighTextMarkupLanguage”>HighTextMarkupLanguage</li></ul>

2. WhatdoesWWWstandfor?<ulstyle=“margin-top:1pt”><li><inputtype=“radio”name=“q2”value=“WorldWideWing”>WorldWideWing</li>85

<li><inputtype=“radio”name=“q2”value=“WholeWorldWeb”>WholeWorldWeb</li><li><inputtype=“radio”name=“q2”value=“WorldWideWeb”>WorldWideWeb</li></ul>

3. WhatdoesHTTPstandfor?<ulstyle=“margin-top:1pt”><li><inputtype=“radio”name=“q3”value=“HyperTextTransmissionProtocol”>HyperTextTransmissionProtocol</li><li><inputtype=“radio”name=“q3”value=“HyperTextTransferProtocol”>HyperTextTransferProtocol</li><li><inputtype=“radio”name=“q3”value=“HighTextTransferProtocol”>HighTextTransferProtocol</li></ul>

4. WhatdoesFTPstandfor?<ulstyle=“margin-top:1pt”><li><inputtype=“radio”name=“q4”value=“FileTransmissionProtocol”>FileTransmissionProtocol</li><li><inputtype=“radio”name=“q4”value=“FileTestingProtocol”>FileTestingProtocol</li><li><inputtype=“radio”name=“q4”value=“FileTransferProtocol”>FileTransferProtocol</li></ul><inputtype=“bufon”value=“Getscore”onClick=“getScore(this.form)”><inputtype=“reset”value=“Clearall”><p>Score=<strong><inputclass=“bgclr”type=“text”size=“5”name=“percentage”disabled></strong><br><br>Correctanswers:<br><TEXTAREAclass=“bgclr”name=“solutions”wrap=“virtual”rows=“4”cols=“50”disabled></TEXTAREA></FORM></BODY>

86

</HTML>quiz.js//InsertnumberofquestionsvarnumQues=4;//InsertnumberofchoicesineachquestionvarnumChoi=3;//Insertnumberofquestionsdisplayedinanswerareavaranswers=newArray(4);//Insertanswerstoquestionsanswers[0]=“HyperTextMarkupLanguage”;answers[1]=“WorldWideWeb”;answers[2]=“HyperTextTransferProtocol”;answers[3]=“FileTransferProtocol”;functiongetScore(form){varscore=0;

varcurrElt;varcurrSelection;for(i=0;i<numQues;i++){currElt=i*numChoi;for(j=0;

j<numChoi;j++){currSelection=form.elements[currElt+j];if(currSelection.checked){

if(currSelection.value==answers[i]){score++;break;

}

}

}

87

}

score=Math.round(score/numQues*100);form.percentage.value=score+“%”;varcorrectAnswers=””;for(i=1;i<=numQues;i++){

correctAnswers+=i+“.”+answers[i-1]+“\r\n”;

}

form.solutions.value=correctAnswers;

}

CaseStudy2-OnlineGame

1. ThisisthetwoplayersTic-Tac-Toelogicgameallowsoneplayertoplayagainstanother.2. Player1isXandthePlayer2isO.3. Selectthesquareyouwanttoputyourmarkerintobyclickingthebox.4. Youcannotoccupyasquarethatisalreadyoccupied.5. Thefirstplayertogetthreesquaresinarowwins.Viewthesourcecode.

88

tictactoe.html<!DOCTYPEhtml><html><head><title>Tic-Tac-Toe</title><linkrel=“stylesheet”type=“text/css”href=“tictactoe.css”/><scripttype=“text/javascript”src=“tictactoe.js”></script></head><body><center><h1><b><pid=“turnlabel”>Player1</p></b></h1><table><tr>

</tr><tr>

</tr><tr>

</tr>

<td><bufonid=“cell”name=“c00”onclick=“move(this,0,0);”></bufon></td><td><bufonid=“cell”name=“c01”onclick=“move(this,0,1);”></bufon></td><td><bufonid=“cell”name=“c02”onclick=“move(this,0,2);”></bufon></td>



</table><b><p>Player1-X</p><p>Player2-O</p></b></center></body></html>

89

tictactoe.jsvarcurrLefer=“X”;varmoves=0;varboard=[[‘‘,’‘,’‘],[‘‘,’‘,’‘],[‘‘,’‘,’‘]];functionmove(obj,i,j)

{

if(board[i][j]==‘‘)

{

varlbl=document.getElementById(“turnlabel”);moves=moves+1;obj.innerHTML=currLefer;board[i][j]=currLefer;if(currLefer==“X”)

{

}

else

{

}

currLefer=“O”;lbl.innerHTML=“Player2”;currLefer=“X”;lbl.innerHTML=“Player1”;

varresult=gameOver();if(result==“tie”)

{

alert(“Nobodywins!”);initBoard();

}

elseif(result!=””)

{

alert(result.substring(0,1)+”wins!”);

90

initBoard();

}

}

else

{

//donothing

}

}

functioninitBoard()

{

varlbl=document.getElementById(“turnlabel”);lbl.innerHTML=“Player1”;currLefer=“X”;moves=0;for(vari=0;i<3;i++)

{

for(varj=0;j<3;j++)

{

board[i][j]=‘‘;varcells=document.getElementsByName(“c”+i+j);cells[0].innerHTML=”“;

}

}

}

functiongameOver()

{

//isthereisaroworcolumnofallXsorOsvarstr;str=board[0][0]+board[0][1]+board[0][2];if(str==“XXX”||str==“OOO”){

returnstr;

}

91

str=board[1][0]+board[1][1]+board[1][2];if(str==“XXX”||str==“OOO”){returnstr;

}


}


}


}


}


92

}

str=board[2][0]+board[1][1]+board[0][2];if(str==“XXX”||str==“OOO”){

returnstr;

}

//areallthespacestakenif(moves==9)

{

return“tie”;

}

return””;

}

CaseStudy3–OnlineBillCalculator

93

calculator.html<!DOCTYPEhtml><html><head><title>SimpleCalculator</title><scripttype=“text/javascript”src=“calculator.js”></script><linkrel=“stylesheet”type=“text/css”href=“calculator.css”/></head><body><center><formname=“form1”><tableborder=“5”><tr>

<tdcolspan=“4”><inputtype=“text”name=“display”style=“text-align:right”style=“font-weight:bold”></td></tr>

<tr>

</tr><tr>

<td><inputtype=“bufon”class=“btn”name=“btnClear”value=“C”onclick=cleardata()></td><td><inputtype=“bufon”class=“btn”name=“btnClear”value=”√”onclick=sqroot()></td><td><inputtype=“bufon”class=“btn”name=“btn0”value=”+/-”onclick=negation()></td><td><inputtype=“bufon”class=“btn”name=“btnDiv”value=”%”onclick=mod()></td>

<td><inputtype=“bufon”class=“btn”name=“btn1”value=“1”onclick=“form1.display.value+=‘1’”></td>94

</tr><tr>

</tr><tr>

</tr><tr>

<td><inputtype=“bufon”class=“btn”name=“btn2”value=“2”onclick=“form1.display.value+=‘2’”></td><td><inputtype=“bufon”class=“btn”name=“btn3”value=“3”onclick=“form1.display.value+=‘3’”></td><td><inputtype=“bufon”class=“btn”name=“btnDiv”value=””onclick=div()><td>

<td><inputtype=“bufon”class=“btn”name=“btn4”value=“4”onclick=“form1.display.value+=‘4’”></td><td><inputtype=“bufon”class=“btn”name=“btn5”value=“5”onclick=“form1.display.value+=‘5’”></td><td><inputtype=“bufon”class=“btn”name=“btn6”value=“6”onclick=“form1.display.value+=‘6’”></td><td><inputtype=“bufon”class=“btn”name=“btnMul”value=“x”onclick=mul()></td>

<td><inputtype=“bufon”class=“btn”name=“btn7”value=“7”onclick=“form1.display.value+=‘7’”></td><td><inputtype=“bufon”class=“btn”name=“btn8”value=“8”onclick=“form1.display.value+=‘8’”></td><td><inputtype=“bufon”class=“btn”name=“btn9”value=“9”onclick=“form1.display.value+=‘9’”></td><td><inputtype=“bufon”class=“btn”name=“btnSub”value=”-”onclick=sub()></td>

<td><inputtype=“bufon”class=“btn”name=“btnEqual”value=”.”onclick=decpoint()></td><td><inputtype=“bufon”class=“btn”name=“btn0”value=“0”onclick=“form1.display.value+=‘0’”></td><td><inputtype=“bufon”class=“btn”name=“btnEqual”value=”=”

95

</tr>

onclick=equals()></td><td><inputtype=“bufon”class=“btn”name=“btnAdd”value=”+”onclick=add()></td></table></form></center></body></html>

calculator.css

input{

}

td{

}

font-family:consola,monospace;font-size:20px;font-weight:bold;

margin-left:auto;margin-right:auto;text-align:center;

.btn{

}

height:40px;width:40px

calculator.jsvarN1=0;

96

varN2=0;varop;varFlag=0;functiondecpoint()

{

if(Flag==0)

{

form1.display.value=form1.display.value+“.”;Flag=1;

}

}

functionnegation()

{

form1.display.value=form1.display.value*-1;

}

functioncleardata()

{

form1.display.value=””;N1=0;N2=0;Flag=0;

}

functionsqroot()

{

form1.display.value=Math.sqrt(form1.display.value);

}

functionadd()

{

if(N1==0)N1=Number(form1.display.value);else

97

N1+=Number(form1.display.value);op=“+”;form1.display.value=””;

}

functionsub()

{

if(N1==0)N1=Number(form1.display.value);elseN1-=Number(form1.display.value);

op=“-“;form1.display.value=””;

}

functionmul()

{

if(N1==0)N1=Number(form1.display.value);elseN1*=Number(form1.display.value);

op=“*”;form1.display.value=””;

}

functiondiv()

{

if(N1==0)N1=Number(form1.display.value);elseN1/=Number(form1.display.value);

op=“/”;form1.display.value=””;

98

}

functionmod()

{

N1=Number(form1.display.value);op=“%”;form1.display.value=””;

}

functionequals()

{

N2=Number(form1.display.value);if(op==“+”)

form1.display.value=N1+N2;elseif(op==“-”)form1.display.value=N1-N2;elseif(op==“*”)form1.display.value=N1*N2;elseif(op==”/”)form1.display.value=N1/N2;elseif(op==”%”)form1.display.value=N1%N2;

N1=0;N2=0;

}

References:1. hfp://code.tutsplus.com/tutorials/the-essentials-of-writing-high-quality-javascript—net-151452. hfp://www.webestools.com/3. hfps://docs.google.com/file/d/0BzsgtY7KuQUXdzgyLURVZ3BuS3c/edit?pli=14. hfp://sumtotalz.com/TotalAppsWorks/Javascript/JS_BasicCalc.html5. hfp://www.javascriptsource.com/miscellaneous/basic-javascript-quiz.html

99

100

ChapterThree

ITDC-403FundamentalsofJavaProgramming

•IntroductiontoJava•ObjectOrientedProgramming•JavaLanguageElements•Operators•ControlFlow•Array•ClassDesign•ExceptionHandling•Assertions•Threads•WrapperClasses•StringManipulation

101

FUNDAMENTALSOFJAVAPROGRAMMING

1. IntroductiontoJavaJavaisahigh-levelprogramminglanguageoriginallydevelopedbySunMicrosystemsandreleasedin1995,lateracquiredbyOracleCorporation.ItwasconceivedbyJamesGoslingandPatrickNaughton.Itisasimpleprogramminglanguage.Writing,compilinganddebuggingaprogramiseasyinjava.Ithelpstocreatemodularprogramsandreusablecode.Javarunsonavarietyofplatforms,suchasWindows,MacOS,andthevariousversionsofUNIX.

1.1MainFeaturesofJAVA:1)Javaisaplatform independent language:Aplatformisapre-existingenvironment inwhichaprogramruns,obeying its

constraints,andmakinguseofitsfacilities.Duringcompilation,thecompilerconvertsjavaprogramtoitsbytecode.ThisbytecodecanrunonanyplatformsuchasWindows,Linux,Mac/OSetc.WhichmeansaprogramthatiscompiledonwindowscanrunonLinuxandvice-versa.Thisiswhyjavaisknownasplatformindependentlanguage.

2)Java is an Object Oriented language:Object oriented programming is awayof organizing programs as collection ofobjects,eachofwhichrepresentsaninstanceofaclass.

3)Simple:Java is considered as one of simple language because it does not have complex features like Operatoroverloading,Multipleinheritance,pointersandExplicitmemoryallocation.

4)RobustLanguage:Twomainproblems thatcauseprogramfailuresarememorymanagementmistakesandmishandledruntimeerrors.Javahandlesbothofthemefficiently.

a)Memory management mistakes can be overcome by garbage collection. Garbage collection is automatic de-allocationofobjectswhicharenolongerneeded.

b)MishandledruntimeerrorsareresolvedbyExceptionHandlingprocedures.5)Secure:It provides a virtual firewall between the application and the computer. Java codes are confinedwithin Java

RuntimeEnvironment(JRE)thusitdoesnotgrantunauthorizedaccessonthesystemresources.102

6)Java is distributed:Using java programming languagewecan create distributed applications. RMI (Remote MethodInvocation)andEJB(EnterpriseJavaBeans)areusedforcreatingdistributedapplicationsinjava.Insimplewords:Thejavaprogramscanbedistributedonmorethanonesystemsthatareconnectedtoeachotherusinginternetconnection.ObjectsononeJVM(javavirtualmachine)canexecuteproceduresonaremoteJVM.

7)Multithreading:Javasupportsmultithreading.Itenablesaprogramtoperformseveraltaskssimultaneously.8)Portable: As discussed above, java code that is written on onemachine can run on anothermachine. The platform

independentbytecodecanbecarriedtoanyplatformforexecutionthatmakesjavacodeportable.1.2JavaTools:

JDK(JavaDevelopmentKit):JDKcontains JREalongwithvariousdevelopment tools like Java libraries, Javasourcecompilers, Javadebuggers,bundlinganddeploymenttoolsJRE(JavaRuntimeEnvironment):ItispartofJDKbutcanbeusedindependentlytorunanybytecode(compiledjavaprogram).ItcanbecalledasJVMimplementation.

JVM(JavaVirtualMachine):‘JVM’issoftwarethatcanbeportedontovarioushardwareplatforms.JVMwillbecomeinstanceofJREatruntimeofjavaprogram.BytecodesarethemachinelanguagefortheJVM.Likearealcomputingmachine,JVMhasaninstructionset which manipulates various memory areas at run time. Thus for different hardware platforms one has correspondingimplementationofJVMavailableasvendorsuppliedJREs.

JavaAPI(ApplicationProgrammingInterface):Setofclasses’writtenusing Javaprogramming languagewhichrunson JVM.Theseclasseswillhelpprogrammersbyprovidingstandardmethods likereadingfromconsole,writingtoconsole,savingobjects indatastructureetc.

1.3PopularJavaEditors:TowriteyourJavaprograms,youwillneedatexteditor.ThereareevenmoresophisticatedIDEsavailableinthemarket.Butfornow,youcanconsideroneofthefollowing:

•Notepad:OnWindowsmachineyoucanuseanysimpletexteditorlikeNotepad

•Netbeans:NetbeansisaJavaIDEthatisopen-sourceandfreewhichcanbe

103

downloadedfromhttp://www.netbeans.org/index.html.•Eclipse:EclipseisalsoaJavaIDEdevelopedbytheeclipseopen-sourcecommunityandcanbedownloadedfromhttp://www.eclipse.org/.

1.4HowJavaWorks:Step1:Createasourcedocumentusinganyeditorandsavefileas.java(e.g.abc.java)Step2:Compiletheabc.javafileusing“javac”command.Step3:ByteCode(abc.class)willbegeneratedondisk.Step4:ThisbytecodecanrunonanyplatformordevicehavingJVM(java.execonvertbytecodeinmachinelanguage)

1.5FirstJavaProgram:

LetuslookatasimplecodethatwouldprintthewordsHelloWorld.publicclassMyFirstJavaProgram

{

/*Thisismyfirstjavaprogram.*Thiswillprint‘HelloWorld’astheoutput

*/

publicstaticvoidmain(String[]args){System.out.println(“HelloWorld”);//printsHelloWorld}

}

Let’slookathowtosavethefile,compileandruntheprogram.Pleasefollowthestepsgivenbelow:•Opennotepadandaddthecodeasabove.•Savethefileas:MyFirstJavaProgram.java.•Openacommandpromptwindowandgotothedirectorywhereyousavedtheclass.Assumeit’sC:.•Type‘javacMyFirstJavaProgram.java‘andpressentertocompileyourcode.Iftherearenoerrorsinyourcode,thecommandpromptwilltakeyoutothenextline

•Now,type‘javaMyFirstJavaProgram’torunyourprogram.

104

Youwillbeabletosee‘HelloWorld‘printedonthewindow.C:>javacMyFirstJavaProgram.javaC:>javaMyFirstJavaProgramHelloWorld

1.6JavaProgrammingGuidelines:•CaseSensitivity-Javaiscasesensitive,whichmeansidentifierHelloandhellowouldhavedifferentmeaninginJava.•ClassNames-ForallclassnamesthefirstlettershouldbeinUpperCase.Ifseveralwordsareusedtoformanameoftheclass,eachinnerword’sfirstlettershouldbeinUpperCase.

Example:classMyFirstJavaClass•MethodNames -Allmethodnamesshould startwithaLowerCase letter. If severalwordsareused to form thenameof themethod,theneachinnerword’sfirstlettershouldbeinUpperCase.

Example:publicvoidmyMethodName()•ProgramFileName-Nameoftheprogramfileshouldexactlymatchtheclassname.Whensavingthefile,youshouldsaveitusingtheclassname(RememberJavaiscasesensitive)andappend‘.java’totheendofthename(ifthefilenameandtheclassnamedonotmatchyourprogramwillnotcompile).

Example:Assume‘MyFirstJavaProgram’istheclassname.Thenthefileshouldbesavedas‘MyFirstJavaProgram.java’•publicstaticvoidmain(Stringargs[])-Javaprogramprocessingstartsfromthemain()methodwhichisamandatorypartofeveryJavaprogram.

2. ObjectOrientedProgrammingA type of programming inwhich programmers definenot only the data type of a data structure, but also the types of operations(functions)thatcanbeappliedtothedatastructure.Inthisway,thedatastructurebecomesanobjectthatincludesbothdataandfunctions. In addition, programmers can create relationships between one object and another. For example, objects can inheritcharacteristicsfromotherobjects.

105

Oneoftheprincipaladvantagesofobject-orientedprogramming techniques over procedural programming techniques is that theyenableprogrammerstocreatemodulesthatdonotneedtobechangedwhenanewtypeofobjectisadded.Aprogrammercansimplycreateanewobjectthatinheritsmanyofitsfeaturesfromexistingobjects.Thismakesobject-orientedprogramseasiertomodify.

.1WhatisObject?Objects are key to understanding object-oriented technology. Look around right now and you’ll findmany examples of real-worldobjects:yourdog,yourdesk,yourtelevisionset,yourbicycle.

Real-world objects share two characteristics: They all have state and behavior. Dogs have state (name, color, breed, hungry) andbehavior(barking,fetching,waggingtail).Bicyclesalsohavestate(currentgear,currentpedalcadence,currentspeed)andbehavior(changinggear,changingpedalcadence,applyingbrakes).Identifyingthestateandbehaviorforreal-worldobjectsisagreatwaytobeginthinkingintermsofobject-orientedprogramming.

Softwareobjectsareconceptuallysimilartoreal-worldobjects:theytooconsistofstateandrelatedbehavior.Anobjectstoresitsstatein fields (variables in some programming languages) and exposes its behavior throughmethods (functions in some programminglanguages).Methodsoperateonanobject’sinternalstateandserveastheprimarymechanismforobject-to-objectcommunication.Hidinginternalstateandrequiringallinteractiontobeperformedthroughanobject’smethodsisknownasdataencapsulation—afundamentalprincipleofobject-orientedprogramming.

Objectisabundleofrelatedvariablesandfunctions(alsoknownmethods).Objectssharetwocharacteristics:•State:Stateisawelldefinedconditionofanitem.Astatecapturestherelevantaspectsofanobject

•Behavior:Behavioristheobservableeffectsofanoperationorevent,

Examples:1)Object:HouseState:CurrentLocation,Color,AreaofHouseetcBehavior:Close/Openmaindoor.

106

2)Object:CarState:Color,MakeBehavior:ClimbUphill,Accelerate,SlowDownetc

Everythingasoftwareobjectknows(State)andcando(Behavior)isrepresentedbyvariablesandmethods(functions)intheobjectrespectively.

Bundlingcodeintoindividualsoftwareobjectsprovidesanumberofbenefits,including:•Modularity:Thesourcecodeforanobjectcanbewrittenandmaintainedindependentlyofthesourcecodeforotherobjects.Oncecreated,anobjectcanbeeasilypassedaroundinsidethesystem.•Information-hiding:Byinteractingonlywithanobject’smethods,thedetailsofitsinternalimplementationremainhiddenfromtheoutsideworld.•Code re-use: If an object already exists (perhaps written by another software developer), you can use that object in yourprogram.Thisallowsspecialiststoimplement/test/debugcomplex,task-specificobjects,whichyoucanthentrusttoruninyourowncode.•Pluggability and debugging ease: If a particular object turns out to be problematic, you can simply remove it from yourapplicationandpluginadifferentobjectasitsreplacement.Thisisanalogoustofixingmechanicalproblemsintherealworld.Ifaboltbreaks,youreplaceit,nottheentiremachine.

.2WhatisClass?Intherealworld,you’lloftenfindmanyindividualobjectsallofthesamekind.Theremaybethousandsofotherbicyclesinexistence,allofthesamemakeandmodel.Eachbicyclewasbuiltfromthesamesetofblueprintsandthereforecontainsthesamecomponents.Inobject-orientedterms,wesaythatyourbicycleisaninstanceoftheclassofobjectsknownasbicycles.Aclassistheblueprintfromwhichindividualobjectsarecreated.

ThefollowingBicycleclassisonepossibleimplementationofabicycle:classBicycle{intcadence=0;intspeed=0;intgear=1;

107

voidchangeCadence(intnewValue){cadence=newValue;

}

voidchangeGear(intnewValue){gear=newValue;

}

voidspeedUp(intincrement){speed=speed+increment;

}

voidapplyBrakes(intdecrement){speed=speed-decrement;

}

voidprintStates(){System.out.println(“cadence:”+cadence+”speed:”+speed+”gear:”+gear);

}

}

ThesyntaxoftheJavaprogramminglanguagewilllooknewtoyou,butthedesignofthisclassisbasedonthepreviousdiscussionofbicycle objects. The fields cadence, speed, and gear represent the object’s state, and the methods (changeCadence, changeGear,speedUpetc.)defineitsinteractionwiththeoutsideworld.

YoumayhavenoticedthattheBicycleclassdoesnotcontainamainmethod.That’sbecauseit’snotacompleteapplication;it’sjusttheblueprintforbicyclesthatmightbeusedinanapplication.TheresponsibilityofcreatingandusingnewBicycleobjectsbelongstosomeotherclassinyourapplication.

Here’saBicycleDemoclassthatcreatestwoseparateBicycleobjectsandinvokestheirmethods:

classBicycleDemo{publicstaticvoidmain(String[]args){

108

//Createtwodifferent//BicycleobjectsBicyclebike1=newBicycle();Bicyclebike2=newBicycle();

//Invokemethodson//thoseobjectsbike1.changeCadence(50);bike1.speedUp(10);bike1.changeGear(2);bike1.printStates();bike2.changeCadence(50);bike2.speedUp(10);bike2.changeGear(2);bike2.changeCadence(40);bike2.speedUp(10);bike2.changeGear(3);bike2.printStates();}

}

Theoutputofthistestprintstheendingpedalcadence,speed,andgearforthetwobicycles:cadence:50speed:10gear:2

cadence:40speed:20gear:3.3Messagepassing

Asingleobjectby itselfmaynotbeveryuseful.Anapplicationcontainsmanyobjects.Oneobject interactswithanotherobjectbyinvoking methods (or functions) on that object. Through the interaction of objects, programmers achieve a higher order offunctionalitywhichhascomplexbehavior.Oneobject invokingmethodsonanotherobject isknownasMessagepassing. It isalsoreferredtoasMethodInvocation.

109

.4ObjectOrientedProgrammingfeatures:

.4.1Abstraction

Thepurposeofabstractionistohideinformationthatisnotrelevantorrathershowonlyrelevantinformationandtosimplifyitbycomparingittosomethingsimilarintherealworld.Abstractionmeans“Theprocessofformingofgeneralandrelevantconceptfrommorecomplexscenarios”.

.4.2EncapsulationEncapsulationmeansthelocalizationoftheinformationorknowledgewithinanobject.Encapsulationisalsocalledas“InformationHiding”.

•Objectsencapsulatedataandimplementationdetails.Totheoutsideworld,anobjectisablackboxthatexhibitsacertainbehavior.•Thebehaviorofthisobjectiswhatwhichisusefulfortheexternalworldorotherobjects.•Anobjectexposesitsbehaviorbymeansofmethodsorfunctions.•Thesetoffunctionsanobjectexposestootherobjectsorexternalworldactsasthe

110

interfaceoftheobject...3Inheritance

The process by which one class acquires the properties and functionalities of another class. Inheritance provides the idea ofreusabilityofcodeandeachsubclassdefinesonlythosefeaturesthatareuniquetoit.

•Inheritance is amechanism of defining a new classbasedonanexistingclass.•Inheritanceenablesreuseofcode.Inheritancealsoprovidesscopeforrefinementoftheexistingclass.Inheritancehelpsinspecialization

•Theexisting(ororiginal)classiscalledthebaseclassorsuperclassorparentclass.Thenewclasswhichinheritsfromthebaseclassiscalledthederivedclassorsubclassorchildclass.

•Inheritanceimplementsthe“Is-A”or“KindOf/Has-A”relationship.

ThebiggestadvantageofInheritanceisthat,codeinbaseclassneednotberewritteninthederivedclass.Themembervariablesandmethodsofthebaseclasscanbeusedinthederivedclassaswell.

TypesofInheritance:1)MultilevelInheritance:Multilevel inheritancereferstoamechanisminOOtechnologywhereonecaninherit fromaderivedclass,therebymakingthisderivedclassthebaseclassforthenewclass.

2)Multiple Inheritance: “Multiple Inheritance” refers to the concept of one class inheriting from more than one base class. Theinheritancewelearntearlierhadtheconceptofonebaseclassorparent.Theproblemwith“multipleinheritance”isthatthederivedclasswillhavetomanagethedependencyontwobaseclasses.

Note:MultilevelinheritanceisallowedinJavabutnotmultipleinheritance...4Polymorphism

Polymorphismisafeaturethatallowsoneinterfacetobeusedforageneralclassofactions.It’sanoperationmayexhibitdifferentbehaviorindifferentinstances.Thebehaviordependsonthetypesofdatausedintheoperation.Itplaysanimportantroleinallowingobjectshavingdifferentinternalstructurestosharethesameexternalinterface.Polymorphismisextensivelyusedinimplementinginheritance.

111

TypesofPolymorphism:1)StaticPolymorphism:

•FunctionOverloading–withinsameclassmorethanonemethodhavingsamenamebutdifferinginsignature.•Resolvedduringcompilationtime.•Returntypeisnotpartofmethodsignature.

2)DynamicPolymorphism:•FunctionOverriding–keepingthesignatureandreturntypesame,methodintheBaseclassisredefinedinthederivedclass.•Resolvedduringruntime.•Whichmethodtobeinvokedisdecidedbytheobjectthatthereferencepointstoandnotbythetypeofthereference.

3. JavaLanguageElementsWhenweconsideraJavaprogramitcanbedefinedasacollectionofobjectsthatcommunicateviainvokingeachother’smethods.Letusnowbrieflylookintowhatdoclass,object,methodsandinstancevariablesmean.

1)Object-Objectshavestatesandbehaviors.Example:Adoghasstates-color,name,breedaswellasbehaviors-wagging,barking,eating.Anobjectisaninstanceofaclass.

2)Class-Aclasscanbedefinedasatemplate/blueprintthatdescribesthebehaviors/statesthatobjectofitstypesupport.3)Methods-Amethodisbasicallyabehavior.Aclasscancontainmanymethods.Itisinmethodswherethelogicsarewritten,dataismanipulatedandalltheactionsareexecuted.

4)InstanceVariables-Eachobjecthasitsuniquesetofinstancevariables.Anobject’sstateiscreatedbythevaluesassignedtotheseinstancevariables.

3.1JavaKeywords:ThefollowinglistshowsthereservedwordsinJava.Thesereservedwordsmaynotbeusedasconstantorvariableoranyotheridentifiernames.

112

abstract assert boolean break

byte case catch char

class const continue default

do double else enum

extends final finally float

for goto if implements

import instanceof int interface

long native new package

private protected public return

short static strictfp super

switch synchronized this throw

throws transient try void

volatile while3.2JavaIdentifiers:AllJavacomponentsrequirenames.Namesusedforclasses,variablesandmethodsarecalledidentifiers.InJava,thereareseveralpointstorememberaboutidentifiers.Theyareasfollows:

1)Allidentifiersshouldbeginwithaletter(AtoZoratoz),currencycharacter($)oranunderscore(_).2)Afterthefirstcharacteridentifierscanhaveanycombinationofcharacters.3)Akeywordcannotbeusedasanidentifier.4)Mostimportantlyidentifiersarecasesensitive.Examples:

age,$salary,value,1_value (legalidentifiers)

3.3

123abc,-salaryJavaDatatypes:

(illegalidentifiers)

TherearetwodatatypesavailableinJava:1)PrimitiveDataTypes2)Reference/ObjectDataTypes

113

..1PrimitiveDataTypes:ThereareeightprimitivedatatypessupportedbyJava.Primitivedatatypesarepredefinedbythelanguageandnamedbyakeyword.Letusnowlookintodetailabouttheeightprimitivedatatypes.

Datatype Size Range Example

byte 8-bit -128to127(-28to28-1)

bytea=100byteb=-50

short 16-bit -32,768to32,767(-216to216-1)

shorts=10000shortr=-20000

int 32-bit -2,147,483,648to2,147,483,647(-231to231-1)

inta=100000intb=-200000

long 64-bit -9,223,372,036,854,775,808to9,223,372,036,854,775,807(-264to264-1)

longa=100000Lintb=-200000L

float 32-bit 3.4e-038to3.4e+038 floatf1=234.5f

double 64-bit 1.7e-308to1.7e+308 doubled1=123.4

char 16-bit 0to65,535 Charch=‘A’boolean 1-bit True/False booleanone=

true..2ReferenceDataTypes:

Reference variables are created using defined constructors of the classes. They are used to access objects. These variables aredeclaredtobeofaspecifictypethatcannotbechanged.Forexample,Employee,Puppyetc.

•Classobjects,andvarioustypeofarrayvariablescomeunderreferencedatatype.•Defaultvalueofanyreferencevariableisnull.•Areferencevariablecanbeusedtorefertoanyobjectofthedeclaredtypeoranycompatibletype.•Example:Animalanimal=newAnimal(“giraffe”);.3JavaLiterals:

Aliteralisasourcecoderepresentationofafixedvalue.Theyarerepresenteddirectlyinthecodewithoutanycomputation.Literalscanbeassignedtoanyprimitivetypevariable.Forexample:

114

bytea=68;chara=‘A’

byte,int,long,andshortcanbeexpressedindecimal(base10),hexadecimal(base16)oroctal(base8)numbersystemsaswell.

Prefix0isusedtoindicateoctalandprefix0xindicateshexadecimalwhenusingthesenumbersystemsforliterals.Forexample:intdecimal=100;intoctal=0144;inthexa=0x64;

StringliteralsinJavaarespecifiedliketheyareinmostotherlanguagesbyenclosingasequenceofcharactersbetweenapairofdoublequotes.Examplesofstringliteralsare:“HelloWorld”“two\nlines”

“"Thisisinquotes"”

StringandchartypesofliteralscancontainanyUnicodecharacters.Forexample:chara=‘\u0001’;Stringa=

“\u0001”;

JavalanguagesupportsfewspecialescapesequencesforStringandcharliteralsaswell.Theyare:

Notation Characterrepresented\n Newline(0x0a)\r Carriagereturn(0x0d)\f Formfeed(0x0c)

\b Backspace(0x08)

\s Space(0x20)\t tab" Doublequote' Singlequote

\backslash

\ddd Octalcharacter(ddd)\uxxxx HexadecimalUNICODEcharacter(xxxx)

115

.4JavaVariables:Variablesarenothingbutreservedmemory locations tostorevalues.Thismeans thatwhenyoucreateavariableyoureservesomespaceinmemory.Basedonthedatatypeofavariable,theoperatingsystemallocatesmemoryanddecideswhatcanbestoredinthereservedmemory.Therefore,byassigningdifferentdatatypestovariables,youcanstoreintegers,decimals,orcharactersinthesevariables.

A variable provides us with named storage that our programs can manipulate. Each variable in Java has a specific type, whichdeterminesthesizeandlayoutofthevariable’smemory;therangeofvaluesthatcanbestoredwithinthatmemory;andthesetofoperationsthatcanbeappliedtothevariable.

Youmustdeclareallvariablesbeforetheycanbeused.Thebasicformofavariabledeclarationisshownhere:datatypevariable[=value][,variable[=value]…];HeredatatypeisoneofJava’sdatatypesandvariableisthenameofthevariable.Todeclaremorethanonevariableofthespecifiedtype,youcanuseacomma-separatedlist.

FollowingarevalidexamplesofvariabledeclarationandinitializationinJava:inta,b,c;//Declaresthreeints,a,b,andc.inta=10,b=10;//ExampleofinitializationbyteB=22;//initializesabytetypevariableB.doublepi=3.14159;//declaresandassignsavalueofPI.chara=‘a’;//thecharvariableaiisinitializedwithvalue‘a’TherearethreekindsofvariablesinJava:

1)Localvariables2)Instancevariables3)Class/staticvariables3.5.1Localvariables:Localvariablesaredeclaredinmethods,constructors,orblocks.Localvariablesarecreatedwhenthemethod,constructororblockisenteredandthevariablewillbedestroyedonceitexitsthemethod,constructororblock.Accessmodifierscannotbeusedforlocalvariables.Localvariablesarevisibleonlywithinthedeclaredmethod,constructororblock.Local116

variablesareimplementedatstacklevelinternally.Thereisnodefaultvalueforlocalvariablessolocalvariablesshouldbedeclaredandaninitialvalueshouldbeassignedbeforethefirstuse.

Example:Here,ageisalocalvariable.ThisisdefinedinsidepupAge()methodanditsscopeislimitedtothismethodonly.

publicclassTest{publicvoidpupAge(){intage=0;

age=age+7;System.out.println(“Puppyageis:”+age);

}

publicstaticvoidmain(Stringargs[]){Testtest=newTest();test.pupAge();

}

}

Thiswouldproducethefollowingresult:Puppyageis:7Example:Followingexampleusesagewithoutinitializingit,soitwouldgiveanerroratthetimeofcompilation.

publicclassTest{publicvoidpupAge(){intage;

age=age+7;System.out.println(“Puppyageis:”+age);

}

publicstaticvoidmain(Stringargs[]){Testtest=newTest();

117

test.pupAge();

}

}

Thiswouldproducethefollowingerrorwhilecompilingit:Test.java:4:variablenumbermightnothavebeeninitializedage=age+7;

^1error

3.5.2Instancevariables:Instancevariablesaredeclaredinaclass,butoutsideamethod,constructororanyblock.Whenaspaceisallocatedforanobjectintheheap,aslotforeachinstancevariablevalueiscreated.Instancevariablesarecreatedwhenanobjectiscreatedwiththeuseofthekeyword‘new’anddestroyedwhentheobjectisdestroyed.Instancevariablesholdvaluesthatmustbereferencedbymorethanonemethod,constructororblock,oressentialpartsofanobject’sstatethatmustbepresentthroughouttheclass.Instancevariablescanbedeclaredinclasslevelbeforeorafteruse.Accessmodifierscanbegivenforinstancevariables.

Theinstancevariablesarevisibleforallmethods,constructorsandblockintheclass.Normally, it isrecommendedtomakethesevariablesprivate(accesslevel).Howevervisibilityforsubclassescanbegivenforthesevariableswiththeuseofaccessmodifiers.

Instancevariableshavedefaultvalues.Fornumbersthedefaultvalueis0,forBooleansitisfalseandforobjectreferencesitisnull.Valuescanbeassignedduringthedeclarationorwithintheconstructor.

Instancevariablescanbeaccesseddirectlybycallingthevariablenameinsidetheclass.Howeverwithinstaticmethodsanddifferentclass(wheninstancevariablesaregivenaccessibility)shouldbecalledusingthefullyqualifiedname.

ObjectReference.VariableNameExample:

118

importjava.io.*;publicclassEmployee{

//thisinstancevariableisvisibleforanychildclass.publicStringname;

//salaryvariableisvisibleinEmployeeclassonly.privatedoublesalary;

//Thenamevariableisassignedintheconstructor.publicEmployee(StringempName){name=empName;

}

//Thesalaryvariableisassignedavalue.publicvoidsetSalary(doubleempSal){salary=empSal;

}

//Thismethodprintstheemployeedetails.publicvoidprintEmp(){System.out.println(“name:”+name);System.out.println(“salary:”+salary);

}

publicstaticvoidmain(Stringargs[]){EmployeeempOne=newEmployee(“Ajay”);empOne.setSalary(5000);empOne.printEmp();

}

}

Thiswouldproducethefollowingresult:name:Ajay

salary:5000.0119

.5CommentsinJava:Javasupportssingle-lineandmultilinecommentsverysimilartocandc++.AllcharactersavailableinsideanycommentareignoredbyJavacompiler.

publicclassMyFirstJavaProgram{/*Thisismyfirstjavaprogram.*Thiswillprint‘HelloWorld’astheoutput*Thisisanexampleofmultilinecomments.

*/

publicstaticvoidmain(String[]args){//Thisisanexampleofsinglelinecomment/*Thisisalsoanexampleofsinglelinecomment.*/System.out.println(“HelloWorld”);

}

}

.6UsingBlankLines:Alinecontainingonlywhitespace,possiblywithacomment,isknownasablankline,andJavatotallyignoresit.

4. JavaOperatorsJavaprovidesarichsetofoperatorstomanipulatevariables.WecandividealltheJavaoperatorsintothefollowinggroups:

•ArithmeticOperators•RelationalOperators•BitwiseOperators•LogicalOperators•AssignmentOperators•ConditionalOperators4.1TheArithmeticOperators:

Arithmeticoperatorsareusedinmathematicalexpressionsinthesamewaythattheyareusedinalgebra.Thefollowingtableliststhearithmeticoperators:

120

AssumeintegervariableAholds10andvariableBholds20,then:

Operator Description Example

+Addition-Addsvaluesoneithersideoftheoperator A+Bwillgive

30

-Subtraction-Subtractsrighthandoperandfromlefthandoperand

A-Bwillgive-10

*Multiplication-Multipliesvaluesoneithersideoftheoperator

A*Bwillgive200

/Division-Divideslefthandoperandbyrighthandoperand

B/Awillgive2

%Modulus-Divideslefthandoperandbyrighthandoperandandreturnsremainder

B%Awillgive0

++Increment-Increasesthevalueofoperandby1 B++gives21

—Decrement-Decreasesthevalueofoperandby1 B—gives19

4.2TheRelationalOperators:TherearefollowingrelationaloperatorssupportedbyJavalanguageAssumevariableAholds10andvariableBholds20,then:


==Checksifthevaluesoftwooperandsareequalornot,ifyesthenconditionbecomestrue.

(A==B)isnottrue.

!=Checksifthevaluesoftwooperandsareequalornot,ifvaluesarenotequalthenconditionbecomestrue.

(A!=B)istrue.

> Checksifthevalueofleftoperandisgreaterthanthevalueofrightoperand,ifyesthenconditionbecomestrue.

(A>B)isnottrue.

< Checksifthevalueofleftoperandislessthanthevalueofrightoperand,ifyesthenconditionbecomestrue.

(A<B)istrue.

>= Checksifthevalueofleftoperandisgreaterthanorequaltothevalueofrightoperand,ifyesthenconditionbecomestrue

(A>=B)isnot.true.

<= Checksifthevalueofleftoperandislessthanorequaltothevalueofrightoperand,ifyesthenconditionbecomestrue.

(A<=B)istrue.

121

4.3TheBitwiseOperators:Javadefinesseveralbitwiseoperators,whichcanbeappliedtotheintegertypes,long,int,short,char,andbyte.Bitwiseoperatorworksonbitsandperformsbit-by-bitoperation.

Assumeifa=60;andb=13;nowinbinaryformattheywillbeasfollows:a=00111100b=00001101–––––—a&b=00001100a|b=00111101a^b=00110001~a=11000011Thefollowingtableliststhebitwiseoperators:AssumeintegervariableAholds60andvariableBholds13then:

Operator Description Example& BinaryANDOperatorcopiesabittotheresultif

itexistsinbothoperands.(A&B)willgive12whichis00001100

|BinaryOROperatorcopiesabitifitexistsineitheroperand.

(A|B)willgive61whichis00111101

^BinaryXOROperatorcopiesthebitifitissetinoneoperandbutnotboth.

(A^B)willgive49whichis00110001

~BinaryOnesComplementOperatorisunaryandhastheeffectof‘flipping’bits.

(~A)willgive-61whichis11000011in2’scomplementformduetoasignedbinarynumber.

<< BinaryLeftShiftOperator.Theleftoperandsvalueismovedleftbythenumberofbitsspecifiedbytherightoperand.

A<<2willgive240whichis11110000

122

>> BinaryRightShiftOperator.Theleftoperandsvalueismovedrightbythenumberofbitsspecifiedbytherightoperand.

A>>2willgive15whichis1111

>>> Shiftrightzerofilloperator.Theleftoperandsvalueismovedrightbythenumberofbitsspecifiedbytherightoperandandshiftedvaluesarefilledupwithzeros.

A>>2willgive15whichis00001111

.4TheLogicalOperators:

Thefollowingtableliststhelogicaloperators:AssumeBooleanvariablesAholdstrueandvariableBholdsfalse,then

Operator Description Example&& CalledLogicalANDoperator.Ifboththe

operandsarenon-zero,thentheconditionbecomestrue.

(A&&B)isfalse.

||CalledLogicalOROperator.Ifanyofthetwooperandsarenon-zero,thentheconditionbecomestrue.

(A||B)istrue.

! CalledLogicalNOTOperator.Usetoreversesthelogicalstateofitsoperand.IfaconditionistruethenLogicalNOToperatorwillmakefalse.

!(A&&B)istrue.

.5TheAssignmentOperators:TherearefollowingassignmentoperatorssupportedbyJavalanguage:


=Simpleassignmentoperator,Assignsvaluesfromrightsideoperandstoleftsideoperand

C=A+BwillassignvalueofA+BintoC

+=AddANDassignmentoperator,Itaddsrightoperandtotheleftoperandandassigntheresulttoleftoperand

C+=AisequivalenttoC=C+A

-=SubtractANDassignmentoperator,Itsubtractsrightoperandfromtheleftoperandandassigntheresulttoleftoperand

C-=AisequivalenttoC=C-A

*=MultiplyANDassignmentoperator,Itmultipliesrightoperandwiththeleftoperandandassigntheresulttoleftoperand

C=AisequivalenttoC=CA

123

/=DivideANDassignmentoperator,Itdividesleftoperandwiththerightoperandandassigntheresulttoleftoperand

C/=AisequivalenttoC=C/A

%=ModulusANDassignmentoperator,Ittakesmodulususingtwooperandsandassigntheresulttoleftoperand

C%=AisequivalenttoC=C%A

<<= LeftshiftANDassignmentoperator C<<=2issameasC=C<<2

>>= RightshiftANDassignmentoperator C>>=2issameasC=C>>2

&= BitwiseANDassignmentoperator C&=2issameasC=C&2

^=bitwiseexclusiveORandassignmentoperator C^=2is

sameasC=C^2

|=bitwiseinclusiveORandassignmentoperator C|=2issame

asC=C|2

Conditionaloperatorisalsoknownastheternaryoperator.ThisoperatorconsistsofthreeoperandsandisusedtoevaluateBooleanexpressions.Thegoaloftheoperatoristodecidewhichvalueshouldbeassignedtothevariable.Theoperatoriswrittenas:variablex=(expression)?valueiftrue:valueiffalseFollowingistheexample:publicclassTest{

publicstaticvoidmain(Stringargs[]){inta,b;a=10;b=(a==1)?20:30;System.out.println(“Valueofbis:”+b);b=(a==10)?20:30;System.out.println(“Valueofbis:”+b);

}

}

124

Thiswouldproducethefollowingresult:Valueofbis:30Valueofbis:20

4.7PrecedenceofJavaOperators:Operator precedence determines the grouping of terms in an expression. This affects how an expression is evaluated. Certainoperatorshavehigherprecedence thanothers; for example, themultiplicationoperatorhashigherprecedence than theadditionoperator:Forexample,x=7+32;herex isassigned13,not20becauseoperatorhashigherprecedencethan+,so it firstgetsmultipliedwith3*2andthenaddsinto7.

Here,operatorswiththehighestprecedenceappearatthetopofthetable,thosewiththelowestappearatthebottom.Withinanexpression,higherprecedenceoperatorswillbeevaluatedfirst.

Category Operator Associativity

Postfix ()[].(dotoperator) Lefttoright

Unary++--!~

Righttoleft

Multiplicative*/%

Lefttoright

Additive+-

Lefttoright

Shift >>>>><< Lefttoright

Relational >>=<<= Lefttoright

Equality==!=

Lefttoright

BitwiseAND & Lefttoright

BitwiseXOR^

Lefttoright

BitwiseOR|

Lefttoright

LogicalAND && Lefttoright

LogicalOR||

Lefttoright

Conditional?:

Righttoleft

Assignment =+=-=*=/=%=>>=<<=&=^=|= Righttoleft

Comma , Lefttoright

125

Thiswouldproducethefollowingresult:5. ControlFlow

Injava,controlflowismanagedbyfollowingtwotypesofstatements:1)DecisionMakingStatements2)LoopControlStatements

5.1DecisionMakingStatementsTherearetwotypesofdecisionmakingstatementsinJava.Theyare:

1)ifstatements2)switchstatements5.1.1TheifStatement:AnifstatementconsistsofaBooleanexpressionfollowedbyoneormorestatements.Syntax:if(Boolean_expression)

{

//StatementswillexecuteiftheBooleanexpressionistrue

}

IftheBooleanexpressionevaluatestotruethentheblockofcodeinsidetheifstatementwillbeexecuted.Ifnotthefirstsetofcodeaftertheendoftheifstatement(aftertheclosingcurlybrace)willbeexecuted.

Example:publicclassTest{

publicstaticvoidmain(Stringargs[]){intx=10,y=20;

if(x<y){System.out.print(“xislessthany”);

}

}

}

126

Thiswouldproducethefollowingresult:xislessthany..2Theif…elseStatement:

Anifstatementcanbefollowedbyanoptionalelsestatement,whichexecuteswhentheBooleanexpressionisfalse.

Syntax:if(Boolean_expression){

//ExecuteswhentheBooleanexpressionistrue}else{

//ExecuteswhentheBooleanexpressionisfalse

}


publicstaticvoidmain(Stringargs[]){intx=20,y=10;

if(x<y){System.out.print(“xislessthany”);

}else{System.out.print(“xisnotlessthany”);

}

}

}

Thiswouldproducethefollowingresult:xisnotlessthanyExampleProgram://JavaProgramtocheckEvenorOddnumberimportjava.util.Scanner;

127

classCheckEvenOdd

{

publicstaticvoidmain(Stringargs[])

{

intnum;System.out.println(“EnteranIntegernumber:”);//TheinputprovidedbyuserisstoredinnumScannerinput=newScanner(System.in);num=input.nextInt();/*Ifnumberisdivisibleby2thenit’sanevennumberelseoddnumber/if(num%2==0)

System.out.println(“Enterednumberiseven”);

else

}

}

System.out.println(“Enterednumberisodd”);Output1:EnteranIntegernumber:78EnterednumberisevenOutput2:EnteranIntegernumber:77Enterednumberisodd

..3Theif…elseif…elseStatement:Anifstatementcanbefollowedbyanoptionalelseif…elsestatement,whichisveryusefultotestvariousconditionsusingsingleif…elseifstatement.Whenusingif,elseif,elsestatementstherearefewpointstokeepinmind.Anifcanhavezerooroneelse’sanditmustcomeafteranyelseif’s.Anifcanhavezerotomanyelseif’sandtheymustcomebeforetheelse.Onceanelseifsucceeds,noneoftheremainingelseif’sorelse’swillbetested.

128

Syntax:if(Boolean_expression1){

//ExecuteswhentheBooleanexpression1istrue}elseif(Boolean_expression2){

//ExecuteswhentheBooleanexpression2istrue}elseif(Boolean_expression3){

//ExecuteswhentheBooleanexpression3istrue}else{

//Executeswhenthenoneoftheaboveconditionistrue.

}


publicstaticvoidmain(Stringargs[]){intx=30;if(x==10){

System.out.print(“ValueofXis10”);}elseif(x==20){

System.out.print(“ValueofXis20”);}elseif(x==30){

System.out.print(“ValueofXis30”);}else{

System.out.print(“Thisiselsestatement”);

}

}

}

Thiswouldproducethefollowingresult:ValueofXis30ExampleProgram://JavaProgramtofindlargestofthreenumbersusingif…elseifimportjava.util.Scanner;

129

classLargestOfThreeNumbers

{


{

intx,y,z;System.out.println(“Enterthreeintegers“);Scannerin=newScanner(System.in);

x=in.nextInt();y=in.nextInt();z=in.nextInt();

if(x>y&&x>z)System.out.println(“Firstnumberislargest.”);elseif(y>x&&y>z)System.out.println(“Secondnumberislargest.”);elseif(z>x&&z>y)System.out.println(“Thirdnumberislargest.”);

else

}

}

System.out.println(“Enterednumbersarenotdistinct.”);Output:Enterthreeintegers103020Secondnumberislargest.5.1.4Nestedif…elseStatement:Itisalwayslegaltonestif-elsestatementswhichmeansyoucanuseoneiforelseifstatementinsideanotheriforelseifstatement.

Syntax:if(Boolean_expression1){

//ExecuteswhentheBooleanexpression1istrueif(Boolean_expression2){

130

//ExecuteswhentheBooleanexpression2istrue

}

}

Youcannestelseif…elseinthesimilarwayaswehavenestedifstatement.Example:publicclassTest{

publicstaticvoidmain(Stringargs[]){intx=10;inty=20;

if(x==10){if(y==20){

System.out.print(“X=10andY=20”);

}

}

}

}

Thiswouldproducethefollowingresult:X=10andY=20//JavaProgramtofindlargestofthreenumbersusingnestedifimportjava.util.Scanner;

classLargestOfThreeNumbers

{


{

intx,y,z;System.out.println(“Enterthreeintegers“);Scannerin=newScanner(System.in);

x = in.nextInt(); y = in.nextInt(); z =in.nextInt();

131

if(x>y)

{

If(x>z)System.out.println(“Firstnumberislargest.”);

}

else

{

else

System.out.println(“Thirdnumberislargest.”);

If(y>z)System.out.println(“Secondnumberislargest.”);

else

}

}

}

System.out.println(“Thirdnumberislargest.”);Output:Enterthreeintegers103020Secondnumberislargest.5.1.5TheswitchStatement:Aswitchstatementallowsavariabletobetestedforequalityagainstalistofvalues.Eachvalueiscalledacase,andthevariablebeingswitchedonischeckedforeachcase.

Syntax:switch(expression){casevalue:

//Statementsbreak;//optionalcasevalue:

//Statementsbreak;//optional

132

//Youcanhaveanynumberofcasestatements.default://Optional//Statements

}

Thefollowingrulesapplytoaswitchstatement:1)Thevariableusedinaswitchstatementcanonlybeabyte,short,int,orchar.2)Youcanhaveanynumberofcasestatementswithinaswitch.Eachcaseisfollowedbythevaluetobecomparedtoandacolon.3)Thevalueforacasemustbethesamedatatypeasthevariableintheswitchanditmustbeaconstantoraliteral.4)Whenthevariablebeingswitchedonisequaltoacase,thestatementsfollowingthatcasewillexecuteuntilabreakstatementisreached.

5)Whenabreakstatementisreached,theswitchterminates,andtheflowofcontroljumpstothenextlinefollowingtheswitchstatement.

6)Noteverycaseneedstocontainabreak.Ifnobreakappears,theflowofcontrolwillfallthroughtosubsequentcasesuntilabreakisreached.

7)Aswitchstatementcanhaveanoptionaldefaultcase,whichmustappearat theendof theswitch.Thedefaultcasecanbeusedforperformingataskwhennoneofthecasesistrue.Nobreakisneededinthedefaultcase.


publicstaticvoidmain(Stringargs[]){//chargrade=args[0].charAt(0);chargrade=‘C’;

switch(grade)

{

case‘A’:System.out.println(“Excellent!”);break;

133

case‘B’:case‘C’:

System.out.println(“Welldone”);break;case‘D’:

System.out.println(“Youpassed”);case‘F’:System.out.println(“Bettertryagain”);break;

default:System.out.println(“Invalidgrade”);

}

System.out.println(“Yourgradeis”+grade);

}

}

Compileandrunaboveprogramusingvariouscommandlinearguments.Thiswouldproducethefollowingresult:WelldoneYourgradeisaCProgramExample://JavaProgramtoprintthedayimportjava.util.Scanner;

classCheckDay

{


{

intn;System.out.println(“Enterthenumber:”);//TheinputprovidedbyuserisstoredinnScannerinput=newScanner(System.in);n=input.nextInt();

134

switch(n)

{

case1:System.out.println(“MONDAY”);break;case2:System.out.println(“TUESDAY”);break;case3:System.out.println(“WEDNESDAY”);break;case4:System.out.println(“THURSDAY”);break;case5:System.out.println(“FRIDAY”);break;case6:System.out.println(“SATURDAY”);break;case7:System.out.println(“SUNDAY”);break;

default:

}

}

}

System.out.println(“WRONGENTRY”);Output1:Enterthenumber:3WEDNESDAYOutput2:Enterthenumber:8WRONGENTRY

6. ArrayJavaprovidesadatastructure,thearray,whichstoresafixed-sizesequentialcollectionofelementsofthesametype.Anarrayisusedtostoreacollectionofdata,butitisoftenmore

135

usefultothinkofanarrayasacollectionofvariablesofthesametype.Instead of declaring individual variables, such as number0, number1, …, and number99, you declare one array variable such asnumbersandusenumbers[0],numbers[1],and…,numbers[99]torepresentindividualvariables.

.1DeclaringArrayVariables:Touseanarrayinaprogram,youmustdeclareavariabletoreferencethearray,andyoumustspecifythetypeofarraythevariablecanreference.Hereisthesyntaxfordeclaringanarrayvariable:dataType[]arrayRefVar;//preferredway.ordataTypearrayRefVar[];//worksbutnotpreferredway.Example:Thefollowingcodesnippetsareexamplesofthissyntax:double[]myList;//preferredway.ordoublemyList[];//worksbutnotpreferredway.

.2CreatingArrays:Youcancreateanarraybyusingthenewoperatorwiththefollowingsyntax:arrayRefVar=newdataType[arraySize];Theabovestatementdoestwothings:

1)ItcreatesanarrayusingnewdataType[arraySize];2)ItassignsthereferenceofthenewlycreatedarraytothevariablearrayRefVar.

Declaringanarrayvariable,creatinganarray,andassigningthereferenceofthearraytothevariablecanbecombinedinonestatement,asshownbelow:dataType[]arrayRefVar=newdataType[arraySize];

136

Alternativelyyoucancreatearraysasfollows:dataType[]arrayRefVar={value0,value1,…,valuek};Thearrayelementsareaccessedthroughtheindex.Arrayindicesare0-based;thatis,theystartfrom0toarrayRefVar.length-1.

Example:Followingstatementdeclaresanarrayvariable,myList,createsanarrayof10elementsofdoubletypeandassignsitsreferencetomyList:double[]myList=newdouble[10];ExampleProgram:Thisprogramuseslinearsearchalgorithmtofindoutanumberamongallothernumbersenteredbyuser.

/*Program:LinearSearchExample*Writtenby:Chaitanyafrombeginnersbook.com

*Input:Numberofelements,element’svalues,valuetobesearched

*Output:Positionofthenumberinputbyuseramongothernumbers*/importjava.util.Scanner;

classLinearSearchExample

{


{

intcounter,num,item,array[];//TocaptureuserinputScannerinput=newScanner(System.in);System.out.println(“Enternumberofelements:”);num=input.nextInt();//Creatingarraytostoretheallthenumbersarray=newint[num];System.out.println(“Enter”+num+”integers”);//Looptostoreeachnumbersinarrayfor(counter=0;counter<num;counter++)array[counter]=input.nextInt();

137

System.out.println(“Enterthesearchvalue:”);item=input.nextInt();

for(counter=0;counter<num;counter++)

{

if(array[counter]==item)

{

System.out.println(item+”ispresentatlocation”+(counter+1));/*Itemisfoundsotostopthesearchandtocomeoutofthe

loopusebreakstatement./break;

}

}

if(counter==num)System.out.println(item+”doesn’texistinarray.”);

}

}

Output1:Enternumberofelements:6Enter6integers2233451399Enterthesearchvalue:4545ispresentatlocation3Output2:Enternumberofelements:4

138

Enter4integers112245Enterthesearchvalue:9999doesn’texistinarray.

7. ClassDesignJavaisanObject-OrientedLanguage.Inobject-orientedprogrammingtechnique,wedesignaprogramusingobjectsandclasses.Inthischapter,wewilllookintotheconceptsClassesandObjects.

•Object-Objectshavestatesandbehaviors.Example:Adoghasstates-color,name,breedaswellasbehaviors-wagging,barking,eating.Anobjectisaninstanceofaclass.•Class-Aclasscanbedefinedasatemplate/blueprintthatdescribesthebehaviors/statesthatobjectofitstypesupport.7.1ObjectsinJava:

Letusnowlookdeepintowhatareobjects.Ifweconsiderthereal-worldwecanfindmanyobjectsaroundus,Cars,Dogs,Humans,etc.Alltheseobjectshaveastateandbehavior.Ifweconsideradog,thenitsstateis-name,breed,color,andthebehavioris-barking,wagging,runningIfyoucomparethesoftwareobjectwitharealworldobject,theyhaveverysimilarcharacteristics.Softwareobjectsalso have a state and behavior. A software object’s state is stored in fields and behavior is shown via methods. So in softwaredevelopment,methodsoperateontheinternalstateofanobjectandtheobject-to-objectcommunicationisdoneviamethods.

7.2ClassesinJava:Aclassisablueprintfromwhichindividualobjectsarecreated.Asampleofaclassisgivenbelow:publicclassDog{

139

Stringbreed;intage;Stringcolor;

voidbarking(){

}

voidhungry(){

}

voidsleeping(){

}

}

Aclasscancontainanyofthefollowingvariabletypes.•Localvariables:Variablesdefinedinsidemethods,constructorsorblocksarecalledlocalvariables.Thevariablewillbedeclaredandinitializedwithinthemethodandthevariablewillbedestroyedwhenthemethodhascompleted.•Instancevariables:Instancevariablesarevariableswithinaclassbutoutsideanymethod.Thesevariablesareinstantiatedwhentheclassisloaded.Instancevariablescanbeaccessedfrominsideanymethod,constructororblocksofthatparticularclass.•Classvariables:Classvariablesarevariablesdeclaredwithinaclass,outsideanymethod,withthestatickeyword.

Aclasscanhaveanynumberofmethodstoaccessthevalueofvariouskindsofmethods.Intheaboveexample,barking(),hungry()andsleeping()aremethods.

7.3Constructors:Whendiscussingaboutclasses,oneofthemostimportantsubtopicwouldbeconstructors.Everyclasshasaconstructor.Ifwedonotexplicitly write a constructor for a class the Java compiler builds a default constructor for that class. Each time a new object iscreated,atleastoneconstructorwillbeinvoked.Themainruleofconstructorsisthattheyshouldhavethesamenameastheclass.Aclasscanhavemorethanoneconstructor.Exampleofaconstructorisgivenbelow:publicclassPuppy{publicPuppy(){

140

}

publicPuppy(Stringname){//Thisconstructorhasoneparameter,name.

}

}

JavaalsosupportsSingletonClasseswhereyouwouldbeabletocreateonlyoneinstanceofaclass.

7.4CreatinganObject:Asmentionedpreviously,aclassprovidestheblueprintsforobjects.Sobasicallyanobjectiscreatedfromaclass.InJava,thenewkeywordisusedtocreatenewobjects.Therearethreestepswhencreatinganobjectfromaclass:

1)Declaration:Avariabledeclarationwithavariablenamewithanobjecttype.2)Instantiation:The‘new’keywordisusedtocreatetheobject.3)Initialization:The‘new’keywordisfollowedbyacalltoaconstructor.Thiscallinitializesthenewobject.

Exampleofcreatinganobjectisgivenbelow:publicclassPuppy{publicPuppy(Stringname){

//Thisconstructorhasoneparameter,name.System.out.println(“PassedNameis:”+name);

}

publicstaticvoidmain(String[]args){//FollowingstatementwouldcreateanobjectmyPuppyPuppymyPuppy=newPuppy(“tommy”);

}

}

Ifwecompileandruntheaboveprogram,thenitwouldproducethefollowingresult:PassedNameis:tommy141

7.5AccessingInstanceVariablesandMethods:Instancevariablesandmethodsareaccessedviacreatedobjects.Toaccessaninstancevariablethefullyqualifiedpathshouldbeasfollows:/*Firstcreateanobject*/ObjectReference=newConstructor();

/*Nowcallavariableasfollows*/ObjectReference.variableName;

/*Nowyoucancallaclassmethodasfollows*/ObjectReference.MethodName();

Example:Thisexampleexplainshowtoaccessinstancevariablesandmethodsofaclass:publicclassPuppy{

intpuppyAge;publicPuppy(Stringname){

//Thisconstructorhasoneparameter,name.System.out.println(“PassedNameis:”+name);

}

publicvoidsetAge(intage){puppyAge=age;

}

publicintgetAge(){System.out.println(“Puppy’sageis:”+puppyAge);returnpuppyAge;

}

publicstaticvoidmain(String[]args){/*Objectcreation*/PuppymyPuppy=newPuppy(“tommy”);/*Callclassmethodtosetpuppy’sage*/myPuppy.setAge(2);

/*Callanotherclassmethodtogetpuppy’sage*/142

myPuppy.getAge();/*Youcanaccessinstancevariableasfollowsaswell*/System.out.println(“VariableValue:”+myPuppy.puppyAge);}

}

Ifwecompileandruntheaboveprogram,thenitwouldproducethefollowingresult:PassedNameis:tommyPuppy’sageis:2VariableValue:2

.6Sourcefiledeclarationrules:Asthelastpartofthissectionlet’snowlookintothesourcefiledeclarationrules.Theserulesareessentialwhendeclaringclasses,importstatementsandpackagestatementsinasourcefile.

Therecanbeonlyonepublicclasspersourcefile.1)Asourcefilecanhavemultiplenonpublicclasses.2)Thepublicclassnameshouldbethenameofthesourcefileaswellwhichshouldbeappendedby.javaattheend.Forexample:TheclassnameispublicclassEmployee{}ThenthesourcefileshouldbeasEmployee.java.

3)Iftheclassisdefinedinsideapackage,thenthepackagestatementshouldbethefirststatementinthesourcefile.4)Ifimportstatementsarepresentthentheymustbewrittenbetweenthepackagestatementandtheclassdeclaration.Iftherearenopackagestatementsthentheimportstatementshouldbethefirstlineinthesourcefile.

5)Importandpackagestatementswill implytoalltheclassespresent inthesourcefile.It isnotpossibletodeclaredifferentimportand/orpackagestatementstodifferentclassesinthesourcefile.

.7JavaPackage:In simple, it is a way of categorizing the classes and interfaces. When developing applications in Java, hundreds of classes andinterfaceswillbewritten,thereforecategorizingtheseclassesisamustaswellasmakeslifemucheasier.

143

Importstatements:In Java if a fullyqualifiedname,which includes thepackageand theclassname, isgiven then thecompilercaneasily locate thesourcecodeorclasses.Importstatementisawayofgivingtheproperlocationforthecompilertofindthatparticularclass.

Forexample,thefollowinglinewouldaskcompilertoloadalltheclassesavailableindirectoryjava_installation/java/io:importjava.io.*;

8. ExceptionHandlingAnexceptionisaproblemthatarisesduringtheexecutionofaprogram.Anexceptioncanoccurformanydifferentreasons,includingthefollowing:

1)Auserhasenteredinvaliddata.2)Afilethatneedstobeopenedcannotbefound.3)AnetworkconnectionhasbeenlostinthemiddleofcommunicationsortheJVMhasrunoutofmemory.

Someoftheseexceptionsarecausedbyusererror,othersbyprogrammererror,andothersbyphysicalresourcesthathavefailedinsomemanner.

TounderstandhowexceptionhandlingworksinJava,youneedtounderstandthethreecategoriesofexceptions:•Checkedexceptions:A checkedexception is an exception that is typically auser error or aproblem that cannotbe foreseenby theprogrammer.Forexample,ifafileistobeopened,butthefilecannotbefound,anexceptionoccurs.Theseexceptionscannotsimplybeignoredatthetimeofcompilation.•Runtimeexceptions:A runtime exception is an exception that occurs that probably could have been avoided by the programmer. Asopposedtocheckedexceptions,runtimeexceptionsareignoredatthetimeofcompilation.•Errors:Thesearenotexceptionsatall,butproblemsthatarisebeyondthecontroloftheuserortheprogrammer.Errorsaretypicallyignoredinyourcodebecauseyoucanrarelydoanythingaboutanerror.Forexample, ifastackoverflowoccurs,anerrorwillarise.Theyarealsoignoredatthetimeofcompilation.

144

8.1ExceptionHierarchy:Allexceptionclassesaresubtypesof the java.lang.Exceptionclass.Theexceptionclass isasubclassof theThrowableclass.OtherthantheexceptionclassthereisanothersubclasscalledErrorwhichisderivedfromtheThrowableclass.

ErrorsarenotnormallytrappedformtheJavaprograms.Theseconditionsnormallyhappenincaseofseverefailures,whicharenothandledbythejavaprograms.Errorsaregeneratedtoindicateerrorsgeneratedbytheruntimeenvironment.Example:JVMisoutofMemory.Normallyprogramscannotrecoverfromerrors.

TheExceptionclasshastwomainsubclasses:IOExceptionclassandRuntimeExceptionClass.

Throwable

Error

Exception

IOExceoption

RuntimeException

145.2ExceptionsMethods:

FollowingisthelistofimportantmedthodsavailableintheThrowableclass.

SN MethodswithDescription

1 publicStringgetMessage()Returnsadetailedmessageabouttheexceptionthathasoccurred.ThismessageisinitializedintheThrowableconstructor.

2 publicThrowablegetCause()ReturnsthecauseoftheexceptionasrepresentedbyaThrowableobject.

3 publicStringtoString()ReturnsthenameoftheclassconcatenatedwiththeresultofgetMessage()

4 publicvoidprintStackTrace()PrintstheresultoftoString()alongwiththestacktracetoSystem.err,theerroroutputstream.

5 publicStackTraceElement[]getStackTrace()Returnsanarraycontainingeachelementonthestacktrace.Theelementatindex0representsthetopofthecallstack,andthelastelementinthearrayrepresentsthemethodatthebottomofthecallstack.

6 publicThrowablefillInStackTrace()FillsthestacktraceofthisThrowableobjectwiththecurrentstacktrace,addingtoanypreviousinformationinthestacktrace..3CatchingExceptions:

Amethodcatchesanexceptionusingacombinationofthetryandcatchkeywords.Atry/catchblockisplacedaroundthecodethatmightgenerateanexception.Codewithinatry/catchblockisreferredtoasprotectedcode,andthesyntaxforusingtry/catchlookslikethefollowing:try

//Protectedcode}catch(ExceptionNamee1)

{

//Catchblock

146

}

Acatchstatementinvolvesdeclaringthetypeofexceptionyouaretryingtocatch.Ifanexceptionoccursinprotectedcode,thecatchblock (orblocks) that follows the try ischecked. If the typeofexception thatoccurred is listed inacatchblock, theexception ispassedtothecatchblockmuchasanargumentispassedintoamethodparameter.

Example:Thefollowingisanarrayisdeclaredwith2elements.Thenthecodetriestoaccessthe3rdelementofthearraywhichthrowsanexception.

//FileName:ExcepTest.javaimportjava.io.*;publicclassExcepTest{

publicstaticvoidmain(Stringargs[]){try{inta[]=newint[2];System.out.println(“Accesselementthree:”+a[3]);

}catch(ArrayIndexOutOfBoundsExceptione){System.out.println(“Exceptionthrown:”+e);}

System.out.println(“Outoftheblock”);

}

}

Thiswouldproducethefollowingresult:Exceptionthrown:java.lang.ArrayIndexOutOfBoundsException:3Outoftheblock

.4MultiplecatchBlocks:Atryblockcanbefollowedbymultiplecatchblocks.Thesyntaxformultiplecatchblockslookslikethefollowing:try

{

//Protectedcode

147

}catch(ExceptionType1e1)

{

//Catchblock}catch(ExceptionType2e2)

{


{

//Catchblock

}

Theprevious statementsdemonstrate threecatchblocks,but youcanhaveanynumberof themaftera single try. If anexceptionoccurs in the protected code, the exception is thrown tothefirst catch blockinthelist.Ifthe data typeoftheexception thrownmatchesExceptionType1,itgetscaughtthere.Ifnot,theexceptionpassesdowntothesecondcatchstatement.Thiscontinuesuntiltheexceptioneither iscaughtor falls throughallcatches, inwhichcase thecurrentmethodstopsexecutionand theexception isthrowndowntothepreviousmethodonthecallstack.

Example:Hereiscodesegmentshowinghowtousemultipletry/catchstatements.

try

{

file=newFileInputStream(fileName);x=(byte)file.read();

}catch(IOExceptioni)

{

i.printStackTrace();return-1;}catch(FileNotFoundExceptionf)//Notvalid!

{

f.printStackTrace();return-1;

}

148.5Thethrows/throwKeywords:

Ifamethoddoesnothandleacheckedexception,themethodmustdeclareitusingthethrowskeyword.Thethrowskeywordappearsattheendofamethod’ssignature.Youcanthrowanexception,eitheranewlyinstantiatedoneoranexceptionthatyoujustcaught,byusing the throwkeyword.Try tounderstand thedifferent in throwsand throwkeywords.The followingmethoddeclares that itthrowsaRemoteException:importjava.io.*;publicclassclassName

{

publicvoiddeposit(doubleamount)throwsRemoteException

{

//MethodimplementationthrownewRemoteException();

}

//Remainderofclassdefinition

}

Amethod can declare that it throwsmore than one exception, in which case the exceptions are declared in a list separated bycommas.Forexample, the followingmethoddeclares that it throwsaRemoteExceptionandanInsufficientFundsException: importjava.io.*;publicclassclassName

{

publicvoidwithdraw(doubleamount)throwsRemoteException,InsufficientFundsException

{

//Methodimplementation

}

//Remainderofclassdefinition

}

.6ThefinallyKeyword:Thefinallykeywordisusedtocreateablockofcodethatfollowsatryblock.Afinallyblockofcodealwaysexecutes,whetherornotanexceptionhasoccurred.Usingafinallyblockallows

149

youto run any cleanup-type statements that youwant to execute, nomatter what happens in the protected code. A finally blockappearsattheendofthecatchblocksandhasthefollowingsyntax:try

{

//Protectedcode}catch(ExceptionType1e1)

{


{


{

//Catchblock}finally

{

//Thefinallyblockalwaysexecutes.

}

Example:publicclassExcepTest{

publicstaticvoidmain(Stringargs[]){inta[]=newint[2];try{

System.out.println(“Accesselementthree:”+a[3]);}catch(ArrayIndexOutOfBoundsExceptione){System.out.println(“Exception

thrown:”+e);}finally{

a[0]=6;System.out.println(“Firstelementvalue:”+a[0]);System.out.println(“Thefinallystatementisexecuted”);}

150

}

}

Thiswouldproducethefollowingresult:Exceptionthrown:java.lang.ArrayIndexOutOfBoundsException:3Firstelementvalue:6Thefinallystatementisexecuted

Note:1)Acatchclausecannotexistwithoutatrystatement.2)Itisnotcompulsorytohavefinallyclauseswheneveratry/catchblockispresent.3)Thetryblockcannotbepresentwithouteithercatchclauseorfinallyclause.4)Anycodecannotbepresentinbetweenthetry,catch,finallyblocks..7DeclaringyouownException:

YoucancreateyourownexceptionsinJava.Keepthefollowingpointsinmindwhenwritingyourownexceptionclasses:AllexceptionsmustbeachildofThrowable.IfyouwanttowriteacheckedexceptionthatisautomaticallyenforcedbytheHandleorDeclareRule,youneedtoextendtheExceptionclass.

Ifyouwanttowritearuntimeexception,youneedtoextendtheRuntimeExceptionclass.

WecandefineourownExceptionclassasbelow:classMyExceptionextendsException{

}

YoujustneedtoextendtheExceptionclasstocreateyourownExceptionclass.Theseareconsideredtobecheckedexceptions.Thefollowing InsufficientFundsException class is a user-defined exception that extends the Exception class, making it a checkedexception.Anexceptionclassislikeanyotherclass,containingusefulfieldsandmethods.

151

Example://FileNameInsufficientFundsException.javaimportjava.io.*;

publicclassInsufficientFundsExceptionextendsException

{

privatedoubleamount;publicInsufficientFundsException(doubleamount)

{

this.amount=amount;

}

publicdoublegetAmount()

{

returnamount;

}

}

Todemonstrateusingouruser-definedexception,thefollowingCheckingAccountclasscontainsawithdraw()methodthatthrowsanInsufficientFundsException.

//FileNameCheckingAccount.javaimportjava.io.*;

publicclassCheckingAccount

{

privatedoublebalance;privateintnumber;publicCheckingAccount(intnumber)

{

this.number=number;

}

publicvoiddeposit(doubleamount)

{

balance+=amount;

}

publicvoidwithdraw(doubleamount)throws

152

InsufficientFundsException

{

if(amount<=balance)

{

}

else

{

}

}

balance-=amount;

doubleneeds=amount-balance;thrownewInsufficientFundsException(needs);

publicdoublegetBalance()

{

returnbalance;

}

publicintgetNumber()

{

returnnumber;

}

}

ThefollowingBankDemoprogramdemonstratesinvokingthedeposit()andwithdraw()methodsofCheckingAccount.

//FileNameBankDemo.javapublicclassBankDemo

{

publicstaticvoidmain(String[]args)

{

CheckingAccountc=newCheckingAccount(101);System.out.println(“Depositing$500…”);c.deposit(500.00);try

{

System.out.println(“\nWithdrawing$100…”);

153

c.withdraw(100.00);System.out.println(“\nWithdrawing$600…”);c.withdraw(600.00);}catch(InsufficientFundsExceptione)

{

System.out.println(“Sorry,butyouareshort$”+e.getAmount());e.printStackTrace();

}

}

}

CompilealltheabovethreefilesandrunBankDemo,thiswouldproducethefollowingresult:Depositing$500…Withdrawing$100…Withdrawing$600…Sorry,butyouareshort$200.0InsufficientFundsException

atCheckingAccount.withdraw(CheckingAccount.java:25)atBankDemo.main(BankDemo.java:13).8CommonExceptions:

InJava,itispossibletodefinetwocategoriesofExceptionsandErrors.1)JVMExceptions:Theseareexceptions/errorsthatareexclusivelyorlogicallythrownbytheJVM.Examples:NullPointerException,ArrayIndexOutOfBoundsException,ClassCastException,

2)Programmaticexceptions:TheseexceptionsarethrownexplicitlybytheapplicationortheAPIprogrammersExamples:IllegalArgumentException,IllegalStateException.

9. AssertionsAssertionisastatementinjava.Itcanbeusedtotestyourassumptionsabouttheprogram.Whileexecutingassertion,itisbelievedtobetrue.Ifitfails,JVMwillthrowanerrornamedAssertionError.Itismainlyusedfortestingpurpose.

154

.1AdvantageofAssertion:Itprovidesaneffectivewaytodetectandcorrectprogrammingerrors.Syntax:Therearetwowaystouseassertion.Firstwayis:assertexpression;andsecondwayis:assertexpression1:expression2;SimpleExampleofAssertioninjava:importjava.util.Scanner;classAssertionExample{publicstaticvoidmain(Stringargs[]){

Scannerscanner=newScanner(System.in);System.out.print(“Enteryourage“);

intvalue=scanner.nextInt();assertvalue>=18:”Notvalid”;System.out.println(“valueis“+value);

}

}

Ifyouuseassertion,Itwillnotrunsimplybecauseassertionisdisabledbydefault.Toenabletheassertion,-eaor-enableassertionsswitchofjavamustbeused.

Compileitby:javacAssertionExample.javaRunitby:java-eaAssertionExampleOutput:Enterurage11Exceptioninthread“main”java.lang.AssertionError:Notvalid

.2WherenottouseAssertion:

155

Therearesomesituationswhereassertionshouldbeavoidtouse.Theyare:1)According to Sun Specification, assertion should not be used to check arguments in thepublic methods becauseitshouldresultinappropriateruntimeexceptione.g.IllegalArgumentException,NullPointerExceptionetc.

2)Donotuseassertion,ifyoudon’twantanyerrorinanysituation.10. Threads

Java is amultithreaded programming languagewhichmeanswe can developmultithreaded program using Java. Amultithreadedprogramcontains twoormoreparts that can run concurrently and eachpart canhandledifferent task at the same timemakingoptimaluseoftheavailableresourcesspeciallywhenyourcomputerhasmultipleCPUs.

BydefinitionmultitaskingiswhenmultipleprocessessharecommonprocessingresourcessuchasaCPU.Multithreadingextendstheideaofmultitaskingintoapplicationswhereyoucansubdividespecificoperationswithinasingleapplicationintoindividualthreads.Eachofthethreadscanruninparallel.TheOSdividesprocessingtimenotonlyamongdifferentapplications,butalsoamongeachthreadwithinanapplication.

Multithreadingenablesyoutowriteinawaywheremultipleactivitiescanproceedconcurrentlyinthesameprogram.10.1LifeCycleofaThread:

Athrestarted,adgoesthroughvariousstagesinitslifecycle.Forexample,athreadisborn,ndthendies.Followingdiagramshowscompletelifecycleofathread.runs,a

156

Above-mentionedstagesareexplainedhere:New:Anewthreadbeginsitslifecycleinthenewstate.Itremainsinthisstateuntiltheprogramstartsthethread.Itisalsoreferredtoasabornthread.

Runnable: After a newly born thread is started, the thread becomes runnable. A thread in this state is considered to beexecutingitstask.

Waiting:Sometimes,a thread transitions to thewaitingstatewhile the threadwaits foranother thread toperforma task.Athreadtransitionsbacktotherunnablestateonlywhenanotherthreadsignalsthewaitingthreadtocontinueexecuting.

Timedwaiting:A runnable thread can enter the timedwaiting state for a specified interval of time. A thread in this statetransitionsbacktotherunnablestatewhenthattimeintervalexpiresorwhentheeventitiswaitingforoccurs.

Terminated:Arunnablethreadenterstheterminatedstatewhenitcompletesitstaskorotherwiseterminates.10.2ThreadPriorities:

EveryJavathreadhasaprioritythathelpstheoperatingsystemdeterminetheorderinwhichthreadsarescheduled.

JavathreadprioritiesareintherangebetweenMIN_PRIORITY(aconstantof1)andMAX_PRIORITY(aconstantof10).Bydefault,everythreadisgivenpriorityNORM_PRIORITY(aconstantof5).

Threadswithhigherpriorityaremoreimportanttoaprogramandshouldbeallocatedprocessortimebeforelower-prioritythreads.However,threadprioritiescannotguaranteetheorderinwhichthreadsexecuteandverymuchplatformdependentant.

10.3CreateThreadbyImplementingRunnableInterface:IfyourclassisintendedtobeexecutedasathreadthenyoucanachievethisbyimplementingRunnableinterface.Youwillneedtofollowthreebasicsteps:

Step1:Asafirststepyouneedtoimplementarun()methodprovidedbyRunnableinterface.Thismethodprovidesentrypointforthethreadandyouwillputyoucompletebusinesslogicinsidethismethod.Followingissimplesyntaxofrun()method:157

publicvoidrun()Step2:AtsecondstepyouwillinstantiateaThreadobjectusingthefollowingconstructor:Thread(RunnablethreadObj,StringthreadName);Where,threadObjisaninstanceofaclassthatimplementstheRunnableinterfaceandthreadNameisthenamegiventothenewthread.

Step3:OnceThreadobjectiscreated,youcanstartitbycallingstart()method,whichexecutesacalltorun()method.Followingissimplesyntaxofstart()method:voidstart();Example:Hereisanexamplethatcreatesanewthreadandstartsitrunning:classRunnableDemoimplementsRunnable{

privateThreadt;privateStringthreadName;RunnableDemo(Stringname){threadName=name;

System.out.println(“Creating”+threadName);

}

publicvoidrun(){System.out.println(“Running”+threadName);try{

for(inti=4;i>0;i—){System.out.println(“Thread:”+threadName+“,”+i);//Letthethreadsleepforawhile.Thread.sleep(50);

}

}catch(InterruptedExceptione){System.out.println(“Thread”+threadName+”interrupted.”);158

}

System.out.println(“Thread”+threadName+”exiting.”);

}

publicvoidstart()

{

System.out.println(“Starting”+threadName);if(t==null)

{

t=newThread(this,threadName);t.start();

}

}

}

publicclassTestThread{publicstaticvoidmain(Stringargs[]){

RunnableDemoR1=newRunnableDemo(“Thread1”);R1.start();RunnableDemoR2=newRunnableDemo(“Thread2”);R2.start();

}

}

Thiswouldproducethefollowingresult:CreatingThread1StartingThread1CreatingThread2StartingThread2RunningThread1Thread:Thread1,4RunningThread2Thread:Thread2,4Thread:Thread1,3Thread:Thread2,3

159

Thread:Thread1,2Thread:Thread2,2Thread:Thread1,1Thread:Thread2,1ThreadThread1exiting.ThreadThread2exiting.

10.4CreateThreadbyExtendingThreadClass:ThesecondwaytocreateathreadistocreateanewclassthatextendsThreadclassusingthefollowingtwosimplesteps.ThisapproachprovidesmoreflexibilityinhandlingmultiplethreadscreatedusingavailablemethodsinThreadclass.

Step1:Youwillneedtooverriderun()methodavailableinThreadclass.Thismethodprovidesentrypointforthethreadandyouwillputyoucompletebusinesslogicinsidethismethod.Followingissimplesyntaxofrun()method:publicvoidrun()Step2:OnceThreadobjectiscreated,youcanstartitbycallingstart()method,whichexecutesacalltorun()method.Followingissimplesyntaxofstart()method:voidstart();Example:HereistheprecedingprogramrewrittentoextendThread:classThreadDemoextendsThread{

privateThreadt;privateStringthreadName;ThreadDemo(Stringname){threadName=name;

System.out.println(“Creating”+threadName);

}

publicvoidrun(){160

System.out.println(“Running”+threadName);try{for(inti=4;i>0;i—){

System.out.println(“Thread:”+threadName+“,”+i);//Letthethreadsleepforawhile.Thread.sleep(50);

}

}catch(InterruptedExceptione){System.out.println(“Thread”+threadName+”interrupted.”);}System.out.println(“Thread”+threadName+”exiting.”);

}

publicvoidstart()

{

System.out.println(“Starting”+threadName);if(t==null)

{

t=newThread(this,threadName);t.start();

}

}

}

publicclassTestThread{publicstaticvoidmain(Stringargs[]){

ThreadDemoT1=newThreadDemo(“Thread1”);T1.start();

ThreadDemoT2=newThreadDemo(“Thread2”);T2.start();

}

}

161

Thiswouldproducethefollowingresult:CreatingThread1StartingThread1CreatingThread2StartingThread2RunningThread1Thread:Thread1,4RunningThread2Thread:Thread2,4Thread:Thread1,3Thread:Thread2,3Thread:Thread1,2Thread:Thread2,2Thread:Thread1,1Thread:Thread2,1ThreadThread1exiting.ThreadThread2exiting.

10.5ThreadMethods:FollowingisthelistofimportantmethodsavailableintheThreadclass.


1 publicvoidstart()Startsthethreadinaseparatepathofexecution,theninvokestherun()methodonthisThreadobject.

2 publicvoidrun()IfthisThreadobjectwasinstantiatedusingaseparateRunnabletarget,therun()methodisinvokedonthatRunnableobject.

3 publicfinalvoidsetName(Stringname)ChangesthenameoftheThreadobject.ThereisalsoagetName()methodforretrievingthename.

162

4 publicfinalvoidsetPriority(intpriority)SetsthepriorityofthisThreadobject.Thepossiblevaluesarebetween1and10.

5 publicfinalvoidsetDaemon(booleanon)AparameteroftruedenotesthisThreadasadaemonthread.

6 publicfinalvoidjoin(longmillisec)Thecurrentthreadinvokesthismethodonasecondthread,causingthecurrentthreadtoblockuntilthesecondthreadterminatesorthespecifiednumberofmillisecondspasses.

7 publicvoidinterrupt()Interruptsthisthread,causingittocontinueexecutionifitwasblockedforanyreason.

8 publicfinalbooleanisAlive()Returnstrueifthethreadisalive,whichisanytimeafterthethreadhasbeenstartedbutbeforeitrunstocompletion.

ThepreviousmethodsareinvokedonaparticularThreadobject.ThefollowingmethodsintheThreadclassarestatic.Invokingoneofthestaticmethodsperformstheoperationonthecurrentlyrunningthread.


1 publicstaticvoidyield()Causesthecurrentlyrunningthreadtoyieldtoanyotherthreadsofthesameprioritythatarewaitingtobescheduled.

2 publicstaticvoidsleep(longmillisec)Causesthecurrentlyrunningthreadtoblockforatleastthespecifiednumberofmilliseconds.

3 publicstaticbooleanholdsLock(Objectx)ReturnstrueifthecurrentthreadholdsthelockonthegivenObject.

4 publicstaticThreadcurrentThread()Returnsareferencetothecurrentlyrunningthread,whichisthethreadthatinvokesthismethod.

5 publicstaticvoiddumpStack()Printsthestacktraceforthecurrentlyrunningthread,whichisusefulwhendebuggingamultithreadedapplication.

163

Example:ThefollowingThreadClassDemoprogramdemonstratessomeofthesemethodsoftheThreadclass.ConsideraclassDisplayMessagewhichimplementsRunnable://FileName:DisplayMessage.java//CreateathreadtoimplementRunnablepublicclassDisplayMessageimplementsRunnable

{

privateStringmessage;publicDisplayMessage(Stringmessage)

{

this.message=message;

}

publicvoidrun()

{

while(true)

{

System.out.println(message);

}

}

}

FollowingisanotherclasswhichextendsThreadclass://FileName:GuessANumber.java//CreateathreadtoextentdThreadpublicclassGuessANumberextendsThread

{

privateintnumber;publicGuessANumber(intnumber)

{

this.number=number;

}

publicvoidrun()

{

164

intcounter=0;intguess=0;do

{

guess=(int)(Math.random()*100+1);System.out.println(this.getName()

+”guesses”+guess);counter++;}while(guess!=number);System.out.println(“**Correct!”+this.getName()+”in”+counter+”guesses.**”);

}

}

Followingisthemainprogramwhichmakesuseofabovedefinedclasses://FileName:ThreadClassDemo.javapublicclassThreadClassDemo

{

publicstaticvoidmain(String[]args)

{

Runnablehello=newDisplayMessage(“Hello”);Threadthread1=newThread(hello);thread1.setDaemon(true);thread1.setName(“hello”);System.out.println(“Startinghellothread…”);thread1.start();Runnablebye=newDisplayMessage(“Goodbye”);Threadthread2=newThread(bye);thread2.setPriority(Thread.MIN_PRIORITY);thread2.setDaemon(true);System.out.println(“Startinggoodbyethread…”);thread2.start();System.out.println(“Startingthread3…”);

165

Threadthread3=newGuessANumber(27);thread3.start();try

{

thread3.join();}catch(InterruptedExceptione)

{

System.out.println(“Threadinterrupted.”);

}

System.out.println(“Startingthread4…”);Threadthread4=newGuessANumber(75);thread4.start();System.out.println(“main()isending…”);

}

}

Thiswouldproducethefollowingresult.Youcantrythisexampleagainandagainandyouwouldgetdifferentresulteverytime.

Startinghellothread…Startinggoodbyethread…HelloHelloHelloHelloHelloHelloGoodbyeGoodbyeGoodbyeGoodbyeGoodbye…….

166

11.WrapperClassesEachofJava’seightprimitivedatatypeshasaclassdedicatedtoit.Theseareknownaswrapperclasses,becausethey“wrap”theprimitivedatatypeintoanobjectofthatclass.Thewrapperclassesarepartofthejava.langpackage,whichisimportedbydefaultintoallJavaprograms.

Thewrapperclassesinjavaserverstwoprimarypurposes.1)Toprovidemechanismto‘wrap’primitivevaluesinanobjectsothatprimitivescandoactivitiesreservedfortheobjectslikebeingaddedtoArrayList,Hashset,HashMapetc.collection.

2)To provide an assortment of utility functions for primitives like converting primitive types to and from string objects,convertingtovariousbaseslikebinary,octalorhexadecimal,orcomparingvariousobjects.

Thefollowingtwostatementsillustratethedifferencebetweenaprimitivedatatypeandanobjectofawrapperclass:intx=25;Integery=newInteger(33);The first statement declares an int variable named x and initializes it with the value 25. The second statement instantiates anIntegerobject.Theobjectisinitializedwiththevalue33andareferencetotheobjectisassignedtotheobjectvariabley.

BelowtablelistswrapperclassesinJavaAPIwithconstructordetails.

Primitive WrapperClass ConstructorArgumentboolean Boolean booleanorStringbyte Byte byteorString

char Character charint Integer intorStringfloat Float float,doubleorStringdouble Double doubleorStringlong Long longorStringshort Short shortorStringBelowiswrapperclasshierarchyasperJavaAPI

167

As explain in above table all wrapper classes (except Character) take String as argument constructor. Please notewemight getNumberFormatExceptionifwetrytoassigninvalidargumentinconstructor.ForexampletocreateIntegerobjectwecanhavefollowingsyntax.

IntegerintObj=newInteger(25);IntegerintObj2=newInteger(“25”);Here in we can provide any number as string argument but not the words etc. Below statement will throw run time exception(NumberFormatException)IntegerintObj3=newInteger(“Two”);ThefollowingdiscussionfocusesontheIntegerwrapperclass,butappliesinageneralsensetoalleightwrapperclasses.Themostcommonmethodsof the Integerwrapperclassare summarized inbelow table.Similarmethods for theotherwrapperclassesarefoundintheJavaAPIdocumentation.

168

Method PurposeparseInt(s) returnsasigneddecimalintegervalueequivalenttostrings

toString(i) returnsanewStringobjectrepresentingtheintegeri

byteValue() returnsthevalueofthisIntegerasabytedoubleValue() returnsthevalueofthisIntegerasandoublefloatValue() returnsthevalueofthisIntegerasafloatintValue() returnsthevalueofthisIntegerasanintshortValue() returnsthevalueofthisIntegerasashortlongValue() returnsthevalueofthisIntegerasalongintcompareTo(inti)

Compares the numerical value of the invoking object withthat of i. Returns 0 if the values are equal. Returns anegative value if the invoking object has a lower value.Returnsapositivevalueiftheinvokingobjecthasagreatervalue.

staticintcompare(intnum1,intnum2)

Compares the values of num1 and num2. Returns 0 if thevalues are equal. Returns a negative value if num1 is lessthannum2.Returnsapositivevalueifnum1isgreaterthannum2.

booleanequals(ObjectintObj)

ReturnstrueiftheinvokingIntegerobjectiseq

Let’sseejavaprogramwhichexplainfewwrapperclassesmethods.packageWrapperIntro;publicclassWrapperDemo{

publicstaticvoidmain(Stringargs[]){IntegerintObj1=newInteger(25);IntegerintObj2=newInteger(“25”);IntegerintObj3=newInteger(35);//compareTodemoSystem.out.println(“ComparingusingcompareToObj1andObj2:”+intObj1.compareTo(intObj2));System.out.println(“ComparingusingcompareToObj1andObj3:”+intObj1.compareTo(intObj3));

//EqualsdemoSystem.out.println(“ComparingusingequalsObj1andObj2:”+intObj1.equals(intObj2));System.out.println(“ComparingusingequalsObj1andObj3:”+intObj1.equals(intObj3));

Floatf1=newFloat(“2.25f”);Floatf2=newFloat(“20.43f”);Floatf3=newFloat(2.25f);

System.out.println(“Comparingusingcomparef1andf2:“+Float.compare(f1,f2));System.out.println(“Comparingusingcomparef1andf3:“+Float.compare(f1,f3));//AdditionofIntegerwithFloatFloatf=intObj1.floatValue()+f1;System.out.println(“AdditionofintObj1andf1:“+intObj1+”+”+f1+”=”+f);

}

}

Output:ComparingusingcompareToObj1andObj2:0ComparingusingcompareToObj1andObj3:-1ComparingusingequalsObj1andObj2:trueComparingusingequalsObj1andObj3:falseComparingusingcomparef1andf2:-1Comparingusingcomparef1andf3:0AdditionofintObj1andf1:25+2.25=27.25

12.StringManipulationStrings,whicharewidelyused inJavaprogramming,areasequenceofcharacters. In theJavaprogramming language,stringsareobjects.TheJavaplatformprovidestheStringclasstocreateandmanipulatestrings.

170

.1CreatingStrings:Themostdirectwaytocreateastringistowrite:Stringgreeting=“Helloworld!”;Wheneveritencountersastringliteralinyourcode,thecompilercreatesaStringobjectwithitsvalueinthiscase,“Helloworld!’.

Aswith any other object, you can create String objects by using thenewkeyword and a constructor. TheString class has elevenconstructorsthatallowyoutoprovidetheinitialvalueofthestringusingdifferentsources,suchasanarrayofcharacters.

publicclassStringDemo{publicstaticvoidmain(Stringargs[]){char[]helloArray={‘h’,‘e’,‘l’,

‘l’,‘o’,‘.’};StringhelloString=newString(helloArray);System.out.println(helloString);

}

}

Thiswouldproducethefollowingresult:hello.Note:TheStringclassisimmutable,sothatonceitiscreatedaStringobjectcannotbechanged.IfthereisanecessitytomakealotofmodificationstoStringsofcharacters,thenyoushoulduseStringBuffer&StringBuilderClasses.

.2StringLength:Methodsused toobtain informationaboutanobject areknownasaccessormethods.Oneaccessormethod that youcanusewithstringsisthelength()method,whichreturnsthenumberofcharacterscontainedinthestringobject.

Afterthefollowingtwolinesofcodehavebeenexecuted,lenequals17:publicclassStringDemo{publicstaticvoidmain(Stringargs[]){

Stringpalindrome=“DotsawIwasTod”;

171

intlen=palindrome.length();System.out.println(“StringLengthis:”+len);}

}

Thiswouldproducethefollowingresult:StringLengthis:17.3ConcatenatingStrings:

TheStringclassincludesamethodforconcatenatingtwostrings:string1.concat(string2);Thisreturnsanewstringthatisstring1withstring2addedtoitattheend.Youcanalsousetheconcat()methodwithstringliterals,asin:“Mynameis“.concat(“Zara”);Stringsaremorecommonlyconcatenatedwiththe+operator,asin:“Hello,”+”world”+“!”whichresultsin:“Hello,world!”Letuslookatthefollowingexample:publicclassStringDemo{

publicstaticvoidmain(Stringargs[]){Stringstring1=“sawIwas“;System.out.println(“Dot”+string1+“Tod”);

}

}

Thiswouldproducethefollowingresult:DotsawIwasTod

172.4CreatingFormatStrings:

Youhave printf() and format()methods to print outputwith formattednumbers. TheString class has an equivalent classmethod,format(),thatreturnsaStringobjectratherthanaPrintStreamobject.

UsingString’s static format()method allows you to create a formatted string that you can reuse, as opposed to a one-time printstatement.Forexample, insteadof:System.out.printf(“Thevalueofthefloatvariable is”+“%f,whilethevalueofthe integer”+“variableis%d,andthestring”+

“is%s”,floatVar,intVar,stringVar);youcanwrite:Stringfs;fs=String.format(“Thevalueofthefloatvariableis”+“%f,whilethevalueoftheinteger”

+“variableis%d,andthestring”+“is%s”,floatVar,intVar,stringVar);System.out.println(fs);

.5StringMethods:HereisthelistofmethodssupportedbyStringclass:SNMethodswithDescription

1charcharAt(intindex)Returnsthecharacteratthespecifiedindex.2intcompareTo(Objecto)ComparesthisStringtoanotherObject.3intcompareTo(StringanotherString)Comparestwostringslexicographically.4intcompareToIgnoreCase(Stringstr)Comparestwostringslexicographically,ignoringcasedifferences.5Stringconcat(Stringstr)Concatenatesthespecifiedstringtotheendofthisstring.

173

6booleancontentEquals(StringBuffersb)ReturnstrueifandonlyifthisStringrepresentsthesamesequenceofcharactersasthespecifiedStringBuffer.7staticStringcopyValueOf(char[]data)ReturnsaStringthatrepresentsthecharactersequenceinthearrayspecified.8staticStringcopyValueOf(char[]data,intoffset,intcount)ReturnsaStringthatrepresentsthecharactersequenceinthearrayspecified.9booleanendsWith(Stringsuffix)Testsifthisstringendswiththespecifiedsuffix.10booleanequals(ObjectanObject)Comparesthisstringtothespecifiedobject.11booleanequalsIgnoreCase(StringanotherString)ComparesthisStringtoanotherString,ignoringcaseconsiderations.12bytegetBytes()EncodesthisStringintoasequenceofbytesusingtheplatform’sdefaultcharset,storingtheresultintoanewbytearray.13byte[]getBytes(StringcharsetNameEncodesthisStringintoasequenceofbytesusingthenamedcharset,storingtheresultintoanewbytearray.14voidgetChars(intsrcBegin,intsrcEnd,char[]dst,intdstBegin)Copiescharactersfromthisstringintothedestinationcharacterarray.

15inthashCode()Returnsahashcodeforthisstring.16intindexOf(intch)Returnstheindexwithinthisstringofthefirstoccurrenceofthespecifiedcharacter.17intindexOf(intch,intfromIndex)Returnstheindexwithinthisstringofthefirstoccurrenceofthespecifiedcharacter,startingthesearchatthespecifiedindex.18intindexOf(Stringstr)Returnstheindexwithinthisstringofthefirstoccurrenceofthespecifiedsubstring.19intindexOf(Stringstr,intfromIndex)Returnstheindexwithinthisstringofthefirstoccurrenceofthespecifiedsubstring,startingatthespecifiedindex

17420Stringintern()Returnsacanonicalrepresentationforthestringobject.21intlastIndexOf(intch)Returnstheindexwithinthisstringofthelastoccurrenceofthespecifiedcharacter.22intlastIndexOf(intch,intfromIndex)Returnstheindexwithinthisstringofthelastoccurrenceofthespecifiedcharacter,searchingbackwardstartingatthespecifiedindex.23intlastIndexOf(Stringstr)Returnstheindexwithinthisstringoftherightmostoccurrenceofthespecifiedsubstring.24intlastIndexOf(Stringstr,intfromIndex)Returnstheindexwithinthisstringofthelastoccurrenceofthespecifiedsubstring,searchingbackwardstartingatthespecifiedindex.

25intlength()Returnsthelengthofthisstring.26booleanmatches(Stringregex)Tellswhetherornotthisstringmatchesthegivenregularexpression.27booleanregionMatches(booleanignoreCase,inttoffset,Stringother,intooffset,intlen)Testsiftwostringregionsareequal.28booleanregionMatches(inttoffset,Stringother,intooffset,intlen)Testsiftwostringregionsareequal

29Stringreplace(charoldChar,charnewChar)

ReturnsanewstringresultingfromreplacingalloccurrencesofoldCharinthisstringwithnewChar.30StringreplaceAll(Stringregex,StringreplacementReplaceseachsubstringofthisstringthatmatchesthegivenregularexpressionwiththegivenreplacement.31StringreplaceFirst(Stringregex,Stringreplacement)Replacesthefirstsubstringofthisstringthatmatchesthegivenregularexpressionwiththegivenreplacement.32String[]split(Stringregex)Splitsthisstringaroundmatchesofthegivenregularexpression.

175

33String[]split(Stringregex,intlimit)Splitsthisstringaroundmatchesofthegivenregularexpression.34booleanstartsWith(Stringprefix)Testsifthisstringstartswiththespecifiedprefix.35booleanstartsWith(Stringprefix,inttoffset)Testsifthisstringstartswiththespecifiedprefixbeginningaspecifiedindex.36CharSequencesubSequence(intbeginIndex,intendIndex)Returnsanewcharactersequencethatisasubsequenceofthissequence.37Stringsubstring(intbeginIndex)Returnsanewstringthatisasubstringofthisstring.38Stringsubstring(intbeginIndex,intendIndex)Returnsanewstringthatisasubstringofthisstring.39char[]toCharArray()Convertsthisstringtoanewcharacterarray.40StringtoLowerCase()ConvertsallofthecharactersinthisStringtolowercaseusingtherulesofthedefaultlocale.41StringtoLowerCase(Localelocale)ConvertsallofthecharactersinthisStringtolowercaseusingtherulesofthegivenLocale.42StringtoString()Thisobject(whichisalreadyastring!)isitselfreturned.43StringtoUpperCase()ConvertsallofthecharactersinthisStringtouppercaseusingtherulesofthedefaultlocale.44StringtoUpperCase(Localelocale)ConvertsallofthecharactersinthisStringtouppercaseusingtherulesofthegivenLocale.45Stringtrim()Returnsacopyofthestring,withleadingandtrailingwhitespaceomitted.46staticStringvalueOf(primitivedatatypex)Returnsthestringrepresentationofthepasseddatatypeargument.

176

References:1)http://www.tutorialspoint.com/java/java_overview.htm2)http://beginnersbook.com/2013/05/java-introduction/3)http://www.javatpoint.com/object-and-class-in-java4)http://www.explain-java.com/java-wrapper-class-tutorial-explain-java-wrapper-classes-examples/5)http://www.w3resource.com/java-tutorial/the-string-class.php6)https://docs.oracle.com/javase/tutorial/java/concepts/object.html

177

178

ChapterFour

ITDC-404WorkIntegratedLearningIT–DMA

•IdentificationofWorkAreas•WorkExperience

179

ScopeofProgramminginJava,web-basedapplicationsanddatabasemanagementScopeofJavaprogrammingishugeintheworldtodayasanumberofwebbasedapplicationsaredevelopedinJava.Javaisaplatformindependentlanguageandisusedworldoverfordevelopmentofmajorityofwebsitesandwebbasedapplications.Itoffersanumberof jobopportunities suchas thoseof Javadeveloper, entry level Javaprogrammer, programmer, software engineer, analyst. Salaryofferedisalsoverygood.Thereishugescopefordatabasemanagerstoo.

SkillsrequiredbyDeveloper,Programmer,databasemanagerSomeofthemostimportantskillsrequiredtobecomeasoftwaredeveloper,webbasedapplicationdeveloper,Javaprogrammer,databasemanagerareasfollows:-

i) ProblemSolvingSkill:Programmingisdoneandsoftwareisdevelopedtosolvewelldefinedproblems.Prospectivecandidatesareaskedtosolveproblemsininterviews.Examsforjobsandinterviewstestadeveloper’sanddatabasemanager’sabilitytosolveproblems.Hence,problemsolvingskillisneededbydevelopers,programmers,etc.

ii)ProfessionalDevelopment:Witha lotofchangestakingplacesorapidly in the fieldofsoftwaredevelopmentanddatabasemanagement,apersonisconstantlyrequiredtoupdatehimselfwithnewertechnologiesanddevelophimselfprofessionally.Oneshouldhavetheabilitytoacquiretheknowledgeandskillsquickly.

iii)Dealingwithpeople/InterpersonalSkills:Herethepersonisrequiredtodealwithpeople–clients,users,fellowprogrammersand developers, organisations, etc. to identify the needs, conditions, to explain to others the process, to integrate variousmodulesandcomponents,henceinterpersonalskillsarerequiredtosucceedasadeveloper,databasemanager.

iv)PracticalSkills:Oneshouldhavecompetenceinusingdifferenttechnologiesandshouldhavetheabilitytoapplythem.v)CommunicationSkill :As thedeveloper,programmer is required to interactwithclients,users, staffatdifferent levels,etc.he/sheshouldbeaneffectivecommunicator.

Therearejobopportunitiesintheprivatesectoraswellasthepublicsector.Therearenumberofmultinationalcorporationsaswellas softwarecompanies in India suchas INFOSYS, IBM,HCL,HP,SATYAM,DELL,DOCOMO,LG,FACEBOOK,BHEL,ONGC,POWERGRID,

180

GOOGLE,TCS,MICROSOFT,ACCENTURE,COGNIZANTinwhichthereareabundantopportunitiesforpersonsskilledinjavaprogramming,webbasedapplicationdevelopmentanddatabasemanagersBesides,therearemanyPSUs(PublicSectorUndertakings)inIndiasuchasBHEL,BEL,ECIL,EIL,NTPC,HPCL,GAIL,SAI,AAI,HAL,GENCO,TRANSCO,BSNL,MTNL,etc.manyofwhichconductexamsforrecruitmentintheseareas.Selectioninthesecompaniesisthrough:

1. Writtentest2. Technicalinterview3,Presentation

4.HRinterview,etc.Candidatesareselectedfromcampusesofcollegesanduniversitiesaswellasdirectlyfromthemarketthroughtheaboveselectionprocess. Informationabout the recruitment canbeobtainedover the Internet.Candidates canalsoget the informationabout therecruitmentintheiremailaccountbyregisteringwiththesites.

ProcedureforapplicationforjobsonlineStepstoapplyforJobsonlinearegivenbelow:-

•Step-I:WehavetogotoJobwebsites(Listofsomeofthewebsitesismentionedbelow).•Step-II:Weshouldregisterwiththewebsiteandsubmitresume.•Step-III:Wearerequiredtomentionareainwhichwewanttoworkandalsoourqualification.•Step-IV:WearerequiredtogiveourE-MailIdwherewecangetinformationaboutjobs.•Step-V:Itissuggestedthatwecheckoure-maileveryday.TherewillbealotofinformationaboutjobscommensuratewithourqualificationandourInterests.•Step-VI:Wearerequiredtoapplyforjobandattendwrittenexams,groupdiscussionandinterviewsetc.

181

ListofWebsites/portalsforjobs:http://www.naukri.com/http://www.shine.com/http://www.timesjobs.com/http://www.fresherworld.com/http://www.monsterindia.comhttp://governmentjobsalerts.com/etcStudentsshouldacquirecompetencyintheseareasandgetsomeworkexperience.

182

ChapterFiveITDC-410

MovieEditingTools(withWindowsMovieMaker)

•Familiarisationofinterfacecomponents•Importingpictures•ImportingAudioandVideoFiles•SpliflingandJoiningMovieClips•AddingTitlesandpublishing

183

WindowsMovieMakerVerdict:WindowsMovieMakerisaneasy-to-useapplicationformakingquick,professional-lookingeditstoyourvideoclips.Getitnowandstartmakingthemostofyourvideosandphotos.

•WindowsMovieMaker•License:Freeware•Language:English•Author:Microsoft•System:WinXP•Filesize:1.2MB

184

WindowsMovieMakerisafreevideocreating/editingsoftwareapplication,designedforWindowsMe,XPandVista.AlsoworkswithlatestWindows7& Windows 8. Windows Movie Maker contains features such as effects, transitions, titles/credits, audio track,timeline narration, and AutoMovie. New effects and transitions can bemade and existing ones can be modified usingXMLcode.WindowsMovieMakerisalsoabasicaudiotrackeditingprogram.WindowsMovieMakercanapplybasiceffectstoaudiotrackssuchasfadeinorfadeout.Theaudiotrackscanthenbeexportedintheformofasoundfileinsteadofavideofile.

HowtoMakeaVideoinWindowsMovieMakerHowcanyouturnyourvideo folder intoamovie thateveryonewants towatch?Thekey toanygoodmovie is theeditingprocess.WindowsMovieMaker can transform your collection of clips into a singlemasterpiece, completewith credits, a soundtrack, andsnazzytransitions.Followthistutorialstepstomakeavideoasit’smeanttobeseen.

GeflingStartedDownloadWindowsEssentials:ThisisafreesoftwarepackagefromMicrosoftthatcontainsWindowsMovieMakeraswellasafewotherWindowsutilities.YoucanfindtheinstallationprogramfromtheMicrosoftwebsite.

•WindowsMovieMakerisincludedinWindowsVistaandXP,butneedstobedownloadedforWindows7and8.WindowsMovieMakerFreeDownloadWithWindowsMovieMaker,youcanquicklyturnyourphotosandvideosintopolishedmovies.Addspecialeffects,transitions,sound,andcaptionstohelptellyourstory.Sharethemoviewithfriendsandfamily.

CompatiblewithWindowsXP,Windows7,Windows8,WindowsVista.Link1:hflp://www.windows-movie-maker.org/

185

Windows-Movie-Maker.orgisawebsitetodownloadWindowsMovieMakerforXP,Vista,Windows7,Windows8.TestCompatibleforWindowsXP,Vista,7,8.Softwarehasbeenscannedbypopularanti-virussoftwareavast!andAVG.Note:WearenotaffiliatedwithMicrosoft.Thewindowsmoviemakersoftwareisalsoavailableonmicrosoftofficialsite.

HowtodownloadandinstallWindowsMovieMaker?Steps:

1. Openyourbrowser,navigateto“hfp://www.windows-movie-maker.org/”andclickthedownloadbufontodownloadsetupfile.

2. Doubleclickthedownloadedsetupfile:windows-movie-maker.exe.Theclick“Yes”toallowthesetuppackagetorun.

186

3. Click“Next”bufontocontinuewithWindowsMovieMakerinstallprogress.Select“Iaccepttheagreement”tocontinue.Ofcourse,pleasereadWindowsMovieMakerLicenseAgreementcarefullybefore“Accept”it.

4. In the next steps, you can select the destination folder whereWindowsMovie Maker will be installed, rename theQuickstartgroupnameifyoulike,etc.Itisrecommendedtoleaveallthesesefingsasdefault,justclick“Next”bufontogetthesoftwareinstalled.

187

5. Thisisthelaststep. The option “LaunchWindowsMovieMaker” is checked as default. ThismeansWindowsMovieMakerwillbelaunchedautomaticallyaftertheinstallprocessisfinished.Youcanuncheckthisoptionifyouwantrunthesoftwarelater.

6. Finishthedownloadandinstallprocess.ThenyoucanmakevideoswithWindowsMovieMakerasyouwish.Enjoythesoftwarenow!

What’sthedifferencebetween“WindowsMovieMaker”and“WindowsLiveMovieMaker”?

Whenyousearch“windowsmovie maker”onpopularsearchenginessuchasgoogle/yahoo/bing, you may get “windows live moviemaker” or even the “windows live” setup package. What’s wrong?Where is my familiar windowsmovie maker? I still need thissoftwaretomakevideosfrommyimagesandvideoscollection.

Asyoumayalreadyknow,“WindowsLiveMovieMaker”isthelaterversionof“WindowsMovieMaker”.Butthethingisnotsosimple.Firstly,thelaterversiondoesnotsupportpreviousWindowsEditionincludingthepopularlyusedWindowsXP.Secondly,laterversionmaynotaseasy&powerfulasthepreviousversions.

HereisatableofWindowsMovieMakerversionsandabriefdescription.

188

Version SupportedOS Brief

WindowsMovieMaker2.1,2.6

WindowsXPandlater

TheonlyversionthatworksonWindowsXP.

WindowsMovieMaker6.0

WindowsVistaandlater

LatestversionofWindowsMovieMaker.Laterversionchangesname.

WindowsLiveMovieMaker2009,2011

WindowsVistaandlater

HereWindowsMovieMakerispartoftheWindowsLiveSohwarepackage.

WindowsLiveMovieMaker2012

Windows7,8 LatestVersionofWindowsMovieMaker.OnlysupportsWindows7andlater.

OK.thetableaboveisclearenough.However,itmaybealittlecomplicatedformanyusers.Sothereisasimplesolution.JustclickanddownloadthebelowmentionedWindowsMovieMakerinstaller.TheinstallerwillselectthebesteditionbasedonyourWindowsversionandhardwareconfigurations.

Link2:hfp://www.windows-movie-maker.org/download/windows-movie-maker-free.exe

Introduction

Familiarizationofinterfacecomponents

WindowsMovieMakerisanembeddedprograminWindow s (Start > All Programs > Windows MovieMaker). You can useWindowsMovieMaker to create movies by importing pictures, videos and audios. You can also add videotransitionsoreffectstoyourmovietomakeitnicer.

OpenWindowsMovieMaker.YoucanfinditinyourStartMenuunderallprograms,oryoucansearchfor“moviemaker”andselectitfromtheresults.

Ahercompletingthis,youwillseemenuasfollows:

189

Basic Intermediate Advanced•Tools •Effect •Adjustvolume•Importmedia •Transition •Timeline

•Credit/title •Storyboard•Addmusic •Publishproject

Familiarizeyourselfwiththeinterface.WindowsMovieMaker is organized in a similarwaytoMicrosoft Office. You can navigatethroughthevariousoptionsbyselectingthetabsatthetopofthewindow.

•Home–ThisisthemaintabforMovieMaker.Youcanusethistabtoaddvideos,images,andaudiotoyourproject.Youcanalsoselectpremade themes for themovie, rotate the image,andupload theproject towebsites suchasFacebook,YouTube, andVimeo.•Animations–Thistaballowsyoutoaddtransitionsbetweenclips.•VisualEffects–Thistabwillallowyoutochangethecolorandtoneoftheimage.Youcanturnitblackandwhiteorturnthecolorsaturationwayup.•Project–Youcanmakeoverallchangestoyourentireprojectbyadjustingtheaudiomixandchangetheaspectratioofthevideo.•View–Thistabletsyouzoominandoutonthetimeline,changethethumbnailsizes,andviewthewaveformsforyourfilm’saudio.•Edit–Thismenuappearsafteryouaddyourfirstvideoclip.Youcanusethistabtotrimtheclip,setanewstartpointorendpoint,fadeinandout,andstabilizethevideo.•Options–Thistabshowsupafteryouaddamusicfiletoyourproject.Youcansetstartandendtimesforthemusic,fadeitinandout,andsplitthefile.

190

OverviewoftheWindowsMovieMakerScreenBeforewecanstartmakingamovie,let’slookatthepartsoftheWindowsMovieMakerwindow.

1.MovieTaskView:Linkstothevarioustaskstocreateyourmovie.

ThisMOVIETASKSPANEhasalloftheimportanttasksataglance.Thereareevenhelptopics!

191

2. CollectionsView:Alistofallimportedcomponentsforyourmovie-photos,videosorsounds.

3. ThePreviewScreen.4. TheTimelineorStoryboard

:Allpartsofyourmovie,whetherphotos,videosorsoundsaredraggedtothisarea.TimelineViewofWindowsMovieMaker

Note-ClickingtheShowStoryboardlinkreturnsyoutotheStoryboardview.ThislinkwillthenreadShowTimeline.ClickingonthelinkShowTimelinereturnsthisareatotheTimelineview.Youwillusebothviewsduringthecreationofyourmovie.

Step:OpenMovieMakerandnameyourprojectFile>Saveprojectas(F12)

ImportingpicturesStep:Importpictures,sounds,videosintoMovieMaker

A)Tools>NewCollectionFolderB)File>ImportintoCollections(ctrl+I)

192

StepstoImportPictures1. ClickontheCaptureVideolinktoopenthelistofoptions.Inthisexamplewewillbeusingstillpicturesandmusicto

createourmovie.

2. ClickonImportpicturesandlocatethefoldercontainingyourpictures.3. Selectthepicturefilesyouwishtoimport.

Tip-Toselectseveralpicturefileswhicharelistedconsecutively,clickthefirstfilenameinthelist,andthenwhileholdingtheShiftkey,clickonthelastfilenameinthelist.Thiswillselectallthefilesatoncetoimport.

Similarly,toselectseveralfilesthatarenotinconsecutiveorder,holdtheCtrlkeyratherthantheShiftkeyandthenclickonthedifferentfilenamesyouwishtoimport.

•FindtheMOVIEMAKERicononthedesktopanddoubleclickittoopentheprogram.•FindeachofthefollowingareasoritemsontheMOVIEMAKERscreen.1–OpenProjectbufon

2–ImportPicturestool3–EditMovieoptions4–ShowTimeline/ShowStoryboardbufon5–SaveProjectbufon

•ClicktheIMPORTPICTURESlink.•Usethemenutolocateyour

MYMOVIEfolderanddoubleclickthepicturesyourwanttoimport.

•QuickTip:HolddowntheSHIFTkeyandclickonseveralpicturesinarow.ClickIMPORTtoputtheminyourmovie.

•TIMETOSAVE:ClickthediskiconorgotoFile—>SaveandfindyourMyMoviefoldertosaveyourmovieproject.

193

ThereareseveralwaystoimportfilesintoWindowsMovieMaker.1. YoucanjustdraganddropthefilesintoContentsPanel

2. ClickFile>ImportintoCollection(indicatedintheredframeintheimagebelow)3. Clickonthe“ImportintoCollection”(indicatedintheredframeintheimagebelow)

4. GotoTaskPanel>Importvideo,pictures,audioormusic(indicatedintheredframeintheimagebelow)

DraganddropthefilesthatyouimportedfromContentsPaneltoStoryboard/Timeline.Step:Placepictures,video,andsoundintoyourproject

Drageachelementfromthecollectionfoldertothetimeline.Youcanchangethedurationofeachelement(howlongitappearsonthescreen)bypullingontheendsofit’sframeonthetimeline,stretchingitlongertomakeitstayonthescreenlongerorpushingitbacktocompactitintoashortertimeframe.

194

AddtransitionsTransitionsdocoolthingsasyourmovieswitchesfromonescenetothenext.Note: InmostmoviesandTVshows, thereareno transitions;scenessimplyadvance fromoneto thenextTherefore, for themostprofessionalappearance,don’tuseanytransitions.Homemoviesaresupposedtobefun,though,souseallthecrazytransitionsyouwant.However,rememberyouraudience:youmightwanttousejustafewsoyoudon’toverwhelmyourviewers.

Stepstoaddtransitionsinmovies1. Tools>VideoTransitions>Selectthetransitionthatyouwanttoadd.2. IntheMovieTaskspane,underEditMovie,clickViewvideotransitions.Clicktransitionsthatyouwanttoaddanddraganddropit

betweentwoclipsonthestoryboard.

195

PreviewtransitionsbydoubleclickingthemandwatchingthePreviewMonitor.Onceyou’vefoundatransitionyoulike,dragitfromtheVideoTransitionspane,underEditMoviepanetotheboxbetweentwoofyourclips.

InthePreviewMonitor,clicktheVideoTransitionspane,underPlaybufontowatchyourtransitioninaction.Ifyoudon’tlikeit,justreturntotheprevioussteptoreplaceitwithadifferenttransition.

Toremoveatransition:Onthestoryboard,rightclickthetransitioncellthatcontainsthetransitionandclick“delete”.Ifyoudecidenottouseanytransition,right-clickitonthestoryboard,andclickDelete.

196

Transitionscauseyourvideoclipstooverlapbyaboutonesecond,whichmeansyouwon’tseeallofthefirstorlastsecondofyourclip.So,whenyou’refilming,it’sgoodtostartthecameraafewsecondsbeforetheactionstarts,andtokeepfilmingforacoupleofsecondsafterwardsothatyouhavetimetotransitionbetweenscenes.

Thisalsohelpsyougetasteadiershot.Ifyoudon’tneedtheextratimeinaclip,youcantrimitfromyourclipinMovieMaker.MovieTips:

•

•

Don’taddbothtypesofeffects!Choosetheonethatbestfitsyourpictureand/ormovie.Useonlytwoorthreeeffects.Toomanyeffectswilldistractfromyourmovieandviewerswillfocusonthemratherthantheinformation

youarepresenting.

Addeffects:Thereare26effectsand20transitionsthatcomewithMovieMaker.Youcanaddmore-somearefree,othersyoucanbuy.Youcanpreviewwhateacheffectortransitiondoessimplybyclickingonitandlookingatthepreviewwindow.AlotoflearningMovieMakerissimplyfiguringoutwhichoftheseeffectsandtransitionstousemosteffectively.

Tip:Youcannotcombinetransitions,butyoucancombineaneffectWITHatransition,andyoucanaddmorethanoneeffect(suchas “fade in from black” AND “Ease in.”)Warning-themore of these you use, themore likely you are to have difficulty with theprogram(theyusealotofprocessingpowerandmemory).

HowtoaddaspecialeffectYoucanusespecialeffectstochangehowyourclipsplayinseveraldifferentways:

197

•SpeedupaclipusingSpeedUp,Double,orslowdownaclipusingSlowDown,Half.•ZoominusingEaseIn,orzoomoutusingEaseOut.•MakeaclipappearolderbyusingSepiaTone,FilmAge,orGrayscale.•RotateaclipusingoneoftheRotateeffects(perfectifsomeoneaccidentallyholdsthecamerasideways).

•FadeinusingoneoftheFadeIneffects,orfadeoutusingoneoftheFadeOuteffects.•FixexposureproblemsusingBrightness,DecreaseorBrightness,Increase.Inordertoaddvideoeffectstoyourmovie,

1. Tools>VideoEffects>Selectthetransitionthatyouwanttoadd.

2. Clickvideoeffectsthatyouwanttoaddanddraganddropitontheimage.

Toremoveaneffect:Onthestoryboard,rightclicktheeffectcellthatcontainstheeffect,andclick“delete”.

198

PrevieweffectsbydoubleclickingthemandwatchingthePreviewMonitor.Onceyou’vefoundaneffectyoulike,dragitfromtheVideoEffectspanetooneofyourclips.Thisaddstheeffecttotheclip,whichyoucanseebylookingatthestarinthelower-leftcorneroftheclip.

InthePreviewMonitor,clickthePlaybufontowatchyoureffectinaction.

199

Youcanaddmorethanoneeffecttoaclip.Forexample,ifyouwanttobothbrightenaclipandaddazoomeffect,youcanaddEaseInandBrightness,Increase.Youcanalsoaddasingleeffectmultipletimestoincreasetheeffect.

Forexample,addmultipleBrightness,Increaseeffectstobrightenasceneevenmore,oraddtwoSpeedUpDoubleeffectstoquadruplethespeedofaclip.

Ifyoudon’tliketheeffect,right-clickthestariconinthelower-leftcorneroftheclip,andclickDeleteEffects.

AddingTitlesandpublishingAddtitlesandcredits

1)Addtitlesandcredits•Addatitle:Tools>TitlesandCredits.

200

Selectthelinkthatcorrespondstowhereyouwanttoaddthetitleandcredit.

Typethetextforyourtitleandthenclick“Done,addtitletoMovie”bufon.

2)Toeditanexistingtitle•Onthestoryboard/timeline,rightclickonthetitlethatyouwanttoedit,andclick“EditTitle”.Makethechangesyouwanttomake,

andthenclick“Done”.3)Toremoveatitle

•Onthestoryboard/timeline,rightclickonthetitlethatyouwanttoremovefromyourmovieandclickon“delete”.

201

Let’screateatitleslide.Clickinthefirstboxattheboflomofthewindow.

•ClickthelinkforMAKETITLESORCREDITS.

•CilckthelinkforADDTITLEATTHEBEGINNINGOFTHEMOVIE.202

•Enterthetextyouwantforyourmovietitleinthetopbox.•Enteranyothertextyouwantonthefirstpageinthesecondbox.•ClickCHANGETHETITLEANIMATIONtochangehowitappearsontheslide.•ClickCHANGETHETEXTFONTANDCOLORtochangethetextstyleandbackgroundcolor.•ClickDONE,ADDTITLETOMOVIEwhenyouarefinished.NOTE:Youcanalsouseapictureonthefirstslideinsteadofaplainbackground.MovieTip:Choosecolorsforyourtextandbackgroundsothatthetextiseasytosee.*NowItisTIMETOSAVE!ImportingAudioandVideoFilesImportinganAudioFileintoYourMovie

WhatisanAudioFile?Anymusic,soundornarrationfileisknownasanaudiofile.StepstoImportanAudioFile

1. UndertheCaptureVideolink,chooseImportaudioormusic.2. Locatethefoldercontainingyouraudiofile.3. Selecttheaudiofileyouwishtoimport.

Oncetheaudiofileisimported,youwillnoticethedifferenttypeoficonintheCollectionswindow.

203

AudioClipsCanOnlyBeAddedintheTimelineDragtheaudioicontotheStoryboard.*NotethemessageboxindicatingthataudioclipscanonlybeaddedintheTimelineview.ClickOKinthismessagebox.AddanaudiofileGotoTaskPanel>AudioorMusic.

•Navigatetothelocationthatcontainsthedigitalmediafilesyouwanttoimport,andthenclick“Import”.

204

•Theareawhereyoucreateandedityourprojectisdisplayedintwoviews,thestoryboardandthetimeline.

Adjustvolumeoftheaudio•Aquickwaytoadjustthevolumeofanaudioclipistoright-clicktheclip,andthenclick“Volume”.Adjustthevolumewiththe

slider.

SpliflingandJoiningMovieClipsEditingToeditclips:IfyouareinSTORYBOARDviewclickheretochangetoTIMELINEview

205

Trimmingaclip–1. Dragthemediaclipstothetimelinetobeginmakingamovie2. Onceyou’reclipsareonthetimeline,clickontheclipyou’dliketotrim3. InthePREVIEWwindow,dragthescrollbartothepointwhereyouwanttotrimtheclip4. OntheCLIPmenuclickSETSTARTTRIMPOINT5. Nowcontinuetodragthescrollbaruntilyoureachthedesiredendpointofyourclip6. OntheCLIPmenuclickSETENDTRIMPOINT–youwillnowhaveyourtrimmedclip

Spliflingaclip—Youcansplitavideoclipintotwoclips.Thisisusefulifyouwanttoinserteitherapictureoravideotransitioninthemiddleofaclip.

1. Clickontheclipyouwouldliketosplit2. InthePREVIEWwindow,dragthescrollbartothepointwhereyouwanttotrimtheclip3. OntheCLIPmenuclickSPLIT–youroriginalclipisnowtwoseparateclips

Youcanenhanceyourmoviesbyaddingdifferentelementstoyourmovie,suchasthefollowing:

• Video transitions - A video transition controls how yourmovie plays from one video clip or picture to the next. You can add atransition between two pictures, video clips, or titles, in any combination, on the storyboard/timeline. The transition playsbeforetheoneclipendsandwhiletheotherclipstartstoplay.

•Videoeffects-Avideoeffectdetermineshowavideoclip,picture,ortitledisplaysinyourprojectandfinalmovie.Videoeffectsletyou add special effects to yourmovie. A video effect is applied for the entire duration that the video clip, picture, or titledisplaysinyourmovie.

•Titlesandcredits-Titlesandcreditsletyouenhanceyourmoviebyaddingtext-basedinformationtoyourmovie.Youcanchangetheappearanceof the titleorcredit, inaddition tochanging the titleanimation,whichdetermineshowyour titleorcreditdisplaysinyourmovie.

206

DeletetheaudiofileRightclickontheaudiofileontheTimelineview,andclickon“delete”.

AudioFilesHaveTheirOwnTimelineinWindowsMovieMakerAudioFilesontheTimeline

AudiofileshavetheirownlocationintheTimelinetokeepthemseparatefrompicturesorvideoclips.Thismakesiteasiertomanipulateeithertypeoffile.

207

AligntheAudioWiththeFirstPicture

Dragtheaudiofiletothelefttoalignwiththestartpointofthefirstpicture.Thiswillstartthemusicwhenthefirstpictureappears.

TimelineViewofAudioClip

TheTimelineindicateshowmuchtimeeachitemtakesupoverthecourseofthewholemovie.Noticethatthisaudiofiletakesupamuchbigger spaceon theTimeline than thepictures.Scroll across theTimelinewindow to see the endof theaudio clip. In thisexample,themusicendsatapproximately4:23minutes,whichismuchlongerthanweneed.

208

ShortenanAudioClip

Hoverthemouseovertheendofthemusicclipuntilitbecomesatwo-headedarrow.Dragtheendofthemusiccliptothelefttolineupwiththelastpicture.

Note-Inthisinstance,Iwillhavetodragtheendofthemusicclipseveraltimestoreachthebeginningofthemovieduetoitssize.Itiseasiertodothisifyouzoominonthetimelinesothatthereisnotsomuchdragging.TheZoomtoolsarelocatedatthebofomleftsideofthescreen,totheleftoftheStoryboard/Timeline.

209

MusicandPicturesAreLinedUp

Nowthemusicclipislinedupwiththepicturesfromstarttofinish.Savethemovieproject.Note-Youmaychoosetostartthemusicatanytimeinyourmovie.Themusicclipdoesnothavetobeplacedatthebeginning.

Publishamovietoyourcomputer1. Clickon“Savetomycomputer”under“3.FinishMovie”onTaskPanel.

2. IntheFilenamebox,typeanameforyourmovie.InthePublishtobox,choosewhereyouwanttosaveyourmovieonceit’spublished,andthenclickon“Next”.

210

3.Clickon“Next”whenyouseethisimage.

211

4. Clickon“Finish”whenyouseethisimage.

ClickFINISHtocompletetheprocess.Itmaytakealongtime!Bepatient!Step:Exportyourfinishedmovie.“Ctrl+P”willopenupawizardthatwillguideyouthroughaprocessthatwillallowyoutosaveyourmovietooneof5formats:forplaybackonyourcomputer(bigfile,highqualitycanbeburnedtoaDVD),foremail(lowestquality,highlycompressed),forpostingon theweb (as forYouTube),tobeburnedonavideoCD,or to adigital camcorder (highestquality).Theprocess is prefymuch selfexplanatory,butifyouwanttoeventuallyburnyourmovietoaDVD,choosethemoviesefing“DV-AVI(NTSC)”whenyousaveyourfilm. To export your film to powerpoint, save it as a windowsmedia file (.avi extension) using the “playback on your computer”option.”

212

SaveYourWindowsMovieMakerProject

Beforeyouproceedanyfurther,youshouldsaveyourproject.Itisagoodideatodothisfrequentlythroughoutthemoviemakingprocess.

Fromthemainmenu,chooseFile>SaveProject.WindowsMovieMaker saves the project in the file format.MSWMMwhich allows for editing at a later time.When yourmovie iscomplete,youhaveadditionaloptionsforsavingthefile,sothatitmaybeplayedinawebpageoremailed,forexample.Theseotheroptionsdonotallowediting,soitisimportanttosaveyourworkingfileintheMovieMakerprojectformat.

Thereareafewoptionsforsharingyourcompletedmovie.MyComputer–SuggestedSelectionThisoptionisbestformoviesyouwilluseinotherapplicationssuchasPowerPoint.

1. ClickonSAVETOMYCOMPUTERfromtheTASKPANE2. Enteranameforyoursavedmovie3. SelectBESTQUALITYFORPLAYBACKONMYCOMPUTER

213

Herearethedefinitionsforeachinanutshell:

•Titlesarestandaloneclipsmeanttoprecedeyourmovie.•Creditsarestandaloneclipsmeanttofollowyourmovie.•Captionsaretextareasthataresuperimposedontopofclipsorphotos.

That’sit.Really!:-)

214

KnowledgeCheckPoints

WindowMoviemaker.1)Whattypeoffileshouldyousaveyouraudioastobeabletoimportitcorrectlyintomoviemaker?

A. .jpgB. .movC. .wav(Answer)D. .aud

.2)Youcanaddnarrationtoyourtimelinebyspeakingintoamicrophoneafachedtothecomputer.A. True(Answer)B. False

.3)Todeleteanypartofthetimeline,selecttheitemandpress“delete”A. True(Answer)B. False

.4)Singlestillimagesfromavideocliparecalled:A. trimpointsB. frames(Answer)C. sourcefile

.5)Afileonyourcomputerthatcontainesanimage,aclip,asoundtrack,orallthefootagefromyourdigitalcameraorphone:A. storyboardB. sourcefile(Answer)C. project

.6)Thepurposeofthe“collections”sectionis:A. todisplayanypicturesormusicclipsthathavealreadybeenimported(Answer)B. tohelpyouimportpicturesintoMovieMakerC. toassistyouinaddingeffectsandtransitionstoyourmovie

.7)Howdotitlesandcreditsletyouenhanceyourmovie?A. byaddingtext-basedinformationtoyourmovie(Answer)B. smallersegmentsoflargesaudioandvideofilesC. collectionspaneofWindowsMovieMaker

215.8)Acollectionactsasafor.

A. container,clips(Answer)B. organizer,capturedC. split,twoclips

.9)Howcanwetestthemovie?A. SelectthefirstslideandthenstartthemoviefromVideoPreview(Answer)B. wecannotC. saveit

.10)WindowsMovieMakerwillallowyoutouse,pictures,ORpicturesandvideoclips,ORjustvideoclipsonthevideotimeline.A. True(Answer)B. False

.11)InWindowsMovieMaker,ifIdeleteavideoclip,pictureoraudiofilefromacollectionfolder,itisalsodeletedfromtheharddrive.

A. TrueB. False(Answer)

.12)Movementsasonepictureorvideoclipchangestoanother.A. effectsB. transitions(Answer)C. sequencesD. collections

.13)Toaddpicturestoyourmovie,clickon…A. captureimagesB. capturevideoC. importpictures(Answer)D. importvideo

216

SomemoreKnowledgeCheckPoints:-

1. MovingPicturesExpertGroup,acompanyofprogrammersanddesigners,designedaseriesofwidelyusedmultimediafileformatsknownas:A. FlashB. MPEGC. AVID. Macromedia

2. WindowsMediaAudio(WMA)standsfor:A. Losslesscompressiontosignificantlyreducefilesize.B. MicrosoftWindowsMedianativeaudiofileformatC. TheuncompressedWaveaudiofileformatusedwithMicrosoftWindows.

3. Tweeningistheprocessof:-A. Joiningpiecesofanimationwithafadeorslide.B. Duplicatingframesbetweenkeyframestoanimateanobject.C. Generatingframesbetweenkeyframestoanimateanobject.D. Animatinganobjecttomakeitspin.

4. Ananimationhas30framespersecond(fps).Iftheanimationplaysfor30secondshowmanyframesintotalwouldtheanimationcontain?

A. 1800framesB. 900framesC.1200

D.15005. Youareworkingonthedraftofalogo.Youaretryingtodecidewhethertoflafentheimageorleavethedocumentasa

layered file until your client has approved the logo.Which format should you use if you anticipatemaking futurechangestothelogoinPhotoshop?A. MergethelayersthatyoulikeandleavetheremainderinlayersB. LeavethedocumentasalayeredfileforanyfutureeditsorchangesC. FlafentheimagetosavefilespaceD. Mergeonlythetextlayers

217

6. Whatvideoeditingtechniqueallowsonetomakeagradualchangefromonevideocliptoanotherbyusingspecialeffects?A. TransitionsB. AlphachannelC. TimestampingD. Scenes

7. Whichofthefollowingfileformatsdeliversvector-basedanimationontheweb?A. AVIB. SWFC. AnimatedGIFD. EPS

8. Thequalityofavectorimageis;-A. WhollyresolutiondependantB. ReducediftheimageisresizedC. TotallydependentonthenumberofcoloursusedD. Unaffectediftheimageisrescaledtoadifferentsize.

9. Whatisthemosteffectivemethodforpreservingbitmapimagequality?A. Usetheoriginalimageatexactly100%sizeB. SelectAllowsmoothingfromBitmapPropertiesC. BreakapartimageandresizetofitexactlyD. Resizeproportionatelybyholdingshiftkey

10. Whichofthefollowingistrueofabitmapimage?A. ItismadeupofpixelsonagridB. itcannotbeeditedC. ScalingdoesnotreducethequalityD. Itismathematicallydefined

11. MP3isafileextensionandfileformatthatisusedfor:A. Audiofiles.B. DigitalfilesC. High-definitionwidescreenfilm.D. Web-basedmultimedia.

218

12. SeemaeditsaphotoinPhotoshopandsavesitasaJpegfiletouseonabirthdaycard.Whenheresizestheimagetomakeitlarger,itlooksblurred.Thisismostlikelyaresultof;-A. DitheringB. PixilationC. AntialiasingD. Distortion

13. Youarerequiredtocreateamusicmashupof5differenttopsongsfor2013.Whattypeoffileshouldyousaveyouraudiotrack,inordertoimportitcorrectlyintoaprogramlikeWindowsMovieMaker?A. .aidB. .wavC. MP3D. BothB&C

14. Youarecreatingagraphicforawebpage.Youneedtomaintainatransparentbackgroundusingamafecolor.Youhaveturnedoffthevisibilityofthebackgroundlayer.A. ChooseFile>SaveAs,andthenselectGIFB. ChooseFile>SaveAs,andthenselectJPEGC. ChooseFile>SaveforWeb,andthenselectPNGD. ChooseFile>SaveforWeb,andthenselectGIF

15. Togenerateavideoproductioninitsfinalform,includingtransitions,effects,andsuperimposedtracksiscalled:A. Compress.B. RenderC. StoreD. Finalize.

16. Theprocessofplayingaudioandvideoinrealtimeovertheinternetiscalled;-A. FileSharingB. TransferringC. StreamingD. Downloading

219

17. Ajunioranimatorhasbeenaskedtoquicklydevelopashort30secondanimationusingFLASHandsaveitinthemosteasilyviewedwebformat.Whichfileformatdoyourecommendisthemostappropriateforuploadingtoaninternetsite?A. FLVB. SWFC. WMVD. MPEG

18. Whatshouldyoutake intoconsiderationwhenpreparing images foraneducationalaudienceofstudents,ages fivethroughto11?A. EntertainingandcolorfulimagesB. WhethertheimagesareageappropriateC. ParentalconcernsandrequestsD. Alloftheabove

19. ThisFlashfileissmallerbecauseitisusedtoviewanduseonly.Itcannotbemodified.A. FLVB. SWFC. HTMLD. PPT

20. AdesigninAdobePhotoshopconsistsofmultiple…………………….ofgraphicsandtext.A. LayersB. TextC. ImagesD. Graphics

21. Youhaveanimagewithfourlayers.WhatwillhappenifyouselectallthefourlayersandapplyastylefromtheStylespalefe?A. Thestylewillapplyonallthefourselectedlayerssimultaneously.B. Thestylewillapplyonlyonthebofommostlayer.C. Thestylewillnotaffectanylayer.D. Thestylewillapplyonlyonthetopmostlayer

22. WhataretwofiletypesthatareassociatedwithFlash?A. FLVandSWFB. PSDandFLV

220

C. PSDandSWFD. SWFandDOC

23. TheprocessofbuildingamoviefromsoucefilessothatitscanbeviewedonanothersystemsuchasaPCoraDVDplayer.A. CaptureB. FramesC. StoryboardD. Rendering(Ans)

24. Torecordaudio,video,orastillimageasadigitalfileonyourcomputer.A. Capture(Ans)B. ClipsC. TrimpostsD. Textclip

25. Usesatimescarethatmeasuresthelengthofclipswithinasceneandworksinrealtimewhilethesceneplaysback.A. ProjectB. FramesC. Timeline(Ans)D. Import

26. Singlestillimagesfromavideoclip.A. TrimpointsB. TextclipC. SourcefileD. FirewireE. Frames(Ans)

27. Afileonyourcomputerthatcontainesanimage,aclip,asoundtrack,orallthefootagefromyourdigitalvideocamera.A. StoryboardB. ProjectC. Sourcefile(Ans)

D. import

221

WindowMovieMakerKeyboardshortcuts

ShortcutkeysareavailableformanyofthecommandsinWindowsMovieMaker.Byusingshortcutkeys,wecanquicklyaccomplishcommontasks.

Thefollowingtableprovidesanoverviewofthetaskswecancompletebyusingshortcutkeys.TaskShortcutkeyCreateanewprojectCTRL+NOpenanexistingprojectCTRL+OSaveaprojectCTRL+SSaveaprojectwithanewnameF12SaveamovieCTRL+PCapturevideoCTRL+RImportanexistingdigitalmediafileCTRL+IUndothelastactionCTRL+ZRedothelastundoneactionCTRL+YCutCTRL+XCopyCTRL+CPasteCTRL+VDeleteDELETESelectallclipsCTRL+ARenameacollectionorclipF2Clearthestoryboard/timelineCTRL+DELETEShoworhidethestoryboard/timelineCTRL+TZoominonthetimelinePAGEDOWNZoomoutonthetimelinePAGEUPAddselectedclipstothestoryboard/timelineCTRL+DPlayvideoinfullscreenALT+ENTERSetstarttrimpointCTRL+SHIFT+ISetendtrimpointCTRL+SHIFT+OCleartrimpointsCTRL+SHIFT+DELETESplitaclipCTRL+LCombinecontiguousclipsCTRL+MNudgescliptotheleftCTRL+SHIFT+BNudgescliptotherightCTRL+SHIFT+N

222

PlayorpauseclipSPACEBARStopplaybackonthestoryboard/timelineCTRL+KPlaycontentonthestoryboard/timelineCTRL+WRewindcontentonthestoryboard/timelineCTRL+QBackCTRL+ALT+LEFTARROWForwardCTRL+ALT+RIGHTARROWPreviousframeALT+LEFTARROWNextframeALT+RIGHTARROWDisplayHelptopicsF1Selectpreviousitem(onatimelinetrack,onthestoryboard,orintheContentspane)LEFTARROWSelectnextitem(onatimelinetrack,onthestoryboard,orintheContentspane)RIGHTARROWSelectitemabove(onatimelinetrackorintheContentspane)UPARROWSelectitembelow(onatimelinetrackorintheContentspane)DOWNARROWGotothefirstitem(onatimelinetrack,onthestoryboard,orintheContentspane)HOMEGotothelastitem(onatimelinetrack,onthestoryboard,orintheContentspane)END

223

Glossary

•bandwidth:Anetwork’scapacityfortransferringanamountofdatainagiventime.•bitrate:Thenumberofbitstransferredpersecond.•Capture:Torecordaudio,video,orstillimagesasdigitaldatainafile.•capturedevice:Hardwarethattransfersaudioandvideofromanexternalsource,suchasaVCRorcamcorder,toacomputer.

•Clip:Smallsegmentofalargervideofile.•Codec:Anabbreviationforcompressor/decompressor.Softwareorhardwareusedtocompressanddecompressdigitalmedia.

•Collection:Acontainerfororganizingclips.•Compression:Aprocessforremovingredundantdatafromadigitalmediafileorstreamtoreduceitssizeorthebandwidthused.

•Content:Audio,video,images,text,oranyotherinformationthatiscontainedinadigitalmediafileorstream.

•Cross-fade:Amethodofsmoothlymovingfromonevideocliporphototoanother.With a cross-fade transition, the frames in theplayingclipfadeoutastheframesinthenewclipfadein.Inthefilmindustry,thesameprocessiscalledadissolve.

•depthoffield:Themeasurementoftheareainfrontofandbehindthesubjectthatisinfocus.

•digitalvideo(DV):Videoimagesandsoundstoredinadigitalformat.•directmemory access (DMA) :Memory access that does not involve the microprocessor and is frequently used for data transfer

directlybetweenmemoryandaperipheraldevice,suchasadiskdrive.

•Download:Totransferafileoveranetworkinresponsetoarequestfromthedevicethatreceivesthedata.Downloadedcontentiskeptonthereceivingdeviceforplaybackondemand.Incontrast,streamedcontentisplayedasitisdelivered.

•Frame:Oneofmanysequentialimagesthatmakeupvideo.

224

•framerate :Thenumber of video framesdisplayedper second.Higher frame rates generally produce smoothermovement in thepicture.

•Header:Apartofthefilestructurethatcontainsinformationrequiredbyanapplicationtodecompressandrenderthecontent.Theheaderinaprotectedfilealsocontainsinformationrequiredtogetalicense.

•InstituteofElectricalandElectronicsEngineers (IEEE)1394 :Ahigh-speedserialbusstandard thatprovidesenhancedcomputerconnectivity for a wide range of devices, including consumer electronics audio/video (A/V) appliances, storage peripherals,othercomputers,andportabledevices.

•microphonenoise:Unwantedsoundthatiscapturedwhenobjectstouchamicrophoneinadvertently.

•moirépaflern:Videoartifactsthatoccurwhenrecordinganobjectthathasmanythin,parallellines.

•projectfile:Thefilethatcontainsinformationaboutthefilesthathavebeenimportedintoorcapturedinthecurrentproject,andhowfilesorclipshavebeenarranged.

•Record:Seedefinitionfor:capture

•Source:Audioandvideocontentthatcanbecapturedandencodedfromdevicesinstalledonyourcomputerorfromafile.

•Split:Todivideanaudioorvideoclipintotwoclips.

•Storyboard:Aviewoftheworkspacethatdisplaysthesequenceofyourclips.

•Timeline:Theareaoftheuserinterfacethatshowsthetimingandarrangementoffilesorclipsthatmakeupaproject.

•Trim:Tohidepartsofafileorclipwithoutdeletingthemfromtheoriginalsource.Filesandclipscanbetrimmedbyadjustingthestartorendtrimpoints.

•trimpoints:Thepointswhereplaybackofafileorclipbeginsandends.Therearetwotrimpoints:starttrimpointandendtrimpoint.

•WindowsMedia file :A file containing audio, video, or script data that is stored inWindowsMedia Format. Depending on theircontentandpurpose,WindowsMediafilesuseavarietyoffilenameextensions,suchas:.wma,.wme,.wms,.wmv,.wmx,.wmz,or.wvx.

225

•WindowsMediaTechnologies:AfamilyofdigitalmediasoftwaredevelopedbyMicrosoft,suchasWindowsMediaServices,WindowsMediaEncoder,andWindowsMediaPlayer.

•WindowsMovieMaker:Softwareforcapturing,editing,andarrangingaudioandvideosourcematerialtocreatemovies.

•Workspace:TheareaofWindowsMovieMakerinwhichyoucreateyourmovies.Itconsistsoftwoviews:storyboardandtimeline,whichactasacontainerforworkinprogress.

226

ChapterSixITDC-411

CustomizingandEmbeddingMultimediaComponentsinWebPages

•CompatibleMultimediaFileFormatsforWebPages•EmbeddingAudioFile•EmbeddingVideoFile•EmbeddingFlashFile

227

IntroductionMultimediameansthatcomputerinformationcanberepresentedthroughaudio,video,andanimationinadditiontotraditionalmedia(i.e.,text,graphicsdrawings,images).Multimedia is the field concerned with the computer-controlled integration of text, graphics, drawings, still and moving images(Video),animation,audio,andanyothermediawhereeverytypeofinformationcanberepresented,stored,transmifedandprocesseddigitally.AMultimedia Application is an Application which uses a collection of multiple sources e.g. text, graphics, images, sound/audio,animationand/orvideo.IntroductionofDreamweaverDreamweaver has become one of the industry’s leadingWebsite Design editing andmanagementtool.Thiscourseisdesignedforstudentswho wishtoevaluate theDreamweaverWebdesign tool or who would like to learn to use it. TheemphasisisonlearningtouseDreamweaverasatooltocreateaWebsite,ratherthanonlearningthebasicconceptsofWebdesignandwemoveveryquickly.However,allquestionsaboutbasicWebdesignconceptswillbeanswered.Dreamweaverisawebdevelopmentapplication.Itisawebeditorandallowsuserstocreatewebpageswithdifferentfeatureswithouttheneed towrite theHTML code by hand. The application enables you to previewwebsites in a previewpanel and also providestransferandsynchronizationfeatures.Dreamweaverisasoftwareapplicationwhosemainfunctionistodesign,manageandpublishwebsites.ThissoftwarewasoriginallycreatedbyMacromediabutrightstoproduceitwerelatersoldtoAdobeSystems.StartingDreamweaver1.StartDreamweaver.YoushouldseeastartupScreen.

228

DefinealocalsiteWhenyouDefinealocalsite,youtellDreamweaverwhereyouplantostoreallthefilesforaparticularsite.ToworkeffectivelyinDreamweaver,alwaysdefinealocalsiteforeachWebsiteyoucreate.Forthistutorial,you’llspecifytheCompassSitefolderasthelocalsitefolder.

1. Ifitisn’talreadyopen,launchDreamweaver.Ablankdocumentopens.2. ChooseSite>NewSite.3. IntheSiteDefinitiondialogbox,makesureLocalInfoisselectedintheCategorylist.4. IntheSiteNamefield,typemytutorial.Thesitenameletsyoueasilyidentifyandselectasitefromalistofsitesyou’ve

defined.5. ClickthefoldericontotherightoftheLocalRootFolderfield.

229

6. InWindows,clickOpen,thenclickSelectwhenCompassSiteappearsintheSelectfield.7. OntheMacintosh,clickChoosetoselect theCompass_Site folder.TheLocalRootFolder fieldupdates todisplay the

pathtothelocalsite.Note:ThecompletepathtotheCompass_Sitefoldermayvary,dependingonwhereyouinstalledDreamweaver.

8. ClickOKtoclosethedialogbox.

LocalInfoLocalInfoiswhereweputintheinformationaboutthefilesthatareonyourlocalcomputer(whichiswhereallyourfilesareorwillbefornow).

1. IntheAdvancedTab,underCategory,chooseLocalInfo.2. Next to Site Name, type: My First Dreamweaver Web site.Youwill use this name when you go into Dreamweaver to

retrievethefilesassociatedwiththissite.ThisnamehastobeuniquewithinDreamweaver.3. NexttoLocalrootfolder,clickontheyellowfoldericontobrowseforwhereyouwanttostoreyourwebsiteonyour

localcomputer.Youmaywishtocreateanewfoldertostoreyourfilesin.IstoredmyWebsiteonF:(myflashdrive)inafolderIcalledMyWebSite.ThisisnowyourRootFolder

4. ClickDONE.YoushouldseeaFilespanelontherightsideofyourscreen.TheLocalViewintheFilesPanelwilldisplayallthefilesforyourWebsitethatareintheRootFolderonyourcomputer.

230

Laterwewilladdinformationaboutconnectingtotheserver.TheRemoteViewshowswhichfileshavebeenuploadedtotheserver.

5.Oncewe’veenteredallthisinformationaboutlocalandremoteservers,itwillbesetupforusnexttimeweuseDreamweaveronthiscomputer.Unfortunately,itdoesn’tworkthatwayonlabcomputers.Ifyoumovetoanothercomputer,youwillhavetosetupyourWebsiteonthenewcomputeraswell.

TocreateaWebpage,followtheseguidelines:

1. ChooseapagetobethehomepageofyourWebsite.Thiswillbethefirstpagethatusersencounterwhentheyvisityoursite.Savethisfiletoyourlocalrootfolderashome.html.Namingthehomepagehome.htmltellstheWebbrowserthatthisisthefirstpageitshouldopenwhensomeonevisitsyoursite.

2. ToaddanewpagegotoFile>NewandchooseabasicHTMLpage.SavethispagebyclickingFile>SaveAs.Namethefirstpageindex.html(thatishomepage)

231

3. Afteryourhomepageiscreated,youcanusethispageasatemplatelayoutforalltheotherpagesinyoursite.SimplyhitSaveAsandnamethefilewhateveryouwish,ButRemembernottousecapitallefersorspaceswhennamingfiles;thiswillmakeiteasierforwebbrowserstofindyourfiles.

4. TosavethepagesofyoursitesimplyclickFile>Saveforeachpage.Makesureyourhomepageisnamedindex.html,andsaveallofyourfilesinthefolderyouchosewhenyoudefinedyoursite,i.e.inyourlocalrootfolder.

5. Afteryourhomepageiscreated,youcanusethispageasatemplatelayoutforalltheotherpagesinyoursite.Simplyhit Save As and name the file whatever you wish, but be sure to keep the name simple, for example CV.html,resume.html,pictures.etc.Remembernottousecapitallefersorpaceswhennamingfiles;thiswillmakeiteasierforwebbrowserstofindyourfiles.

6. TosavethepagesofyoursitesimplyclickFile>Saveforeachpage.Makesureyourhomepageisnamedhome.html,andsaveallofyourfilesinthefolderyouchosewhenyoudefinedyoursite,i.e.inyourlocalrootfolder.

NOTE:Afterthatallfiletransfertotheentiresiteonceyouhavefinishedworkingonit.

WHAT’SAROOTFOLDER?ThelocalrootfolderiswhereyouwillkeepALLthefilesforyourwebsite.Youcancreatesubfoldersunderit,butconsiderittobetheparentofallparentfolders.You’llkeepallofthefilesandsubfoldersforyourWebsite(includinghtmlpages,images,multimediafiles,etc.)eitherintherootfolderorasubfolderundertherootfolder..MakingyourfirstWebPage:

10. UndertheFilemenuatthetop,chooseNew.11. IntheNewDocumentdialogbox,makesureyouhaveBlankPageselected,thePageTypeisHTML,andtheLayoutis

<none>.

232

12. ClickCreate.YoushouldnowseeablankWebpageintheDocumentWindow.13. UndertheFileMenu,chooseSave.14. IntheSaveAsbox,findyourWebsitefolderandsaveyourfileasindex.html15. ClickSave.IntheFilespanel,youshouldnowseeindex.html.Congratulations!You’vecreatedyourfirstWebpageusing

Dreamweaver.Unfortunately,it’sprefyboringatthemoment.RULESOFTHUMBfornamingwebfiles:

•Donotusespacesorspecialcharacters,suchasthosefoundaboutthenumber keys onthekeyboard,inyour filenames.Youcanusedashesandunderscores.(e.g.,my_page.html)

•Always use a 3-or 4-character file extension for everyfile youuseon theWeb. In thecaseofa regularWebpage,alwaysuse.htmor.html.

•BeveryspecificaboutcapitalizingbecausemostWebserversarecase-sensitive.

GiveyourWebPageaTitleInthedocumenttoolbar,findtheTitlebox.

1. Onthedocumenttoolbar,locatetheTitlefield.2. Typeinatitleforyourpage.Feelfreetobecreative(butnotindecent).HitEnter3. Thetitledoesn’tshowuponthepage,butwillappearintabsandacrossthetopofbrowsers.

AddingSomeContent

1. IntheDocumentwindow,typeinagoodtitle.ThisonewillbetheheadofyourWebpage.Ifyoucan’tthinkofanything,youcanalwaysuse,“AardvarkAdoptionSocietyofDelaware”.

2. Addasubtitle.Again,itcanbeanythingyouwant.Ifyou’dprefer,itcouldbe,“WespeakforAardvarkswhocan’tspeakforthemselves.”

3. Nowthatyou’vegotagoodtitle,addsomecontent.Logically,itshouldgowiththetitle.Typeoneortwolinesnowfornow.We’lladdmorelater.(Ifyoucan’tthinkofanything,feelfreetothrowinsomeoftheAardvarkcontent).

233

Nowlet’sformatthecontent:ØOntheWebpage,highlightthetitle.ØInthePropertyInspector,clickontheFormatdropdownarrow,andchooseHeading1.

Note:IfyoudonotseethePropertyInspector,chooseWindow>>Properties.4. Onthewebpage,highlightthesecondlineoftext.5. FromtheFormatmenuonthePropertyInspector,chooseHeading2.

Note:Whenformafingyourtext,keepinmindthattextsizesinHTMLarerelativesizes.Thismeansthat,whenyourpageisviewedinabrowser,thetextsizewilldependonthedefaulttextsizesefingsoneachuser’scomputer.Relativesizesgiveuserstheabilitytoadjustthetextsizetosuittheirindividualneeds.Thisoptionisespeciallyimportantforpeoplewithvisualimpairments,butitmeansthattheappearanceofyourpagesmayvaryfromcomputertocomputer.PlayingwithFontProperties

1. HighlighttheSubtitle.Changethefontsizeto24.2. HighlightanywordonthepageandclicktheBoldicon()onthePropertyInspector.Theselectedwordappearsbold.3. HighlightthetitleclickthegraysquaretotherightoftheSizepopupmenuinthePropertyInspector.Agridofcolored

squaresappears,andthecursorchangestoaneyedropper.4. Clicktheeyedropperonthedesiredcolor.ThefieldtotherightofthecolorswatchreflectsthecodeWebbrowsersneed

tocorrectlydisplaythecoloryou’vechosen.

234

Alignment1. Highlightthetitleandsubtitleonthepage.2. ClicktheAlignCenterbufon()onthePropertyInspector.Thetitlesshouldnowbecenteredonyourpage.

CreatingLists1. Firstweneedtoaddalist.2. Typeinatitleforyourlistandthentypeinalistofitems.Makesurethereareatleast3itemsinyourlist.Makesure

youhitreturnaftereachitem.(Feelfreetousealistfromtheaardvarkhomeworkifyoucan’tthinkofyourown.)3. HighlightthelisttitleandchooseHeading3fromtheFormatmenuonthePropertyInspector.4. HighlightthelistitemsandclicktheUnorderedListbufononthePropertyInspector.5. Theitemsappearasabulletedlist.6. NowtypeinanotherListtitleandanotherlistofitems.7. HighlightthetitleandselectHeading3.8. HighlighttherestoftheitemsandclicktheOrderedListbufononthePropertyinspector(nexttotheorderedlist

bufon).Theitemsshouldnowappearinanumberedlist.9. Saveyourwork.Getintothehabitofsavingyourworkregularly.

235

PagePropertiesInthissectionyouwilllearnhowtosetyourpage’sbackgroundcolor,aswellasthedefaulttextandlinkcolors.Thesesefingsdifferfromwhatyou’vedonesofaronthePropertyInspectorbecausethey’llapplytoallthetextandlinksonthepage—notjustaselectedpieceoftext.

1. FromtheModifymenuatthetopoftheworkspace,choosePageProperties.2. Tochangethetextcolor,clickthebofomrightcornerofthetextcolorbox.3. Usingtheeyedropper,chooseacolorbyclickingonanyofthecolorswatches.4. Similarly,youcanchangethebackgroundcolorforthepageusingtheBackgroundcolorsefing.5. Youcanalsochangethecoloroflinks,activelinks,andvisitedlinks.Anactivelinkisalinkjustwhentheuserclicksit.

Acolorchangeletstheuserknowthats/heclickedonalink.Avisitedlinkisonethattheuserhasalreadyclickedonandvisited.Acolorchangeletstheuserknows/he’salreadyvisitedthatlink.

6. Select“Links”fromtheCategorymenuatleft,thenmakeyourselectionsforlink,visitedlink,andactivelinkcolorsasyoudidinStep3.

7. ClicktheApplybufontoseehowyourcolorchoiceslookontheindexpage.ThePagePropertiesdialogboxwillremainonthescreen.

8. Whenyou’resatisfiedwiththecolorsyou’vepicked,clickOK.

236

Note:Youcanaddabackgroundimageifyouwant.Browsetofindanimagebythebackgroundimage.Seewhatitlookslike.Nowyouknowthat’sanoption.We’lltalkaboutthisoptionmorelater.Fornow,gobacktoasolidcolorbackground.Note:IfyouchangedthecolorforanytextusingthePropertyInspector,thosechangeswilloverridegeneralpagecolorchoices.WebPagePreviewAsyoucreateapageinDreamweaver,thepagemaynotlookexactlylikeitwouldinabrowser.Topreviewthepageinabrowser:

1. ChooseFile>>PreviewinBrowser>>i-explorerorNetscapeorpresstheF12key.Awebbrowser,suchasNetscapeorInternetExplorer,opensandloadsthewebpage.

2. TakealookatyourpagetoseehowitwillappearontheWeb.3. Whenfinished,closethebrowserandswitchbacktoDreamweaver.

NOTE:Coloredorunderlinedtextcanbemistakenforlinks.Chooseyourcolorschemesothatthelinksstandoutfromrestofthetext.Thetextandlinksalsoshouldstandoutfromthebackgroundforreadability.Whenselectingcolors,keepitsimple.Toomanycolorscanbedistractingorconfusing.AddingImagesNote:Anyeditingorresizingofanimageshouldbecompletedbeforeitisaddedtoawebpage.

1. Firstyouneedanimage.Feelfreetofindoneonyourownthatsuitsthethemeofyourwebpage.Ifyoudon’tfeellikeit,I’veincludedanimageonmyWebsitethatyoucandownload.

2. Next,addittoyourWebpage.3. PlaceyourcursorbelowthesubheaderinyourdocumentandpressEntertwice.4. ChooseInsert>>Image.TheSelectImageSourcedialogboxwillappear.5. Usingthedialogbox,locateandselectanimage,thenclickOK.

237

Youwillfirstencounteraprompttoaddaccessibilityafributes:

•TypeabriefdescriptionoftheimageintheAlternatetextbox,thenclickOK.

•Becauseyou’retryingtouseafilethatliesoutsideyourrootfolder(mywebsite),you’llreceivethefollowingmessage:•ClickYes.TheCopyFileAsdialogboxwillappear.

•ClicktheSavebufontoplaceacopyoftheimagefileinsideyourmywebsitefolder.•Theimagewillappearonyourwebpage.•ClicktheRefreshbufonontheFilespanel()andtheimagefilewillappearinthelistoflocalfiles.

238

DeleteanImage1. IntheDocumentwindow,clickontheimagetoselecttheimage.2. PresstheDeletekey.Theimagedisappears.3. Toreversethedeletion,usetheUndocommand.FromtheEditmenu,chooseUndo.Theimageshouldreappearonthe

page.CreateaSecondPageNext,youwillcreateasecondpageforyourWebsite.

1. FromtheFilemenu,chooseNew…TheNewpagedialogboxappears.2. ClicktheCreatebufon.Thenewfilewillappearinthedocumentwindow.3. SaveyournewpageinthemywebsitefolderasPage2.html4. IntheTitlefield,typeanappropriatetitleforthispage.We’lleventuallymakeitintoaCalendarofEventsPage,ifthat

helpsyoudecideonatitle.5. Saveyourwork.

InsertTableToinsertatable,followthesesteps:

1. Inthemainmenu,clickInsert>Table(alt+ctrl+T)2. InserttheamountofTableRowsandColumns3. SetTablewidthtobetween600and800pixels,orourpageratio.4. SetBorderthickness.Tohaveavisiblebordertypein1orhigher,tohavenobordertypein0.5. Cellpaddingaddsroominsideofacell.Enter0fornospaceoranumbertoIncreasethespace.6. Cellspacingaddsspacebetweencells.Enter0fornospaceoranumbertoIncreasethespace.7. ClickOK.

239

>>PropertiesofaTableItselfIfyouclickononeofthetableborders,youcanviewyourtablepropertiesintheTable

BytheaboveTableyoucanmodify•nameyourtable;•changethenumberofrowsandcolumnsinthetable;•changethewidthandheightofthetable,•ChangetheCellPad:thisisthenumberofpixelsthatcomebetweentheborderofcellsandthecontentofcells.

240

•ChangetheCellSpace:thisisthenumberofpixelsthatcomebetweenthebordersofeachcell.•Changethealignment:thisisthepositionofthetableontheleftorrightedge,orinthecenterofthepage.•Changetheborder:thisisthenumberofpixelsthatmakeupthethicknessofcellborders.•Youcanclearandconverttablewidthsandheights.•Changethebackgroundcolorofthewholetable.•Insertabackgroundimageforthewholetable.•Changethebordercolor.

PropertiesofCellsInsideTableOncethepropertiesofthetablehavebeenset,youcanalsoadjustthepropertiesofindividualcellswithinthetablebyclickinginsidethecellInthetopsectionofthiswindowyoucanformatthetextinsidethetablecell.Inthebofomsectionofthiswindowyoucan:

•Changethealignmentofthecontenthorizontallyandvertically.•Changethewidthandtheheightofthecell •UseWrap.•InsertHeader •Insertabackgroundimageforthesinglecell.•Changethebackgroundcolorforthesinglecell.•Changethebordercolorforthesinglecell.

InsertingImageToinsertanimage,followthesesteps:

1. Clickinthecellwhereyouwanttheimagetoappear.2. ClickInsert>Image.3. Locatetheimageyouwanttoinsert.

NOTE:Allofyourimagesshouldbesavedinthe“images”folderthatyouestablished241

whenyoustarted.4. ClickChoosetoinserttheimage.

InternalLinksInternallinksareusedtoconnectuserstootherpageswithinthesamewebsite.Beforelinkingtootherpages,youmustmakesurethattheotherpagesaresavedinyourlocalrootfolderandcontainthefileextension.html.Tocreateaninternallink,followthesesteps:

•Selectthetextorimageyouwouldliketomakeahyperlink.•ClickonthesmallfoldernexttotheLinkfieldinthePropertiesInspector.•ClickOK.

EmbeddingFlashFileInsertaFlashmovieNowyou’lladdadifferenttypeofasset.You’lldragaFlashmovieintothecellbelowthenavigationbufons.

1ClicktheFlashiconintheAssetspaneltoviewalltheFlashfilesintheCompasssite.2IntheNameslist,clickwelcome.swftoselecttheFlashmovieyou’reinsertinginthedocument.

IntheAssetspanel’spreviewareayouseeaplaceholderfortheFlashmovie.

Playbufon

4IntheNameslist,dragtheWelcome.swftothecellbelowtheTripPlannernavigationbufon.AFlashmoveplaceholderappearsintheselectedcell.

InsertFlashobjectsFlashobjectsaresmallgraphicSWF(Shockwave)filesyoucancreatewhileworkinginDreamweaver.YoucancreateFlashTextandFlashBufonobjects.UsingFlashTextallowsyoutodesignWebpagesthatusenonstandardfontswithoutworryingaboutwhichfontsvisitors to your site have available on their computers. Flash bufons are created from Flash templates that ship withDreamweaver.Youcaneasilycustomizeatemplatebufonandaddittoyour

242

Webpages.TheFlashText object appears in thedocument. Youmust play theFlashobject to see the textwith its rollover effect. 1 If it isn’talreadyexpanded,inthePropertyinspectorclicktheexpanderarrowtoseeall.2IntheFlashTextPropertyinspector,clickPlay.3IntheDocumentwindow,rollthepointerovertheFlashTextobject.4Tostopplayingtheobject,clickStopinthePropertyinspector.CreateaFlashbuflonobjectNowyou’llseehoweasyitistoaddaFlashbufontoadocument.You’llcreateaFlashbufon,andadditbelowtheclimberimage.

•IntheDocumentwindow,placetheinsertionpointwhereyouwanttheobjecttoappear,belowtheimageoftherockclimber,thenintheObjectspanel,clicktheInsertFlashBufonicon.

TheInsertFlashBufondialogboxappears.

•IntheStylelist,selectBeveledRect-Bronze.•ForBufonText,typeMoreDetails.•ForFont,selectVerdana,orchooseoneofyourfavoritefonts.•ForSize,type11.•ClickApplytoseetheFlashbufoninthedocument.•InSaveAs,typemyBufon.swf

243

ClickOKtoclosethedialogbox.TheFlashBufonobjectappearsinthedocument.

ViewtheFlashbufloninthedocumentTheFlashbufonyouinsertedhasarollovereffect,nowyou’llplaythebufontoseehowitlooks.

1IntheFlashbufonPropertyinspector,clickPlaytoplaythebufoninthedocument.2IntheDocumentwindow,rollthepointerovertheobjecttoseetheFlashbufon’srollovereffect.3Tostopplayingtheobject,clickStopinthePropertyinspector.Youcanaddmusicorvideointoyourwebpage.

EmbeddingAudioFileHowtoEmbedMP3AudioFilesInWebPages<audiocontrols>

<sourcesrc=“horse.mp3”type=“audio/mpeg”><sourcesrc=“horse.ogg”type=“audio/ogg”>

<embedheight=“50”width=“100”src=“horse.mp3”></audio>

EmbeddingVideoFileWindowsMediaHereisanexampleofembeddingaWindowsMediafile.Onyourpageyouwouldreplacebothinstancesoffilename.wmvwithyouractualfilepathandname.<objectid=“MediaPlayer”width=“192”height=“190”classid=“CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95”

standby=“LoadingWindowsMediaPlayer…”TYPE=“application/x-oleobject”><paramname=“FileName”VALUE=“filename.wmv”><paramname=“ShowControls”VALUE=“true”><paramname=“ShowStatusBar”value=“false”><paramname=“ShowDisplay”VALUE=“false”><paramname=“autostart”VALUE=“false”>

<embedtype=“application/x-mplayer2”src=“filename.wmv”name=“MediaPlayer”width=“192”height=“190”ShowControls=“1”ShowStatusBar=“0”ShowDisplay=“0”

244

autostart=“0”></embed></object>

RealMediaThefollowingexamplepresentsarealmediafileonawebpage.Again,youwouldreplacebothinstancesoffilename.rmvbwithyouractualfilepathandname.<objectid=rvocxclassid=“clsid:cfcdaa03-8be4-11cf-b84b-0020abbccfa”width=“180”height=“159”><paramname=“src”

value=“filename.rm”><paramname=“autostart”value=“false”><paramname=“controls”value=“imagewindow”><paramname=“console”value=“video”><embedtype=“audio/x-pn-realaudio-plugin”src=“filename.rmvb”width=“180”height=“159”autostart=“false”

controls=“all”console=“video”></embed></object>

NoteonLinkingIfyoucreatealinkdirectlytoaRealMediafileitwilldownloadinitsentiretybeforetheusercanstartplayingit.Youwoulddothatlikethis:<ahref=“filename.rm”>DownloadVideo</a>Ifyouwishtostreamthefilesuchthattheusercanstartwatching itassoonasenoughof the file isbuffered,youmustcreateametafile. This metafile is a simple text file containing the URL of the video file, but with a .ram extension:hfp://it.rit.edu/~rpv/local/tutorials/embeding_video/filename.ramYouwouldthenlinktothismetafile:<ahref=“filename.ram”>WatchVideo</a>

QuicktimeEmbeddingQuickTimeissimilartotheabovetwo,againusingboththe<object></object>and<embed></embed>tagsformaximumbrowsercompatibility:<objectclassid=“clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b”

width=“320”height=“180”codebase=“hfp://www.apple.com/qtactivex/qtplugin.cab”>245

<paramname=“src”value=“filename.mov”><paramname=“autoplay”value=“true”><paramname=“controller”value=“false”><embedsrc=“filename.mov”width=“320”height=“180”autoplay=“true”

controller=“false”pluginspage=“hfp://www.apple.com/quicktime/download/”></embed>

</object>

MPEG-4YoucanpresentMPEG-4videotoyourusersviatheQuickTimeplug-inaswell:<objectclassid=“clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b”codebase=“hfp://www.apple.com/qtactivex/qtplugin.cab”

width=“320”height=“256”><paramname=“src”value=“filename.mp4”><paramname=“autoplay”value=“true”><embedsrc=“qtmimetype.pntg”type=“image/x-macpaint”pluginspage=“hfp://www.apple.com/quicktime/download”qtsrc=“filename.mp4”

width=“320”height=“256”autoplay=“true”></embed>

</object>

FlashToplaceaFlashprogressivedownloadvideoonyourwebpageyouwillneedtwofiles:AnFLVvideofileandanSWFFlashapplication

withwhichtoplaythevideo.Embeddingthevideoonthepageisaccomplishedthusly:<objectclassid=“clsid:D27CDB6E-AE6D-11cf-96B8-444553540000”

codebase=“hfp://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0”width=“400”height=“400”><paramname=“movie”value=“flashplayer.swf”><paramname=“quality”value=“high”><paramname=“LOOP”value=“false”><embed src=“flashplayer.swf” width=“400” height=“400” loop=“false”

quality=“high”pluginspage=“hfp://www.macromedia.com/go/getflashplayer” type=“application/x-shockwave-flash”></embed></object>

246

UploadingFilestoWebDreamweaverallowsyoutoconnecttoyourmainserverspaceandretrievestoredfolderslocated

onyoursite.Thisfeaturewillonlybenecessaryifyouneedtoupdateacurrentlyuploadedwebsiteandyounolongerhavethelocal

rootfolderforthesite.

Todownloadafilefromtheserver,youwillneedtoknowtheRemoteInfo(Figure1).TheRemoteInfoyouenteredwhenyouuploadedyoursitetellsDreamweaverwheretofindyourcurrentlyuploadedfiles.

NOTE:IfyouareusingapersonalBGSUwebaccount,youcanfindtheremoteinformationontheGeflingStartedpageofthistutorial.DOWNLOADINGYOURFILESTodownloadfiles,completethefollowingprocess:

1ClicktheConnectbufon.2ChangethetoolbarsoitdisplaysRemoteViewandthefilesassociatedwithyoursiteappearonthescreen.3Selectthefolderwhereallofthefilesarelocated,andclickontheGetbufon.4Youwillseeadialogboxasking“Areyousureyouwanttogettheentiresite?”ClickOK.5Youshouldseethefilesbeingdownloaded,andwhenitiscompletedyouruploadedWebsiteshouldappearunderLocalViewinthetoolbar.6GotoFile>Savetosaveyourprojectbeforeyoumakechangestoit.

NOTE:Ifthisprocessdoesnotwork,gobackandcheckyourRemoteInfounderSites>ManageSite>yoursitename.

247

HandonActivitiesImportant:AddaNavigationMenuBartoYourWebsite

1. StartupDreamweaver.2. Loadyourindex.htmlpageasbefore.Thatis,doubleclickthefileintheFilespaneintherightcolumn.3. Locateyourexistingnavigationmenu,whichatthistimemerelyconsistsofaseriesoflinkstoyourhomepage,About

Uspage,ContactUspageandtheSiteMap.Selectthemanddeletethem.Wewillbecompletelyreplacingtheminthischapter.

Incaseyou’rewonderingwhywebotheredtocreatethoselinksifweweregoingtodestroythemagainanyway,hyperlinksareoneofthemostimportantfeaturesofawebpage.Asawebmaster,youwillbecontinuallycreatinghyperlinkstootherpagesonyoursiteaswellaslinkstoothersitesontheInternet.Notalltheselinkswillbeplacedinyournavigationmenu.Itwasthusimportanttocoverthataspectofwebdesigninthetutorial.

4. Makesurethattheblinkingtextcursoriscurrentlyinthesidebar.Ifit isnot,clicksomewhereinthesidebar.Nowclick“Insert|Spry|SpryMenuBar”fromthemenu.Thatis,clickthe“Insert”menu,thenthe“Spry”itemonthemenuthatappears,andfinallyon“SpryMenuBar”onthesubmenuthatappears.

5. Adialogboxwillappearaskingyouwhetheryouwantahorizontalmenubaroraverticalone.Sinceweareplacingthemenubarintheleftcolumn,wewantaverticalmenubar.Selectthe“Vertical”optionandclickOK.

6. A default menu bar will be inserted into your side bar. If you look at the Properties pane at the bofom of yourDreamweaverwindow,youwillseethatthetextandlinksformenuitemsaredisplayedthere.

7. Select“Item1”byclickingonit,ifitisnotalreadyselected.Inthe“Text”box,replacethewords“Item1”with“Home”(withoutthequotes).Replacethedefault“Link”textof“#”with“index.html”(withoutthequotes).

8. BydefaultDreamweavercreatedasubmenuforyourmenu.Wedon’tneedone,sowewillneedtodeleteit.Select“Item1.1”.Directlyabove“Item1.1”aretwobufons“+”and“-“.Clickthe“-”itemtodeleteItem1.1.Dothesamefor“Item1.2”and“Item1.3”.

9. Nowdothesamewiththeotheritems,replacingthetextwiththeappropriatewordsforyoursite,andthelinkswiththeactualpagenames.Iftherearesubmenus,deletethemasyoudidforItem1.Foryourconvenience,thereplacementtext and links are reproduced below from chapter 3. Note that Item 3 has a three-level menu system. Delete allsubmenus(item3.1.1,3.1.2,3.1,3.2,3.3)-wewon’tneedthem.

248

Text:AboutUs,Link:aboutus.htmlText:ContactUs,Link:feedback.htmlText:SiteMap,Link:sitemap.html

10. Click“File|Save”.Adialogboxwillpopuptellingyouthatcertainfileshavebeenaddedtoyoursite,andthatthesefileswillneedtobeuploaded.Click“OK”.

11. Nowuploadthepagetoyourwebsiteusing“Site|Put”andchecktheresultsinyourbrowser.Hoveryourmouseoveryourmenubufons,andyouwillseethattheychangecolour.

CustomisingtheSpryFramework’sMenuBarWidgetWhileaddingtheSpryFramework’snavigationmenubartoyourwebpageisasimpleprocedureunderDreamweaver,customising(“customizing” inUSEnglish) it is, however, another cup of tea. There is no built-inmethod to do so underDreamweaver’s userinterface.Youwillhavetodoitmanually.ThefastestwaytodothisistodoitviaDreamweaver’s“Code”view.Dreamweaverhastwobasicwaysyoucanworkonyourwebsite.Sofar,youhavebeencreatingyoursiteusingthe“Design”view.The“Design”viewallowsyoutoworkonyourwebpageusingtheWhat-You-See-Is-What-You-Get(WYSIWYG)editor-thatis,asyoucreateyourwebpage,youbasicallyseethepageasavisitorwouldwhentheyvisityourwebsite.The“Design”viewhidestherealcode,theHTMLandCSScode,thatDreamweavergeneratesforyourwebsite.Thiscode,the“raw”code, if you will, is the actual content that is uploaded (published) to your website.When your visitor loads your web page, thebrowsertakesthe“raw”codeanddisplaysitaccordingtotheinstructionsgiveninthe“raw”code.TocustomisetheSpryFramework’smenubarwidget,youwillbeusingDreamweaver’sfacilityforviewingthis“raw”codeforyourwebsite.Even if you find themenubarwidget satisfactory at themoment, you should still take the following steps to familiarizeyourselfwithDreamweaver’s“Code”view.YouwillbeusingtheCodeviewinafuturechaptertoinsertyourfeedbackformcode.Toswitchtothe“Code”view,click“View|Code”fromthemenu.Insteadofthewebpagethatyouareaccustomedtoviewing,youwillnowseethe“raw”HTMLcodeforthatpage.Ifyouscrollupanddownthepage,youshouldbeabletoseeyourcontentamidstothercharacters.Theseothercharacters,thingslike“<p>”andthelike,aretheformafingcodethattellsthebrowserhowitshouldrenderyourpage.

249

•CenteringtheMenuBarScrolltothetopoftheindex.htmlfilein“Code”view.Locatethetext“</head>”(withoutthequotes)somewherenearthetopofthefile.Placeyourcursorjustbefore“</head>”onthesameline.HitENTER(orRETURN)toinsertablankline.Whenyoudothis,theentirelinewith“</head>”shouldmovedownwards,creatinganewblankline.Movethecursortotheblankline.Now copy the text from the box below and paste it into the blank line you just created in Dreamweaver. To copy the text, clicksomewhereintheboxtohighlightallthetextinthebox.(Ifnothingisselectedwhenyoudothat,dragyourmousecursoroverthetexttohighlightit.)Thenclicktherightmousebufon(orifyouuseMacOSX,holddowntheControlkeyonthekeyboardandclickthemouse),andselectCopyfromthemenuthatappears.Topaste it intoDreamweaver,switchtotheDreamweaverwindow.Makesurethatyourtextcursorisinthecorrectlocation(intheblanklineabovetheword“</head>”).Select“Edit|Paste”fromthemenu.

Tocheckthatyourinsertionworks,click“View|Design”fromthemenu.YoushouldseethatthemenuisnowcentredintheDesignview.Youcanagainclick“View|Code”againfromthemenuifyouwanttoreturntothe“Code”view.

•ChangingtheColoursoftheMenuBarOn the right side of the Dreamweaver window, in the Files pane, doubleclick the folder“SpryAssets”.Itshould expand,showingyouother files.Doubleclickthe file“SpryMenuBarVertical.css”. If the Files pane is too narrow for you to see what fileyou’reclicking,hoveryourmouseovereachfileinturnuntilDreamweaverdisplaysatooltiptellingyouthefullnameofthefile.Anotherfile,fullofunfamiliarcode,willappearintheDreamweaver’scentrepane.ThisistheCSScodeforyourmenu.TheCSScodecontainstheformafingcodeforyourmenu.Click“Edit|FindandReplace”fromthemenu.Type“ul.MenuBarVerticala”(withoutthequotes)intothebig“Find”box.Clickthe“FindNext”bufon.Dismissthedialogboxbyclicking250

the“Close”bufon.Inthemainwindow,youshouldseethehighlightedwords“ul.MenuBarVerticala”.Underthesewordsisablockoftextenclosedbetween“{”and“}”(withoutthequotes).Youshouldbeabletofind“background-color”followedbyavalue“#EEE”inthisblock.Thislinedeterminesthecolorofthemenuwhenthemouseisnothoveringoverit.“#EEE”isthecodeforthegrayishcoloryouseeinthemenu.IntherighthandcolumnoftheDreamweaverwindow,intheCSSpane,youshouldbeabletosee“Propertiesforul.MenuBarVerticala”.Ifnot,moveyourmouseoverthelineseparatingtheblue“Applications”andthesectionaboveanddragitdownwardstomakemorespace.Under“Propertiesforul.MenuBarVerticala”, lookforthelinethatsays“background-color”(orpartsof“background-color”ifyourwindowistoonarrowtodisplaythefulltext).Totheright,youshouldseeasquareboxfollowedby“#EEE”.Clickthesquareboxtodisplaythecolourpickerwindowandchooseacolourofyourchoice.To modify the colour of the menu bufon when a mouse moves over it, click “Edit | Find and Replace” again and search for“ul.MenuBarVertical a:hover”.Dismiss thedialogboxwhen you’ve located the text.Onceagain, you shouldbeable to change the“background-color”propertyfromtheCSSpaneintherighthandcolumn.Whenyou’rethroughmakingyourchanges,checktheoutputbyswitchingbacktotheindex.htmlwindow.Todothis,select“Window|index.html”fromthemenu.Ifyouarestillin“Code”viewwhenyouswitchtotheindex.htmlwindow,switchtothe“Design”viewbyselecting“View|Design”.Whenyouaresatisfiedwiththechangesyouhavemade,saveyourworkwith“File|SaveAll”from the menu. Note that you need to use “Save All” instead of “Save” because you havemodified two files, index.html and SpryMenuBarVertical.css.Clicking“Save”alone willonlysavewhateverfileyouhappenedtobeworkingonlast.Again,use“Site|Put”topublishyourworkandcheckitoutwithyourbrowser.Atthispoint,thehomepageforyourwebsiteiscomplete.Ifyouhavebeenworkingonthepageusingsomedummytextandpictures,suchastheoneIsuppliedinchapter1,nowistimetochange them to your real content.Youhave learned everything you need to create aworkingmainpage that looksdecentandworkscorrectly.Wewillnotbereturningto thispage in thenextfewchapters.Instead,wewillbedesigningyourotherpagesusingthismainpageasthetemplate.

251

AddaFeedbackFormtoYourWebsiteinDreamweaver

vGenerateacustomfeedbackformscript In thenextpage, enter the information requestedby the form.Modify theURLs suppliedbelowtocontainyourrealdomain.Forexample, ifyourdomainis“suchandsuchaname.com”,usethatinsteadofthe“example.com”givenbelow.

•Email:(enteryouremailaddress) •URLofFeedbackForm:hfp://www.example.com/feedback.html•URLof“ThankYou”Page:hfp://www.example.com/thankyou.html•URLof“Error”Page:hfp://www.example.com/error.html

Finally,readthelicenceagreement.Ifyouagreetotheterms,indicateitintheform,andclick“Generatescript”tocontinue.Donotclosethewebpagethatappears.Leaveitopenwhileyouworkonthenextfewsteps.

vSavingthescriptStartupDreamweaver.Select“File|New”fromthemenu.Thatis,clicktheFilemenu,followedbythe“New…”itemonthemenuthatappears.Click“BlankPage”fromtheleftmostcolumn.Inthe“PageType”column,selectthe“PHP”item.Click“Create”.Click“View|Code”fromthemenutoswitchtoCodeview.Note:thisstepisveryimportant.Ifyouomitit,yourfeedbackformwillnotwork.SelecteverythingyouseeinthewindowwithyourmouseandhittheDELkey.Youshouldnowbeleftwithablankwindow.Switchtoyourwebbrowser,andlocatethesectionthathastheheader“FeedbackFormScript”.Selecteverythingintheboxbelow.IfyouareusingWindows,oneeasywaytoselecteverythingistosimplyclickyourmousesomewhereintheboxandtypeCtrl+A(holddowntheCtrlkeyandtype‘a’).Thencopythetextyouhaveselectedtotheclipboard.Todothis,useCtrl+CinWindows,oruse“Edit|Copy” fromthebrowser’smenu. Ifyourbrowserdoesnothavean“Edit”menu, tryclickingtherightmousebufon intheboxandselecting“Copy”fromthemenu.Switch back toDreamweaver, and select “Edit | Paste”. The entire content of the script generated by the Feedback FormWizardappears(invariouscolours).Donotafempttobeautifyit,addorchangeanything.Donotevenaddablankline.Thisisnottheuser-visibleportionofyourwebpage.Wewillcometothatlater.Note:ifyoudonotseetheoutputdisplayedinavarietyofcolours,youhaveomifedthevery

252

importantstepmentionedabove.Closethedocumentwithoutsavingitandrestartthissectionagain.Select“File|SaveAs”andtype“feedback.php”intothe“Filename”box.Donotuseanyothername.Donotusecapitallefers.Select“View|Design”.Youshouldseeablankpage.DoNOTtypeanythinghere.Click“File|Close”toclosethefile.vCreatingthefeedbackformwebpageSelect“File|New”,choose“PagefromTemplate”andclick“Create”.Modifythetitlefieldto“ContactUs”.Modifythe“PageTitle”editableregiontoread“ContactUs”aswell.Deleteallthetextinthe“PageDescription”editableregion.Nowswitchtothebrowserwindowthatcontainsthegeneratedcodefromthesitewizard.com’swizard.Thistimelocatethesectionintheoutputgeneratedbythewizardthatreads“HTMLCode”.Clickintheboxbelowthosewords,selecteverythingintheboxandcopyittotheclipboard.SwitchbacktoDreamweaver.Makesureyourcursorisinthe“PageDescription”editableregion.Select“View|Code”fromthemenu.DreamweaverwillswitchtotheHTMLcodeview.Yourtextcursorshouldbejustafter“<p>”andbefore“ <p>”.Usingthearrowkeysonyourkeyboard,movethecursortotheendofthatline(thatis,afterthe“<p> <p>”.Thenselect“Edit|Paste”.Thetextfromthesitewizard’sfeedbackformwizardshouldbeinsertedatthatpoint.Nowuse“View|Design”toswitchbacktotheDesignmode.Youshouldnowbeabletoseethefeedbackforminyourwebpage.Towidentheinputfieldof“Name”,clicksomewhereintheboxnextto“Name”.Inthe“Properties”paneatthebofomofthescreen,changethedefault“Charwidth”of“25”toavaluethatbefersuitsyourpage.Forexample,increasethenumberifyouwanttheboxtobewideranddecreaseitifyouwantittobenarrower.Repeattheprocesswiththe“Emailaddress”fieldsothatboththe“Name”fieldandthe“Emailaddress”fieldshavethesamewidthonthescreen.Similarly,youcanchangethewidthandheightofthe“Comments”box.Clicktheboxundertheword“Comments”.Inthe“Properties”pane,changethe“Charwidth”toamoreappropriatenumberthan“25”ifyouwish.Tochangethedefaultheightofthe“Comments”box,lookforthe“Numlines”boxinthe“Properties”paneandchangeittotheheightyouwanttohave.Youcanexperimentwiththevaluesuntilyouaresatisfiedwiththeappearanceoftheboxesonyourpage.

253

Notethatmodifyingthesizeofthevariousboxesintheformmerelychangestheappearanceoftheboxonthescreen.Thesesizesdonotaffecthowmuchtextyourvisitorcantypeintothefield.Mostbrowserswillsimplyscrollthetextiftheboxis not wide or tallenoughforwhatthevisitorwantstotype.Ifyoulike,youcanalsochangethetextappearingonthebufon.Bydefault,thistextis“SendFeedback”.Tochangeitclickonthebufon.Inthe“Properties”paneatthebofomoftheDreamweaverwindow,changethetextinthe“Value”boxtosomeothertextifyouwish.Click“File|SaveAs”andtype“feedback.html”intothe“Filename”box.Notethatyoushouldnottypeanyothernamehere,sincethenavigationmenusyoucreatedforyoursite.

Creatingthe“ThankYou”and“Error”pagesBynow,youshouldhavenotroublecreatingnewpagesfromyourtemplate,havingdonesoafewtimesalreadywhencreatingtheotherpagesofyoursite.Usethesamemethodthatyouhavebeenusinginthepastandcreatetwonewpages:the“ThankYou”pageandthe“Error”page.The“ThankYou”pageisdisplayedbythefeedbackformscriptafteryourvisitorclicksthe“SendFeedback”bufon.Ittypicallythanksyourvisitorforsendinghiscomments.Themainpurposeofsuchapageistoprovidefeedbacktothevisitorthathiscommentshadbeensuccessfullysubmifed.Youmaywriteanythingyouwishforthispage.Ifyoudon’tknowwhattosay,youmayusethefollowingtext:Thankyouforyourcomments.Ifyourmessagerequiresareply,Itypicallyreplywithin24hoursofthereceiptofthemessage.The“Error”pageisshownwheneverthevisitorsubmitstheformwithoutfillingoneofthefields.Forexample,ifhefailstoenteranemailaddresswhentheformissubmifed,the“Error”pagewillbedisplayedinsteadofthe“ThankYou”page.Yourerrorpageshouldinformthevisitorthatheneedstocompleteallthefieldsintheform,andthatheistoclickthebrowser’s“Back”bufontogobacktotheformtorepairtheerror.Ifyoudon’tknowwhattosay,youmayusethefollowingtext:Therewereerrorsintheformthatyousubmifed.Pleasecompletealltherequestedinformationbeforesubmifingtheform.Clickthe‘Back’bufononyourbrowsertoreturntotheformtofixtheerror.Save your “ThankYou”page with a filename of “thankyou.html” (without the quotes) and your “Error” page with a name of“error.html”(withoutthequotes).ThesearethenamesyousuppliedearliertotheFeedbackFormWizard.Thecustomizedscriptthatthewizardcreatedhasthenameshardcodedintoit.Youshouldthereforenotchangethenamesatthispoint,or254

thescriptwillnotworkproperly.

MakeMoneyFromYourWebsiteIfyou lookatmanywebsites,youwillprobablynotice that therearebanneradvertisementsdisplayedonmostpages. Ifyouareanewcomer to the scene, youmight think that youmusteitherbea companyor that your sitemustbe famousbefore youcangetadvertisers,justasitisthecaseinhardcopypublications.Inreality,anyonewithawebsitecangetadvertisers.Whileitistruethatifyoursiteiswell-known,youmaygetcompaniescontactingyou to offer to advertise on your site, you canget advertising revenueeven if youare just startingout and your site is relativelyunknown.Thewaytodothisistojoinasan“affiliate”ofvariouscompaniesorsites,eitherdirectly,orthroughanaffiliatenetwork.Anaffiliatenetwork issimplyan intermediarywithwhomyoucansignuptogetadvertisers(asopposedtodealingwith individualcompaniesseparately).>>PaymentSchemesBeforejoininganyprogram,youshouldprobablybeawareofthedifferentpaymentschemesavailable.

1. PayPerImpression(CPM)Here,youarepaidaccordingtothenumberoftimestheadvertiser’sbannerisdisplayedonyoursite.Theamountyouearnistypicallycalculatedbasedonthenumberofthousandimpressionsofthebanner(impressions=numberoftimesthebannerisdisplayed), often abbreviatedCPM (costper thousand,with theMbeing theLatinnumeral for thousand).That is, $5CPMmeansthatyougetpaid$5for1,000displaysofthebanner.Ingeneral,theamountpaidisusuallysmall,butitiseasytoearnsinceeverytimeavisitorloadsthepage,youearn.Thisisknownasa“highconversionrate”.Needlesstosay,thismethodwillallowyoutoautomaticallyearnmoreifyoursiteafractsalotofvisitors.

2. PayPerClick(PPC)Whenyouarepaidperclick,youareonlypaidwhenvisitorsclick theadvertiser’sbanneronyoursite.Theamountpaid isusually higher than the pay per impression scheme.Whether you get a high conversion rate here depends on the banner(whetheritafractspeopletoclickit),althoughingeneral,ithasahigherconversionratethanthepaypersalemethod.Ahightrafficsitewillprobablyenjoyahigherclickratethanalowertraffic

255

site,althoughyouwillprobablygetbeferresultsifyourbannersarecarefullyselectedtosuitthetargetaudienceofyoursite.3.PayPerSaleorLead(sometimesreferredtoasCostPerAction,orCPA)

Whileyouwillprobablygetthehighestpaymentrateswiththismethod,ithasthelowestconversionrateofthethreeschemes.Youwillonlyearnifyourvisitorsclickthroughthebannerandeitherpurchaseanitemfromtheadvertiserortakesomeotherprescribedaction(eg,signupforaservice).LikethePayPerClickmethod,yougetmuchbeferresults ifyoucarefullyselectyouradvertiserstosuitthetargetaudienceofyoursite.

Ingeneral,toavoidwastingresourcesinissuingchequesforverysmallamounts,advertiserswillusuallyaccruetheamountowingtoyouuntilitreachesacertainlevel(suchas$25)beforetheypayyou.CustomisetheNavigationMenuBaronYourWebsiteusingDreamweaverMostwebsiteshavesomesortofnavigationmenu.YourNavigationMenuAsitstands,thenavigationmenuinyourleftcolumnhasfourbufonsthatcurrentlydonotappeartoactuallydoanything.Carryoutthefollowingstepstomakethemintoworkingbufons.Select“Linkone”bydraggingyourmouseoverthosewordstohighlightit.Type“Home”(withoutthequotes),overwritingtheexistingwords.

Clicktoputyourtextcursorinthe“Link”fieldofthePropertiespanel,andreplacethehash(“#”)markthatiscurrentlytherewith the web address of your home page. For example, if your website has a URL of “hfp://www.example.com/“,type“hfp://www.example.com/”(withoutthequotes)followedbytheENTER(orRETURNkeyontheMac).Alternatively,youcanalsousearelativeURLWiththisstep,thetopbufonofyourmenunowsays“Home”andisaclickablelinkpointingtoyourhomepage.Incidentally, Iknowthatyoualreadymadethesite logolinktoyourhomepage inthepreviouschapter.However, thehomepageisalsoderigueurthefirstlinkofasite’snavigationmenu,andusershavecometoexpectitthere.Notonlywillkeepingtothisconventionmakeyoursitemoreuser-friendly,sincethelinksarewheretheyare“supposedtobe”,butitwillalsohelpnoviceuserswhodon’tknowthatthesitelogoisactuallyclickable.

256

(Bytheway,whenyouhittheENTERkeyaftertypingyourURL,yourbufonmayhaveanadditionalthinblanklineunderneath.Thisisjustatemporaryvisualglitch.Youdidn’tdoanythingwrong.Justignoreit.Itwillgoawayeventuallywhenyoureplacethetextonthenextbufonorwhenyoudosomethingelse.)

1. TheFeedback(orContact)FormApartfromthetopmostlink,whichshouldalwaysbe“Home”,theotherlinkscanbeinanyorderyouwant.I’llsimplysuggestasequenceinthisarticle,butfeelfreetoputtheminadifferentorder.Select“Linktwo”andreplacethewordswith“Feedback”(withoutthequotes).Notethatunlikethe“Home”linkabove(whichhas a fixed convention across nearly every site on the internet), you don’t actually have to use the word “Feedback”; forinstance,somepeopleprefertosay“Support”,“ContactUs”or“ContactForm”.Modifythe“Link”fieldforthatbufonsothatitsays“feedback.html”(withoutthequotes).Donotuseanyothernameforthislink.Donotusecapital(uppercase)lefers,spacesorchangeitinanyway.Ifyoudo,youwillhaveproblemswhenyoucompletechapter8.Don’tworryifyourbufonsays“Support”,butthelinksays“feedback.html”.Whatthebufonreadsandwhatthelinksaysaretwoseparatethings.Oneisfortheusertoread,andshouldbeinplainEnglishsothattheycanunderstandit.Theotheroneisforthebrowsertouse,andcanbeinthickcomputereseorwhatever.Thereasonitneedstosay“feedback.html”andnotsomeotherthingisbecauseyou’llcreateafilecalled“feedback.html”inchapter8,andifyouuseadifferentnamehere,yourbufonwillnotlinktotherightfile.

2. TheAboutUsPage(Optional)If you are running a business, you probably should have an “About Us” page somewhere on your site, to tell your visitorssomethingaboutyourcompany.(Lookatitasachancetopromoteyourcompany.)Thepageisoptionalforpersonalandhobbywebsites.Forthosenotplanningtocreatean“AboutUs”page,skiptothenextpoint.Select“Linkthree”andreplacethetextwith“AboutUs”,“AboutMe”,“About”orsomesuchthing.Changethelinkfrom“#”to“about.html”(withoutthequotes).

3. TheSiteMapReplace“Linkfour”(or“Linkthree”ifyouhaveskippedtheAboutUspageabove)with“SiteMap”anditscorrespondinglink“#”with“sitemap.html”(withoutthequotes).Whenyoureachthisparagraph,youwilleitherhaveanextraunusedbufon(because

257

youdidn’tcreateanAboutUsbufon),oryouhaverunoutofdummybufonstoreuse(becauseyoudid).Whicheverthe casemaybe,youwillundoubtedlywanttoaddmorebufonstoyourmenutopointtotheotherimportantpages.Someofyouwillalsowanttoknowhowtodeleteunwantedbufonsthatyouhaveaddedbymistake.

HowtoAddaNewBuflontotheNavigationMenu1. Clicksomewhere inthebofommostbufoninyourmenu.Thiswillputtheblinkingtextcursorsomewhereamidstthe

text.Positionthecursorsothatitcomesafterallthewordsinthatbufon,butstillonthesameline.Youcandothisusingthearrowkeysonyourkeyboard.Forexample,ifthelastbufonsays“SiteMap”,movethetextcursorsothatitisjustafterthe“p”in“Map”.

2. HittheENTERkey(ortheRETURNkeyontheMac).Thiswillcreateaverythinanaemic-lookingbufonunderneath,andputsthetextcursorthere.Infact,atthispoint,itwon’tevenlooklikeabufontoyou,butmorelikeaverythinline.

3. Type the words you want the bufon to show. For example, if you are creating a page to list all your products, type“Products”(withoutthequotes).Thebufonwillbecometaller,toaccomodatethewordsyouentered,butitwillstillnotlookliketheothers:thetextwillnotbealignedproperly,andthecolourwillbewrong.

4. Selectthewordsthatyou’vejusttyped.Ifyoufinditdifficulttohighlighteverythingusingthemouse,usethekeyboard:ie,holddowntheshiftkeyonyourkeyboardwhileusingthearrowkeystomovethecursoroverthelefersyouwanttoselect.

5. TypetheURLthatyouwantthebufontopointtointothe“Link”fieldofthePropertiespanel,followedbytheENTERkey.Therewillnotbeany“#”foryoutooverwrite,sojusttypeyouraddressintotheblankfield.Forexample,ifyou’relinkingtotheProductspage,type“products.html”(withoutthequotes).

Thetextappearingonyourbufonshouldnowbecentred,andhavethesamecolourschemeastherestofyourmenu.Repeattheaboveprocedureasmanytimesasyouneed,tillyouhaveallthebufonsyouwant.

HowtoDeleteaBuflonfromtheNavigationMenu1. Selectallthewordsappearingonthebufonthatyouwanttodelete.2. HittheDeletekeyonyourkeyboard.Thiscausesthebufontocollapseintoathinsliver.3. Moveyourmousepointersothatitisdirectlyovertheremnantsofthebufonandclick

258

therightmousebufon.4.Clickthe“Removetag<li>”iteminthemenuthatpopsout.Thebufonshoulddisappearcompletely.

Warning:ifyoudon’tsee“Removetag<li>”inthemenu,butseesomethingelse,like“Removetag<ul>”,donotclickit.HittheESCkeyinsteadtogetridofthemenu,andtryagain.Clicking“Removetag”withwildabandon,withoutmakingsurethatit’sreally“Removetag<li>”andnotsomethingelse,isgenerallyabadthing.Itmayresultinyouraccidentallydeletingtheformafingfromthemenuoreventheentiremenuitself.

Ifyoumakeamistakethatyoudon’tknowhowtorecoverfrom,tryusingthe“Edit|Undo”menuitem.Thatis,click“Edit”fromthemenubar,followedby“Undo[whatever]”fromthemenuthatappears,where“[whatever]”istheoperationthatyoulastperformed.(The“Undo”menuitemsaysdifferentthingsdependingonwhatyoudidbeforeinvokingthemenu,butitwillalwaysbeginwiththeword“Undo”.)Ontheotherhand,ifyouhavemadesomanyerrorsthateventhe“Undo”bufonisunabletorepair,youmaywanttoabandonalltheworkyoudidinthecurrentsessionandreloadyourfilefromyourlastsave.Todothis,click“File|Close”andwhenDreamweaverissuesadialogboxsaying“Savechangestoindex.html?”,click“No”.Thenreopenthefileagainbydoubleclickingthe“index.html”lineintheFilespanel.Bewarnedthatthiswillcauseyoutoloseeverythingyouhavedonesinceyourlastsave,soonlydoitasalastresort.Anddon’tdoitatallifyouhavesavedyourfileafteryoumadeyourmistake,sinceyou’llonlyloadbackthesameerror-filledpage,thistimewithnoUndofacility.HowtoCustomisetheColoursofYourNavigationMenuIfyouhavealteredyourbackgroundcoloursinchapter4,andhavebeenwaitingwithbatedbreadthtomatchyourmenucolourstotheschemefoundontherestofthepage,yourmomenthasarrived.Unliketherestofthepage,however,thebufonsonthemenuactuallyhavedifferentcoloursdependingonwhetheramousepointerishoveringover it.(Youwill onlybeable to see thebufon’sdefault colour inDreamweaver; to view the colourwhenamousepointerisoverit,youwillneedtouseawebbrower.)1.Clickyourmousepointersomewhereinanyoneofyournavigationmenubufons(itdoesn’tmaferwhich).Thisputsyourtextcursorinthemiddleoftheword(orwords)ononeofthebufons.

259

2. LookfortheRulessectionintheCSSStylespanelontherightsideofDreamweaver.Youshouldseethese2lines.Thelinesaying“ul.nava,ul.nava:visited<a>”containstherulesforthedefaultbufon.By“default”,Imeanthebufonasitappearsonthepagewhenthemouseisnotpointingatit.Another line saying “ul.nav a:hover, ul.nav… <a>” holds the rules for the bufon when the mouse pointer ishovering over it. Notice that the line is almost the same as the other one, except that “a:hover” occurssomewherewithinit.

DoubleclickingoneortheotheroftheselineswillbringuptheCSSRuleDefinitiondialogboxwiththerelevantrulesthatyoucanmodify.Forexample,ifyouwanttochangethedefaultcolours,doubleclickthefirstlinedescribedearlier.Dothesamewiththe“a:hover”linetocustomizethebufoncolourwhenthemouseisoverit.

3. TheCSSRuleDefinitiondialogbox,whichyou’llprobablyfindveryfamiliarsinceyouhaverepeatedlyencountereditintheearlierchapters,willappear.Yes,itisthesamedialogboxanditbehavesexactlyasithasinthepreviouschapterswithnonewunpleasantsurprises.

Clickthe“Background”lineinthelistboxonthelefttobringuptheoptionspertainingtocolours.4. Changethecolourofyourbufontoyoursatisfactionusingthecolourpickerforthe“Background-color”field.5. Clickthe“OK”bufonfortheCSSRuleDefinitiondialogboxwhenyou’redone.

260

KnowledgeCheckPoints

DreamweaverMultipleChoiceQuestionsandAnswers1. HowmanySitescanyoudefinewithonecopyofDreamweaverinstalledonyourcomputer?

A. unlimited B. 2C. 10 D. 999Ans:A

2. Whatdoyouaddtoatemplateinordertocontrolwherepagecontentgoes?A. TextFramesB.HTMLControllers

C.EditableRegionsD.PageContentControllersAns:C

3. WhichofthefollowingisNOTaStyle?A. LinkedB.Embedded

C.InlineD.OrthogonalAns:D

4. WhichofthefollowingisNOTaHotspottool?A. OrthogonalHotspotToolB.RectangularHotspotTool

C.OvalHotspotToolD.PolygonHotspotToolAns:A

5. Whichofthefollowingisnotsupportedbyolderbrowsers?A. CSSB.Layers

C.FramesD.AlloftheaboveAns:D

6. WhichofthefollowingistheHTMLtagtostartaHeadingLevel3?A.<H3>B.</H3>C.<#H3>D.<H3/>Ans:A

7. Whichtypeofstyleshouldyouuseifyouwanttousetheformatsonmultiplepages?A. LinkedB.Embedded

C.InlineD.OrthogonalAns:A

261

8. Whenyoucreatea“recipient”hiddenfieldforaform,whichofthefollowingistheONLYcorrectwaytotypetheword“recipient?”:

A. RecipientB.<recipient></recipient>C.recipientD.RECIPIENTAns:C

9. Whichfilecontrolshowyourframeswillappear?A. FramesetB.MasterDocument

C.TemplateD.TimelineAns:A

10. Whatcan’tlayersdoifyouwanttoconvertthemtotables?A. BecloseB.ContainaColor

C.BelargerthanthetargettableD.OverlapAns:D

11. ThetricktogefingaballtobouncearoundaWebpageisto:A. AddAnimationBouncelayers

B. AddkeyframestothetimelineC. AddBounceparameterstotheObjectproperties

D. Dreamweaverdoesnotsupportanimation…useFlashinsteadAns:B

12. Bydefault,what’stheFpsshownonthetimeline?A.15B.1C.20D.huh?Ans:A

13. Whenyouswapimages,it’sbestif:A. Theimagesarethesame“Mime”type

B. TheimagesarethesamecolorC. Theimagesarethesamesize

D. Youusethe“Constrain”toolAns:C

14. Whichofthefollowingisfalse?A. TheSiteMapcanbesavedasanimageB. YoucanFTPfilesusingDreamweaverC. YoucancreateformsinDreamweaver

262

D.NoneoftheaboveAns:D

15. WhichofthefollowingisNOTaPageProperty?A. TitleB.TracingImage

C.MarginWidthD.TimelineAns:D

16. DreamweaverusersworkintheDocumentWindowusingoneofhowmanyviews?A. 3B.5

C.2Ans:A

17. Thegeneraldefinitionofa(n)isasetoflinkeddocumentswithsharedafributes,suchasrelatedtopics,asimilardesign,orasharedpurpose.

A. indexB.websiteC.InternetD.HomepageAns:B

18. providesthelargesttext.A. H6B.24

C.H1D.BoldAns:C

19. Dreamweaver’sfeatureallowsuserstoselectcolorsandmakeperfectcolormatches.A. ColorCubeB.Palafes

C.HTMLviewD.EyedropperAns:D

20. TheWandHboxesinthePropertyinspectorindicatethewidthandheightofanimage,inA. inchesB.pixels

C.pointsD.millimetersAns:B

21. Asubfolderisafolderinsideanotherfolder.A. TrueB.False

Ans:A263

22. AWebsite’shomepageisnormallynamedhome.htmorhome.htmlA. TrueB.False

Ans:B23. viewisahand-codingenvironmentforwritingandeditingcode.

A. DesignB.SplitC.CodeAns:C

24. imagesareusedtoaddtextureandinterestingcolortoaWebpage.A. ClipArtB.Animated

C.BackgroundD.CroppedAns:C

25. Inthemode,youcreatetablesbydrawingthem.A. LayoutB.Expanded

C.StandardAns:A

26. Aisaverticalcollectionofcellsinatable.A. RowB.Column

C.TableIDAns:B

27. Aisthecontainer/intersectionwherearowandcolumnmeetinatable.A. tagB.tableID

C.linkD.cellAns:D

28. Acanconnectuserstoaplaceonthesamewebpageortoplaceonanothersite.A. rootfolderB.typeface

C.texteditorD.hyperlinkAns:D

29. Inordertodefineasite,usersmustcreateabothaand.A. domainnameIPaddressB.loginpassword

C.sitenamehomepageD.sitenamerootfolderAns:D264

30. WhichofthefollowingisNOTavalidreasonfordefiningalocalsiteinDreamweaver?A. ToenableDreamweavertocreaterelativelinksbetweendocuments

B. ToenableDreamweavertodisplayallyoursitesfilesinthe‘FilesPanel’C. ToprovidedetailsofyourWebserversothatyoucanuploadyousite

D. ToallowDreamweavertoconductlinkcheckingbetweendocumentsAns:C

31. Toviewandchangecurrentformafingforselectedobjectsortext,youwoulduse:A. InsertbarB.PropertyInspector

C.FilePanelAns:B

32. Youcaninsertdatesintoyourwebpagethatwillautomaticallybeupdatedwheneveryousavethepage.A. TrueB.False

Ans:A33. Toinsertaspecialcharacter,whatcategoryontheInsertbardoyouuse?

A. CommonB.HTMLC.TextAns:C

34. Whichpanelcanbeusedtomanageandcreatenewsites?A. FilesB.Application

C.TagInspectorAns:A

35. Whatshouldthehomepageofyoursitebenamed?A. home.htmlB.Anythingyouwanttonameit

C.index.htmlAns:C

36. Cellpaddingdeterminesthenumberofpixelsbetweenadjacentcells.A. TrueB.False

Ans:B265

37. WhichgraphicformatcanyouNotinsertintoyourwebpage?A. bmpB.gif

C.pngAns:A

38. Whichviewmustyoubeintodrawoutatablevisually.A. StandardB.Layout

C.TableAns:B

39. FormafingusingCSSstylesallowseachindividual’sbrowsertocontrolthewayyourpageisdisplayed.A. TrueB.False

Ans:B40. Whatistheproperwaytomanuallytypeanemaillink?

A. email:[email protected]:[email protected]:[email protected]:B

41. ThelatestversionofDreamweaveris:A. AdobeDreamweaverCS5.5B.AdobeDreamweaverCS5

C.AdobeDreamweaverCS4D.MacromediaDreamweaver8Ans:A

42. Dreamweaverissoldbywhatsoftwarecompany:A. Adobe

B. MacromediaC. Microsoft

D. Nocompany,theprogramsimplyappearedonedayontheweb.Ans:A

43. YoucanuseDreamweavertocreate:A. HTML,XML,andCSSfiles

B. PHP,Java,andASP.NETC. Thenewspace-timecontinuumformatSTCML

D. alloftheabove,exceptthespace-timecontinuumthing…Ans:D266

44. HTMLtagsaresurroundedby:A. brackets<…>

B. parenthesise(…)C. quotemarks”…”

D. Fire-breathingdragonswhotrytokeepyouawayfromtagsAns:A

45. YoucansaveimagesfortheWebintheseformats:A. JPG,GIF,PNGB.PSD,Tiff

C.FlickrD.ftp,fla,jspAns:A

46. Thefirstpageofawebsiteshouldmostcommonlybenamed:A. home.html

B. index.htmlordefault.htmdependingontheserverC. MySite.html

D. Somethingcool,sotheothersiteswillnotmakefunofitAns:B

47. The</h1>isanopeningtag.A. True

B. FalseC. DoIhavetolearnHTMLtags?

D. Closeyourdarntags!Wereyouborninabarn?Ans:B

48. Bonusquestion:WhatistherefrainofthepophitsingleDreamweaverbyGaryWrightA. Tomorrow,tomorrow,there’salwaystomorrow…

B. Younevercountyourmoney…C. Yesterday,allmytroublesseemedsofaraway…

D. Dreamweaver,IbelieveyoucangetmethroughthenightAns:D

49. WhatoptionintheTargetpop-upmenuischosentoopenalinkeddocumentinanewbrowserwindowwhilekeepingthecurrentwindowavailable?

A. topB.selfC.blankD.parentAns:C

267

50. Whatdoestheasteriskafterthefilenameinthedocumenttitlebarsignify?A. documentisuntitled

B. pageisnotlocatedwithinthesiteC. theextensiontothefilenamehasnotbeenspecified

D. unsavedadditionsordeletionsweremadetothepageAns:D

51. UsingDreamweaver,itispossibletoconvertlayerstotablesandtablestolayers.A. TrueB. FalseAns:A

52. Whatdescribesthecorrectwaytocreateapagelayoutthatalwaysfillsthebrowserwindow,nomaferwhatsizewindowtheviewerhasset?

A. Addaspacerimagetothetable.B. CreatethetablecellwithapercentagewidthintheHTML.C. UsetheDreamweaverAutostretchoptiontosetthetablewidthtoresizeautomatically.D. Createafixedwidthtablethatcorrespondswiththespecificnumericwidthoftheviewer’sbrowser.

Ans:C53. SelectingheaderinthePropertyinspectorforagiventable’scellmakesthatcontent(Choosetwo)A. boldandcenteredinmostbrowsers

B. justifiedinallbrowsersC. a<th>elementD. boldanditalicizedinmostbrowsers

E. left-justifiedinallbrowsers\Ans:C

54. Atemplatecanbemodifiedafterdocumentshavebeencreatedbasedonthetemplate.A. TrueB.False

Ans:A268

55. WhataccuratelydescribesthewaytemplatesworkinDreamweaver?IfatemplatefileisopenedyoucaneditA. nothinginthefile,unlessnopageshavebeencreatedfromthetemplate.

B. everythinginthefile.C. anyeditableregion.

D. anythinginthefile,butonlyinCodeView.Ans:B

56. Whathappenswhencontentin<DIV>tagsisviewedwith3.0versionsofNetscape?A. Nocontentisdisplayedatall.B. Thecontentlooksthesameasitdoesinanyotherbrowser.C. Thecontentisonlydisplayedifthevisibleafributeissettotrue.D. Thecontentappearsinthesamelocationaswherethe<DIV>tagsappearinthecode.

Ans:D57. ThebehaviorsthatcomewithDreamweaverwerewrifentoworkinallbrowsers.

A. TrueB.FalseAns:B

58. Whatpanelisusedtochangetheeventthattriggersanimageswap?A. CSSPanelB.AssetsPanel

C.FramesPanelD.ObjectsPanelE.BehaviorsPanelAns:E

59. WhatisonewayyouchangethecoloroftextinDreamweaver4.0?A. Highlightthetextandthenselect:Edit>Font>ColorfromthemenuB. HighlightthetextandselectanewcolorwiththeColorPickerinthePropertiespanelC. YouareunabletochangethetextcolorinDreamweaver,itcanonlybechangedintheHTML

D. HighlightthetextandchangethecolorintheObjectspanelAns:B

60. Bulletsinunorderedlistscanonlybecircles.A. TrueB.False

Ans:B

269

SkillCheckPoint

1. WriteHTMLCodeforcreatingawebsiteofyourorganization.a)Thewebsitesiteshouldcontainfivepagesi.e.Home,Aboutus,Profile,Details,Contactus.b)HomepageshouldbeMainpage(firstpage)

2. CreateEnquiryformandusetheirvalidationforma)Lastname,Contactus,andemailiscompulsoryfield.b)Informationshouldbesubmit.

270

ChapterSeven

ITDC-412WebScripting-JavaScript

•JavaScriptReview•Functions–userdefined•StringObject•MathObject•ArrayObject•Events•CaseStudies

271

JAVASCRIPTREVIEWJavaScriptisaprogramminglanguageusedtomakewebpagesinteractive.JavaScriptwasdesignedprimarilyforaddinginteractivitytoWebpagesandcreatingWebapplications.JavaScriptisusedforclientsidescripting.Client-sideJavaScriptprograms,orscripts,canbeembeddeddirectlyinHTMLsourceofWebpages.JavaScriptiswidelysupportedbymostofthebrewersavailabletoday.

•JavaScriptsinHTMLmustbeinsertedbetween<script>and</script>tags.•JavaScriptscanbeputinthe<body>andinthe<head>sectionofanHTMLpage.

JavaScriptisalightweight,interpretedprogramminglanguagewithobject-orientedcapabilitiesthatallowsyoutobuildinteractivityintootherwisestaticHTMLpages.

Client-sideJavaScriptClient-sideJavaScriptisthemostcommonformofthelanguage.ThescriptshouldbeincludedinHTMLdocumentforthecodetobeinterpretedbythebrowser.ItmeansthatawebpageneednolongerbestaticHTML,butcanincludeprogramsthatinteractwiththeuser,controlthebrowser,anddynamicallycreateHTMLcontent.

TheJavaScriptcodeisexecutedwhentheusersubmitstheform,andonlyifalltheentriesarevalidtheywouldbesubmifedtotheWebServer.JavaScriptcanbeusedtotrapuser-initiatedeventssuchasbufonclicks,linknavigation,andotheractionsthattheuserexplicitlyorimplicitlyinitiates.

AdvantagesofJavaScript•Lessserverinteraction:Youcanvalidateuserinputbeforesendingthepageofftotheserver.Thissavesservertraffic,whichmeanslessloadonyourserver.•Immediatefeedbacktothevisitors:Theydon’thavetowaitforapagereloadtoseeiftheyhaveforgofentoentersomething.•Increasedinteractivity:Youcancreateinterfacesthatreactwhentheuserhoversoverthemwithamouseoractivatesthemviathekeyboard.•Richerinterfaces:YoucanuseJavaScripttoincludesuchitemsasdrag-and-dropcomponentsandsliderstogiveaRichInterfacetoyoursitevisitors.

LimitationswithJavaScript•Client-sideJavaScriptdoesnotallowthereadingorwritingoffiles.Thishasbeenkeptforsecurityreason.

272

•JavaScriptcannotbeusedforNetworkingapplicationsbecausethereisnosuchsupportavailable.•JavaScriptdoesn’thaveanymultithreadingormultiprocesscapabilities.JAVASCRIPTFUNCTIONSA function isablockofcode thatwillbeexecutedwhensomeonecalls it.Functionscanbeclassified in twocategories:Library functionsandUserdefined functions.Thedifferencebetweenthistwofunctionsis,Libraryfunctionsarealreadybuilt inandweneednot towrite itscode,whereasaUserdefinedfunctionhastobewrifentoget itexecutedduringtheoutput.

UserDefinedFunctionsTheuser-definedfunctionsaredefinedbyauserasperitsownrequirement.Theuser-definedfunctionsarepartoftheprogram.Inuser-definedfunctionsthenameoffunctionisdecidedbyuserthatcanbechangeatanytime,whereasinlibraryfunctionnameoffunctioncan’tbechanged.

Example:<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionmyFunction()

{

alert(“HelloWorld!”);

}

</script></head><body><bufononclick=“myFunction()”>Tryit</bufon></body></html>Syntaxofuser-definedfunctionAfunctioniswrifenasacodeblockinsidecurly{}braces,proceededbythefunctionkeyword:

functionfunction-name()

{

273

somecodetobeexecuted

}

Thecodeinsidethefunctionwillbeexecutedwhensomeonecallsthefunction.Thefunctioncanbecalleddirectlywhenaneventoccurs(likewhenauserclicksabufon),anditcanbecalledfromanywherebyJavaScriptcode.

JavaScriptiscasesensitive.Thefunctionkeywordmustbewrifeninlowercaselefers,andthefunctionmustbecalledwiththesamecapitalsasusedinthefunctionname.

CallingaFunctionwithArgumentsWhenyoucallafunction,youcanpassalongsomevaluestoit,thesevaluesarecalledargumentsorparameters.Theseargumentscanbeusedinsidethefunction.Youcansendasmanyargumentsasyoulike,separatedbycommas(,)myFunction(argument1,argument2)

Declaretheargument,asvariables,whenyoudeclarethefunction:functionmyFunction(var1,var2)

{

somecode

}

Thevariablesandtheargumentsmustbeintheexpectedorder.Thefirstvariableisgiventhevalueofthefirstpassedargumentetc.

Example:<bufononclick=“msg(‘SCERT’,‘Delhi’)”>Tryit</bufon><scripttype=“text/javascript”>functionmsg(name,place)

{

alert(“WelcomeTo”+name+“”+place);

}

</script>

274

<!DOCTYPEhtml><html><body><p>Clickthebufontocallafunctionwitharguments</p><bufononclick=“msg(‘SCERT’,‘Delhi’)”>Tryit</bufon><scripttype=“text/javascript”>functionmsg(name,place)

{

alert(“WelcomeTo”+name+””+place);

}

</script>

</body></html>\Thefunctionabovewillalert“WelcomeToSCERTDelhi”whenthebufonisclicked.FunctionswithaReturnValueSometimesyouwantyourfunctiontoreturnavaluebacktowherethecallwasmade.Thisispossiblebyusingthereturnstatement.Whenusingthereturnstatement,thefunctionwillstopexecuting,andreturnthespecifiedvalue.

Syntax:functionmyFunction()

{

varx=5;returnx;

}

Thefunctionabovewillreturnthevalue5.Thefunction-callwillbereplacedwiththereturnvalue:varmyVar=myFunction();ThevariablemyVarholdsthevalue5,whichiswhatthe

functionmyFunction()returns.Youcanalsousethereturnvaluewithoutstoringitasavariable:275

GlobalVariablesVariablesdeclaredoutsideafunction,becomeglobal,andallscriptsandfunctionsonthewebpagecanaccess it. Ifyouassignavaluetovariablethathasnotyetbeendeclared,thevariablewillautomaticallybedeclaredasaglobalvariable.Thisstatement:carname=“Volvo”;willdeclarethevariablecarnameasaglobalvariable,evenifitisexecutedinsideafunction.TheLifetimeofJavaScriptVariablesThelifetimeJavaScriptvariablestartswhentheyaredeclared.Localvariablesaredeletedwhenthefunctioniscompleted.Globalvariablesaredeletedwhenyouclosethepage.

JAVASCRIPTOBJECTS

EverythinginJavaScriptisanobject:aString,aNumber,anArray,aDate.InJavaScript,anobjectisdata,withpropertiesandmethods.

•Propertiesarevaluesassociatedwithanobject.•Methodsareactionsthatcanbeperformedonobjects.WhenyoudeclareaJavaScriptvariablelikethis:vartxt=“Hello”;YouactuallycreateaJavaScriptStringobject.TheStringobjecthasabuilt-inpropertycalledlength.Forthestringabove,lengthhasthevalue5.TheStringobjectsalsohaveseveralbuilt-inmethods.

Example:person=newObject();person.firstname=“John”;person.lastname=“Write”;person.age=50;person.eyecolor=“blue”;Thisexamplecreatesanobjectcalled“person”,andaddsfourpropertiestoit.

277

AccessingObjectPropertiesThesyntaxforaccessingthepropertyofanobjectis:objectName.propertyNameThisexampleusesthelengthpropertyoftheStringobjecttofindthelengthofastring:

varmessage=“HelloWorld!”;varx=message.length;

Thevalueofx,afterexecutionofthecodeabovewillbe:12AccessingObjectMethodsThesyntaxforcallingamethodofanobjectis:objectName.methodName()ThisexampleusesthetoUpperCase()methodoftheStringobject,toconvertatexttouppercase:

varmessage=“Helloworld!”;varx=message.toUpperCase();

Thevalueofx,afterexecutionofthecodeabovewillbe:HELLOWORLD!CreatingJavaScriptObjectsWithJavaScriptyoucandefineandcreateyourownobjects.Thereare2differentwaystocreateanewobject:

1. Defineandcreateadirectinstanceofanobject.2. Useafunctiontodefineanobject,thencreatenewobjectinstances.

CreatingaDirectInstanceThisexamplecreatesanewinstanceofanobject,andaddsfourpropertiestoit.Example:

person=newObject();278

person.firstname=“John”;person.lastname=“Write”;person.age=50;person.eyecolor=“blue”;Alternativesyntax(usingobjectliterals).person={firstname:“John”,lastname:“Write”,age:50,eyecolor:“blue”};UsinganObjectConstructorThisexampleusesafunctiontoconstructtheobject

Example:functionperson(firstname,lastname,age,eyecolor)

{

this.firstname=firstname;this.lastname=lastname;this.age=age;this.eyecolor=eyecolor;

}

Thereasonforallthe“this”stuffisthatyou’regoingtohavemorethanonepersonatatime(whichpersonyou’redealingwithmustbeclear).That’swhat“this”is:theinstanceoftheobjectathand.

CreatingJavaScriptObjectInstances

Onceyouhaveaobjectconstructor,youcancreatenewinstancesoftheobject,likethis:varmyFather=newperson(“John”,“Write”,50,“blue”);varmyMother=new

person(“Sally”,“Rally”,48,“green”);

AddingPropertiestoJavaScriptObjectsYou can add new properties to an existing object by simply giving it a value. Assume that the personObject already exists - you can give it new properties named firstname,

lastname,age,andeyecolorasfollows:person.firstname=“John”;person.lastname=“Write”;279

person.age=30;person.eyecolor=“blue”;x=person.firstname;Thevalueofx,afterexecutionofthecodeabovewillbe:JohnAddingMethodstoJavaScriptObjectsMethodsarejustfunctionsafachedtoobjects.Definingmethodstoanobjectisdoneinsidetheconstructorfunction:functionperson(firstname,lastname,age,eyecolor)

{

this.firstname=firstname;this.lastname=lastname;this.age=age;this.eyecolor=eyecolor;

this.changeName=changeName;functionchangeName(name)

{

this.lastname=name;

}

}

ThechangeName()functionassignsthevalueofnametotheperson’slastnameproperty.myMother.changeName(“Write”);JavaScriptknowswhichpersonyouaretalkingaboutbysubstitutingthiswithmyMother.

JAVASCRIPTNUMBEROBJECT

TheNumberobjectisanobjectwrapperforprimitivenumericvalues.TheNumberobjectrepresentsnumericaldate,eitherintegersorfloating-pointnumbers.Ingeneral,youdonotneedtoworryaboutNumberobjectsbecausethebrowserautomaticallyconvertsnumber280

literalstoinstancesofthenumberclass.Syntaxforcreatinganumberobject:

varval=newNumber(number);Iftheargumentcannotbeconvertedintoanumber,itreturnsNaN(Not-a-Number).NumberProperties

Property DescriptionMAX_VALUE ThelargestpossiblevalueanumberinJavaScriptcan

have1.7976931348623157E+308MIN_VALUE ThesmallestpossiblevalueanumberinJavaScript

canhave5E-324

NaN Equaltoavaluethatisnotanumber.

NEGATIVE_INFINITY AvaluethatislessthanMIN_VALUE.POSITIVE_INFINITY AvaluethatisgreaterthanMAX_VALUEprototype A static property of the Number object. Use the

prototype property to assign new properties andmethods to the Number object in the currentdocument

NumberMethodsTheNumberobjectcontainsonlythedefaultmethodsthatarepartofeveryobject’sdefinition.

Method Descriptionconstructor() Returnsthefunctionthatcreatedthisobject’sinstance.By

defaultthisistheNumberobject.toExponential() Forcesanumbertodisplayinexponentialnotation,evenifthe

numberisintherangeinwhichJavaScriptnormallyusesstandardnotation.

toFixed() Formatsanumberwithaspecificnumberofdigitstotherightofthedecimal.

toLocaleString() Returnsastringvalueversionofthecurrentnumberinaformatthatmayvaryaccordingtoabrowser’slocalesefings.

toPrecision() Defineshowmanytotaldigits(includingdigitstotheleftandrightofthedecimal)todisplayofanumber.

toString() Returnsthestringrepresentationofthenumber’svalue.valueOf() Returnsthenumber’svalue.

281

JAVASCRIPTSTRINGOBJECT

TheStringobjectisusedtomanipulateastoredpieceoftext.StringobjectsarecreatedwithnewString().

Syntaxvartxt=newString(“string”);vartxt=“string”;

StringObjectProperties:

Property Descriptionconstructor ReturnsthefunctionthatcreatedtheStringobject’sprototypelength Returnsthelengthofastringprototype AllowsyoutoaddpropertiesandmethodstoanobjectExample:<!DOCTYPEhtml><html><head><b>ExampleforStringProperties</b><scripttype=“text/javascript”>functionbook(title,author){this.title=title;this.author=author;

}

</script></head><body><scripttype=“text/javascript”>varstr=newString(“HelloWorld”);document.write(“<br>”+“str.constructoris:”+str.constructor+“<br>”);document.write(“str.lengthis:”+str.length+“<br>”);varmyBook=newbook(“ConversationswithMyself”,“NelsonMandela”);book.prototype.price=null;myBook.price=28;document.write(“Booktitleis:”+myBook.title+“<br>”);

282

document.write(“Bookauthoris:”+myBook.author+“<br>”);document.write(“Bookpriceis:$”+myBook.price+“<br>”);</script></body></html>

StringObjectMethods:

Method DescriptioncharAt() ReturnsthecharacteratthespecifiedindexcharCodeAt() ReturnstheUnicodeofthecharacteratthespecifiedindexconcat() Joinstwoormorestrings,andreturnsacopyofthejoined

stringsfromCharCode() ConvertsUnicodevaluestocharacters

indexOf() Returnsthepositionofthefirstfoundoccurrenceofaspecifiedvalueinastring

lastIndexOf() Returnsthepositionofthelastfoundoccurrenceofaspecifiedvalueinastring

match() Searchesforamatchbetweenaregularexpressionandastring,andreturnsthematches

replace() Searchesforamatchbetweenasubstring(orregularexpression)andastring,andreplacesthematchedsubstringwithanewsubstring

search() Searchesforamatchbetweenaregularexpressionandastring,andreturnsthepositionofthematch

slice() Extractsapartofastringandreturnsanewstringsplit() Splitsastringintoanarrayofsubstrings

substr() Extractsthecharactersfromastring,beginningataspecifiedstartposition,andthroughthespecifiednumberofcharacter

substring() Extractsthecharactersfromastring,betweentwospecifiedindices

toLowerCase() ConvertsastringtolowercaseleferstoUpperCase() ConvertsastringtouppercaselefersvalueOf() ReturnstheprimitivevalueofaStringobject

283

Example:<!DOCTYPEhtml><html><head><b>ExampleforStringProperties</b></head><body><scripttype=“text/javascript”>varstr1=newString(“Hello”);varstr2=newString(“World”);document.write(“<br>”+“String1:”+str1);document.write(“<br>”+“String2:”+str2);document.write(“<br>”+“ConcatenatedString1&String2:”+str1.concat(str2));document.write(“<br>”+“String1toUpperCase:”+str1.toUpperCase());document.write(“<br>”+“String2toLowerCase:”+str2.toLowerCase());</script></body></html>JAVASCRIPTMATHOBJECTTheMathobjectallowsyoutoperformmathematicaltasks.Mathisnotaconstructor.Allproperties/methodsofMathcanbecalledbyusingMathasanobject,withoutcreatingit.

Syntax:varx=Math.PI;//ReturnsPIvary=Math.sqrt(16);//Returnsthesquarerootof16

MathObjectProperties:

Property DescriptionE ReturnsEuler’snumber(approx.2.718)LN2 Returnsthenaturallogarithmof2(approx.0.693)LN10 Returnsthenaturallogarithmof10(approx.2.302)LOG2E Returnsthebase-2logarithmofE(approx.1.442)

LOG10E Returnsthebase-10logarithmofE(approx.0.434)

PI ReturnsPI(approx.3.14)SQRT1_2 Returnsthesquarerootof1/2(approx.0.707)SQRT2 Returnsthesquarerootof2(approx.1.414)

284

Example:<!DOCTYPEhtml><html><head><b>JavaScriptMathPropertyExample:</b></head><body><scripttype=“text/javascript”>varproperty_value=Math.SQRT1_2document.write(“<br>”+“PropertyValueofSQRT1_2Propertyis:”+property_value);document.write(“<br>”+“PropertyValueofSQRT2Propertyis:”+Math.SQRT2);document.write(“<br>”+“PropertyValueofPIPropertyis:”+Math.PI);</script></body></html>MathObjectProperties:

Method Descriptionabs(x) Returnstheabsolutevalueofxacos(x) Returnsthearccosineofx,inradiansasin(x) Returnsthearcsineofx,inradiansatan(x) Returnsthearctangentofxasanumericvaluebetween-PI/2

andPI/2radians

atan2(y,x) Returnsthearctangentofthequotientofitsargumentsceil(x) Returnsx,roundedupwardstothenearestintegercos(x) Returnsthecosineofx(xisinradians)exp(x) ReturnsthevalueofExfloor(x) Returnsx,roundeddownwardstothenearestintegerlog(x) Returnsthenaturallogarithm(baseE)ofxmax(x,y,z,…,n) Returnsthenumberwiththehighestvaluemin(x,y,z,…,n) Returnsthenumberwiththelowestvaluepow(x,y) Returnsthevalueofxtothepowerofyrandom() Returnsarandomnumberbetween0and1round(x) Roundsxtothenearestinteger

sin(x) Returnsthesineofx(xisinradians)

sqrt(x) Returnsthesquarerootofx

tan(x) Returnsthetangentofanangle285

Example:<!DOCTYPEhtml><html><head><b>JavaScriptMathObjectMethodExample:</b></head><body><scripttype=“text/javascript”>varvalue1=Math.sin(30);varvalue2=Math.cos(30);varvalue3=Math.tan(30);varvalue4=Math.pow(5,2);varvalue5=Math.sqrt(25);document.write(“<br>”+“TestValueofsin(30):”+value1);document.write(“<br>”+“TestValueofcos(30):”+value2);document.write(“<br>”+“TestValueoftan(30):”+value3);document.write(“<br>”+“TestValueofpower(5,2):”+value4);document.write(“<br>”+“TestValueofsqrt(25):”+value5);</script></body></html>JAVASCRIPTARRAYOBJECTTheArrayobjectisusedtostoremultiplevaluesinasinglevariable.Anarrayisaspecialvariable,whichcanholdmorethanonevalueatatime.Forexampleifyouhavealistofcarnames,storingthecarsinsinglevariablescouldlooklikethis:varcar1=“Toyota”;varcar2=“Volvo”;varcar3=“BMW”;

Anarraycanholdmanyvaluesunderasinglename,andyoucanaccessthevaluesbyreferringtoanindexnumber.

CreatinganArrayAnarraycanbecreatedinthreeways.ThefollowingcodecreatesanArrayobjectcalledmyCars:

286

1. Regular:varmyCars=newArray();myCars[0]=“Saab”;myCars[1]=“Volvo”;myCars[2]=“BMW”;

2. Condensed:varmyCars=newArray(“Saab”,“Volvo”,“BMW”);

3. Literal:varmyCars=[“Saab”,“Volvo”,“BMW”];

AccessinganArrayYourefertoanelementinanarraybyreferringtotheindexnumber.ThisstatementaccessthevalueofthefirstelementinmyCars:varname=myCars[0];ThisstatementmodifiesthefirstelementinmyCars:myCars[0]=“Opel”;

ArrayObjectProperties:

Property Descriptionconstructor ReturnsthefunctionthatcreatedtheArrayobject’sprototypelength Setsorreturnsthenumberofelementsinanarrayprototype AllowsyoutoaddpropertiesandmethodstoanArrayobject

287

Example:<!DOCTYPEhtml><html><head><b>JavaScriptArrayconstructorPropertyExample</b></head><body><scripttype=“text/javascript”>vararr=newArray(10,20,30);document.write(“arr.constructoris:”+arr.constructor);document.write(“arr.lengthis:”+arr.length);</script></body></html>ArrayObjectMethods

Method Descriptionconcat() Joinstwoormorearrays,andreturnsacopyofthejoined

arraysindexOf() Searchthearrayforanelementandreturnsitspositionjoin() JoinsallelementsofanarrayintoastringlastIndexOf() Searchthearrayforanelement,startingattheend,and

returnsitspositionpop() Removesthelastelementofanarray,andreturnsthat

elementpush() Addsnewelementstotheendofanarray,andreturnsthe

newlengthreverse() Reversestheorderoftheelementsinanarrayshift() Removesthefirstelementofanarray,andreturnsthat

elementslice() Selectsapartofanarray,andreturnsthenewarraysort() Sortstheelementsofanarraysplice() Adds/Removeselementsfromanarray

toString() Convertsanarraytoastring,andreturnstheresult

unshift() Addsnewelementstothebeginningofanarray,andreturnsthenewlength

valueOf() Returnstheprimitivevalueofanarray

288

Example:<!DOCTYPEhtml><html><head><b>JavaScriptArrayMethodExample</b></head><body><scripttype=“text/javascript”>vararr=newArray(“Orange”,“Mango”,“Banana”,“Apple”,“Pineapple”);document.write(“<br>”+“Originalarrayis:“+arr);document.write(“<br>”+“Sortedarrayis:”+arr.sort());document.write(“<br>”+“Reversedarrayis:“+arr.reverse());</script></body></html>JAVASCRIPTDATEOBJECTTheDateobjectisusedtoworkwithdatesandtimes.DateobjectsarecreatedwithnewDate().Therearefourwaysofinstantiatingadate:vard=newDate();vard=newDate(milliseconds);vard=newDate(dateString);vard=newDate(year,month,day,hours,minutes,seconds,milliseconds);DateObjectProperties

Property Descriptionconstructor ReturnsthefunctionthatcreatedtheDateobject’sprototypeprototype Allowsyoutoaddpropertiesandmethodstoanobject

289

DateObjectMethods

Method DescriptiongetDate() Returnsthedayofthemonth(from1-31)getDay() Returnsthedayoftheweek(from0-6)getFullYear() Returnstheyear(fourdigits)getHours() Returnsthehour(from0-23)getMilliseconds() Returnsthemilliseconds(from0-999)getMinutes() Returnstheminutes(from0-59)getMonth() Returnsthemonth(from0-11)getSeconds() Returnstheseconds(from0-59)getTime() ReturnsthenumberofmillisecondssincemidnightJan1,

1970

getTimezoneOffset() ReturnsthetimedifferencebetweenUTCtimeandlocaltime,inminutes

getUTCDate() Returnsthedayofthemonth,accordingtouniversaltime(from1-31)

getUTCDay() Returnsthedayoftheweek,accordingtouniversaltime(from0-6)

getUTCFullYear() Returnstheyear,accordingtouniversaltime(fourdigits)

getUTCHours() Returnsthehour,accordingtouniversaltime(from0-23)

getUTCMilliseconds() Returnsthemilliseconds,accordingtouniversaltime(from0-999)

getUTCMinutes() Returnstheminutes,accordingtouniversaltime(from0-59)

getUTCMonth() Returnsthemonth,accordingtouniversaltime(from0-11)

getUTCSeconds() Returnstheseconds,accordingtouniversaltime(from0-59)

getYear() Deprecated.UsethegetFullYear()methodinsteadparse() Parsesadatestringandreturnsthenumberof

millisecondssincemidnightofJanuary1,1970

setDate() Setsthedayofthemonthofadateobject

setFullYear() Setstheyear(fourdigits)ofadateobjectsetHours() SetsthehourofadateobjectsetMilliseconds() SetsthemillisecondsofadateobjectsetMinutes() SettheminutesofadateobjectsetMonth() SetsthemonthofadateobjectsetSeconds() SetsthesecondsofadateobjectsetTime() Setsadateandtimebyaddingorsubtractinga

specifiednumberofmillisecondsto/frommidnightJanuary1,1970

290

setUTCDate() Setsthedayofthemonthofadateobject,accordingtouniversaltime

setUTCFullYear() Setstheyearofadateobject,accordingtouniversaltime(fourdigits)

setUTCHours() Setsthehourofadateobject,accordingtouniversaltime

setUTCMilliseconds() Setsthemillisecondsofadateobject,accordingtouniversaltime

setUTCMinutes() Settheminutesofadateobject,accordingtouniversaltime

setUTCMonth() Setsthemonthofadateobject,accordingtouniversaltime

setUTCSeconds() Setthesecondsofadateobject,accordingtouniversaltime

setYear() Deprecated.UsethesetFullYear()methodinsteadtoDateString() ConvertsthedateportionofaDateobjectintoareadable

stringtoGMTString() Deprecated.UsethetoUTCString()methodinsteadtoISOString() Returnsthedateasastring,usingtheISOstandardtoJSON() Returnsthedateasastring,formatedasaJSONdatetoLocaleDateString() ReturnsthedateportionofaDateobjectasastring,

usinglocaleconventions

toLocaleTimeString() ReturnsthetimeportionofaDateobjectasastring,usinglocaleconventions

toLocaleString() ConvertsaDateobjecttoastring,usinglocaleconventions

toString() ConvertsaDateobjecttoastring

toTimeString() ConvertsthetimeportionofaDateobjecttoastring

toUTCString() ConvertsaDateobjecttoastring,accordingtouniversaltime

UTC() ReturnsthenumberofmillisecondsinadatestringsincemidnightofJanuary1,1970,accordingtouniversaltime

valueOf() ReturnstheprimitivevalueofaDateobject

291

Example:<!DOCTYPEhtml><html><head><b>JavaScriptDateMethodExample</b></head><body><scripttype=“text/javascript”>vardt=newDate();document.write(“<br>”+“DateandTime:”+dt);document.write(“<br>”+“Today’sdateandtime:”+dt.getDate());document.write(“<br>”+“Today’smonth:”+dt.getMonth());document.write(“<br>”+“Today’syear:”+dt.getYear());document.write(“<br>”+“Today’stimezone:”+dt.getTimezoneOffset());</script></body></html>JAVASCRIPTBOOLEANOBJECTTheBooleanobjectisusedtoconvertanon-BooleanvaluetoaBooleanvalue(trueorfalse).BooleanObjectProperties

Property Descriptionconstructor ReturnsthefunctionthatcreatedtheBooleanobject’s

prototypeprototype AllowsyoutoaddpropertiesandmethodstoaBooleanobjectBooleanObjectMethods

Method DescriptiontoString() ConvertsaBooleanvaluetoastring,andreturnstheresultvalueOf() ReturnstheprimitivevalueofaBooleanobject

292

Example:<!DOCTYPEhtml><html><head><b>JavaScripttoString()MethodExample</b></head><body><scripttype=“text/javascript”>varflag=newBoolean(false);document.write(“<br>”+“flag.toStringis:”+flag.toString());document.write(“<br>”+“flag.valueOfis:”+flag.valueOf());</script></body></html>JAVASCRIPTREGEXPOBJECTAregularexpressionisanobjectthatdescribesapafernofcharacters.Regularexpressionsareusedtoperformpafern-matchingandsearch-and-replacefunctionsontext.

Syntaxvarpaf=newRegExp(pafern,modifiers);varpaf=/pafern/modifiers;

pafernspecifiesthepafernofanexpressionmodifiersspecifyifasearchshouldbeglobal,case-sensitive,etc.ModifiersModifiersareusedtoperformcase-insensitiveandglobalsearches:

Modifier Descriptioni Performcase-insensitivematching

g Performaglobalmatch(findallmatchesratherthanstoppingafterthefirstmatch)

m Performmultilinematching

293

BracketsBracketsareusedtofindarangeofcharacters:

Expression Description[abc] Findanycharacterbetweenthebrackets[^abc] Findanycharacternotbetweenthebrackets[0-9] Findanydigitfrom0to9[A-Z] FindanycharacterfromuppercaseAtouppercaseZ[a-z] Findanycharacterfromlowercaseatolowercasez[A-z] FindanycharacterfromuppercaseAtolowercasez[adgk] Findanycharacterinthegivenset[^adgk] Findanycharacteroutsidethegivenset

(red|blue|green) FindanyofthealternativesspecifiedMetacharactersMetacharactersarecharacterswithaspecialmeaning:

Metacharacter Description. Findasinglecharacter,exceptnewlineorlineterminator\w Findawordcharacter\W Findanon-wordcharacter\d Findadigit\D Findanon-digitcharacter\s Findawhitespacecharacter\S Findanon-whitespacecharacter

\b Findamatchatthebeginning/endofaword

\B Findamatchnotatthebeginning/endofaword

\0 FindaNULcharacter\n Findanewlinecharacter\f Findaformfeedcharacter\r Findacarriagereturncharacter\t Findatabcharacter\v Findaverticaltabcharacter\xxx Findthecharacterspecifiedbyanoctalnumberxxx\xdd Findthecharacterspecifiedbyahexadecimalnumberdd\uxxxx FindtheUnicodecharacterspecifiedbyahexadecimal

numberxxxx294

Quantifiers

Quantifier Descriptionn+ Matchesanystringthatcontainsatleastonenn* Matchesanystringthatcontainszeroormoreoccurrencesof

nn? Matchesanystringthatcontainszerooroneoccurrencesofnn{X} MatchesanystringthatcontainsasequenceofXn’sn{X,Y} MatchesanystringthatcontainsasequenceofXtoYn’sn{X,} MatchesanystringthatcontainsasequenceofatleastXn’sn$ Matchesanystringwithnattheendofit^n Matchesanystringwithnatthebeginningofit

?=n Matchesanystringthatisfollowedbyaspecificstringn

?!n MatchesanystringthatisnotfollowedbyaspecificstringnRegExpObjectProperties

Property Descriptionglobal Specifiesifthe“g”modifierissetignoreCase Specifiesifthe“i”modifierissetlastIndex Theindexatwhichtostartthenextmatchmultiline Specifiesifthe“m”modifierissetsource ThetextoftheRegExppafernRegExpObjectMethods

Method Descriptioncompile() Compilesaregularexpressionexec() Testsforamatchinastring.Returnsthefirstmatchtest() Testsforamatchinastring.Returnstrueorfalse

295

Example:<!DOCTYPEhtml><html><head><b>JavaScriptRefExp()MethodExample</b></head><body><scripttype=“text/javascript”>varstr=“Helloworld!”;//lookfor“Hello”varpaf1=newRegExp(“Hello”,“g”);varresult=paf1.exec(str);document.write(“<br>”+“<br>”+“OriginalString:”+str);document.write(“<br>”+“Searchpafern:”+paf1);document.write(“<br>”+“Returnedvalue:”+result);//lookfor“World”varpaf2=newRegExp(“world”,“g”);varresult=paf2.test(str);document.write(“<br>”+“<br>”+“Searchpafern:”+paf2);document.write(“<br>”+“Returnedvalue:”+result);</script></body></html>JavaScriptGlobalTheJavaScriptglobalpropertiesandfunctionscanbeusedwithallthebuilt-inJavaScriptobjects.

JavaScriptGlobalProperties

Property DescriptionInfinity Anumericvaluethatrepresentspositive/negativeinfinity

NaN “Not-a-Number”value

undefined Indicatesthatavariablehasnotbeenassignedavalue

296

JavaScriptGlobalFunctions

Method DescriptionFunction DescriptiondecodeURI() DecodesaURIdecodeURIComponent() DecodesaURIcomponentencodeURI() EncodesaURIencodeURIComponent() EncodesaURIcomponentescape() Encodesastringeval() Evaluatesastringandexecutesitasifitwasscript

codeisFinite() Determineswhetheravalueisafinite,legalnumber

isNaN() Determineswhetheravalueisanillegalnumber

Number() Convertsanobject’svaluetoanumber

parseFloat() Parsesastringandreturnsafloatingpointnumber

parseInt() ParsesastringandreturnsanintegerString() Convertsanobject’svaluetoastringunescape() DecodesanencodedstringExample:<!DOCTYPEhtml><html><head><b>JavaScriptGlobalFunctionsExample</b></head><body><scripttype=“text/javascript”>vartest1=newBoolean(true);vartest2=newBoolean(false);vartest3=newDate();vartest4=newString(“111”);vartest5=newString(“111222”);document.write(“<br>”+Number(test1)+“<br>”);document.write(Number(test2)+ “<br>”); document.write(Number(test3)+ “<br>”);document.write(Number(test4)+“<br>”);document.write(Number(test5)+“<br>”);

297

document.write(“isFinite(111):”+isFinite(111)+“<br>”);document.write(“isFinite(-9.23):”+isFinite(-9.23)+“<br>”);document.write(“isFinite(0):”+isFinite(0)+“<br>”);document.write(“isFinite(Hello):”+isFinite(“Hello”)+“<br>”);document.write(“isFinite(2012/01/01):”+isFinite(“2012/01/01”)+“<br>”);document.write(“isNaN(111):”+isNaN(111)+“<br>”);document.write(“isNaN(-9.23):”+isNaN(-9.23)+“<br>”);document.write(“isNaN(0):”+isNaN(0)+“<br>”);document.write(“isNaN(Hello):”+isNaN(“Hello”)+“<br>”);document.write(“isNaN(2012/01/01):”+isNaN(“2012/01/01”)+“<br>”);</script></body></html>JAVASCRIPTEVENTSAJavaScriptcanbeexecutedwhenaneventoccurs,likewhenauserclicksonanHTMLelement.HTMLeventscanbeoccurs:•Whenauserclicksthemouse

•Whenawebpagehasloaded

•Whenanimagehasbeenloaded

•Whenthemousemovesoveranelement

•Whenaninputfieldischanged

•WhenanHTMLformissubmifed

•Whenauserstrokesakey

Toexecutecodewhenauserclicksonanelement,addJavaScriptcodetoanHTMLeventafribute:

onclick=JavaScript

298

Example:<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionsayHello(){alert(“HelloWorld”)

}

</script></head><body><inputtype=“bufon”onclick=“sayHello()”value=“SayHello”/></body></html>HTMLDOMEventsHTMLDOMeventsallowJavaScripttoregisterdifferenteventhandlersonelementsinanHTMLdocument.Eventsarenormallyusedincombinationwithfunctions,andthefunctionwillnotbeexecutedbeforetheeventoccurssuchaswhenauserclicksabufon.MouseEvents

Property Descriptiononclick Theeventoccurswhentheuserclicksonanelementondblclick Theeventoccurswhentheuserdoubleclicksonanelementonmouseup Theeventoccurswhenauserreleasesamousebufonoveran

elementonmousedown Theeventoccurswhenauserpressesamousebufonoveran

elementonmouseover Theeventoccurswhenthepointerismovedontoanelementonmouseout Theeventoccurswhenausermovesthemousepointeroutof

anelementonmousemove Theeventoccurswhenthepointerismovingwhileitisover

anelement

299

Example:

<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionclick1()

{

alert(“HelloSir,Youhaveclickedthebufon”)

}

functionclick2()

{

alert(“HelloSir,Youhavedoubleclickedthebufon”)

}

</script></head><body><inputtype=“bufon”onclick=“click1()”value=“Click”/><inputtype=“bufon”ondblclick=“click2()”value=“Doubleclick”/></body></html>

KeyboardEvents

Aflribute Descriptiononkeydown Theeventoccurswhentheuserispressingakeyonkeyup Theeventoccurswhentheuserreleasesakeyonkeypress Theeventoccurswhentheuserpressesakey

300

Example:<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionfunction1()

{

alert(“Youpressedakeyinsidetheinputfield”);

}

</script></head><body><p>Pressakeyintheinputfield.</p><inputtype=“text”onkeypress=“function1()”></body></html>Frame/ObjectEvents

Aflribute Descriptiononload Theeventoccurswhenadocument,frameset,or<object>

hasbeenloadedonunload Theeventoccursonceapagehasunloaded(for<body>and

<frameset>)onresize Theeventoccurswhenadocumentviewisresizedonscroll Theeventoccurswhenadocumentviewisscrolled

onabort Theeventoccurswhenanimageisstoppedfromloadingbeforecompletelyloaded(for<object>)

onerror Theeventoccurswhenanimagedoesnotloadproperly(for<object>,<body>and<frameset>)

301

Example:<!DOCTYPEhtml><html><head><h1>WelcometoSCERTDelhi</h1><scripttype=“text/javascript”>functionmsg()

{

alert(“Pageloadedsuccessfully”);

}

</script></head><bodyonload=“msg()”></body></html>FormEvents

Aflribute Descriptiononsubmit Theeventoccurswhenaformissubmifedonreset Theeventoccurswhenaformisresetonchange Theeventoccurswhenthecontentofaformelement,the

selection,orthecheckedstatehavechanged(for<input>,<select>,and<textarea>)

onselect Theeventoccurswhenauserselectssometext(for<input>and<textarea>)

onfocus Theeventoccurswhenanelementgetsfocus(for<label>,<input>,<select>,textarea>,and<bufon>)

onblur Theeventoccurswhenaformelementlosesfocus

302

Example:<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionmsg1()

{

alert(‘Thankyou‘+myform.data.value+’!’)

}

</script></head><body><b>Typeyournameandpressthebufon</b<br><formname=“myform”onSubmit=msg1()><inputtype=“text”name=“data”><inputtype=“submit”name=“submit”value=“Submitthisform”></form></body></html>EVENTSCASESTUDIES1)Changethecolorofablockwhenauserholdsdownthemousebufon.

<!DOCTYPEhtml><html><head>

<scripttype=“text/javascript”>functionmDown(x)

{

x.style.backgroundColor=”#7CFC00”;x.innerHTML=”<b>MOUSEDOWN</b>”

}

functionmUp(x)

{

x.style.backgroundColor=”#FF0000”;x.innerHTML=”<b>MOUSEUP</b>”

}

</script>

303

</head><body><divonmousedown=“mDown(this)”onmouseup=“mUp(this)”style=“background-color:#FFFF00;width:120px;height:20px;padding:40px;”><b>ClickMe</b></div></body></html>

2)Displayanerrormessagewhenanimagedoesnotloadproperly.<!DOCTYPEhtml><html><head><scripttype=“text/javascript”>functionimgError()

{

alert(‘Theimagecouldnotbeloaded.’);

}

</script></head><body><h1>WelcometoSCERT</h1><imgsrc=“image.gif”onerror=“imgError()”></body></html>

3)Changethebackground-colorofaninputfieldwhenitgetsfocus.


<scripttype=“text/javascript”>functionfunction1(x)

{

x.style.background=“red”;

}

functionfunction2(x)

{

x.style.background=“green”;

}


{

304

x.style.background=“yellow”;

}


{

x.style.background=“blue”;

}

</script>

</head><body>

<p>EnteryourName:<inputtype=“text”onfocus=“function1(this)”></p><p>EnteryourAddress:<inputtype=“text”onfocus=“function2(this)”></p><p>EnteryourCity:<inputtype=“text”onfocus=“function3(this)”></p><p>EnteryourPhoneNo.:<inputtype=“text”onfocus=“function4(this)”><p><p>Whentheinputfieldgetsfocus,itchangesthebackground-color.</p>

</body></html>

4)Changethesizeofanimagewhenthecursormovesoverit.


<scripttype=“text/javascript”>functionmover(x)

{

x.style.height=“396px”;x.style.width=“396px”;

}

functionmout(x)

{

x.style.height=“132px”;x.style.width=“132px”;

}

</script>

</head><body>

<imgonmouseover=“mover(this)”onmouseout=“mout(this)”border=“0”

305

src=“smiley.gif”alt=“Smiley”width=“132”height=“132”></body></html>5)Displaythemessagetostatebrowserhasenabledcookiesornot.

<!DOCTYPEhtml><html><bodyonload=“chkcookies()”>

<scripttype=“text/javascript”>functionchkcookies()

{

if(navigator.cookieEnabled==true)

{

alert(“Cookiesareenabled”)

}

else

{

alert(“Cookiesarenotenabled”)

}

}

</script>

</body></html>

306

ExerciseKnowledgeCheckPoint

1. JavaScriptisusedfor………………………sidescripting.

a) Client b) Serverc) Local d) Global

2. AJavaScriptcanbeexecutedwhen………………………..occurs,

a) Function b) Eventc) Command d) Call

3. A…………………..isablockofcodethatwillbeexecutedwhensomeonecallsit.

a) Function b) Eventc) Command d) Call

4. AvariabledeclaredwithinaJavaScriptfunctionbecomes………………………andcanonlybeaccessedfromwithinthatfunction.

a) Local b) Globalc) Free d) Universal

5. Variablesdeclaredoutsideafunction,become……………………….andallscriptsandfunctionsonthewebpagecanaccessit.

a) Local b) Globalc) Free d) Universal

6. InJavaScript,an……………………..isdata,withpropertiesandmethods.

a) Function b) Eventc) Command d) Object

7. The………………………objectrepresentsnumericaldate,eitherintegersorfloating-pointnumbers.

a) Number b) Stringc) Math d) Array

8. The……………………objectisusedtomanipulateastoredpieceoftext.

a) Number b) Stringc) Math d) Array

307

9. The……………………objectallowsyoutoperformmathematicaltasks.

a) Number b) Stringc) Math d) Array10. The……………………objectisusedtostoremultiplevaluesinasinglevariable.

a) Number b) Stringc) Math d) Array11. The………………………objectisusedtoworkwithdatesandtimes.

a) Number b) Datec) Math d) Array12. The…………………objectisusedtoconvertanon-BooleanvaluetoaBooleanvalue.

a) Boolean b) Datec) Math d) Array13. HTML…………………eventsallowJavaScripttoregisterdifferenteventhandlersonelementsinanHTMLdocument.

a) Window b) Keyboardc) DOM d) Mouse

14. The……………………eventoccurswhentheuserclicksonanelement.

a) onclick b) onmouseoverc) onmouseup d) onkeypress15. The…………………eventoccurswhenauserreleasesamousebufonoveranelement.

a) onclick b) onmouseoverc) onmouseup d) onkeypress16. The………………………eventoccurswhenthepointerismovedontoanelement.

a) onclick b) onmouseoverc) onmouseup d) onkeypress17. The……………………………eventoccurswhentheuserpressesakey.

a) onclick b) onmouseoverc) onmouseup d) onkeypress18. The……………………eventoccurswhenadocument,frameset,orobjecthasbeenloaded

a) indexOf() b) onsubmitc) onload d) onkeypress

308

19. The……………………….eventoccurswhenaformissubmifed.

a) indexOf() b) onsubmitc) onload d) onkeypress20. Themethod……………………searchthearrayforanelementandreturnsitsposition.

a) indexOf() b) concat()c) pop() d) push()

HandsonActivities

1. Defineafunctionmax()thattakestwonumbersasargumentsandreturnsthelargestofthem.Usetheif-then-elseconstructavailableinJavascript.

2. DefineafunctionmaxOfThree()thattakesthreenumbersasargumentsandreturnsthelargestofthem.

3. Writeafunctionthattakesacharacter(i.e.astringoflength1)andreturnstrueifitisavowel,falseotherwise.

4. Defineafunctionsum()andafunctionmultiply()thatsumsandmultiplies(respectively)allthenumbersinanarrayofnumbers.Forexample,sum([1,2,3,4])shouldreturn10,andmultiply([1,2,3,4])shouldreturn24.

5. Defineafunctionreverse()thatcomputesthereversalofastring.Forexample,reverse(“jagtestar”)shouldreturnthestring“ratsetgaj”.

6. WriteafunctionfindLongestWord()thattakesanarrayofwordsandreturnsthelengthofthelongestone.

7. WriteafunctionfilterLongWords()thattakesanarrayofwordsandanintegeriandreturnsthearrayofwordsthatarelongerthani.

8. CreateapagewithJavaScripttogenerateAlertBoxifusertriestochangetextintextinputfield.

9. CreateapagewithJavaScripttoshowthedateandtimewhenthepageloads.10. CreateapagewithJavaScripttocreateanavigationalbarwith images.Whenthemouseisoverthe image,analternateversionofthe imageshouldappear.Whenthe

mousemovesofftheimage,theoriginalimageshouldreappear.

309

SkillCheckPoint

WritetheJavaScriptcodeforcreatingaRegistrationFormwithfollowingclientsidevalidations:a)TheLoginname,Emailaddress,Password,Confirmpasswordcannotleftempty.b)TheEmailaddressneedstobescannedforthepresenceofan‘@’and‘.’Symbol.c)ThePasswordandConfirmpasswordhastobesame.d)Thelengthofpasswordshouldnotbelessthan8characters

References:1. IvanBayross,WebEnabledCommercialApplicationDevelopmentUsingHTML,DHTML,javascript,PerlCGI,BPBPublication,NewDelhi(2005)2. JavaScriptTutorial-W3Schools,www.w3schools.com/js/3. JavaScriptTutorial,www.tutorialspoint.com/javascript/4. JavaScriptTutorial,www.echoecho.com5. LearnJavaScriptProgramming,www.codecademy.com/tracks/javascript6. JavaScriptTutorial,hfp://html.net/tutorials/javascript/

310

ChapterEight

ITDC-413WorkIntegratedLearningIT–WA-II

•IdentificationofWorkAreas•WorkExperience

Outline•SkillsrequiredforWebDesigning•SkillsRequiredForMultimediaProfessional

311

SkillsrequiredforWebDesigning:Webdesign is abroadarea coveringmanydifferent skill sets anddisciplines that areused in theproductionandmaintenanceofwebsites.Thedifferent areasofwebdesign includeinterfacedesign,webgraphicdesign,authoring,userexperiencedesignandsearchengineoptimization.Tobeasuccessfulwebdesigneryoumusthavepersonalskills,self learning,technical,writingandeditorialskills,youmustbewellversedwithgraphicdesigntheory.

ThefollowingpersonaltechnicalandadditionalskillsareneededtobeagoodWebdesigner.1. PersonalSkills:•Logicalthinking•Creativity•Communicationskills•Wrifenskills•Organizationskills•Punctuality•DesignSense•Selflearning

2. TechnicalSkills:ThefollowinglistoftechnicalskillsisalistoftheskillsyouneedtobeagoodWebdesigner.

•HTML,XHTML•CSS•JavaScriptandAjax •PHP,ASP,Java,PerlorC++•Database–MySQL,MSSQL•Flash •SEOTechniques •Dreamweaver•WindowsMovieMaker

3. AdditionalSkills•WebServerAdministration•Databaseconcepts•ProjectManagement•Creativity&GraphicsDesign

312•BusinessSense•GraphicDesignTheory•KnowTypographywell•MustbeawareofUI(UserInterface)designpaferns.

1. HTML:ForBeginnersHTML(HyperTextMark-upLanguage)isthestartingpointforwebdesign.Itisthebasicandfundamentalskillthatisusedtocreatewebpages.HTMLusestagstoopenandcloseapassageoftext.

2. CSS:CascadingStyleSheets(CSS)isanotherfundamentalskillinwebdesigntoconvertHTMLcodesintoformafedwebpages.Ithastodowiththeappearanceandformatofeachwebpagewithrespecttocolor,text,fonts,borders,etc.

3. JavaScript:JavaScriptisthescriptlanguagewhichisassociatedwithHTMLandusedinwebdesign.ThislanguageimprovestheinteractivityofaWebpagewiththeadditionofdynamiccontent.TheJSisembeddedinHTMLcode.

4. SEO:Awebdesignermustensurethatthesiteissearchenginefriendly.YoumustunderstandthebasicsofsearchengineoptimizationandintegrationoftheirdesignfeaturessoastohelpthewebsiteingainingmorevisibilityontheInternet.

5. JQUERY:Thisislatestwebsitedesigncraze,withtheabilitytointeractwiththeserveronthefly.Forawhilenow,wehaveseenonlargercorporatesites,theintroductionofwhatappeartomainlybeusabilityimprovements,andslickCSStransitionsandeffects.

6. PHP:Regardedas the Internet’snumberonechoice forserver-side languages, itsopensourcebenefitscomerightouton topagain.PHP isusedwidely throughout theinternetfromsimplefunctionsforusingdynamicdates,andincludingtemplatefilesrightthroughtocompleteobjectorientedapplicationdevelopment.

7. FLASH:Animationonthewebisaspopularaseverwithmorefocuson3Dtoolsinteractivityandcompatibility.Havingtheskillstobeabletocreateniceanimationscancertainlygiveyourworkthewowfactorthatwillsellyourworktoyourclients.Animationandvideoareoneofthebestwaystogettheafentionofyourusers.

8. SERVERADMINISTRATION:Therearecertainlymanyareasofwebdesignthatarenotglamorous,butequallyas important ifyouaretomaintainahighlevelofservice.AdministeringDomains,Hosting,Emails,servers,backupsetcisessentialforsmoothwebsiterunning.

313

9. PROJECTMANAGEMENT:Whenrunningorworking forawebcompany,althoughnotnecessarily related towebsitedesign,butmoregoodbusinesspractice ingeneral,beingabletomanagetheprojecttotheconstraintsoftime,budgetandresources,couldbethedifferencebetweenasuccessfulprojectwithongoingsupport,maintenanceandfuturedevelopmentsandadisappointedclientthatlookselsewhereforfutureWebsiteDesign

10. MYSQL:Opensourcetechnologiesonthewebhavesofardominatedwhenitcomestoallrounduptakes.WebdesignersofalllevelscanuseMySQLtechnologyfreelywithintheWebsiteDesign.WiththebulkofwebapplicationsusingMySQLalongwithPHP,it’snosurprisethathavingthisskillsetcancertainlybevaluableinthisdayandage.

Additionalskillsexplained:1. Sketching/Drawing:Thisisthebasicskillthatthegraphicdesignersshouldpossesstogettheirideasonpaper.Thedesignercanalsolearnavarietyofsoftwaretoimproveitsabilitytodelineate.

2. Typography:Typographyistheartoftypedesignandrequiresagoodunderstandingoffontfamilies,withtheuseofline-height,kerningandtracking.Agraphicdesignershouldknowthedifferencebetweenthefamiliesandstylesandhowbesttouse.

3. PrintDesign&Layout:AnunderstandingofPrintLayoutanddesignisaprerequisiteforagraphicdesigner.TheuseofdesignprogramssuchasAdobeInDesignandQuarkisnecessary.Thedesignermusthaveadetailedknowledgeoftheprintingprocesstounderstandtheuseofthecolorspace.

4. Photography:Thisphotographyisaskillthatcanenhancethedesigner’sabilitytoimpresshisclients.Usingadigitalcamera,thedesignercouldilluminatethesubject.Thisisanadd-onskill.

SkillsRequiredForMultimediaProfessional:Multimediaismediaandcontentthatusesacombinationofdifferentcontentformsandtodevelopsuchmedia,contentamultimediaprofessionalmustbewellversedwithmultimediasoftware,tools,techniques,servicesandmediadevices.

Followingisthelistofasuccessfulmultimediaprofessionalskillsetandtechnicalqualities:

314

1. PersonalSkills:•ActiveListening

•CriticalThinking

•JudgmentandDecisionMaking

•TimeManagement

•Speaking•Writing-Communicating

•ReadingComprehension

•ActiveLearning

•Monitoring•Instructing•ServiceOrientation

•SocialPerceptiveness

•SystemsEvaluation

•ManagementofMaterial

2. TechnicalSkills:•AdobeAcrobat •Photoshop •PageMaker/Quark•CorelDraw•Flash/Shockwave•WebDevelopmentToolsforFrontPage•HTML-XML-HTXML•VideoEditMagic•3DMaxStudio•Dreamviewer •Illustrator •Paint •WindowsMovieMaker

3. AdditionalSkillset•Troubleshooting•OperationandControl•ComplexProblemSolving•EquipmentMaintenance

315

•SystemsAnalysis•QualityControlAnalysis•ManagementofPersonnelResources•Coordination

316

Annexure1

ITDC-410MovieEditingTools(withPremierPro)

•Familiarisationofinterfacecomponents•Importingpictures•ImportingAudioandVideoFiles•SpliflingandJoiningMovieClips•AddingTitlesandpublishing

317

IntroductionAdobePremiereisavideoEditingsoftwarepackagesuitableforbothamateurenthusiastsandprofessionals.Itcanbepurchasedandusedalone,oralongsideotherapplicationssuchasAdobePhotoshop,AfterEffects,etc.

Premiereisapowerfuleditingtool,capableofproducingbroadcast-qualityandhigh-definitionvideo.Itisaverypopularpackageamongstvideoenthusiastsandprofessionals,althoughotherpackagesareusuallypreferredfortheverytopleveloftelevisionproduction.

FamiliarizationofInterfaceComponentsPremiereProWorkspace:Overview

Thescreenshotbelowshowsthedefaultworkspace.Thisworkspacecanbecustomizedinmanyways—youcanrearrangethepanelsandusespecialistpanelsfordifferenttasks(audioMixer,titles,etc).Fornowwewillsticktothedefaultworkspace.

318

Thedefaultpanels1. TheToolsPaneliswhereyoucanselectvariouseditingtoolstouseinthetimeline.2. TheProjectPaneliswhereyoustorealltheelementswhichmakeupyoureditedvideo(VideoClips,audioclips,graphics,titles,etc).

3. TheSourceMonitoriswhereyoucanpreviewclips,makesimpleadjustmentsandaddthemtothetimeline.

4. TheProgramMonitorshowstheeditedvideofromthetimeline.5. TheMediaBrowserallowsyoutobrowse,previewandimportclipsfromyourhardDrivesandnetwork.

6. TheTimelinePaneliswhereyouarrangetheelementsofyourvideointhedesiredorder.7. TheAudioMetersdisplaythevolumelevelfromthetimeline.

ExportingVideofromAdobePremiereProThissectionshowshowtoexportVideoclipsusingAdobePremierePro.Youcanexportinavarietyofformatsandit’simportanttochoosetherightoneforthejob.

ExportoptionscanbefoundinthemenuunderFile>Export.Important:Beforeexporting,makesureyouhavethecorrectpanelandsourceselectedinthe workspace. For example, select the timeline panel to export the timeline, or select thepreviewmonitortoexportaclipshownthere.Iftheexportoptionisgrayedout,youdon’thaveacliportimelineselected.

AVIToexportasanAVIfile,chooseFile>Export>Movie.Thiscreatesalargefilebutisthebestquality.Usethisoptionformasteringpurposesorifyouwanttobeabletoeditthevideolater.Formaximumquality,exportasanuncompressedAVI.

319

Workingwithproject:Stepbystepinstructionstostartanewproject:-

1. Startadobepremier2. Clicknewprojecticon3. Chosepreset4. Nametheproject5. Clickonbrowserandlocateadirectorytosavetheproject6. Clickokbufon

Afterthatleftpanelwherestorageandclipsmiddleprojectwindowandbofomtimelineandrightsidetoolsshowsthere

ToolsPremiersgiveanumberoftoolsthathelpyoutoworkfasterandeasy

320

AdobePremiereToolsPanel(Toolbox)Thetoolboxcontainscommontoolsusedforeditingclipsinthetimeline.Clickonanyofthebufons(orusethekeyboardshortcuts)toselecteachtool.Thedefaulttoolistheselectiontool.

Whenyouselectatoolthemousepointerwillusuallychangetoanewicontorepresentthetoolwhenheldoverthetimelinepanel.InsomecasesyoucanchangethebehaviourofatoolbyholdingdownamodifierkeysuchastheShihkey.

Thetoolsaredescribedbelowwithlinkstomoreinformation.BuflonKeyboardDescriptionShortcut

VSelectiontoolThedefaulttool,usedtoselectclipsinthetimeline.

MTrackSelecttoolSelectallclipsonatrackfromagivenpoint,orselectmultipletracks.

BRippleEdittoolAdjustaneditpointandmoveotherclipsinthetimelinetocompensate.

NRollingEdittoolAdjustaneditpointbetweentwoclipswithoutaffectingtherestofthetimeline.

XRateStretchtoolChangethedurationofaclipwhilesimultaneouslychangingthespeedtocompensate.

CRazortoolCutaclip(ormultipleclips)intotwoclips.

YSliptoolMoveaclip’sinandoutpointsbythesameamountsimultaneously,sotherestofthetimelineisnotaffected.

USlidetoolMoveaclipbackandforthinthetimeline,whilesimultaneouslyadjustingadjacentclipstocompensate.

321

PPentoolCreatecontrol(anchor)points.

HHandtoolDragthetimelineviewleftandright.

ZZoomtoolClickinthetimelinetomagnifytheview,ordragandselectarectangularareatozoominto.

ImportingAudioandVideoFilesInsertthesoundfileinanyclip1. ClickSelectandImportthefiletotheProjectAssetspanel.Ensurethatyoudonotclickthedropdownmenu.SwitchtoAdobePremiereElementsandnoticethatthefilehasbeenaddedtotheProjectAssetspanel.

2. UsethefileasyouwouldanyothersoundfilesinAdobePremiereElements.ToimportadditionalfilesfromSmartSound,clickUseSmartSoundfromtheMusicpanel,andre-runthisprocedure.

1. ClickAddmediatoimportthevideoclipyouwanttoenhance.Ignoreifthevideoclipisalreadypresentonthetimeline.2. Selecttheoptiontoimportmedia.3. SelectGuided>AdjustingTitletoyourmovie.4. ClickTitles&Textontheactionbar.5. Selectatemplateanddrag-and-dropittothetimeline.Thereareseveraltemplatesavailablewithpredefinedtext.Selectfromthedrop-downlisttoexploreothertemplates.

SelectTitle1. Toaddcustomtext,selectthedefaulttextandtypeinyourdesiredtext.Doubleclicktoselectthetextifthetextisnotselected.2. Doubleclickthetextpaneltoopenit.Youcanadjustthefont,style,size,andcolorintheAdjustmentspanel.

322

3. Therearevariouspredefinedstylesyoucanselectfrom.ClicktheStyletabintheAdjustmentsbar.

ChooseandAddStylesClickthedesiredstyletoapplyittothetext.

4. Youcananimateyourtext.Toaddananimation,clickthedesiredanimationandselectApply.

ImportatitlefileYoucanimportatitleintoaprojectthatwasexportedfromanotherPremiereElementsproject.

1. IntheExpertview,clickProjectAssetstoopentheProjectAssetspanel.2. Right-click/CtrlclickontheProjectAssetspanelandselectGetMediaFrom>FilesAndFolders.

Alignobjects1. Ifnecessary,doubleclickthetitleintheExpertviewtimelinetoopenitintheMonitorpanel.2. IntheMonitorpanel,Shift-clicktwoormoreobjectsordragamarqueeoverthem.

323

3. Dooneofthefollowing:-Right-click/ctrlclickanyoftheobjectsselected,andchooseAlignObjects.Or-ChooseText>AlignObjects.

4. Selectthetypeofalignmentyouwant.Distributeobjects

1. Ifnecessary,doubleclickthetitleintheExpertviewtimelinetoopenitintheMonitorpanel.

2. IntheMonitorpanel,Shift-clickthreeormoreobjectsordragamarqueeoverthem.3. Dooneofthefollowing:

-Right-click/ctrlclickanyoftheobjectsselected,andchooseDistributeObjects.Or-ChooseText>DistributeObjects.TransformobjectsYouhavefullflexibilityinadjustinganobject’sposition,rotation,scale,andopacity—afributescollectivelyreferredtoastransformproperties.Totransformanobject,youcandragintheMonitorpanelorchooseacommandfromtheTextmenu.

CreatearollingorcrawlingtitleAlthoughstatic titles,graphics,and imagesmaysuffice for someprojects,others require titles thatmove.Using roll andcrawloptions, youcan instantlycreateprofessional-lookingmovingtitles.

324

ThelengthofthetitleintheQuickviewtimelinedeterminesthespeedofthemovement.Themoreyouincreasethetitlecliplength,theslowerthemovement.

Rollingtitlesmovecharactersverticallyacrossthescreen.Crawlingtitlesmovecharactershorizontallyacrossthescreen.Ke`yframesletyoumovecharactersacrossacustompaththatyoucreatebysefingdifferentpositionkeyframesatseveralpointsintime.

Note:Youcannotaddarollorcrawl,orapplykeyframestoatitlethatusesananimationpreset.Applyingananimationpresetwilloverwriteallroll,crawl,andkeyframeseflings.

UseRoll/Crawloptionstochangearollingtitletoacrawlingtitleorviceversa,specifythedirectionofacrawl,andsetthetimingofmovement.

Arollingtitleiscommonlyusedforproductioncredits.Createarollingorcrawlingtitle

1. Dooneofthefollowing:Tocreatearollingtitle,chooseText>Roll/CrawlOptions>Roll.Tocreateacrawlingtitle,chooseText>Roll/CrawlOptions>Crawl.

2. Createthetextandgraphicobjectsforthetitle.UsetheMonitorpanel’sscrollbartoviewoffscreenareasofthetitle.WhenthetitleisaddedtotheQuickviewtimelineortheExpertviewtimeline,thehiddenoffscreenareasrollorcrawlintoview.

3. SelecttheRoll/CrawlOptionsintheRoll/CrawlOptionsdialogbox.4. Specifyoptionsasdesired,andthenclickOK.

Note:Youcanspecifyadirectionforcrawlingtitlesonly.Rollingtitlesalwaysmovefromtheboflomtothetopofthescreen.

Adjustanobject’sopacity1. Ifnecessary,doubleclickthetitleintheExpertviewtimelinetoopenitintheMonitorpanel.2. IntheMonitorpanel,selectanobject.3. Dooneofthefollowing:

Right-click/ctrlclicktheobjectandchooseTransform>Opacity.ChooseText>Transform>Opacity.4. TypeanewOpacityvalue,andclickOK.

325

Note:TheOpacitypropertyseflingadjuststheopacityofobjectswithinatitle.YoucansettheoverallopacityoftheentiretitleintheExpertviewtimelineasyouwouldanyvideoclip,usingeffects.

Moveobjects1. Ifnecessary,doubleclickthetitleintheExpertviewtimelinetoopenitintheMonitorpanel.2. IntheMonitorpanel,selectoneormoreobjects.3. Dooneofthefollowing:

Dragtheselectedobjectorobjectstoanewposition.ChooseText>Transform>Position.Typenewxandypositionvalues,andthenclickOK.Right-click/ctrlclicktheselectedobjectorobjects,andchooseTransform>Position.Typenewxandypositionvalues,andthenClickOK.note:Thexandypositionvaluescorrespondtoacoordinatesysteminwhichtheupper-leßcornerofthetitleis0,0.Whenyouentervaluesforxandy,PremiereElementsplacesthecenteroftheselectedobject’sboundingboxatthatpoint.BringToFrontBringstheobjecttothetopofthestackingorder.BringForwardSwitchestheobjectwiththeobjectdirectlyinfrontofit.SendToBackMovestheobjecttothebofomofthestackingorder.SendBackwardSwitchestheobjectwiththeobjectdirectlybehindit.note:Ifyourtextorshapeelementsaredenselystacked,itmaybedifficulttoselectanelementwithinthestack.YoucanusetheText>Selectorright-click/ctrlclick>Selectcommandtonavigateeasilythroughthestackedelementstoreachthetargetelement.ExpertviewtimelineFormoreadvancedediting,usetheExpertviewtimeline.TheExpertviewtimelinegraphicallyrepresentsyourmovieprojectasvideoandaudioclipsarrangedinverticallystackedtracks.Whenyoucapturevideofromadigitalvideodevice,theclipsappearsequentiallyastheyoccur.

ExpertviewtimelineTheExpertviewtimelineusesatimerulertodisplaythecomponentsofyourmovieandtheirrelationshiptoeachotherovertime.Youcantrimandaddscenes,indicateimportantframeswithmarkers,addtransitions,andcontrolhowclipsareblendedorsuperimposed.ComparedtotheQuickview,theExpertviewtimelinehasmoretracks.Organizer:OpensElementsOrganizertoletyouorganizeandmanageyourmediafiles

326

InstantMovie:Automaticallyguidesyouthroughthemoviecreationprocess.Itletsyouquicklyselectmovietemplatesandeditclips.InstantMoviealsoletsyouaddtheme-basedeffects,titles,transitions,andaudiotoyourmovie.Youcanchangesefingsasdesired.Tools:Providesoptionsthatletyouaddcooleffectstoyourvideo.Forexample,useTimeRemappingandSmartMixtoaddsophisticatedmotioneffectstoyourvideo.YoucanchooseSmartTrimtoletPremiereElementsautomaticallyedityourfootageforacrispervideo.

Transitions:Providestransitionsyoucanusebetweenyourmovieclips.TheTransitioncontextualcontrolappearsautomaticallywhenyouapplyatransitionforthefirsttime.Useittomodifythetransitionproperties.ToopentheTransitioncontextualcontrollater,doubleclickthetransition.TheExpertviewprovidesmoretransitioneffectscomparedtotheQuickview.TitlesandText:Containspre-formafedtitletemplatesyoucanuseinyourmovie.TheTitlecontextualcontrolappearsautomaticallywhenyouapplyatitletoyourmovieforthefirsttime.Useittomodifythetitleproperties.ToopentheTitlecontextualcontrollater,doubleclickthetitle.TheExpertviewprovidesmoretitletemplatescomparedtotheQuickview.Effects:Showsspecialeffectsandpresetsyoucanapplytoclipsinyourmovie.Toeditaspecialeffectafterapplyingit,clickAppliedEffectstomodifythepropertiesintheAppliedEffectspanel.ComparedtotheQuickview,theExpertviewprovidesmoreeffectsthatareorganizedundervariouscategories.Audio:Letsyouaddthememusictoyourmovie.Youcanselectmultiplemusicclipsfromhere,andtheyareplayedintheorderselected.ClickUseSmartSoundtochoosethird-partymusicpluginsforyourmovie.Graphics:Letsyouaddgraphicimages,suchasclipartandcallouts(thoughtbubblesorspeechballoons)tospecificportionsinyourclips.

327

AdjustpanelTheAdjustpanelletsyouadjusttheinherentpropertiesofyourclip,forexamplecolorandlighting.YoucanalsousetheSmartFixtooltoenhancethequalityofyourvideofootage.AdjustpanelTodisplaytheAdjustpanel,selecttheclipandthenclickAdjustontheright.Ifyouaddatitletoyourclip,usetheAdjustpaneltoalteritsproperties,ifrequired.

AppliedEffectspanel

TheAppliedEffectspanelletsyouviewthepropertiesofeffectsalreadyappliedtoyourclip.Thepanelprovidesvariousoptionsthatenableyoutomodifytheappliedeffects.AppliedEffectspanelTodisplaytheAppliedEffectspanel,selectthecliptowhicheffectsareapplied,andclickAppliedEffectsontheright.

328

ImportingmediathroughEmbeddedElementsOrganizerYoucanimportmedia(photos,videos,andaudio)inElementsOrganizertotheAdobePremiereElementsEditorworkspace.Youcanimportmediapresent inacatalogtoPREworkspace.However, themedia thathasbeenorganized intoalbums inElementsOrganizerappearsas localalbums in theEmbeddedElementsOrganizer.TheEmbeddedElementsOrganizerorEmbeddedEOenablesyoutoaddmediatothetimelinedirectly.YoucanaccesstheEmbeddedEOoptionfromtheAddMediadrop-downlist.Note:ThecreationanddeletionofalbumsisnotpossibleinEmbeddedEO.

AccessingmediathroughEmbeddedEOYoucannowaccessthealbumscreatedinElementsOrganizerfromPREEditorworskpaceitself.ThereisanEmbeddedElementsOrganizeroptionpresentunderAddMediathatenablesaccesstoEOalbums.ToimportmediathroughElementsOrganizer,followthesesteps:1ClickAddMedia>ElementsOrganizer.2ClickLocalAlbums.ThealbumscreatedinElementsOrganizeraredisplayedunderLocalAlbums.ClickonanAlbumtodisplaythemediapresentunderthatalbuminEmbeddedEO.Youcanclickagainonthealbumtodeselectit,thisrefreshesthemediavisibleinEmbeddedEOanddisplaysallthemediaavailableintheElementsOrganizercatalog.ClickontheShowStillImageiconifnothingisdisplayedinEmbeddedEO.

1. DoubleclickonavideooraudiofiletopreviewitintheSourceMonitor.2. Clickonafiletoselectit.ClickAddFilestoaddittothetimeline.

Youcanselectmultiplefilesandaddthemtothetimeline.Also,youcandraganddropmediafromtheEmbeddedEOtospecificpointsinthevideoonthetimeline.3. ClickDoneonceyouarethroughaddingthefilestoexitEmbeddedEO.

329

WorkingwithfilesintheEmbeddedEO

YoucanperformvarioustasksonyourfilesintheEmbeddedEOpanel.ClickAddMedia>ElementsOrganizertoaccessthispanel.Youcanperformthefollowingtasksinthispanel:A. BackbuflonClickBacktoreturntotheAddMediaoptions.B. LocalAlbumsClickLocalAlbumstoviewthemediaintheElementsOrganizercatalog.Clickanalbumtoviewthemediapresentinthatalbum.C. PreviousandNextbuflonClickthepreviousornextbufontomovethroughthedisplayedmedia.

Note:Youcanviewupto1000filesinEmbeddedEO.EmbeddedEOpanelbuflonsA. SearchcontentClickthisicontoopenatextbox.EnterthesearchcriteriaandpressEntertosearchforaspecificmediafile.ThisisnotalivesearchsomustpressEnterafterenteringyoursearchcriteria.

B. ShowVideoClickthisicontoviewvideofilesonly.C. ShowAudioClickthisicontoviewaudiofilesonly.D. ShowStillImageClickthisicontoviewphotosonly.E. Selectorder

Clickthistosortthefilesbydateorthebatchesinwhichtheywereimported.Youcansortthephotosinthefollowingways:Newest/Oldestfirst:Sortsthefilesbycreationdate.DefaultorderofdisplayinEmbeddedEOisnewestfirst.Importbatch:Sortsthefilesaccordingtothebatchesinwhichtheywereimported.TherenditionvidoesarenotvisiblewhenfilesaresortedbytheImportbatchoption.ProjectsReviewprojectpresetsandseflingsStartanewprojectOpenaproject

330

ProjectsPremiereElementscreatesaprojectfileforeverynewprojectthatyouwanttopublishorsavetoworkonitlater.Youcanalsocreateaprojectbeforeimportingmedia.Theprojectfilereferencesthemediathatyouaddtoaprojectincludingvideos,images,titles,andthemes.Projectfilesaresmallinsize.Theyincludetitlefilesandreferencestothesourcefilesthatyoucaptureorimport.Becausetheprojectfilesstorereferences,avoidmoving,renaming,ordeletingthesourcefilessothatPremiereElementscanlocatethem.ReviewprojectpresetsandseflingsWhenyoucreateaproject,youcanreviewthedefaultpresetandsefingsbyclickingtheChangeSefingsbufonintheNewProjectdialog.AdobePremiereElementsautomaticallyadjustsyourprojectsefingsbasedonthetypeofmediayouimport.

1. InPremiereElements,selectFile>NewProject.2. ClickChangeSefings.

Startanewproject1. Dooneofthefollowing:

FromtheWelcomescreen,clickVideoEditorandselectNewProject.IfPremiereElementsisopen,chooseFile>NewProject.2. (Optional)Tochangetheprojectsefings,clickChangeSefings,selectadifferentpreset,andclickOK.

Note:Aßeryouchangeyourprojectseflings,youcannotmodifythemlater.Ifyoudonotchangetheprojectsefings,AdobePremiereElementsusesthesefingsofyourpreviousproject.Alternatively,itcreatesanNTS/PALAVCHDfullHDprojectbasedonyourregionsefings.Youcanimportaclipwhosesefingsdonotmatchthesefingsofanemptyproject.AdobePremiereElementsoverwritestheprojectsefingswiththesefingsofyourclipwhenyoudropitontotheExpertviewtimeline.

Bydefault,thefolderwhereyousaveyourprojectalsostoresrenderedpreviews,conformedaudiofiles,andcapturedaudioandvideo.Thesefilesarelarge,sosavethemtoyourlargest,fastestharddrive.Tostorethefilesseparatelyfromprojects,chooseEdit>Preferences>ScratchDisks.OpenaprojectYoucanopenonlyoneprojectatatime.ToensurethatPremiereElementscanopenanexistingproject,ensurethatboththeprojectfile(.PRE)andthesourcefilesare331

accessibleonyourcomputer.Dooneofthefollowing:IntheWelcomescreen,clickVideoEditorandthenclickExistingProject.Choosetheprojectname.(Iftheprojectisn’tlisted,chooseOpen,selecttheprojectfile,andclickOpen.)IfPremiereElementsisopen,chooseFile>OpenProjectorOpenRecentProject;thenselecttheprojectfile,andclickOpen.InWindows®,doubleclicktheprojectfile.note:PremiereElementscanopenprojectsyoucreateinearlierversions.However,previousversionscannotopenprojectsyoucreateinlaterversions.IfyouhavemultipleversionsofPremiereElementsinstalled,openaprojectfromwithinthesoßware.Alternatively,right-click/ctrlclickthefileandchoosetheapplication.Savingandbackingupprojects

SaveaprojectBackupaprojectwithAutoSaveOpenanAutoSaveprojectSaveaprojectSavingaprojectsavesyoureditingdecisions,referencestosourcefiles,andthemostrecentarrangementofpanels.Protectyourworkbysavingoften.

Tosavethecurrentlyopenproject,chooseFile>Save.Tosaveacopyofaproject,chooseFile>SaveAs,specifyalocationandfilename,andclickSave.Tosaveacopyofaprojectandcontinueworkingintheoriginalproject,chooseFile>SaveACopy.Specifyalocationandfilename,andclickSave.Tip:TospecifywherePremiereElementsstoresproject-relatedfiles,suchascapturedvideoandaudio,andpreviews,setupascratchdisk.

BackupaprojectwithAutoSaveTorevisiteditingdecisionsorrecoverfromacrash,enabletheAutoSaveoption.ThisoptionautomaticallysavesbackupprojectfilestotheAdobePremiereElementsAuto-Savefolderataspecifiedtimeinterval.Forexample,youcansetPremiereElementstosaveabackupcopyevery15minutes.AutomaticsavingservesasanalternativetotheUndocommand,dependingontheprojectchangesbetweeneachsave.Becauseprojectfilesaresmallercomparedtosourcevideofiles,archivingmultipleversionsofaprojectconsumeslessdiskspace.

332

1. ChooseEdit>Preferences>AutoSave.2. Dooneofthefollowing,andthenclickOK:

SelectAutomaticallySaveProjects,andenterthedurationinminutesafterwhichAdobePremiereElementssavestheproject.TypeanumberfortheMaximumProjectVersionstospecifyhowmanyversionsofeachprojectfileyouwanttosave.Forexample,ifyoutype5,PremiereElementssavesfiveversionsofeachprojectyouopen.note:Eachtimeyouopenaproject,saveitatleastoncebeforetheAutoSaveoptiontakeseffect.

OpenanAutoSaveproject1.Doeitherofthefollowing:

StartAdobePremiereElements.IntheWelcomescreen,clickVideoEditorandthenclickExistingProject.InAdobePremiereElements,chooseFile>OpenProject.Intheprojectfolder,openthefileintheAdobePremiereElementsAuto-Savefolder.(Ifnofilesareavailable,theAutoSavepreferenceispossiblyturnedoff.)2.Note:WhenyoustartPremiereElementsaßeracrash,amessagepromptswhetheryouwanttoopenthelastsavedversionofyourproject.

ProjectsefingsandpresetsAboutprojectseflingsandpresetsDynamicsequencepresetCreateorchangeprojectpresetsCheckyourproject’sseflingsAboutprojectseflingsandpresetsProject sefings determine the properties of your video and audio project assets. For example, they determine their format(DV,HDV,AVCHD),source (hard disk or Flash memorycamcorder),andaspectratio(standardorwidescreenvideo).Projectsefingalsospecifytheframerate,audiosamplerate,upperorlowerfieldfirst,andbitdepthforyourproject.Whenyoustartanewproject,PremiereElementsappliesaprojectpresettoit.Aprojectpresetisacollectionofpreconfiguredprojectsefings.YoucanusethedefaultprojectpresetforthetelevisionstandardforthePremiereElementsversioninstalledonyourcomputer.NTSC(NationalTelevisionStandardsCommifee)isthetelevisionstandardfortheAmericas,theCaribbean,Japan,SouthKorea,andTaiwan.PAL(PhaseAlternatingLine)isthestandardformatforEurope,Russia,Africa,MiddleEast,India,Australia,NewZealand,SouthPacific,China,andotherpartsofAsia.

333

Becauseyoucan’tchangetheprojectpresetafterstartingaproject,verifytheformatofyoursourcefootagebeforeselectingaprojectpreset.Ifyouspecifylowerqualityseflingsforoutput(suchasstreamingwebvideo),donotchangeyourprojectseflings.Changeyourexportseflingsinstead.

DynamicsequencepresetWhenyouaddamoviecliptotheExpertviewtimeline,AdobePremiereElementsautomaticallychangesyourprojectsefingsinthebackgroundtomatchtheclipproperties.Theyincludedimension,fps,pixelaspectratio,andfieldorder.

CreateorchangeprojectpresetsAdobePremiereElementsincludesdefaultprojectpresetsformediafromcommonsources,includingDVcamcorders,cameras,DVDdiscs,andmobilephones.Youcannotcreateacustomprojectpresetsorchangeaprojectpresetafterselectingapresetandstartingaproject.Tochangetheprojectpresetwhenstartinganewproject,clicktheChangeSefingsbufonintheNewProjectdialog.Selectthepresetthatmatchesyourfootage.Ifyouaddamovieclipwhosepresetdoesnotmatchtheproject’spresettotheExpertviewtimeline,amessageappears.ClickYestoletAdobePremiereElementschangetheproject’ssefingstousetheclosestavailablepreset.Formoreinformation,seeDynamicSequencePreset.SelectaprojectpresetBydefault, PremiereElementsuses anAVCHDpreset for the television standard you specifywhen you install the program. Select a newpreset to create projects in a different format, televisionstandard,orframeaspectratio.Thepresetyouselectbecomesthedefault,whichisusedforallnewprojects,untilyouselectanotherpreset.Ifyouchooseapresettemporarily,changeitwhenyou’vefinishedusingit.

1. StartPremiereElements.2. IntheWelcomescreen,clickVideoEditor,andthenclickNewProject.(Or,chooseFile>New>Project.)3. IntheNewProjectdialogbox,clickChangeSefings.

Selectthepresetthatmatchestheformatandstandardofthefootageyouwanttoedit.Forexample,toeditmostHDVfootagefrom1080icamcorders,chooseHDV1080i30orHDV4. ClickOK.5. Provideanameandlocationforyourproject,andclickOK.

334

ChangetheseflingsofanopenprojectAfteryoucreateaproject,youcanonlymakeminordisplay-relatedchangestotheprojectsefings.Note:YoucannotchangetheEditingmodeandtheformatofPreviewfilesaßeryoucreateaproject.

1. ChooseEdit>ProjectSefings>General.2. IntheProjectSefingsdialogbox,specifyprojectsefingsforGeneral,Capture,andVideoRendering.3. ClickOK

Checkyourproject’sseflingsProjectpresetsincludeprojectsefingsunderthreecategories:General,Capture,andVideoRendering.Afteryoustartaproject,youcan’tchangemostofthesefings,suchasframerate,size,andaspectratio.However,youcanreviewthesefingstoensurethatthemediayouwanttoaddtotheprojectiscompatible.OpentheprojectinPremiereElements,andchooseEdit>ProjectSefings>[category].Note:Third-partyproducts,suchasPCs,capturecards,andhardwarebundlessometimesincludecustompresets.Seethethird-partydocumentationfordetails.NTSCvsPALpresetsNTSCpresetsconformtotheNTSCstandard,whereeachvideoframeincludes525horizontallinesdisplayedat29.97framespersecond.TheStandardNTSCpresetappliestofootagethathasa4:3aspectratio.TheWidescreenNTSCpresetappliestofootagethathasa16:9aspectratio.PALpresetsconformtothePALstandard,whereeachvideoframeincludes625linesdisplayedat25framespersecond.GeneralseflingsGeneralsefings(Edit>ProjectSefings>General)controlthefundamentalcharacteristicsofaproject.Theyincludetheeditingmodeusedtoprocessvideo,framesize,aspectratios,counttime(DisplayFormat),andplaybacksefings(Timebase).Thesesefingsmatchthemostcommonsourcemediainyourproject.Forexample,ifmostofyourfootageisDV,usetheDVPlaybackeditingmode.Thequalityofyourvideocandeteriorateifyouchangethesesefingsarbitrarily.Generalsefingsincludethefollowingoptions.EditingModeIdentifiesthetelevisionstandardandformatfortheproject.YoucannotchangetheTimebase,FrameSize,PixelAspectRatio,Fields,andSampleRatepreviewsefings.The335

editingmodedeterminesthesesefings.note:TheEditingModeseflingrepresentsthespecificationsofthesourcemedia,notthefinaloutputseflings.Specifyoutputseflingswhenyouexportaproject.TimebaseSpecifiesthetimedivisionsusedtocalculatethetimepositionofeachedit(PAL:25,NTSC:29.97).PlaybackSeflingsThisbufonisavailableifyouuseaDVpreset,aDVeditingmode,orinstallaplug-inthatprovidesadditionalplaybackfunctions.ForaDVeditingmode,thisoptionindicateswhereyouwantyourpreviewstoplay.Forinformationontheplaybacksefingsforthird-partyplugins,seethedeveloperdocumentation.FrameSizeSpecifiestheframepixelsforyourprojectplayback.Inmostcases,theframesizeforyourprojectmatchestheframesizeofyoursourcemedia.Youcan’tchangetheframesizetocompensateforslowplayback.However,youcanadjusttheplaybacksefings:Right-click/ctrlclickthemonitorandchoosePlaybackSefings.AdjusttheframesizeoftheoutputbychangingtheExportsefings.PixelAspectRatioSetstheaspectratioforpixels.Thevideoformat(PALorNTSC)determinesthisratio.Ifyouuseapixelaspectratiothatisdifferentfromyourvideo,thevideocanappeardistortedwhenyourenderitandplay.FieldsSpecifies the fielddominance,or theorder inwhichthetwo interlaced fieldsofeach framearedrawn.PremiereElementscapturesDVfootagewith fields,even if the footagewasrecordedasprogressivescan.DisplayFormat(video)Specifiesthewaytimeappearsthroughouttheproject.Thetimedisplayoptionscorrespondtostandardsforeditingvideoandmotion-picturefilm.ForDVNTSCvideo,choose30-fpsDrop-FrameTimecode.ForDVPALvideo,choose25-fpsTimecode.TitleSafeAreaSpecifiestheframeedgeareatomarkasasafezonefortitles,sothattitlesaren’tcutoffbyTVsthatzoomthepicture.Arectanglewithcrosshairsmarksthetitle-safezonewhenyouclicktheSafeZonesbufoninthemonitor.Titlesrequireawidersafezonethanaction.ActionSafeAreaSpecifiestheframeedgeareatomarkasasafezoneforactionsothatTVsthatzoomthepicturedonotexcludetheaction.Arectanglemarkstheaction-safezonewhenyouclicktheSafeZonesbufoninthemonitor.SampleRateIdentifiestheaudiosampleratefortheprojectpreset.Ingeneral,higherratesprovidebeferaudioqualityinprojects,buttheyrequiremorediskspaceandprocessing.Recordaudioatahigh-qualitysamplerate,andcaptureaudioattherateatwhichitwas336

recorded.DisplayFormat (audio)Specifies whether audio time display ismeasured by using audio samples ormilliseconds. By default, time is displayed in audio samples. However, you can display time inmillisecondsforsample-levelprecisionwhenyouareeditingaudio.CaptureseflingsCapturesefings(Edit>ProjectSefings>Capture)controlhowvideoandaudioaretransferreddirectlyfromadeckorDVcamcorder.(OtherProjectSefingspanelsdonotaffectcapturing.)VideoRenderingseflingsVideoRenderingsefingscontrolthepicturequality,compressionsefings,andcolordepththatPremiereElementsuseswhenyouplayvideofromtheExpertviewtimeline.To access Video Rendering sefings, choose Edit > Project Sefings > Video Render. These sefings include the following options:MaximumBit DepthAllows Premiere Elements to use up to 32-bitprocessing,eveniftheprojectusesalowerbitdepth.Selectingthisoptionincreasesprecisionbutdecreasesperformance.FileFormatSpecifiestheformatofthepreviewvideo.CompressorIdentifiesthecodec(compressor/decompressor)thatPremiereElementsappliestogeneratemoviepreviews.Theprojectpresetdefinesthecodec.YoucannotchangeitbecauseitmustconformtotheDVstandard.note:Ifyoudon’tapplyeffectstoyourcliporchangeitsframe/timecharacteristics,AdobePremiereElementsusestheclip’soriginalcodecforplayback.Ifyourchangesnecessitateframerecalculation,AdobePremiereElementsappliesthecodecidentifiedhere.OptimizeStillsSelectthisoptiontousestillimagesefficientlyinprojects.Forexample,youcanuseanimagethathasadurationof2secondsina30-fpsproject.PremiereElementscreatesa2-secondframeinsteadof60frames,eachwithadurationof1/30second.Deselectthisoptionifprojectsencounterplaybackproblemswhendisplayingstillimages.ProjectAssetspaneloverviewRenameasourcefileinaprojectFindaniteminaprojectLocatemissingfilesforaprojectDeleteaclipProjectAssetspaneloverviewTheProjectAssetspanelletsyoupreviewsourcematerialforyourprojects.SelecttheExpertviewandthenclickProjectAssets.Youcanviewthecontentsofaprojectusingthelistvieworthegridview.Usethepanel

337

optionsmenutoswitchbetweentheviews.Thegridviewdisplaysasnapshotofthevideoyouimportedintotheproject.TheProjectAssetspanelindicatesfilesthatyouuseintheExpertviewtimelinewithagreenicon.UsetheSearchboxtosearchforfileswithinthepanel.DisplayandarrangemediaitemsIntheProjectAssetspanel,youcandisplayitemsintheListview.TheListviewletsyouviewmoreitemssimultaneously,search,andsortitemsbypropertiessuchasmediatypeandduration.TosortitemsinListview,clickthecolumnheadingbywhichyouwanttosorttheitems.(Forexample,clickMediaTypetosortitemsbytype.)Iffoldersareexpanded,itemssortfromthetoplevelanddowntheProjectAssetspanelhierarchy.Toreversethesortorder,clickthecolumnheadingagain.ToseemoreofthecolumnheadingsinListview,dragtherightsideoftheProjectAssetspaneltotheright.Alternatively,dragthescrollbaratthebofomofthepaneltotheright.OrganizeclipsinfoldersTheProjectAssetspanelcanincludefoldersintowhichyoucanorganizeprojectcontentsinthesamewayasfoldersinWindowsExplorer.Folderscancontainmediafilesorsubfolders.Considerusingfolderstoorganizemediatypes,suchasDVcaptures,AdobePhotoshopElementsstillimages,andaudiofiles.

IntheProjectAssetspanel,doanyofthefollowing:Note:ToaccesstheProjectAssetspanel,selectProjectAssetsintheExpertview.

Toaddafolder,clicktheNewFoldericonatthebofomoftheProjectAssetspanel.Inthelistview,ifyouclickNewFoldermultipletimesinarow,eachnewfolderisnestedinsidethepreviousnewfolder.Tomoveanitemintoafolder,dragtheitemtotheFoldericon.Youcanmovefoldersintootherfolderstonestthem.Todisplaythecontentsofafolder,doubleclickthefolder.Alternatively,inListview,clickthetrianglebesidetheFoldericontoexpandthefolder.Tonavigatetoparentfolders,clicktheappropriateicon.Youcanclickandholdthisbufontoseealistofallthefoldersabovetheonecurrentlylisted.Youcanalsojumptoafolderbyhighlightingitandreleasingthemousebufon.RenameasourcefileinaprojectTorenameaclip,selectit,chooseClip>Rename,typethenewname,andpressEnter.(The

338

changeaffectsonlyreferencesused in theProject; thenameof theoriginalsource file in theProjectworkspaceandWindowsremains thesame.)Torenameanoriginalsource file,close PremiereElements,andrenamethefileinWindows.Thenexttimeyouopentheproject,PremiereElementsasksyoutolocatethefile.

Tip:Youcanalsorenameaselectedclipbyclickingitsnameoncetoselectthetext,typingthenewname,andpressingEnter.FindaniteminaprojectRight-clickanitemintheExpertviewtimeline,andselectRevealInProject.Tofindanitemontheharddrive,right-clicktheclip,chooseProperties,andnotethepathatthetopofthePropertiespanel.LocatemissingfilesforaprojectPremiereElementsdoesn’t storeoriginal source files inaproject—it references thenameand locationof each source filewhenyou import it. If you latermove, rename,ordeletea source file inWindows,theWhereIsTheFiledialogboxopenswhenyounextopentheproject.Inadditiontosourcefiles,aprojectalsoreferencespreviewfiles.Previewfilesallowyoutoprevieweffectsinrealtimewithouthavingtorenderthem—aprocessthatcantakehours.Previewfilescanberecreatedifnecessary.Note:Aßeryoucreatethefinalmovie,youcandeletesourcefilesifyoudonotplantoreusethem.Ifyouplantore-editthemovieinthefuture,archivetheprojectwith theProjectArchiverbeforedeletingsourcefiles.IntheWhereIsTheFiledialogbox,chooseoneofthefollowingoptions:DisplayOnlyExactNameMatchesDisplaysonlythefilesthatmatchthenameofthemissingfilewhentheprojectwaslastclosed.Ifyouknowthatthenameofafilehaschanged,deselectthisoption.SelectReplacesthemissingfilewiththeoriginalorreplacementfile.FindStartstheWindowsXPSearchfeature.SkipPreviewsIgnoresmissingpreviewfilessoyouaren’taskedtofindthem.SkipReplacesthemissingfilewithanofflinefile.TheofflinefileactsasaplaceholderforrelatedclipsintheProjectAssetspanelandtheExpertviewtimeline.SkipAllReplacesallmissingclipswithofflinefileswithoutaskingyouforconfirmation.DeleteaclipBecausePremiereElementsdoesn’tstoremediafilesintheproject,deletingaclipfromaprojectremovesallinstancesfromamovie.However,PremiereElementsdoesnotdeletethe339

clip’ssourcefilefromtheWindowsdesktop.Toconservediskspace,deletethesourcefile.TodeleteamediafilefromtheProjectworkspace,dooneofthefollowing:SelectthefileinthepanelandclicktheDeleteicon.Right-click/ctrlclickitintheExpertviewtimeline,andchooseDelete.YoucanalsodeletebyselectingthefileandpressingtheDeletekey.ThefileisdeletedfromtheElementsOrganizer,butitisnotdeletedfromyourharddisk.Tip:Toidentifyunuseditemsinaproject,seetheVideoUsageandAudioUsagecolumnsinListview.Todisplaythesecolumns,scrolltotheright.Agreencheckmark(listview)andagreendot(gridview)indicatesthattheassetisbeingusedintheproject.ViewingclippropertiesSeeanoverviewofbasicclippropertiesViewcomprehensivefileinformationCustomizeListviewpropertiesViewdetailsabouteffectpropertiesSeeanoverviewofbasicclippropertiesToviewthebasicpropertiesofaclip,right-click/ctrlclicktheclipintheProjectAssetspanel,chooseProperties.ViewcomprehensivefileinformationPremiereElements includestools thatyoucanusetoevaluatea file inanysupportedformatstored insideoroutsideaproject.Forexample,youcandeterminewhetheraclipyouexportedhasanappropriate data rate for Internet distribution. Video file properties can include file size, number of video and audio tracks, duration, average frame rate, audio sample rate, video data rate, andcompressionsefings.Inaddition,theyincludeinformationaboutdroppedframesincapturedclips.UsetheGetPropertiesfeaturetocheckfordroppedframesinaclipyoucaptured.UsetheDataRateAnalysisgraphstoevaluatehowwelltheoutputdataratematchestherequirementsofyourdeliverymedium.Thegraphsdepicttherenderkeyframerate,thedifferencebetweencompressionkeyframesanddifferencedframes(framesthatexistbetweenkeyframes).Theyalsodepictthedataratelevelsateachframe.Dooneofthefollowing:

IftheclipisintheExpertviewtimeline,selectitandchooseFile>GetPropertiesFor>Selection.Iftheclipisnotintheproject,chooseFile>GetPropertiesFor>File.LocatetheclipyouwanttoanalyzeandthenclickOpen.

CustomizeListviewpropertiesYoucancustomizetheListviewtodisplayonlytheinformationyouwanttosee.Youcanalso

340

renamecolumns,addcolumnsofyourown,rearrangecolumns,andchangethewidthofcolumns.SpecifywhichpropertiesappearinListviewTheNamepropertyappearsbydefault,anddisplaystheclipnameondisk.YoucannotremovetheNamepropertyusingtheEditColumnsdialogbox.Youcanchangethenametheclipusesinsidetheproject.Open the Project Assets panel. Right-click/ctrlclick in theMedia view, and choose Edit Columns. Ensure that you click an area outside the rows containing the assets. Select any of the followingpropertiesyouwanttoappearinMediaview,andclickOK:UsedDisplaysacheckmarkiftheclipisusedintheproject.

MediaTypeMedia,suchasMovieorStillImage.FrameRateTheframerateoftheclip,suchas29.97fps.MediaDurationLengthofthecapturedmediaondisk,expressedintheDisplayFormatspecifiedintheGeneralsectionoftheProjectSefingsdialogbox.note:InPremiereElements,alldurationsinapanelincludetheframesthattheInpointandOutpoint specify.Forexample, sefling the InpointandOutpoint to the same frame results inadurationofoneframe.VideoDurationThedurationofthecliptheVideoInpointandOutpointdefine.IncorporatinganyadjustmentsappliedinPremiereElements,suchaschangingtheclipspeed.AudioDurationThedurationofthecliptheAudioInpointandOutpointdefine.IncorporatinganyadjustmentsappliedinPremiereElements,suchaschangingtheclipspeed.VideoInfoTheframesizeandaspectratiooftheclip,andwhetheranalphachannelispresent.AudioInfoTheaudiospecificationsoftheclip.VideoUsageThenumberoftimesthevideocomponentofaclipisusedinthemovie.AudioUsageThenumberoftimestheaudiocomponentofaclipisusedinthemovie.StatusSpecifieswhetheraclipisonlineoroffline.Ifaclipisoffline,thisoptionalsoindicateswhy.ClientFieldforaddingaclient’snameorotherdetails.

AdjustcolumnsinListviewUsetheListviewtoquicklyevaluate,locate,ororganizeclipsbasedonspecificproperties.

341

1. OpentheProjectAssetspanel.2. Doanyofthefollowing:

Tochangethewidthofacolumn,positionthepointeroveradividinglinebetweencolumnheadingsuntiltheColumnResizeiconappears.Then,draghorizontally.Tocreateacolumn,right-click/ctrlclickandchooseEditColumns,clickAddandselectacolumnname(afterwhichthenewcolumnappears).Typeanameandchooseatypeforthenewcolumn,andclickOK.Textcolumnscancontainanytextyouenter.Booleancolumnsprovideacheckbox.Todisplayacolumn,right-click/ctrlclickandchooseEditColumns,andthenclicktheboxnexttothecolumnnameyouwanttodisplay.Tosortcolumnsinascendingordescendingorder,clicktheirheading.Torearrangecolumns,right-click/ctrlclickandchooseEditColumns,selectacolumnname,andclickMoveUp,orMoveDown.note:PremiereElementslockssomecolumnaflributes.Youcan’tlocateorchangetheseaflributesintheEditColumnsdialogbox.

Forexample,youcanchangethenamesofcolumnsyouadded,butnotthenamesofcolumnsbuiltinPremiereElements.Viewdetailsabouteffectproperties

1. SelectaclipintheQuickviewtimelineortheExpertviewtimeline.2. ClicktheAppliedEffectsbufonandviewthepropertiesintheAppliedEffectspanel.

UndochangesincrementallyIfyouchangeyourmindaboutaneditoreffect,PremiereElementsprovidesseveralwaystoundoyourwork.Youcanundoonlythoseactionsthataltervideocontent;forexample,youcanundoanedit,butyoucannotundoscrollingapanel.

Toundoorredothemostrecentchange,chooseEdit>Undo.(Youcansequentiallyundoaseriesofrecentchanges.)Toundoachange,andallsuccessivechangesthatoccurredsinceyoulastopenedaproject,deleteitfromtheHistorypanel.TostopachangethatPremiereElementsisprocessing(forexample,whenyouseeaprogressbar),pressEsc.Toundoallchangesmadesinceyoulastsavedtheproject,chooseFile>Revert.Toundochangesmadebeforeyoulastsavedaproject,tryopeningapreviousversionintheAdobe

342

PremiereAuto-Savefolder.ThenchooseFile>SaveAstostoretheprojectoutsidetheAdobePremiereAuto-Savefolder.ThenumberofchangesyoucanundodependsontheAutoSave-preferenceseflings.

UndoanypreviouschangeTheHistorypanelrecordsthechangesyoumaketoaproject.Eachtimeyouaddaclip,insertamarker,orapplyaneffect,theHistorypaneladdsthatactiontoitslist.Thetoolorcommandyouusedappearsinthepanelalongwithanidentifyingicon.Youcanusethepaneltoquicklyundoseveralchanges.Whenyouselectachangeinthepanel,theprojectreturnstothestateoftheprojectatthetimeofthatchange.Themorerecentchangesturngrayanddisappearwhenyoumakeyournextchange.TheHistorypanelrecordschangesonlyforthecurrentsession.ClosingaprojectorchoosingtheRevertcommandclearstheHistorypanel.Whilethepanellistsmostchanges,itdoesnotlistindividualchangeswithinsomepanels,nordoesitlistprogram-widechanges,suchasPreferencessefings.

TodisplaytheHistorypanel,chooseWindow>History.ToselectachangeintheHistorypanel,clickit.Todeleteaselectedchange,clickandthenclickOK.TomovearoundintheHistorypanel,dragthesliderorthescrollbarinthepanel.Or,chooseStepForwardorStepBackwardfromtheHistorypanelmenu.ToclearallchangesfromtheHistorypanel,chooseClearHistoryfromtheHistorypanelmenu,andthenclickOK.

343

CreateanInstantMoviefromtheworkspace1. FromtheQuickviewtimelineortheExpertviewtimeline,selecttheclipsthatyouwanttoincludeinyourmovie.2. FromtheActionbar,clickInstantMovie.3. Chooseathemeforyourmovieordownloadatemplate.Todownloadandonlinetemplateforyourinstantmovie:

a. Right-click/Ctrlclickthemoviethemetemplate.b. ClickDownloadNowtodownloadselectedtemplate.ClickDownloadAlltodownloadallthetemplates.c. (Optional)ClicktheDownloadInBackgroundbufontoletthecontentdownloadinthebackgroundwhileyoucontinuetoworkinAdobePremiereElements.

4. Specifythepropertiesforthemovie,asdesired:Topreviewamovietheme,movethemousecursoroverthetheme’sthumbnailtoseeadescription,andclickthePlaybufontowatchapreview.ClickNext.

OpeningandClosingTitles:Openingandclosingtitlescanbemultiplelines.However,forbestresults,keeptheopeningtitletooneline.InstantMovie:Specifieswhetheryouwanttoperformanautoedit,whichautomaticallytrimstheclipsandaddsthemtotheprojectbasedontheirSmartTags.AndwhethertoanalyzeclipsandapplySmartTagstothem.ApplyTo:Specifieswhethertoapplythethemetotheentireprojectortotheselectedclipsin

344

theQuickviewtimeline/Expertviewtimeline.Music:Specifieswhethertousethethememusic,yourownmusic(clickBrowsetolocateandopenit),ornomusic.Youcanselectmultiplemusicclips,andtheyareplayedintheorderselected.DragthesliderbetweenMusic/SoundFXandMyClipstosettheamountofsoundtrackandaudioeffectsusedversusthesoundfromyourclips.InstantMoviesyncswiththebeatsofthemusic,sochangingthesongcansignificantlychangetheresults.Inaddition,changingthesongchangesthedurationofthemovietomatchthedurationofthenewsong.SpeedAndIntensity:Enablesyoutocontrolthespeedofcutsandamountofeffect.ClickthetrianglebesidetheSpeedAndIntensityoptionandusetheslidertoadjustthespeedofcutsandamountofeffect.Duration:Specifiesthelengthofthefinishedmovie.MatchMusiccreatesamovietothelengthofthethememusic.Thisparameterletsyouspecifytheexactlengthoftimebydragginghours,minutes,andseconds.UseAllClipsensuresalltheselectedclipsareusedandbasesthelengthoftimeontheirduration.Note:Ifyouspecifyadurationthatislongerthanthethememusic,themusicwillloop.Ifthedurationisshorterthanthelengthofthethememusic,themusicendswiththelastclip.Sequence:SpecifieswhetherclipsarearrangedaccordingtotheTime/Datestamporaccordingtothetheme’seditingrules.ThemeContent:Specifieswhichaspectsofthethemeareincludedinthefinal movie. Select or deselect any of the options. If some of your clips have effects already applied, you can choose to keep the applied effects, or remove them and apply the theme’s effectsinstead.RenderPreview:Ifthisoptionisenabled,theinstantmovieisrenderedafteritiscreatedandplacedonthetimeline.Renderingimprovestheframerateofthemovieforplayback.EditanInstantMovieWhenyoucreateanInstantMovie,AdobePremiereElementscombinesalltheclipsintoasingleclip.Youcanbreakapartthiscombinedclipifyouwanttoeditorreplacetheindividualclips.UsetheReplaceClipcommandtoquicklyreplaceoneclipwithanotherwithouthavingtotrimandeditthenewcliptofit.Alternatively,changetheeffectsoroverlaysappliedtotheclip.BecauseInstantMovieiscreatedusingbeatdetectontheaddedmusicclip,changingtheAudioAddingmediaintoAdobePremiereElements

AddmediafromEmbeddedElementsOrganizerImportfromAdobeRevelAddfilesfromFilesandFoldersImportphotosfromyourdigitalcamera,phones,orremovabledriveImportfromFlip,AVCHD,cameras,phones,orremovabledrivesCapturevideofromDV/HDVcamcorders,webcams,andWDMdevices

345

Youcan add media to Premiere Elements using one of these methods:capturingfrom live or recorded sourcesimportingfiles from other types of storageaddingfrom the Project AssetspanelrecordingnarrationsfromamicrophoneWhenyouaddmediafilestoPremiereElements,theyareaddedtotheQuickviewtimelineandtheExpertviewtimeline.Inaddition,theyareaddedtotheProjectAssetspanelintheExpertview.Athumbnail,calledaclip,representseachfileintheProjectAssetspanel.Clips,whethertheycontainaudio,video,orimages,arethebuildingblocksofyourmovies.ToaddnewmediaintoPremiereElements,clickAddMedia.UseanyofthefollowingoptionsintheAddMediapaneltoaddmediafiles:AddMediapanelElementsOrganizerSelectthisoptiontoaddmediafromthealbumsinElementsOrganizer.FromtheElementsOrganizerapplication,dragvideoandimagestotheQuickview/ExpertviewtimelineortheProjectAssetspanel.AdobeRevelSelectthisoptiontoaddmediafromAdobeRevel.FromtheAdobeRevelonlinealbums,dragvideoandimagestotheQuickview/ExpertviewtimelineortheProjectAssetspanel.FilesAndFoldersImportvideos,photos,andaudiofilesfromyourpersonalcomputer’sharddrive.DigitalStillCamera,Phones,orRemovableDriveImportphotos fromacamera,mobilephone,or throughUSB.Thisoptionopens theAdobePremiereElements -MediaDownloaderwindow. ItalsoimportsmediafromdevicesthatstorevideofilesinFlash

346

memory,oronadiskFlip,AVCHD,Cameras,PhonesorRemovableDriveAddmediafromdevicesthatstorevideofilesinFlashmemoryoronadisk.SuchdevicesincludeFlipandothercompactvideocameras,AVCHD,DVD,DSLRandothercameras,andmobilephones.WebcamOrWDMDeviceCapturevideofromawebcamorWDM-compatiblecapturedevice.ThisoptionopenstheCapturewindow.DVDCamcorderorPCDVDDriveImportvideofromyourDVDbasedAVCHDcamersoryourcomputer’sDVDdrive.YoucanimportmediafilesinAVCHDformatfromaDVDCamcorder.ThisoptionopenstheAdobePremiereElements-VideoImporterwindow.Note:DVDdriveisnotdetectedinMacOS.HDVCamcorderCapturevideofromanHDVcamcorderthroughFireWire(IEEE1394).ThisoptionopenstheCapturewindow.DVCamcorderCapturevideofromaDVcamcorderthroughFireWire(IEEE1394)orUSB.ThisoptionopenstheCapturewindow.AddmediafromEmbeddedElementsOrganizer

1ClickAddMedia,andselectElementsOrganizer.TheEmbeddedElementsOrganizeroptionlaunches.2IntheEmbeddedEOworkspace,locatethealbumcontainingyourmedia.3DragoneormoremediafilestotheQuickviewtimelineorExpertviewtimelineinAdobePremiereElements.

ImportfromAdobeRevelYoucanimportmedia(photosandvideos)uploadedtolibrariesinAdobeReveltoAdobePremiereElementsEditorworkspace.MediauploadedtoAdobeRevelareavailableintheMobilealbumsectionofEmbeddedEOandAdobeRevelmenuoptions.TheAdobeReveloptionispresentunderAddMedia.ToimportmediafromAdobeReveltoPREworkspace,followthesesteps:

1ClickAddMedia>AdobeRevel.2ClickMobileAlbums.ThelibrariescreatedinAdobeRevelaredisplayedunderMobileAlbums.ClickonanAlbumtodisplaythemediapresentunderthatalbumintheAdobeReveldialogbox.Youcanclickagainonthealbumtodeselectit,thisrefreshesthemediavisibleinAdobeRevelanddisplaysallthemediaavailableintheAdobeRevellibrary.

347

3Clickonafiletoselectit.ClickAddFilestoaddittothetimeline.4ClickDoneafterimportingthefilesfromAdobeRevel.

Youcanselectmultiplefilesandaddthemtothetimeline.Also,youcandraganddropmediatospecificpointsinthevideoonthetimeline.Addfilefromfolder:ClickAddMedia,andthenclickFilesAndFolders.Locateandselectthefilesthatyouwant,andclickOpen.Toaddanentirefolder,selectitandclickImportFolder.DragfilesorfoldersfromWindowsExplorertotheProjectAssetspanel.DragfilesfromWindowsExplorerdirectlytotheQuickvieworExpertviewtimeline.Note:YoucanalsousetheElementsOrganizertoaccessfilesthatarestoredonyourharddrive.FilesthatyouaddedtotheElementsOrganizer from eitherPremiereElements orAdobePhotoshopElementsaredisplayed.Importphotosfromyourdigitalcamera,phones,orremovabledrive

1. Connectthedigitalcamera,ormobilephonetoyourcomputer.Note:Installanydriversyourdevicerequires.Consultthemanual.

2. InAdobePremiereElements,selectAddMedia>DigitalStillCamera,PhonesOrRemovableDrives,andthenclickAdvancedDialog.

AdobePremiereElements-PhotoDownloader(AdvancedDialogview)1. ChoosethedriveordevicefromtheGetPhotosFrompop-upmenu.Thumbnailsofallimportablefilesappearinthedialogbox.2. Tospecifyalocationforthesavedfiles,dooneofthefollowing:

TosavefilestothedefaultAdobefolder,leavethelocationasitappearsinthedialogbox.Tospecifyadifferentlocation,clickBrowse(Windows)/Choose(MacOS)andchooseafolder.Alternatively,clickMakeNewFolder(Windows)/NewFolder(MacOS)tocreateafolderandnameit.

348

Tocreateoneormoresubfoldersforgroupingfilesbycriteria,clickthetrianglenexttotheCreateSubfolderfield.Chooseoneoftheoptionsfromthepop-upmenufornamingthesubfolder.Torenamethefilesinthefolderconsistently,clickthetrianglenexttotheRenameFilesfield.Chooseanoptionfromthepop-upmenufornamingthefiles.Thefilenamedefaultstothefoldernameyouenter.WhenthefilesareaddedtothefolderandtheProjectAssetspanel,thefilenamesareinincrementsof0001.

1SelectfilestoaddtotheProjectAssetspanel.Acheckmarkbelowthefile’sthumbnailindicatesthatthefileisselected.Bydefault,allfilesareselected.Clickanoptiontoremovethecheckmarkandexcludeafile.YoucanalsoselectordeselectallfilesbyusingtheCheckAllbufonortheUncheckAllbufon.2Ifyouareusingmetadata,youcanselectPreserveCurrentFilenameInXMP.3ClickthetrianglenexttoApplyMetadata,selectatemplate,andfillintheCreatorandCopyrightfields.4ClickGetMedia.YoucanclickCancelintheProgressdialogboxatanytimetostoptheprocess.

Note:Ifyoudon’tintendtouseallthefilesyouadd,youcandeletethemfromtheProjectAssetspanel.Deletingfilesfromthepaneldoesn’tdeletethemfromyourharddrive.ImportfromFlip,AVCHD,cameras,phones,orremovabledrivesManytypesofdevicesotherthanDVcamcorders,HDVcamcorders,webcams,andWDMdevicesrecordandstorevideo.Usingthevideoimporter,youcanimportvideoclipsfromtapelesscamcorders,FLIPandAVCDHDcamera,removablememorydevices,andmobiledevices.Youcanalsoimportfilesfromremovablemedia,suchasDVDs,memorycards,andmultimediacards.Thesefilesarecopiedtotheharddrivelocationyouspecify.ThefilesarealsoaddedtotheProjectAssetspanel.YoucanaddclipsdirectlytotheQuickview/Expertviewtimelinewithoutfirstcreatingaproject.Whenyouaddacliptoeithertimeline,AdobePremiereElementsautomaticallychangesyourprojectsefingstomatchtheclipproperties.However,ifyouaddacliptoanexistingprojectwhosepresetdoesnotmatchtheclip’spreset,amessageappears.ClickYestoletAdobePremiereElementschangetheproject’ssefingstousetheclosestavailablepreset.Note:Imagefilescannotbeimportedusingthisoption.Toimportimages,usethePhotosFromCameras

349

OrDevicesoptionintheAddMediapanel.1.Dooneofthefollowing:

PlacetheDVDintoyourcomputer’sDVDdrive.ConnectyourcardreadersuchasSDcardormemorysticktoyourcomputer.Connectthedigitalcamera,mobilephone,orotherdevicetoyourcomputerusingtheUSB2.0port.USB2.0portNote:Installanydriversyourdevicerequires.Consultthemanual.

1. ClickAddMedia.2. Clickthedevicefromwhichyouwanttoimport:VideosFromFlipOrCamera

DVDCameraOrComputerDriveTheVideoImporterdialogboxappears.note:VideoImportercannotimportmediafromexternalharddrives.Ifyouwanttoimportmediafromanexternalharddrive,usetheFilesAndFoldersoptionintheAddMediapanel.

4. IntheSourceMenu,selectthedevicefromwhichyouwanttodownloadmovieclips.ThecontentsofthedeviceordiskaredisplayedinthepanelbelowtheSourcemenu.Thenumberoffiles,andthesizeofthecontentisdisplayedatthebofomofthepanel

containingthecontent.

5. Dooneofthefollowing:Toimportallthecontentdisplayedinthepanel,clickCheckAll.Toimportafewclips,clickdeselectAll,andselectonlythoseclipsthatyouwanttoimport.Note:Topreviewthecontentsofaclip,clicktheclip.ClickthePlaybufloninthePreviewpanel.

6. Tospecifyalocationforthesavedfiles,dooneofthefollowing:To save files to the default Adobe folder, leave the location as it appears in the dialog box. To specify a different location, click Browse (Windows)/Choose (Mac OS) and choose a folder.Alternatively,clickMakeNewFolder(Windows)/NewFolder(MacOS)tocreateandnameanewfolder.

7. SelectanamingconventionforthedownloadedfilesusingthePresetsmenu.FilenameRetainsthefilenamesthecamcorderassigns.FolderName-NumberIfyourfoldernameisWeddingPics,theclipsareassignedthenamesWeddingPics-001,WeddingPics-002,andsoon.Date-filenameAddsatimestamptothefilenamethecamcorderassigns.Thetimestampisthecurrentdateandtime-thedateandtimeonwhichthemoviesweretransferredto

350

yourcomputer.note:Torenamefiles,deletethemfromtheProjectAssetspanelintheExpertview,andreimportthem.CustomName-NumberEnteracustomnameintheNamefield.Forexample,ifyouenterMyHolidayinthefield,theclipsarenamedMyHoliday-001,MyHoliday-002,andsoon.1(Optional)Ifyouwanttodeletetheselectedfilesinthecameraafterimport,selecttheoptionAfterCopyingDeleteOriginals.2(Optional)IfyoudonotwanttheimportedclipsaddedtotheQuickview/Expertviewtimelineafterimport,deselectAddToTimeline.TheimportedclipsareaddedonlytotheProjectpanel.3(Optional)IfyouwanttocreateanInstantMovieusingtheselectedclips,selectCreateInstantMovie.4ClickGetMedia.YoucanclickCancelintheProgressdialogboxatanytimetostoptheprocess.

Note: If youdon’t intend touse all the files you add, you candelete them from theProjectAssetspanel.Deleting files from thepaneldoesn’tdelete them from yourharddrive.Thispractice isrecommendedforlargeVOBfiles.CapturevideofromDV/HDVcamcorders,webcams,andWDMdevicesDevices,suchasDVcamcorders,HDVcamcorders,webcams,andWDMdevicescapturelivevideo.UsingtheCapturewindow,youcapturelivevideofromthesedevicesandcopythevideoclipstotheharddrivelocationyouspecify.YoucanaddtheseclipstoAdobePremiereElementsbydraggingthemfromWindowsExplorertotheQuickview/Expertviewtimeline.YoucanalsodragtheclipstotheProjectAssetspanelintheExpertview.Alternatively,usetheFileAndFoldersoptionintheAddMediapaneltoaddtheclipstotheQuickview/Expertviewtimeline.1.Dooneofthefollowing:

TurnonthewebcamtocapturelivefootageConnecttheDVcamcorder,HDVcamcorder,ortheWDMdevicetoyourcomputerusingtheFireWire(IEEE1394)port.FireWireportNote:Installanydriversyourdevicerequires.Consultthemanual.

1. ClickAddMedia.2. FromtheAddMediapanel,selecttheoptionforthedeviceusingwhichyouwanttocapturevideo:

351

DVCamcorderHDVCamcorderWebcamOrWDMTheCapturewindowappears.

4.IntheCapturingSourcemenu,selectthedevicefromwhichyouwanttocapturevideoclips.ThevideothatthedevicecapturesisdisplayedinthepanelbelowtheCapturingSourcemenu.Note:Youcanextractframesusingstopmotionorfullmotionfromtheintegratedcamera’swebcamfeed.

1. ClicktheCapturebufon.2. Specifyanameforthecapturedvideo.3. Tospecifyalocationforthevideo,dooneofthefollowing:

To save files to the default Adobe folder, leave the location as it appears in the dialog box. To specify a different location, click Browse (Windows)/Choose (Mac OS) and choose a folder.Alternatively,clickMakeNewFolder(Windows)/NewFolder(MacOS)tocreateandnameanewfolder.

1. ClickAddMediaandselectFilesAndFolders.2. BrowsetothelocationwhereyousavedthevideofilesandaddthemtotheQuickview/Expertviewtimeline.

Note:YoucanalsouseWindowsExplorertolocatethesavedvideofilesanddragthemtoAdobePremiereElements.Addnumberedimagefilesasasingleclip

1Makesurethateachstill-imagefilenamehasthecorrectfilenameextension.Allfilenamesinthesequencemustcontainanequalnumberofdigitsbeforetheextensionforexample,file000.bmp,andfile001.bmp.2Dooneofthefollowing:ClickAddMediaandchooseFilesAndFolders.ChooseFile>AddMediafrom>FilesAndFolders.

3. Locateandselectthefirstimageinthesequence.FromtheFilesOfTypemenu,selectNumberedStills,andclickOpen.PremiereElementsinterpretsallofthenumberedfilesasasinglesequence.

352

note:Forinformationonchangingthedurationofimages,see“Setdurationforimportedimages”inHelp.5.1audioimportDragclipstotheMonitorwindowAdobePremiereElementsfacilitatesimportingandplayingclipswith5.1audiointhesameformatastheprojectpreset.YoucancreatemoviescombiningAVCHDvideoandstereoaudioand5.1audioandstereoaudio.YoucanmoveclipsfromtracktotrackintheExpertviewtimelineregardlessofwhethertheaudiois5.1orstereo.Ifyouimport5.1audiofiletothestereochannel,itisconvertedto5.1andtheotherwayround.Tocreatea5.1channeltrack,draga5.1ontotheemptyareaontheExpertviewtimelineofastereoproject.Alternatively,dragachannelaudiovideoclipora5.1channelaudioonlyclip.A5.1channeltrackinastereoprojectiscreated.Tocreateastereotrackina5.1channelproject,drag-and-dropastereoclipintotheemptyareaonExpertviewtimeline.Astereotrackina5.1channelprojectiscreated.1.Dooneofthefollowing:

FromtheWelcomescreen,clickNewProject.IfAdobePremiereElementsisopen,chooseFile>NewProject.

1. ClickChangeSefingstochangethepresetused.SelectFullHD1080i305.1channelfromtheAVCHDfolder,andclickOK.2. IntheNewProjectdialogbox,specifyanameandlocationfortheproject,andclickOK.IntheExpertviewtimeline,youcansee5.1besidetheAudiotracks.Youcannowincludeclipsto

yourproject.However,theaudioismappedtoachanneltypedependingonhowyouinsertthemediafile.

DragclipstotheMonitorwindowWhenyoudragclipsontotheMonitorwindow,theaudioismappedtothechanneltypeofAudio1track.However,whenyoudragontotheMonitorwindow,youarepresentedwiththefollowingadditionaloptions.Theaudiomappingschangedependingontheoptionyouselect.InsertAherThisSceneAudioismappedtotheAudioonetrack,andtheclipisinsertedintheVideo1/Audio1track.Theclipisinsertedattheendoftheexistingclip.SplitAndInsertAudioismappedtotheAudio1track,andtheclipisinsertedintheVideo1/Audio1track.ThecurrentclipissplitatthepointwheretheCTIispointing.Theclipisinserted.

353

PlaceOnTopIfthereisanemptytrackaboveVideo1/Audio1,theselectedclipisinsertedonthattrack,andmappedtothecorrespondingtrack’schanneltype.Ifthereisnoemptytrack,anewtrackiscreatedmatchingthechanneltypeoftheselectedclip.AdobePremiereElementsplacesthevideoontheCTI,inatrackabovetheexistingvideo.Thenewvideofileoverlapstheexistingvideoclip.PictureInPictureIfthereisanemptytrackaboveVideo1/Audio1,theselectedclipisinsertedonthattrack,andmappedtothecorrespondingtrack’schanneltype.Ifthereisnoemptytrack,anewtrackiscreatedmatchingthechanneltypeoftheselectedclip.AdobePremiereElementsplacestheexistingandtheinsertedvideossimultaneously.Theusercanseeboththevideos.PlaceOnTop,AndApplyVideomergeIfthereisanemptytrackaboveVideo1/Audio1,theselectedclipisinsertedonthattrackandmappedtothecorrespondingtrack’schanneltype.Ifthereisnoemptytrack,anewtrackiscreatedmatchingthechanneltypeoftheselectedclip.AdobePremiereElementsplacesthevideoontheCTI,inatrackabovetheexistingvideoandappliesVideomergeeffectonthenewvideo.Theunderlyingandthetopvideoscanbeseen.ReplaceClipTheclipisreplacedandthemappingmatchesthechanneltypeofthereplacedclip’strack.Note:Whenyoudropanaudio-onlyclipintotheMonitorwindow,itisplacedontheSoundtracktrackandmappedtostereo.CreatingspecialtyclipsAddcolorbarsanda1-kHztoneCreateandaddablackvideoclipCreateacoloredmafleforabackgroundChangethetonelevelofclipsYougenerateSpecialtyclipsbyusingpaneloptionsintheProjectAssetspanel.TheyresideintheProjectAssetspanelalongwithyouraddedclips.Youcancreateuniversalcountingleaders,colorbars,a1-kHztone,blackvideo,andcoloredbackgroundsforyourproject.UseSpecialtyclipsforcalibrationofyourvideoorsimplyasfootage.CreateandaddablackvideoclipYouaddblackvideoclipstoseparatemultiplemoviesortocreatepausesinamovie.Youcanalsouseablackvideoclipforatitle.

1. ClickProjectAssets.2. IntheProjectAssetspanel,clickNewItemfromthepaneloptionsandchooseBlackVideo.

354

CreateacoloredmafleforabackgroundYoucancreateaclipconsistingofafull-framemafeofsolidcolor,whichyoucanuseasasolidbackgroundfortitlesoranimatedclips.Brightlycoloredmaflescanserveastemporarybackgroundstohelpyouseetransparencymoreclearlywhileyouadjustakeyeffect.

1. ClickProjectAssets.2. IntheProjectAssetspanel,clickNewItemfromthepaneloptionsandchooseColorMafe.3. ChooseacolorintheAdobeColorPickerdialogbox,andclickOK.AcolormafeclipisplacedintoboththeProjectAssetspanelandtheExpertviewtimeline.

Changethetonelevelofclips1.Selectaclipusingoneofthefollowingmethods:

Tosetthelevelforallnewclipinstances,clickNewItemfromthepaneloptionsintheProjectAssetspanel.Then,selecttheBarsAndToneoption.Tosetthelevelforonlyoneclipinstance,selecttheclipintheExpertviewtimeline.

1. ChooseClip>AudioOptions>AudioGain.

2. IntheClipGaindialogbox,dooneofthefollowing,andclickOK:Dragthevaluecontrollefttodecrease,orrighttoincrease,volume.Highlightthevaluecontrolandtypeanumbertoincreaseordecreasevolume.Positivenumbersincreaseit.Negativenumbersdecreaseit.TheNormalizeoptionadjuststhepeakamplitudeintheselectedclipstotheuser-specifiedvalue.Forexample,thisoptionadjuststhegainofaclipwithapeakamplitudeof-6dBto+6dB.EnsurethatNormalizeAllPeaksToissetto0.0dB.Guidelinesforaddingfiles

GuidelinesforaddingvideofilesGuidelinesforaddingaudiofilesGuidelinestoaddimagefilesGuidelinesforaddingananimationorstill-imagesequenceGuidelinesforaddingvideofilesYoucanaddvariousvideofileformatstoyourproject.Importedvideoandsequencefilescanhaveframesizesupto4096x4096pixels.Beforeyouaddvideofilesthatyoudidnotcaptureyourself,makesureyoucanviewthevideooutsidePremiereElements.Usually,doubleclickingavideofileopensaplayback355

application,suchasWindowsMediaPlayerandQuickTimeplayer.(Besuretousethemostup-to-dateversionofWindowsMediaPlayer.)Ifyoucanplaybackyourfileintheplayerapplication,youcanusuallyusethatfileinPremiereElements.note:ToplaybackVOB(VideoObject)files,usetheDVDplayerthatcamewithyourDVDburner.Whenaddingvideofiles,considerthefollowing:MPEGfilecompatibilityAnMPEGfilecanbeimportedorplayedinPremiereElementsifitmeetsthefollowingcriteria:ThefilemustbeinaformatthatPremiereElementssupports.The compressor used to create the file must be compatible with the Premiere Elements decompressor. The compatibility requirements for playing compressed files are less stringent than therequirementsforeditingthem.MPEGfilesthatplayinWindowsMediaPlayerandQuickTimecanbeimportedorplayedinPremiereElementsiftheymeetthecompatibilityrequirements.note:ThefirsttimeyouimportanMPEG-2file,PremiereElementsautomaticallyactivatesthecomponentsifyouareconnectedtotheInternet.IfyouarenotconnectedtotheInternet,youarepromptedtoactivatetheMPEG-2component.TheinstructionsappearintheActivatingComponentdialogbox.Type1AVIfilerenderrequirementsRenderthesefilesbeforeyoucanpreviewthemfromyourDVcamcorder.TorenderaType1AVIclip,add it to theQuickview/Expertviewtimeline.Buildapreviewfileof thatsectionof theQuickview/ExpertviewtimelinebypressingEnter.Iftheclipmustberendered,aredlineappearsabovetheclipintheQuickview/Expertviewtimeline.DVDfileprotectionIftheDVDisamotion-picturediscthatusescopyprotection,youcannotaddthefiles.GuidelinesforaddingaudiofilesWhenyouaddaudiofilestoaproject,theyareconformedtotheaudiosampleratespecifiedintheProjectSefingsdialogbox.Duringthatprocess,you’llseeaprogressbarinthelower-rightcorneroftheapplicationwindow.Youcanplaybackconformedaudioinstantlyathighqualitybecauseit’sconsistentwithallotheraudiointheproject.Bydefault,conformedaudioisstoredatthelocationC:\Users\<username>.<domain>\AppData\Roaming\Adobe\Common.Youcanchangethedefaultlocationofthemediacachebychoosingoneofthefollowingoptions:356

(Windows)Edit>Preferences>ScratchDisks.(MacOS)AdobePremiereElements12>Preferences>ScratchDisks.Note:Aßeryouconformanaudioclip, youdon’thave toconfirm itagainunless youdelete thecorresponding file in theMediaCache folder. If youdeleteconformedaudio files,PremiereElementsregeneratesthemwhenyouopenrelatedprojects.Whenaddingaudiofiles,considerthefollowing:StereoandmonofilesYoucanaddmanyofthestereoaudiofilesthatyoucanopeninanotheraudioplayer,suchasWindowsMediaPlayer,toyourproject.Tocreateastereoversionofamonofile,themonochanneliscopiedtoboththeleftandrightchannelinthenewstereotrack.Inthiscase,bothchannelscontainthesameinformation.5.1surroundsoundfilesImportingclipscontaining5.1audioaddsa5.1-channelaudiotracktoyourproject.mp3andWMAfilesFormatssuchasmp3andWMAarecompressedusingamethodthatreducessomeoftheoriginalaudioquality.Toplaybackcompressedaudio,PremiereElements(likemostvideoeditingapplications)mustdecompressandpossiblyalterthefile’ssamplerate.Compressingcandegradetheaudioquality.CDfilesIfyouwanttoaddaudiofromaCD,copy,orrip,theaudiotrackstoyourharddriveusinganotherapplication.WindowsMediaPlayer,includedwithWindowsXP,canperformthistask.YoucanalsouseAdobeAuditiontoriptheCDatvariousqualitysefingsandperformcomplexaudio-processingfunctionsonthefile.Ifyouplantoairordistributeyourmovie,ensurethatyouownthecopyright,orhavelicensedthecopyrighttoyourCDaudio.InternetfilesYoucandownloadmusicfromtheInternetforyourprojects.WMA(WindowsMediaAudio)andAAC(QuickTime)filescanhavepre-encodedsefingsthatdon’tallowyoutoplaytheminPremiereElements.ImportingPicturesGuidelinestoaddimagefilesBydefault,PremiereElementsscalesimagestofittheprojectframesize.Youcanoverridethisbehaviorandinsteadaddyourfilesatthesizeatwhichtheywerecreated.YoucanalsosetthedefaultdurationforallimagesthatyouaddbychangingthevalueinGeneralPreferences.Youcanaddstillimageswithframesizesupto4096x4096pixels.Createfileswithframesizeequaltoormorethantheframesizeofyourvideo.Choosingtheappropriateframesize

357

ensuresthatyoudon’tenlargetheimageinPremiereElements.Whenyouscaleupanimage,itoftenbecomespixelated.Createitatalargerframesizethantheproject.Forexample,ifyouplantoscaleanimage200%,createtheimageatdoubletheprojectframesizebeforeyouaddit.Youcanalsoaddanimations,whicharesavedasasequenceofnumberedstill-imagefiles.Whenaddingstill-imagefiles,considerthefollowing:PhotoshopElementsfilesPremiereElementsworkswellwithimagesandvideotemplatesyoucreateinPhotoshopElements.JPEGfilesIfyouarehavingtroubleimportingJPEGfilestoPremiereElements,opentheminPhotoshopElementsandresavethem.Thentrytoimportthemagain.TIFFimagesYoucanaddfilesfromPhotoshop3.0or later.However,PremiereElementsdoesn’tsupport16-bitTIFFimagescreatedinPhotoshoporotherapplications.Empty(transparent)areasofnonflafenedPhotoshopfilesappeartransparentinPremiereElementsbecausethetransparencyisstoredasanalphachannel.RGBmodeWhenyouareeditingorcreatingyourstillimages,makesurethatyoudoallofyourworkinRGBmode.Formoreinformation,consultyourproduct’suserguideaboutcolormanagement.RGBmodeproducescolorsthataresuitableforvideo.Guidelinesforaddingananimationorstill-imagesequenceTheframesinananimationaredrawnasgraphicsand,therefore,arenotscenesofliveaction,asinconventionaldigitalvideo.PremiereElementscanalsoaddasequenceofnumberedstill-imagefilesandautomaticallycombinethemintoasingleclip;eachnumberedfilerepresentsoneframe.Someapplications,suchasAdobeAfterEffects®,cangenerateanumberedsequenceofstillimages.Imagesinastill-imagesequencecannotincludelayers.Flafenimagesthatarepartofasequence.Forinformationonlayersandflafening,seethedocumentationfortheapplicationthatcreatedthefile.Note:ChangingthedefaultdurationofstillimagesinthePreferencesdialogboxdoesnotaffectthedurationofstillimagesthatarepartofasequence.Whencreatingthree-dimensionalimagesoranimationsforuseinPremiereElements,usethefollowingguidelineswheneverpossible:Usebroadcast-safecolors.Mostapplicationsthatcreateanimations(suchasAdobeAfterEffects)allowyoutocheckforbroadcast-safecolors.Seeyourapplication’sdocumentationformoreinformation.

358

UsethepixelaspectratioandframesizespecifiedintheprojectsefingsinPremiereElements.Usetheappropriatefieldsefingstomatchyourproject.YoucanuseanAdobeapplication(suchasPhotoshop)togeneratethesequence.SelectEmbedProjectLinktoopenthesequenceintheapplicationthatwasusedtocreateit.Forexample,selectaPSDfileintheProjectAssetspanelinPremiereElements.Then,chooseEdit>EditOriginaltoopenthefileinPhotoshopwiththeoriginallayersintact.SetdurationforimportedstillimagesChangethedefaultdurationforstillimagesSetauniquedurationforastillimageWhenyouaddastillimage,youcanassignaspecificdurationtoit.ThedurationspecifieshowmuchtimetheimageoccupiesintheQuickview/Expertviewtimeline.Youcansetadefaultdurationforallstillimagesthatyouadd,andyoucanchangetheirdurationintheQuickview/Expertviewtimeline.Theframerateofyourprojectdeterminestheamountoftimethatacertainnumberofframesoccupies.Ifyouspecify30framesfora29.97frame-per-second(fps)NTSCproject,eachstillimagehasadurationofaboutonesecond.ForPAL,ifyouspecify25framesfora25-fpsproject,eachstillimageintheQuickview/Expertviewtimelinehasadurationofonesecond.Changethedefaultdurationforstillimages

1. Dooneofthefollowing:OnWindows,selectEdit>Preferences>General.OnMacOS,selectAdobePremiereElements12>Preferences>General.Right-click/ctrlclickintheProjectAssetspanelandchooseStillImageDuration.

2. ForStillImageDefaultDuration,specifythenumberofframesyouwantasadefaultduration.Note:ChangingthedefaultdurationofstillimagesdoesnotaffectthedurationofstillimagesalreadyintheQuickview/ExpertviewtimelineorProjectAssetspanel.Toapplythenewdefaultlengthtoallstillimagesinyourproject,deletethemfromtheProjectAssetspanelandreimportthemintoyourproject.

Setauniquedurationforastillimage1.Dooneofthefollowing:

IntheExpertview,positiontheSelectiontoolovereitherendoftheimage,anddrag.SelecttheclipandchooseClip>TimeStretch.EnteranewdurationandclickOK.359

Workingwithscratchdisks•Aboutscratchdisks•Typesofscratchdisks•Setupascratchdisk•MaximizingscratchdiskperformanceAboutscratchdisksWhenyoueditaproject,PremiereElementsusesdiskspacetostorescratchfilesforyourproject.Theseincludecapturedvideoandaudio,conformedaudio,andpreviewfiles.AdobePremiereElementsusesconformedaudiofilesandpreviewfilestooptimizeperformance,allowingreal-timeediting,highprocessingquality,andefficientoutput.Allscratchdiskfilesarepreservedacrossworksessions.Ifyoudeleteconformedaudiofiles,PremiereElementsautomaticallyrecreatesthem.Ifyoudeletepreviewfiles,theyarenotberecreatedautomatically.Bydefault,scratchfilesarestoredwhereyousavetheproject.Thescratchdiskspacerequiredincreasesasyourmoviebecomeslongerormorecomplex.Ifyoursystemhasaccesstomultipledisks,chooseEdit>Preferences>ScratchDisks/AdobePremiereElements12>Preferences>ScratchDisks.SpecifythedisksPremiereElementsusesforthesefiles.Forbestresults,setupyourscratchdisksattheverybeginningofaproject,beforecapturingorediting.TypesofscratchdisksWhileperformancecanbeenhancedbysefingeachscratchdisk type toadifferentdisk,youcanalsospecify folderson thesamedisk.SelectEdit>Preferences>ScratchDisks /AdobePremiereElements12>Preferences>ScratchDiskstosetthefollowingscratchdiskoptions.CapturedVideoFolderordiskforvideofilesandstop-motionstillimagefilesthatyoucaptureusingtheCapturepanel.CapturedAudioFolderordiskforaudiofilesthatyoucaptureusingtheCapturepanel.VideoPreviewsFolderordiskforvideopreviewfiles.ThesefilesarecreatedwhenyouchooseTimeline>RenderWorkArea,exporttoamoviefile,orexporttoaDVdevice.Ifthepreviewedareaincludeseffects,theeffectsarerenderedatfullqualityinthepreviewfile.AudioPreviewsFolderordiskforaudiopreviewfiles.ThesefilesarecreatedwhenyouchooseTimeline>RenderWorkAreacommand.TheyarealsocreatedwhenyouchooseClip>AudioOptions>RenderAndReplace,exporttoamoviefileorDVdevice.Ifthepreviewedareaincludeseffects,theeffectsarerenderedatfullqualityinthepreviewfile.MediaCacheFolderordiskforaudiopeakfiles,audioconformfiles,videoindexfiles,and360

otherfilesPremiereElementscreatestoimproveperformancewhenreadingmediafiles.DVDEncodingFolderordiskforencodedvideoandaudiofilesthataregeneratedwhenyoucreateaDVD.Note:PremiereElementsplacespreviewfiles,encodedfiles,mediacachefiles,andothertypeswithinsubfoldersofthefoldersyouspecifyforthesetypes.Eachsubfolderisnamedforthetypeofscratchfilesitcontains.SetupascratchdiskYousetupscratchdisksintheScratchDiskspanelofthePreferencesdialogbox.Toverifytheamountoffreediskspaceontheselectedvolume,seetheboxtotherightofthepath.Ifthepathistoolongtoread,placethepointeroverthepath,andthefullpathappearsinatooltip.

1. ChooseEdit>Preferences>ScratchDisks/AdobePremiereElements12>Preferences>ScratchDisks.2. Foreachscratchdisktype,specifyadisklocationforPremiereElementstostorethecorrespondingfiles.Chooseoneoftheseoptionsfromthepop-upmenu:

MyDocumentsStoresscratchfilesintheMyDocumentsfolder.SameAsProjectStoresscratchfilesinthesamefolderwheretheprojectisstored.CustomIndicatesthatthecurrentpathisn’tinthepop-upmenu.Thecurrentpathisn’tchangeduntilyouclickBrowsetospecifyanyavailabledisklocation.

MaximizingscratchdiskperformanceIfyourcomputerhasonlyoneharddisk,considerleavingallscratchdiskoptionsattheirdefaultsefings.Ifithasmorethanone,chooselarge,secondaryharddrivesforscratchdisksandnotthemainloaddrive.InPremiereElements,youcanplaceeachtypeofscratchfileontoitsowndisk.Forexample,youcopyvideotoonediskandaudiotoanother.DefragmentscratchdisksregularlybyusingtheDiskDefragmentertoolinWindowsorathird-partyutility.TousetheDiskDefragmentertool,chooseStart>AllPrograms>Accessories>SystemTools>DiskDefragmenter.Formoreinstructions,seethedocumentationprovidedwithWindowsorthethird-partyutility.Specifyyourfastestharddisksforcapturingmediaandstoringscratchfiles.Youcanuseaslowerdiskforaudiopreviewfilesandtheprojectfile.Specifyonlydisksafachedtoyourcomputer.Thethroughputfromaharddiskonanetwork

361

istooslow.AvoidusingremovablemediaasscratchdisksbecausePremiereElementsalwaysrequiresaccesstoscratchdiskfiles.Scratchdiskfilesarepreservedforeachproject,evenwhenyouclosetheproject.PremiereElementsreusesthesefileswhenyoureopentheprojectassociatedwiththem.Ifscratchdiskfilesarestoredonremovablemediaandthemediaisremovedfromthedrive,thescratchdiskisnotavailabletoPremiereElements.

You can divide a single disk into partitions and set up each partition as a virtual scratch disk.However, partitioning doesn’t improve performance because the single drivemechanism is abofleneck.Forbestresults,setupscratchdiskvolumesonactualseparatedrives.Workingwithofflinefiles

AboutofflinefilesEditanofflinefileReplaceanofflinefilewithafileonyourcomputerAboutofflinefilesAnofflinefileisaplaceholderforasourcefilethatPremiereElementscannotcurrentlyfindonyourharddrive.Offlinefilesrememberinformationaboutthemissingsourcefilestheyrepresent.IfanofflinefileappearsintheQuickview/Expertviewtimeline,a“MediaOffline”messageappearsinthemonitorandintheQuickview/Expertviewtimeline.Editanofflinefile

1IntheExpertview,clickProjectAssets.2IntheProjectAssetspanel,doubleclicktheofflinefile.WhereIsTheFile[nameofthefile]dialogboxappears.Locatethesourcefile,selectthefile,andclickSelect.3Right-click/CtrlclickthefileandselectEditOriginaltoeditthefile.

Replaceanofflinefilewithafileonyourcomputer1IntheExpertview,clickProjectAssets.2IntheProjectAssetspanel,selectoneormoreofflinefiles.3ChooseEdit>LocateMedia.4Locateandselecttheactualsourcefile,andclickSelect.Note:Ifyouselectedmorethanoneofflinefile,theAflachWhichMediadialogboxappearsinturnforeachfileyouselected.Payaflentiontotheofflinefilenameinthetitlebarofthedialogboxsothatyourelinkthecorrectsourcefiletoeachofflinefile.

Workingwithaspectratiosandfieldoptions

362• Understandingaspectratios•Capturingoraddingvariousaspectratios•Viewaproject’saspectratio•Adjustpixelaspectratioforastillimageorsourceclip•Usesquare-pixelfilesinaD1orDVproject•Setfieldoptionsforimportedinterlacedvideo

UnderstandingaspectratiosTheaspectratiospecifiestheratioofwidthtoheight.Videoframeshaveanaspectratio(frameaspectratio)asdothepixelsthatmakeuptheframe(pixelaspectratio).Somevideocamcorderscanrecordvariousframeaspectratios,andtheNTSCandPALvideostandardsusedifferentpixelaspectratios.Ifanimageofacircleappearsoval-shaped,therecanbeamismatchbetweentheaspectratiosoftheimageandyourproject.PremiereElementsautomaticallyafemptstodetectandcompensateforthepixelaspectratioofsourceclipssothatdistortiondoesn’toccur.IfaclipappearsdistortedinPremiereElements,youcanmanuallychangeitspixelaspectratio.It’simportanttoreconcilepixelaspectratiosbeforereconcilingframeaspectratios.Misinterpretationofasourceclip’saspectratiocausesincorrectframeaspectratio.FrameaspectratioFrameaspectratiodescribestheratioofwidthtoheight inthedimensionsofan image.Forexample,DVNTSChasa frameaspectratioof4:3 (or4.0widthby3.0height).Forcomparison,a typicalwidescreenframehasaframeaspectratioof16:9;manycamcordersthathaveawidescreenmodecanrecordusingthisaspectratio.Manyfilmsareshotusingevenwideraspectratios.A4:3frameaspectratio(left),andawider16:9frameaspectratio(right)

Whenyouaddclipsintoaprojectwithadifferentframeaspectratio,decidehowtoreconcilethedifferentvalues.Youcanshowawidescreenmoviewitha16:9frameaspectratioonastandardTVwitha4:3frameaspectratiointwoways.UsetheLeferboxingtechniquetofittheentirewidthofthe16:9frameintoablack4:3frame.Blackbandsappearaboveandbelowthewidescreenframe.

363

Alternatively,usethePanandscantechniquetofillthe4:3framewithonlyaselectedareaofthe16:9frame.Althoughthistechniqueeliminatestheblackbars,italsoeliminatespartoftheaction.PremiereElementsautomaticallyleferboxesany16:9footagethatyouaddintoa4:3aspectratioproject.PixelaspectratioPixelaspectratiodescribestheratioofwidthtoheight inasinglepixelofa frame.Pixelaspectratiosvarybecausedifferentvideosystemsmakedifferentassumptionsaboutthenumberofpixelsrequiredtofillaframe.Forexample,manycomputervideostandardsdefineaframethathasa4:3aspectratioas640x480pixels.Pixelsthataresquare,whichhaveanaspectratiothemselvesof1:1,perfectlyfillthehorizontalandverticalspacetheframedefines.However,videostandardssuchasDVNTSC(standardforDVcamcordersintheU.S.)definea4:3aspectratioframeas720x480pixels.Consequently,tofitallofthesepixelsintheframe,thepixelsmustbenarrowerthanthesquarepixels.Thesenarrowpixelsarecalledrectangularpixels,andtheyhaveanaspectratioof0.9:1,or0.9astheyarecommonlycalled.DVpixelsareverticallyorientedinsystemsproducingNTSCvideoandhorizontallyorientedinsystemsproducingPALvideo.PremiereElementsdisplaysaclip’spixelaspectrationexttotheclip’simagethumbnailintheProjectAssetspanel.

Ifyoudisplayrectangularpixelsonasquare-pixelmonitor,imagesappeardistorted,forexample,circlesdistortintoovals.However,whendisplayedonabroadcastmonitor,theimagesappearcorrectlyproportionedbecausebroadcastmonitorsuserectangularpixels.PremiereElementsexportsclipsofvariouspixelaspectratioswithoutdistortion.Itautomaticallyadjuststhepixelaspectratioofyourprojecttothepixelaspectratiooftheclips.YoucanencounteradistortedclipifPremiereElementsinterpretspixelaspectratioincorrectly.Correctthedistortionbymanuallybyspecifyingthesourceclip’spixelaspectratio.PixelandframeaspectratiosA.Squarepixelsand4:3frameaspectratioB.Nonsquarepixelsand4:3frameaspectratioC.

Nonsquarepixelsdisplayeduncorrectedonasquare-pixelmonitor

364

CapturingoraddingvariousaspectratiosPremiereElementsafemptstoautomaticallycompensateforpixelaspectratiosandpreservetheframesizeofaddedimages.Imagesthatyouaddaretreatedinthefollowingways:AddvideowithD1resolution720x486orDVresolution720x480.PremiereElementsautomaticallysetsthevideo’spixelaspectratiotoD1/DVNTSC(0.9).ForafootagewithD1orDVresolution720x576,PremiereElementssetsitspixelaspectratiotoD1/DVPAL(1.067).However,ithelpstoseetheProjectAssetspanelortheInterpretFootagedialogboxtoensurethatallfilesareinterpretedcorrectly.Premiere Elements automatically assigns pixel aspect ratios to files by using the Interpretation Rules.txt file in the Premiere Elements/Plug-in folder. If a specific type of image is consistentlymisinterpreted(distorted),modify theentries intheInterpretationRules.txt file. Ifyouwanttooverridethepixelaspectratio interpretationfor filesalready inaproject,usetheInterpretFootagecommand.TochangethesizeofaclipinPremiereElements,selecttheclipandchangetheScalepropertyoftheMotioneffect.TheMotioneffectisavailableinthePropertiesviewwiththeclipselectedintheExpertviewtimeline.Viewaproject’saspectratioThepresetyouchoosewhenyoustartaprojectsetsthepixelaspectratiofortheproject.Youcan’tchangetheaspectratioafteritisinitiallyset.ChooseEdit>ProjectSefings>General.AdjustpixelaspectratioforastillimageorsourceclipTocombinediversefootagewithinaprojectandgenerateanoutputwithoutdistortingsourceimages,ensurethatallfilesareinterpretedcorrectly.Note:Whenyousetthepixelaspectratioofafile,useitsoriginalratio,nottheratiooftheprojectandfinaloutput.

1. IntheExpertview,clickProjectAssets.2. Selectthestillimageorsourceclip.3. ChooseFile>InterpretFootage.4. InthePixelAspectRatiosection,selectUsePixelAspectRatioFromFiletousetheoriginalratioofthefile.Alternatively,chooseoneofthefollowingfromtheConformTomenu:

365

SquarePixelsUsesa1.0pixelaspectratio.Usethissefingifyoursourcecliphasa640x480or648x486framesize.Youcanalsousethissefingifthefilewasexportedfromanapplicationthatsupportsonlysquarepixels.D1/DVNTSCUsesa0.9pixelaspectratio.Usethissefingifyoursourcecliphasa720x480or720x486framesize.Thissefingletsyoumaintaina4:3frameaspectratiofortheclip.Usethissefingforclipsexportedfromanapplicationthatworkswithnonsquarepixels,suchasa3Danimationapplication.note:FormoreinformationaboutD1,seetheGlossaryinPremiereElementsHelp.D1/DVNTSCWidescreenUsesa1.2pixelaspectratio.Usethissefingifyoursourcecliphasa720x480or720x486framesize.Thissefingletsyoumaintaina16:9frameaspectratio.D1/DVPALUsesa1.0666pixelaspectratio.Usethissefingifyoursourcecliphasa720x576framesizeandyouwantittomaintaina4:3frameaspectratio.D1/DVPALWidescreenUsesa1.4222pixelaspectratio.Usethissefingifyoursourcecliphasa720x576framesizeandyouwantittomaintaina16:9frameaspectratio.Anamorphic2:1Usesa2.0pixelaspectratio.Usethissefingifyoursourceclipwasamorphicallytransferredfromafilmframewitha2:1aspectratio.HDAnamorphic1080Usesa1.333pixelaspectratio.

Usesquare-pixelfilesinaD1orDVprojectYoucanusesquare-pixelfootageinaDVprojectandgenerateoutputthatdoesnotappeardistorted.PremiereElementseither“upsamples”(increases)or“downsamples”(decreases)theresolutionofafilethatdoesnotmatchtheprojectframesize.Downsamplingresultsinahigher-qualityimage.Createfilesthatarelargerthantheproject’sframesizesothatPremiereElementsneednotupsampleandenlargethem.

Preparethefilebyusingoneofthefollowingmethods,andthencaptureoraddthefiletoPremiereElements:IfyourfinaloutputisDV(NTSC),createandsaveitata720x540framesize.Savingatthisframesizepreventsupsamplingor640x480topreventfielddistortiononafield-renderedfile.IfyourfinaloutputisDV(PAL),createandsaveitata768x576framesize.Savingatthisframesizepreventsupsamplingandfielddistortiononafield-renderedfile.IfyourfinaloutputisD1(NTSC),createandsaveitata720x540framesize.Theframesizeofasquare-pixelimagecanmatchtheframesizeofyourproject(for

366

example720x480).However,iftheyhavedifferentpixelaspectratios,redesigntheimageusingadifferentframesize(suchas720x540).Redesigningisnecessarywhentheapplicationyouusetopreparethefiledoesn’tsupportnonsquarepixels.

SetfieldoptionsforimportedinterlacedvideoInmostvideo,eachframeconsistsoftwofields.Onefieldcontainstheodd-numberedlinesintheframe,andtheothercontainstheeven-numberedlines.Thefieldsareinterlaced,orcombined,tocreatethecompleteimage.AdobePhotoshopElementsincludesareversefieldorderpresetforvideoimportedfromaharddiskorFlashmemorycamcorderthatusesupperfieldsfirst.Youcancapturesourcefootagewithupperfieldsfirst.Forthisfootage,ensurethatyourprojectuseseithertheStandardorWidescreenpresetfromtheFlashMemoryCamcorderspresetsfolder.Ordinarily,interlacingisn’tapparenttoaviewer.However,eachfieldcapturesthesubjectatadifferenttime.Duetothetimedifference,playingaclipinslow-motionorcreatingafreezeframemakesthetwofieldsdiscernible.Youobservethesamebehaviorwhenyouexporta frameasastill image.Toavoidthissituation,youcandeinterlacethe image.Deinterlacingeliminatesonefieldandeitherduplicatesorinterpolatesthelinesoftheremainingfield.Reversingthefielddominance,theorderinwhichthefieldsarerecordedanddisplayed,cancauseplaybackproblems.Whenthefielddominanceisreversed,motionappearsjerkybecausethefieldsnolongerappearinchronologicalorder.Fieldsarereversedwhentheoriginalvideotape’sfielddominanceistheoppositeofthefielddominanceofthevideo-capturecardusedtocapturetheclip.Fieldsare also reversedwhen the field dominance of the original videotape and the video-editing software are opposite to each other.Reversing can alsohappenwhen you set an interlaced clip to playbackward.Toavoidthesecomplications,youcandeinterlacetheimage.Deinterlacingeliminatesonefieldandeitherduplicatesorinterpolatesthelinesoftheremainingfield.Youcanalsosetfieldoptionsforaninterlacedclipsothattheclip’spictureandmotionqualityarepreservedincertainsituations.Theseincludechangingtheclipspeed,exportingafilmstrip,playingaclipbackward,orfreezingavideoframe.

1SelectaclipintheExpertviewtimeline,andchooseClip>VideoOptions>FieldOptions.2SelectReverseFieldDominancetochangetheorderinwhichtheclip’sfieldsappear.Thisoptionisusefulwhenthefielddominanceoftheclipdoesn’tmatchyourequipmentorwhenyouplayaclipbackward.3ForProcessingOptions,selectoneofthefollowingchoices,andclickOK.

367

NoneDoesnotprocesstheclip’sfields.InterlaceConsecutiveFramesConvertspairsofconsecutiveprogressive-scan(noninterlaced)framesintointerlacedfields.Thisoptionisusefulforconverting60fpsprogressive-scananimationsinto30-fpsinterlacedvideobecausemanyanimationapplicationsdon’tcreateinterlacedframes.AlwaysDeinterlaceConvertsinterlacedfieldsintowholeprogressive-scanframes.PremiereElementsdeinterlacesbydiscardingonefieldandinterpolatinganewfieldbasedonthelinesoftheremainingfield.ItkeepsthefieldspecifiedintheFieldSefingsoptionintheProjectSefings.IfyouspecifiedNoFields,PremiereElementskeepstheupperfieldunlessyouselectedReverseFieldDominance,inwhichcaseitkeepsthelowerfield.Thisoptionisusefulwhenfreezingaframeintheclip.FlickerRemovalPreventsthinhorizontaldetailsinanimagefromflickeringbyslightlyblurringthetwofieldstogether.Anobjectasthinasonescanlineflickersbecauseitcanappearonlyineveryotherfield.

SupporteddevicesSupportedfiletypesforimportVerifywhetherAdobePremiereElementssupportsthefileformatandthedevicefromwhichyouimportthefile.SupportedfiletypesforimportIn addition to capturing footage, you can import image, video, and audio files.Youcan add files from folders on your computer, accessory hard drives, and mobile phones.Youcan also add filesfromDVDs,Blu-raydiscs,CDs,digitalcameras,otherdevices,ortheInternet.AdobePremiereElements12.0supportsDV,HDV,WDM,andAVCHDformafedvideo.FilesthatyouaddtoaprojectarevisibleintheProjectAssetspanelintheExpertview.AdobePremiereElementsautomaticallyaddsthemtoElementsOrganizer.note:Somefileformatsrequireactivationofcomponentsbeforeyoucanaddthemtoaproject.SupportedvideoformatsAdobeFlash®(.swf)AVIMovie(.avi)AVCHD(.m2ts,.mts,.m2t)DVStream(.dv)MPEGMovie(.mpeg,.vob,.mod,.ac3,.mpe,.mpg,.mpd,.m2v,.mpa,.mp2,.m2a,.mpv,.m2p,.m2t,.m1v,.mp4,.m4v,.m4a,.aac,3gp,.avc,.264)QuickTimeMovie(.mov,.3gp,.3g2,.mp4,.m4a,.m4v)TOD(.tod)WindowsMedia(.wmv,.asf)-Windowsonlynote:Toimportvideofrommobilephones(.3gpand.mp4),youmusthavethemostrecentversionofQuickTimeinstalledonyourcomputer.

368

SupportedimageformatsAdobePhotoshop®(.psd)AdobePremiereElementstitle(.prtl)Bitmap(.bmp,.dib,.rle)CompuServeGIF®(.gif)JPEG®(.jpg,.jpe,.jpeg,.gif)PixarPicture(.pxr)PortableNetworkGraphic(.png)RAW(.raw,.raf,.crw,.cr2,.mrw,.nef,.orf,.dng)SupportedaudioformatsAdvancedAudioCoding(.aac)Dolby®AC-3(.ac3)Macintosh®AudioAIFF(.aif,.aiff)MP3®Audio(.mp3)MPEG®Audio(.mpeg,.mpg,.mpa,.mpe,.m2a)QuickTime(.mov,.m4a)WindowsMedia(.wma)-WindowsonlyWindowsWAVE(.wav)note:DolbyAC-3isimportedasastandalone.ac3fileoraspartofanencodedaudiofileina.vob(DVD)or.mod(JVC®Everio)file,butexportedasDolbyDigitalStereoonly.ActivateacomponentforimportSome file formats such asMPEG-2,MPEG4(SP), andAMR require component activation before you can add them to a project. If you are connected to the Internet, component activation occursautomatically.IfyouarenotconnectedtotheInternet,theActivatingComponentdialogboxappears.

1. WhentheActivatingComponentdialogboxappears,connecttotheInternet.2. IntheActivatingComponentdialogbox,clickCopytocopytheserialnumber.3. ClicktheURLtogototheactivationwebsite.4. PastetheserialnumberintotheIDboxonthewebsite.5. Copythekey,pasteitintheActivatingComponentdialogbox,andthenclickOK.

Thewebsitedisplaysakeyforunlocking.SharingfilesbetweenAdobePremiereElementsandAdobePhotoshopElementsYoucanaccessallimagesinaPhotoshopElementscatalogdirectlyfromtheElementsOrganizerworkspaceofPremiereElements.Youcanalsoadd,edit,andmanageyourimages,andthendragthemtotheQuickview/ExpertviewtimelineofAdobePremiereElementsforuseinyourproject.AdobePhotoshopElementsandPremiereElementsaredesignedtoworktogether,whetheryoupurchasetheproductsseparatelyorbundledinonepackage.Theseprogramsseamlesslycombinedigitalphotographyandvideoediting,lefingyoucreateexcitingvideoprojects.Thetwoprogramssupportmanyofthesamefiletypes,whichmakesthetransferofmostfilesbetweenthemeasyandefficient.Forexample,youcancatalogPSDfilesinPhotoshopElementsandthenaddthemtotheQuickview/Expertviewtimelinedirectlyfromthe369

ElementsOrganizerinPremiereElements.note:ThePhotoshopElementsOrganizershowsclipsofaudioAVIfileswithbrokenvideothumbnailicons.However,theyplaycorrectly.ThePhotoshopElementsEditorcanimportindividualvideoframesfromASF,AVI,MPEG,andWindowsMediafiles.(ChooseFile>Import>FrameFromVideo.)HereareafewwaysyoucansharefilesbetweenPhotoshopElementsandPremiereElements:Organizeyourphotos,videoclips,andaudioclipsineitherPremiereElementsorPhotoshopElements.FindtheassetsusingElementsOrganizerineitherapplicationandaddthemtoaproject.CapturevideoinPremiereElementsandopenitfromtheElementsOrganizerandcreateandeditstillimagesfromthevideo.(Windowsonly)Createaslideshow inPhotoshopElements6.0or laterwithcaptions, transitions,effects,music,narration,graphics,andtitles. Import theslideshow intoPremiereElements toeditfurtherorburntoDVD.Alternatively,importindividualphotosintoPremiereElementsandcreatetheslideshowthere.note:TheSendToAdobePremiereElementscommandinPhotoshopElementsworksonlywhenyouusePhotoshopElements6.0orlaterwithAdobePremiereElements4.0orlater.CustomizemenutemplatesinPhotoshopElements,andthenusetheminyourPremiereElementsproject.(MenutemplatesarePSDfilesstoredinthePremiereElementsapplicationfolder.)CreateaPhotoshopElementsfilewithyourvideoproject’ssefings,enhanceitinPhotoshopElements,andthenuseitinPremiereElements.CreateandaddablackvideoclipYouaddblackvideoclipstoseparatemultiplemoviesortocreatepausesinamovie.Youcanalsouseablackvideoclipforatitle.

1. ClickProjectAssets.2. IntheProjectAssetspanel,clickNewItemfromthepaneloptionsandchooseBlackVideo.

CreateacoloredmafleforabackgroundYoucancreateaclipconsistingofafull-framemafeofsolidcolor,whichyoucanuseasasolidbackgroundfortitlesoranimatedclips.Brightlycoloredmaflescanserveastemporarybackgroundstohelpyouseetransparencymoreclearlywhileyouadjustakeyeffect.

370

1. ClickProjectAssets.2. IntheProjectAssetspanel,clickNewItemfromthepaneloptionsandchooseColorMafe.3. ChooseacolorintheAdobeColorPickerdialogbox,andclickOK.AcolormafeclipisplacedintoboththeProjectAssetspanelandtheExpertviewtimeline.

Changethetonelevelofclips1. Selectaclipusingoneofthefollowingmethods:

Tosetthelevelforallnewclipinstances,clickNewItemfromthepaneloptionsintheProjectAssetspanel.Then,selecttheBarsAndToneoption.Tosetthelevelforonlyoneclipinstance,selecttheclipintheExpertviewtimeline.

2. ChooseClip>AudioOptions>AudioGain.3. IntheClipGaindialogbox,dooneofthefollowing,andclickOK:Dragthevaluecontrollefttodecrease,orrighttoincrease,volume.Highlightthevaluecontrolandtypeanumberto

increaseordecreasevolume.Positivenumbersincreaseit.NegativenumbersdecreaseMovethroughtheExpertviewtimelineWhen placing and arranging clips in the Expert view timeline,move the current-time indicator to the appropriate location. In the time ruler, the current-time indicator corresponds to the framedisplayedintheMonitorpanel.Averticallineextendsfromthiscurrent-timeindicatorthroughallthetracks.ZoominginandoutoftheExpertviewtimelinecanhelpyouidentifytheexactlocationforplacingacliporperforminganedit.IntheExpertviewtimeline,doanyofthefollowing:Dragthecurrent-timeindicator.Clickthetimerulerwhereyouwanttopositionthecurrent-timeindicator.PressShiftwhiledraggingthecurrent-timeindicatortosnapittotheedgeoftheclosestclipormarker.Dragthetimedisplay(belowtheMonitorpanel)tothedesiredtimevalue.Clickthetimedisplay(atthebofomoftheMonitorpanel),typeavalidtime,andthenpressEnter.(Youneednottypeleadingzeros,colons,orsemicolons.However,AdobePremiereElementsinterpretsnumbersunder100asframes.)YoucanusetheHomeorEndkeysonthekeyboardtoskipbetweenthebeginningandendofthemovie.

371

The PageUp and PageDown keysmove the current-time indicator to the previous and next clipsrespectively.TheRight orLeßArrowkeysmove the current-time indicator forward orbackby aframe.PressingShiß+RightArroworShiß+LeßArrowmovesthecurrent-timeindicatorforwardorbackbyfiveframeseachtime.AddclipstotheExpertviewtimelineWhenyouinsertaclipintotheExpertviewtimeline,adjacentclipsonalltracksshifttoaccommodatethenewclip.Byshiftingallclipstogether,theaudioandvideooftheexistingclipsremaininsync.Sometimes,youdon’twantallclipstoshiftwitheachinsertion.Forexample,whenyouaddbackgroundmusicthatsuperimposestheentiremovie,youdon’twantclipstoshift.Toshiftspecificclipstogather,presstheAltkeyasyouinsert.Atatime,youcanshiftspecificclipssimultaneouslyonamaximumoftwotracks.Theseincludethetrackreceivingtheinsertionandthetrackcontainingthelinkedaudioorvideo(ifany).Theaffectedtracksshifttogether,remainingaligned.Theclipsonothertracksareunaffected.Insertaclip,shihclipsintheExpertviewtimelineDooneofthefollowing:DragtheclipfromtheProjectAssetspaneltothedesiredlocationintheExpertviewtimeline.WhenthepointerchangestotheInserticon,releasethemouse.Movethecurrent-timeindicatortothedesiredlocationintheExpertviewtimeline.ThenselecttheclipintheProjectAssetspanelandchooseClip>Insert.Insertaclip,shihclipsononlythetargetandlinkedtracksAlt-dragtheclipfromtheProjectAssetspaneltothedesiredlocationintheExpertviewtimeline.WhenthepointerchangestotheInserticon,releasethemouse.Ifyoudragaclipintotheblankspaceabovethetopmostvideotrack(forvideo)orbelowthelowestaudiotrack(foraudio),AdobePremiereElementscreatesanewtrackfortheclip.Iftheclipcontainsbothaudioandvideo,itcreatesbothanewvideoandnewaudiotrack.OverlayaclipintheExpertviewtimelineTheeasiestwaytoreplaceaportionofavideoistooverlayitwithotherfootage.Whenyouoverlayaclip,theclipyouaddreplacesanyexistingframesstartingatthelocationyoudesignate.Ifthenewclipis40frameslong,itoverlays40framesoftheexistingclip.Theframesfollowingtheoverlay,ifany,remainatthesamelocationinthetrack.Overlaysdonotchangethelength372

ofthemovieunlesstheoverlayextendsbeyondtheendofthemovie.Dooneofthefollowing:Ctrl-drag/Cmd-dragtheclipfromtheProjectAssetspaneltothefirstframeyouwanttooverlay.WhenthepointerchangestotheOverlayicon,releasethemouse.Movethecurrent-timeindicatortothefirstframeyouwanttooverlay,selecttheclipintheProjectAssetspanel,andthenchooseClip>Overlay.PlaceoneclipaboveanotherintheExpertviewtimelineYoucanplaceoneclipaboveanotherwithoutreplacingasectionofthelowerclipasisdonewithanoverlay.Youcanuseclipsstackedinthisway,forexample,withvariouskeyingeffects.

1. IntheExpertviewtimeline,dragthecurrent-timeindicatortoalocationaboveavideoclipwhereyouwanttooverlayanotherclip.2. Shift-dragaclipfromtheProjectAssetspanel,anddropitontotheMonitorpanel.3. ChoosePlaceOnTop.

AdobePremiereElementsdropsthesecondclipintothefirstavailablevideotrackatthelocationofthecurrent-timeindicator.ReplaceaclipintheExpertViewtimelineToreplaceaclipinthemiddleoftheExpertviewtimeline,withoutalteringthelengthorchangingtheeffectsoroverlays,usetheReplaceClipcommand.Thisoptionisusefulwheneditingexpandedinstantmovies.

1. FromtheProjectAssetspanel,selecttheclipyouwanttouse.2. IntheExpertviewtimeline,right-click/ctrlclicktheclipyouwanttoreplaceandchooseReplaceClipFromProjectAssets.

Iftheincomingclipislongerinduration,itistrimmedfromtheendtomatchtheexistingdurationoftheoutgoingclip.Iftheincomingclipisshorterinduration,awarningmessageappearsgivingyouthechoicetocancelthereplaceactionoruseblackframestofilltheexcessduration.Select,move,align,anddeleteclipsintheExpertviewtimelineAfteryou’veaddedacliptoyourmovie,youmayneedtorearrangeclips,copyandpastescenes,anddeleteotherclips.Severaltechniquesletyouselectindividualclips,arangeofclips,oronlytheaudioorvideoportionofalinkedclip.

373

SelectclipsintheExpertviewtimelineUsingthemousecursor,doanyofthefollowing:Toselectasingleclip,clicktheclipintheExpertviewtimeline.Iftheclipislinkedorgrouped,clickingoneclipselectstheotherlinkedorgroupedclips.Toselectonlytheaudioorvideoportionoflinkedclips,Alt-clickthedesiredclip.Toselectasingleclipwithinagroup,Alt-clickthedesiredclip.Toselectmultipleclips,Shift-clickeachclipyouwant toselect. (Shift-clickaselectedclip todeselectit.)Toselectsequentialclips,dragarectangle(marqueeselection)thatincludestheclipsyouwanttoselect.Toaddarangeofclipstothecurrentselection,Shift-dragamarqueearoundtheclips.Selectingarangeofclipsbydraggingamarquee

MoveaclipintheExpertviewtimeline

YoucaneasilyrearrangeclipsintheExpertviewtimelinebydragging.Byusingthesametechniquesyouusetoaddaclip,youcanchoosetoinsertoroverlayclipswhenyoumovethem.Tomoveaclipandinsertitsoalltracksshiftafterinsertion,dragthecliptothedesiredlocation.WhenthepointerchangestotheInserticon,releasethemousebufon.Tomoveaclipandoverlayanotherclipinthemovie,dragthecliptothefirstframeyouwanttooverlay,andthenpressCtrl/Cmd.WhenthepointerchangestotheOverlayicon,releasethemousebufon.Tomoveonlyoneclipofalinkedpair,Alt-selecttheclipyouwanttomove.Dragittothedesiredlocation.Ifyouwanttoshiftclipsonlyonthetargettracks,releasethemousebufonwhenthepointerchangestotheInserticon.Ifyouwanttooverlayanotherclip,presstheCtrlkey,andwhenthepointerchangestotheOverlayicon,releasethemouse.AlignclipsbyusingtheSnapoptionTheSnapoption,whichisenabledbydefault,makesiteasiertoalignclipswitheachotherorwithparticularpointsintime.YoucanmoveaclipwiththeSnapoptionselected.Theclip374

automaticallyalignswiththeedgeofanotherclip,amarker,thestartandendofthetimeruler,orthecurrent-timeindicator.Snappingalsohelpsensurethatyoudon’tinadvertentlyperformaninsertoroverlayeditwhendragging.Asyoudragclips,apop-upwindowdisplaysthedistance,inframes,thatyouhavemovedthem.Anegativenumberindicatesyou’vemovedthemtowardthebeginningofthemovie.ChooseTimeline>Snap.Acheckmarkindicatesthattheoptionisenabled.DeleteaclipintheQuickviewtimelineorExpertviewtimelineDeletingaclipfromamoviedoesn’tdeleteitfromtheproject.TheclipisstillavailableintheProjectAssetspanel.

1. IntheQuickviewtimelineorExpertviewtimeline,selectoneormoreclips.(Alt-clicktoselectonlytheaudioorvideoportionofaclip.)2. Dooneofthefollowing:

Todeleteclipsandleaveagapofthesameduration,calledclearing,chooseEdit>Delete.Todeleteaclipandclosetheresultinggap,calledarippledeletion,chooseEdit>DeleteAndCloseGap,orpresstheDeleteorBackspacekey.Note:WhenaclipisdeletedfromtheQuickviewtimeline,atransitionthatfollowstheclipisalsodeleted.WhenaclipisdeletedfromtheExpertviewtimeline,theprecedingandfollowingtransitionsaredeleted.DeleteemptyspacebetweenclipsintheExpertviewtimelineYoucanquicklydelete empty spacebetweenclips in theExpert view timelinebyusing theDeleteAndCloseGapcommand.Alternatively, press theDeleteorBackspacekey.Both techniques shiftadjacentclipsovertofillthegap.IntheExpertviewtimeline,dooneofthefollowing:Right-clicktheemptyspace,andchooseDeleteAndCloseGap.Selectthespaceyouwanttodelete,andpresstheDeleteorBackspacekey.note:Ifthegapissmallanddifficulttoselect,movethecurrent-timeindicatortothegapandclicktheZoomInbuflon.CreateaduplicateclipintheExpertviewtimelineEachtimeyoudragasourceclipfromtheProjectAssetspaneltotheExpertviewtimeline,youcreateaclipinstance.Thisinstancesharesthesourceclip’sdefaultInandOutpoints.IfyoudeletethesourceclipintheProjectAssetspanel,allinstancesoftheclipintheExpertview375

timelinearedeleted.TocreateclipinstanceswithdifferentdefaultInandOutpoints,duplicatethesourceclipintheProjectAssetspanel.IfyoudeleteaduplicateclipintheProjectAssetspanel,allinstancesofitintheExpertviewtimelinearedeleted.LinkvideoandaudioclipsMostvideoincludesasoundtrack.IntheProjectAssetspanel,clipsthatcontainbothvideoandaudioappearasasingleitem.WhenyouaddthecliptoamovieintheExpertviewtimeline,thevideoandaudioappearonseparatetrackswiththevideodirectlyabovetheaudio.Thevideoandaudioremainlinked.WhenyoudragthevideoportionintheExpertviewtimeline,thelinkedaudiomoveswithit,andviceversa.Forthisreason,audio/videopairsarecalledlinkedclips.IntheExpertviewtimeline,thenamesoflinkedclipsareunderlinedandidentifiedwitha[V]forvideoor[A]foraudio.Linkedclipssharesamenamewitheither[V]or[A]appendedandareunderlined.Alleditingtasks(suchasmoving,trimming,orchangingtheclipspeed)actonbothpartsofalinkedclip.YoucantemporarilyoverridethelinkbypressingtheAltkeywhenyouinitiateeditingtasks.Youcanalsoplacethevideooraudioportionseparately.

Linkandunlinkvideoandaudioclips

Youcanlinkavideoclipandanaudioclipsothattheyactasaunit.Whenyouselect,trim,split,delete,move,orchangethespeedofone,youaffecttheotherclipaswell.Youcantemporarilyoverridethelinkasneeded.IntheExpertviewtimeline,thenamesoflinkedclipsareunderlinedandidentifiedwitha[V]forvideoor[A]foraudio.Tolinkvideoandaudioclips,Shift-clickavideoandaudiocliptoselectthemboth,andthenchooseClip>LinkAudioAndVideo.Tounlink videoandaudio clips, select a linkedclip andchooseClip>UnlinkAudioAndVideo. (Though the audio and video areunlinked, they areboth still selected.Reselect either clip touse itseparately.)376

Toselectlinkedclipsindividually,Alt-clickthedesiredclip.Afterselectingit,youcanmoveortrimtheclipindependentlyofitslinkedclip.Toquicklydeleteanaudioorvideoclipwithoutunlinkingit,right-click/ctrlclicktheclipandchooseeitherDeleteAudioorDeleteVideofromthemenu.Deleteonlytheaudioorvideoportionofalinkedclip

IntheExpertviewtimeline,dooneofthefollowing:Right-click/CtrlclickthelinkedclipandchooseDeleteAudioorDeleteVideo.

Alt-clicktheaudioorvideoportiontoselectitalone,andpresstheDeleteorBackspacekey.SelectalinkedclickandchooseClip>UnlinkAudioAndVideo.ReselecteitherclipandchooseEdit>ClearorEdit>DeleteAndCloseGap.Theclipsshiftovertofillthegapleftbythedeletedclip.EnableanddisableclipsOccasionally,youmightwanttodisableaclipwhileyoutryadifferenteditingideaortoshortentheprocessingtime.DisablingacliphidesitwhenyouviewthemovieintheMonitorpanelorwhenyouexportthemovie.Youcanstillmoveorchangeadisabledclip.

SelectoneormoreclipsintheQuickviewtimelineortheExpertviewtimeline,andchooseClip>Enable.Thecheckmarknexttothecommanddisappearswhenyoudisableaclip,andtheclipappearsdimmedintheQuickviewtimelineandtheExpertviewtimeline.

HandonActivitiesStarTrekTransporterEffectStep1:TheFilesandProjectThefirsttaskistogathertherequiredfilesandcreatetheproject.

(1)TheTransportSceneThefirstandmostimportantvideoclipbeginswithanemptyscene.Thesubjectwalksintoshotandassumestheir“materialized”position,thenbeginsactingasiftheyhadjustbeamedin.Ifyouwanttomakeyourowntransportereffectyouwillobviouslyneedtoprovidethisshotyourself.Note:Theshotmustbesteady—useatripod.

377

(2)TheTransporterSparklesThesecondvideoclipprovidesthesparklingeffect.Thisisafive-secondclipoffull-screenflickeringsparklesonablackbackground.Youcanmakeyourownsparklesordownloadtheclipusedinthistutorial(below).

(3)TheAudioFile

Wewillalsoaddatransportersoundeffectwhichisthesamedurationasthesparklevideoclip.2Tutorial:GhostEffectCreatingaghosteffectforvideoisquitesimple,aslongasyouhaveaneditingpackagecapableofusinglayersandsefinglayeropacity.Firstofall,setthecamerauponatripodandframetheshot.Shootthesceneempty(withouttheghost),thenshootthesceneagainwiththeghostactor.It’sveryimportantthatbothversions(takes)oftheshotareframedidentically,sodon’tmovethecameraatall.Thebackgroundalsoneedstobestill.Importbothtakesoftheshotintoyoureditingprogram(AdobePremiereinthiscase).Placetheemptyshotonthefirstvideotrackandtheghostshotonthenexttrack.Settheopacityoftheghostshottoaround30%,orwhateversefingachievesthebestresult.

378

KnowledgeCheckPointsQ1)howdoyoushowkeyframingonavideotrack.Ans:Youcanseekeyframesbytwirlingdownthetriangleandopeningaviewtrack.Therelivesakeyframepopupwhereyoucanshowkeyframes,showOpacitykeyframesorhidekeyframes.

OpacityhasitsownmenuoptionbecauseIcanonlyassumeit’sthemostoftenaccessedparameterforthingslikefadinguponaclip.OfnoteisthefactthatwithShowKeyframesselectedyoucanthenchoosewhattypeofkeyframestoshowonaPERCLIPbasiswiththeclipkeyframemenu:ThereyoucanevenchoosekeyframesforthingslikefiltereffectsaswellastheusualMotion,OpacityandTimeRemapping

379

Q2)HowtoImportfile?Answer:ThenopenupAdobePremier.Youthenneedtoclick‘file’,‘import’

Nowmakesureyouclickonthefirstimageinthesequence,(normallynamed000000).Thencheckthe‘imagesequence’box.Itwillthenbringinthewholesequence.

380

Thesequencewillnowbereadyforediting.AndClickopenQ3)Howtofademusicinandoutformontagewithadobepremierepro?Ans:movethetimelinecursortowhereyouwanttheaudiotostarttofadeout

2)ontheuppermiddlewindowinpremiere,makesureyouareontheEffectControlstab3)expandVolume(thisshouldbeontheleftcolumnitactuallysaysfxVolume)3)youwillnoticeBypassandLevelnow…expandLevel 4)clickon0.0dBthisshouldsetakeyframeatthecurrentpointonthetimeline..leaveitat

that5)movethetimelinecursertoagoodspotwhereyou’dlikethevolumetobeLOW

6)adjustthe0.0dBbyholdingdowntheleft-clickanddraggingdown.ifitgoesintothenegativedBs,thevolumeisdecreasing

7)findaspotforwhereyouwantthevolumetostarttoincreasebacktonormalagainbydraggingthetimelinecursoronceagain.thenadjustthedBasneeded..thiswillagaincreateakeyframe

381

Q4)Howtouploadavideofromadobepremierepro?Ans:GotoYouTube.Clickuploadclickbrowse.gointocomputerthere’sprobablysomethingalongthelinesof‘CD’or‘disk’thereclickitchoosethefileyouwanttouploaddone.Q5)CanaFCPprojectbebroughtintoCS6?PremiereProCSsixsupportsFCPXMLsoprojectscanbebothimportedandexportedfromPremiereProtoFinalCutPro.ExportyourentireprojectfromFinalCutProasanXMLandthenimportthatXMLintoPremierePro.Youmayhavetoreconnectsomemediaanditmightnotbeaonehundredpercenttranslationbutit’sactuallyquiteeasyprocess.Q6)Howtobringonetimelinefromoneprojecttoanother?Ans:ThesimplestmethodisyouhaveaprojectopenthatyouwanttomoveaselectsequencefromistojustselectthesequenceandCOPY.ThenopenthenextprojectandPASTE.Thatwillpastethatnewsequenceintotheedit.Notethatallthemediathatisinthatnewtimelinewillgetnewitemscreatedintheprojectaswell.AmoreinterestingmethodistodoaFile>ImportandchooseaPremiereProprojectthatcontainsasequenceyouwanttoimport.You’llgetanoptionimportanentireprojectoraselectedsequence:ChooseImportSelectedSequencesandyoucanchooseexactlywhateditstoimport:

382

That’soneofthejoysofDynamicLinkingamongsttheCreativeSuiteapplications,greatinterchange.Q7)Howcanyoumoveacliptoadifferentlayerwithkeyboardshortcuts?Ans:You’relookingfortheoptionuparrow,downarrowshortcutthatFinalCutProusestomoveclipsupanddownintohigherandlowervideotracksoraudiotracks.PremiereProCS6doesnothavetheshortcutorasimilarkeyboardshortcut.It’stoobadasthisisoneofthoseliflefeaturesthatFinalCutProhasthatworksverywellandisveryuseful.PleaseAdobeaddsuchashortcutorsomethingsimilar.Q8)Howcanyouremoveaudiofromvideoclipquicklyinthetimeline?Ans:Theaudiocanbeginbeforethevideoorextenditafterthevideointothenextclip(orviceversa).Trimminglinkedaudioandvideoseparatelyiscalledasplitedit.Usually,whenyoucreateaspliteditinoneclip,youmustcreateoneintheadjacentclipsotheydon’toverlapeachother.Youcancreatetwokindsofsplitedits:

•AJ-cut,oraudiolead,inwhichaudiostartsbeforelinkedvideo,orvideocontinuesafter383

theaudio.•AnL-cut,orvideolead,inwhichvideostartsbeforelinkedaudio,oraudiocontinuesafterthevideo.

1. IntheExpertviewtimeline,selecttheclip.2. Iftheclipisadjacenttoanother,Alt-dragtheaudioportiondowntoaseparatetracksothereisemptyspacenexttoit.3. (Optional)Movethecurrent-timeindicatortothevideoframeyouwanttotrim,andmakesureSnapisenabledwithacheckmark.(Ifitisn’t,chooseTimeline>Snap.)4. Positionthepointerovertheedgeofthevideoclipyouwanttotrim,anddooneofthefollowing:

Iftrimmingthebeginningoftheclip,whentheTrim-Iniconappears,pressAltanddragtheedgetothedesiredframe.(YoucanreleasetheAltkeyafteryoubegindragging.)Noticethatthevideostaysalignedwiththepreviousclip.Iftrimmingtheendoftheclip,whentheTrim-Outiconappears,pressAltanddragtheedgetothedesiredframe.(YoucanreleasetheAltkeyafteryoubegindragging.)Noticethatsubsequentclipsinthetrackshiftleft.

Q9.HowcanIaddnewvideotracks?Ans:Youhaveavideoandyouwanttoreplacethesoundtrackwithoneofyourcreationsoranothertrack?MakeuseofWindowsMovieMaker(itcomeswithWindows-ifthiswasnotthecaseyoucandownloadithere:WindowsMovieMaker).Wewillproceedinfoursteps:

•ImportVideo•Removethesoundofthevideo•Create/Addanewaudiotrack•SaveVideoImportVideoFirstly,runWindowsMovieMaker.Generally,itisfoundinStartMenuAllProgramsAccessories,butitdependsonyourversionofWindows.

•Startbyimportingthevideo.Todothis,clickon“ImportMedia”(ordirectlyonthe“Video”tab).

384•Nowthevideoispresentintheimportedmedia.•Draginthetrack“Video.”

Removethesoundofthevideo•Openthe“Video”toshowtheaudiotrack.•Nowrightclickontheaudiotrackofthevideoandselect“Mute”.

Create/AddanewaudiotrackTorecordyourvoiceifyouwanttoinsertitinthevideo,youcanuse:

•TherecordersoftwareofWindows(usuallyitisinStartMenuAllProgramsAccessories).•OranaudioeditingsoftwarelikeAudacity.•Savethefileasanmp3orWMA,forWindowsMovieMakercompatibility.•Justasyouopenedthevideo,Openthenewaudiotrack.•Oncethefilesareimported,itwilldraginthenewaudiotrackandnottheoneofthevideo.•Justclickon“PublishtoThisComputer“

Q10.HowcanIcopyandpasteclipstothesametracks?Ans:CopyandpastekeyframesinaTimelinepanelWhenyoupastekeyframesintoaTimelinepanel,theearliestkeyframeappearsatthecurrenttimeandtheotherkeyframesfollowinrelativeorder.Thekeyframesremainselectedafterpasting,soyoucanfine-tunetheirlocation.Youcanpastekeyframesonlytoacliportrackthatdisplaysthesamepropertyasthecopiedkeyframes.Also,PremiereProcanpastekeyframesatthecurrent-timeindicatorononlyonecliportrackatatime.Becausethecurrent-timeindicatorcanspanmultiplevideoandaudiotracks,PremiereProusescriteriainthefollowingordertodeterminewheretopastethekeyframes:

•Ifthecurrent-timeindicatorispositionedwithinaselectedclip,keyframesarepastedinthatclip.•Ifaudiokeyframesarecutorcopied,PremierePropastesinthefirsttrackwhereitfindsacorrespondingeffectproperty,lookingfirstatasequence’saudiotracks,thenitssubmixtracks,andthenthemastertrack.•Ifnoneoftheaboveconditionsproducesatargetvideooraudiotrackthatmatchesboththeeffectspropertyandthescope(cliportrack)ofthecutorcopiedkeyframes,thePaste

385

commandisunavailable.Forexample,ifyoucopyaudiotrackkeyframesbutthetargetedaudiotrackdisplaysclipkeyframes,thekeyframescan’tbepasted.1. InaTimelinepanel,choosefromacliportrack’seffectmenutodisplaythepropertycontainingthekeyframesyouwanttocopy.2. Selectoneormorekeyframes.3. ChooseEdit>Copy.4. Inthetimelineforthesequencecontainingthedestinationcliportrack,dooneofthefollowing:

Selecttheclipwhereyouwanttopastethekeyframes.Targetthevideooraudiotrackwhereyouwantthecopiedkeyframestoappear.

5. Makesurethatthecliportrackdisplaysthesamepropertyasthekeyframesyoucopied;otherwise,thePastecommandisunavailable.Ifthepropertyisnotavailableonthecliportrack’seffectpropertiesmenu,youmustapplythesameeffectthatwasappliedtothecliportrackfromwhichthekeyframeswerecopied.

6. Movethecurrent-timeindicatortothepointintimewhereyouwantthekeyframestoappear.7. ChooseEdit>Paste.

===============

SkillCheckPoint•HowtoimportVideoinPremier.•Howtoseparatesoundfromvideofile.•Howtomakemovie.•HowtomakeVideoCDinAdobePremier-pro.

===============

386

Annexure2

Annexure2NewApplicationsNewapplicationsthroughinternetandphones:

1. 3GInternationalMobileTelecommunications-2000(IMT—2000),beferknownas3Gor3rdGeneration,isagenerationofstandardsformobilephonesandmobiletelecommunicationsservicesfulfillingspecificationsbytheInternationalTelecommunicationUnion.Applicationservicesincludewide-areawirelessvoicetelephone,mobileInternetaccess,videocallsandmobileTV,all inamobileenvironment.In2008,Indiaenteredintothe3Garenawiththelaunchof3GenabledMobileandDataservicesbyBharatSancharNigamLtd.(BSNL)inBihar(Patna).BSNListhefirstMobileoperatorinIndiatolaunch3Gservices.Later,MTNLlaunched3GinMumbai&Delhi.3Genablesdownloadingofdifferenttypesoffilessuchasaudio,video,etc.ataveryhighspeed.Thebandwidthandlocationinformationavailableto3Gdevicesgivesrisetoapplicationsnotpreviouslyavailabletomobilephoneusers.Someoftheapplicationsare:MobileTV–aproviderredirectsaTVchanneldirectlytothesubscriber’sphonewhereitcanbewatched.Videoondemand–aprovidersendsamovietothesubscriber’sphone.Videoconferencing–subscriberscanseeaswellastalktoeachother.Tele-medicine–amedicalprovidermonitorsorprovidesadvicetothepotentiallyisolatedsubscriber.Location-basedservices–aprovidersendslocalizedweatherortrafficconditionstothephone,orthephoneallowsthesubscribertofindnearbybusinessesorfriends.

2. Wi-FiatrademarkoftheWi-FiAlliancethatreferstoarangeofconnectivity387

technologiesincludingwirelesslocalareanetwork(WLAN)andarangeoftechnologiesthatsupportPAN,LANandevenWideAreaNetwork(WAN)connections.Wi-Fidevicesareinstalledinmanypersonalcomputers,videogameconsoles,MP3players,smartphones,printers,andotherperipherals,andnewerlaptopcomputers.Wi-Fienableddevicesuchasapersonalcomputer,videogameconsole,smartphoneordigitalaudioplayercanconnecttotheInternetwhenwithinrangeofawirelessnetworkconnectedtotheInternet.Thecoverageofoneormore(interconnected)accesspoints—calledhotspots—cancompriseanareaassmallasafewroomsoraslargeasmanysquaremiles.Coverageinthelargerareamaydependonagroupofaccesspointswithoverlappingcoverage.Wi-Fialsoallowscommunicationsdirectlyfromonecomputertoanotherwithouttheinvolvementofanaccesspoint.Thisiscalledthead-hocmodeofWi-Fitransmission.Themostcommonwirelessencryption-standard,WiredEquivalentPrivacy(WEP),hasbeenshowntobeeasilybreakableevenwhencorrectlyconfigured.

3. Wikipediahfp://www.wikipedia.org/

388

Wikipediaisamultilingual,web-based,freecontentencyclopediaproject.Wikipediaiswrifencollaborativelybyvolunteersfromallaroundtheworld.Withrareexceptions,itsarticlescanbeeditedbyanyonewithaccesstotheInternetWikipediaisaregisteredtrademarkofthenon-profitWikimediaFoundation.ThenameWikipediaisaCombinationofthewordswiki(atypeofcollaborativewebsite)andencyclopedia.Sinceitscreationin2001,WikipediahasgrownrapidlyintooneofthelargestreferenceWebsitesontheInternet.Ineveryarticle, linkswillguideyoutoassociatedarticles,oftenwithadditional information.Youarewelcometobeboldandeditarticlesyourself,contributingknowledgefurtherinformation,cross-references,orcitationsasyouseefitinacollaborativeway,solongastheydosowithinWikipediaeditingpolicies.OneneednotfearaccidentallydamagingWikipediawhenaddingorimprovinginformation,asothereditorsisalwaysaroundtoadviseorcorrectobviouserrors.BecauseWikipedia isanongoingworktowhich inprincipleanybodycancontribute, itdiffers fromapaper-basedreferencesource,asWikipediacanbeconstantlyupdated,witharticlesontopicaleventsbeingcreatedorupdatedwithinminutesorhoursordaysoftheiroccurrence.4.Blogs:Ablog(acontractionoftheterm“weblog”)isatypeofwebsite,usuallymaintainedbyanindividualwithregularentriesofcommentary,descriptionsofevents,orothermaterialsuchasgraphicsorvideo.Entriesarecommonlydisplayedinreverse-chronologicalorder.fromthemostrecent‘post’(orentry)atthetopofthemainpagetotheolderentriestowardstheboflom.Blogsareusually(butnotalways)wrifenbyonepersonandareupdatedprefyregularly.Blogsareoften(butnotalways)wrifenonaparticulartopic–thereareblogsonvirtuallyanytopicyoucanthinkof.Fromphotography,tospirituality,torecipes,topersonaldiariestohobbies–blogginghasasmanyapplicationsandvarietiesasyoucanimagine.Wholeblogcommunitieshavesprunguparoundsomeofthesetopicspufingpeopleintocontactwitheachotherinrelationshipswheretheycanlearn,shareideas,makefriendswithandevendobusinesswithpeoplewithsimilarinterestsfromaroundtheworld.Exampleofabloggingwebsite:hfp://www.21classes.com/

389

5. FreeCallandSMSsites

a. Skypehflp://about.skype.com/Skypeissoftwarethatenablestheworld’sconversations.MillionsofindividualsandbusinessesuseSkypetomakefreevideoandvoicecalls,sendinstantmessagesandsharefileswithotherSkypeusers.Everyday,peoplealsouseSkypetomakelow-costcallstolandlinesandmobiles.

390

a.WaytoSMShfp://site2.way2sms.com/content/index.html?FirstwebtomobileFreeSMSsiteSend,FreeChat,FreeSMSFreeGroupSMStoIndia:toanymobiletoanynetwork.

391

6. SocialNetworkingWebsites:

Asocialnetworkinganddiscussionservicefocusesonbuildingandreflectingofsocialnetworksorsocialrelationsamongpeople,e.g.,whoshareinterestsand/oractivities.Followingaresomeofthemostfrequentlyusedsocialnetworkingsites.Examples:

1. Linkedinhfp://www.linkedin.com/

392

2. Facebookhfp://www.facebook.com/

3. Orkut

hfps://www.orkut.com

393

4.Hi5hfp://www.hi5.com/friend/displayHomePage.do

394

Annexure3

Annexure3Career/FurtherStudiesOptions

FurtherEducation

Studentscanpursuecoursesintheareasofmultimedia,graphics,animation,VFX,webdesigningatuniversitiesandotherinstitutionsforenhancingtheirknowledgeandskills.Thestudentswithvocationalstreamin12thcanpursuecoursesatITIs(IndustrialTrainingInstitutes)Thestudentswithvocationalstreamin12thcanpursuediplomaincomputerscienceandenggandalsoinITatPolytechnics.

ProcessofadmissionofvocationalstreamstudentsintoPolytechnics:

Vocational students seeking admission in Polytechnic have to appear for CET conducted by BTE,Delhi and upon qualification selection will join the three year diploma programme in secondyear(i.e.heshewillgetadmissioninto2ndyearofthethreeyearcourseatPolytechnicsdirectly)IncasestudentswanttopursueDegree inengineeringaftercompletingDiplomaintheirrespectivestreamfromPolytechnic,thenheisrequiredtoappearagaininCETconductedbytheuniversityofferingDegreeprogrammeinengineering(forexampleGGSIPUinDelhi)foraregularcourse.Uponqualificationselectionheshewilldirectlybeadmifedinto2ndyearofthefouryearDegreecourseinEngineering.OR

Alternativelyhe/shecanpursuedegreeparttimefromDCEandJamiaintheeveningandbecomegraduateengineer.OR

ElsethestudenthastheoptionofpursuingAMIEfromtheInstitutionofengineers,Delhiin

395

particularstreamfromtherespectivebranch.AMIEistreatedasequivalenttoB.Tech.degree.AMIEistobedonethroughcorrespondence.Onceastudentbecomesgraduateengineerthroughanyoftheabovemodesandwantstostudyfurther,he/shecanpursuehighereducationsuchaspostgraduation,etc.aspertheuniversitynorms,eligibilityconditions,normsofequivalenceofthecourses,admissionprocess,etc.withanyoftheIndianorforeignuniversities.HecanpursueeducationuptoPhdintheirfield.Theycanpursuecareerinindustryaswellasinacademics.Studentsmaysurftheinternet,referadvertisementsandnotificationsforadmissiontocourses/programmesintrainingandeducationalinstitutions.Skillsneeded forquality in trainedand skilledmanpower :IT requires precision in decisionmaking, logical thinking and reasoning, somenumerical abilities.Besides the studentsmust havegoodcommunicationinEnglish(wrifenandspoken),presentationandITskillsandsoundknowledgeoftheirdomain.CareerOpportunities

AfterpassingClassXIIinITvocationalstreamopportunitieswouldbeavailableinfollowingworkareas:-Dataentryoperation,computeroperation,wordprocessing,etc.

WithfurtherupgradationofrequiredITskillsandpersonalskills,etc.studentscanalsoseekjobopportunitiesinwebdesigning,websitecreation,digitaldesigning,multimediaandgraphicsandotherrelatedwork.SomeofthecompanieswhichhirethosestudentsareTCS,TechMahindra,HCL,IBM,CSC,etc.OpportunitiesavailabletostudentsafterpassingClXIIarealsogivenatthefollowingwebsiteaswellasmanyothereducationalwebsites:hfp://edudel.nic.in/welcome_folder/after12th.htm

StudentscanconsultYUVAHelplineforcareerguidance.TollFreeYUVAphonelineis1800-11-6888,10580.

396

Annexure4

Annexure4ImportantLinksThepagedisplayslistofsomeoftherelevantlinkstoeducationalandgovernmentsites.

1. EducationDepartment,GNCT,Delhi:hflp://www.edudel.nic.in/

2. SCERT:hflp://www.edudel.nic.in/SCERTORwww.scertdelhi.nic.in

3. CentralBoardofSecondaryEducation(CBSE):hflp://www.cbse.nic.in/

4. CentralInstituteofEducationalTechnology(CIET):hflp://www.ciet.nic.in/

5. CentreforCulturalResourcesandTraining(CCRT):hflp://ccrtindia.gov.in/

6. IndiraGandhiNationalOpenUniversity(IGNOU):hflp://www.ignou.ac.in/

7. JamiaMilliaIslamia:hflp://jmi.ac.in/

8. NationalCouncilofEducationalResearchandTraining:hflp://www.ncert.nic.in9. UniversityofDelhi:hflp://www.du.ac.inSubjectwiseLinksforstudents:

Math:hflp://mathforum.org/dr.math/hflp://www.aplusmath.com/Thiswebsitewasdevelopedtohelpstudentsimprovetheirmathsskillsinteractively

hflp://www.aaastudy.com

AAAMathfeaturesacomprehensivesetofinteractivearithmeticlessons.Unlimitedpracticeisavailableoneachtopicwhichallowsthoroughmasteryoftheconcepts.Science:hflp://www.execulink.com/~ekimmel/Thisisawebsiteforhighschoolsciencestudents.You’llfindavarietyofinteractivequizzes,

397

gamesandpuzzlestopracticewhatyou’relearning.Therearealsosomespecificstudentresourcesforeachcoursehflp://cnx.org/content/col10264/latest/

EachmoduledevelopsacentralconceptinChemistryfromexperimentalobservationsandinductivereasoning.Thisapproachcomplementsaninteractivehflp://www.fun-science-fair-projects.com/

Thise-bookisacompilationof47uniquescienceprojectscoveringtendifferentsubjectareas.Alloftheprojectsareeasy-to-doandeducational.hflp://www.glenbrook.k12.il.us/gbssci/Phys/Class/BBoard.html

ThePhysicsClassroomisanonlineinteractivetutorialofbasicphysicsconcepts.Thelessonsuseaneasy-to-understandlanguagetopresentcommonphysicsSocialScience:hflp://www.wou.edu/las/socsci/anthro/harappa.htmhflp://bla.stisd.net/resources/AncientCivilizations/default.htmHindi:hflp://www.webduniya.comUsefulLinksforTeachersandStudents:hflp://www.ictmanual.net/It provides Online Training Manual forICTIntegration in School Education for teachers, teacher educators,ICTcoordinators, trainers and any one else concerned about integratingICT (web2 inparticular)inimprovingtheeducationalpractices.Itiscompliantwiththe“ICTCompetencyStandardsforTeachers”(ICT-CST)developedbyUNESCO.hflp://www.geogebra.org/cms/

Freemathematicssoftwareforlearningandteaching,GeoGebraisaninteractivegeometry,algebra,andcalculusapplication,intendedforteachersandstudents.Constructionscanbemadewithpoints,vectors,segments,lines,polygons,conicsections,inequalities,implicitpolynomialsandfunctions.Allofthemcanbechangeddynamicallyafterwards.Elementscanbeenteredandmodifieddirectlyonscreen,orthroughtheInputBar.GeoGebrahastheabilitytousevariablesfornumbers,vectorsandpoints,findderivativesandintegralsoffunctions.hflp://star.mit.edu/index.html

Itprovidessoftwaretoolsforacademics,researchers,teachersandstudentswhichfacilitate

398

learningofvariousconcepts.ForexampleStarBiochemisamolecular3-Dviewerthatallowsstudentstolearnkeyconceptsinstructuralbiologyinaninteractivemanner.Thissoftwareallowsforthevisualization and manipulation of any of the structures present in the Protein Data Bank; StarGeneticsis a genetic cross simulator. Using StarGenetics students can performing virtual matingexperimentsbetweengeneticallydifferentorganismsacrossarangeoftraits.Severalusefultoolsandmaterialareavailableonthewebwhichcanbeusedtoaidandenhancelearning.Theteachersandthestudentscansearchforthemusingthesearchenginesandthetechniquesdescribedabove.

Bibliography:hfp://en.wikipedia.org/wiki/Operating_systemhfp://en.wikipedia.org/wiki/Task_barhfp://home.earthlink.net/~cassidyny/spreadsheet.htmhfp://library.thinkquest.org/5862/partsof.htm.hfp://science.csustan.edu/tutorial/Excel/index.htmhfp://webmediaworkshop.com/Classes/cs100/mod.ss/unit.1/lesson.1/navigatess.htmlhfp://wordprocessing.about.com/od/wordprocessingsoftware/a/tabletips.htmhfp://www.adobe.com/devnet/dreamweaver.htmlhfp://www.atlantiswordprocessor.com/en/help/html/selecting_text.htmhfp://www.baycongroup.com/excel2003/excel03.htmhfp://www.computerhope.com/issues/ch000791.htmhfp://www.contextures.com/xlSort01.htmlhfp://www.dreamweavertutorial.co.uk/hfp://www.edu.pe.ca/journeyon/pro_d_pages/file_management/FileManagementinWindows.htmhfp://www.elearningplace.co.uk/6852/taster/tastertypescomp.php?sess_keyhfp://www.esu.edu/win_tutorial/dt_2.htmlhfp://www.geocities.com/Athens/Delphi/6470/word.htm

399

hfp://www.gobe.com/gp/help/Overview/GSDocWindows.htmhfp://www.internet4classrooms.com/on-line_ie.htmhfp://www.internefutorials.net/internet.htmlhfp://www.jegsworks.com/Lessons/words/basics/step-spelling.htmhfp://www.learndreamweavertutorials.com/hfp://www.ncsu.edu/it/edu/winword_trng/word/editing.htmlhfp://www.nos.org/htm/ms-word3.htmhfp://www.thesitewizard.com/#hfp://www.tutorialspoint.com/lisfutorials/dreamweaver/1hfp://www.webopedia.com/TERM/k/keyboard.htmlhfps://www.adobe.com/hfp://www.tutorialized.com/tutorials/Premiere/1hfp://www.microsoft.com/en-in/server-cloud/products/sqlserver/hfp://www.w3schools.com/sql/hfp://www.sqlservercentral.com/hfp://windows.microsoft.com/en-us/windows/homewww.bsesdelhi.com.hfp://www.passportindia.gov.in/AppOnlineProject/welcomeLinkwww.movies.ticketplease.comhfp://www.makemytrip.com/hfps://www.irctc.co.in/eticketing/loginHome.jsfhfp://www.flipkart.com/hfp://moodle.com/

hfp://code.tutsplus.com/tutorials/the-essentials-of-writing-high-quality-javascript—net-15145hfp://www.webestools.com/

hfps://docs.google.com/file/d/0BzsgtY7KuQUXdzgyLURVZ3BuS3c/edit?pli=1hfp://sumtotalz.com/TotalAppsWorks/Javascript/JS_BasicCalc.htmlhfp://www.javascriptsource.com/miscellaneous/basic-javascript-quiz.html

400AdobeDreamWeaverCS3

HelpfileofWindowsMovieMaker

IvanBayross,WebEnabledCommercialApplicationDevelopmentUsingHTML,DHTML,javascript,PerlCGI,BPBPublication,NewDelhi(2005)JavaScriptTutorial-W3Schools,www.w3schools.com/js/JavaScriptTutorial,hfp://html.net/tutorials/javascript/JavaScriptTutorial,www.echoecho.comJavaScriptTutorial,www.tutorialspoint.com/javascript/LearnJavaScriptProgramming,www.codecademy.com/tracks/javascriptOpensourcesoftwareandfreeonlinetutorialsPremierPro

SoftwareandtheirHelpfilesusedinthemanualSQL ServerWindowsMoviesMaker

TutorialsonDreamweaver,PremierPro,JavaScript,SQL, SQL Server,MovieMaker,onlinereservationsystem,e-governance,onlineshoppingandbillpayments.

Otherrelevantwebsites

401

402

volii class – xii 2015-16 - SelfStudys

Documents

Transcript of volii class – xii 2015-16 - SelfStudys