+ All Categories
Home > Documents > Technical Report on REAL-TIME HTML Editor in vb.net

Technical Report on REAL-TIME HTML Editor in vb.net

Date post: 11-Sep-2015
Category:
Upload: sahar-sultan
View: 10 times
Download: 1 times
Share this document with a friend
Description:
Technical Report on REAL-TIME HTML Editor in vb.net
Popular Tags:
54
Transcript

Real-Time HTML Editor

DECLARATIONThe work reported in this report was carried out by me under the supervision of Prof.Tasleem Mustafa, Department of Computer Science, Agriculture University Faisalabad, Pakistan.I hereby declare that the Real-Time HTML Editor and the contents of the report is the product of my own research and no part has been copied from any published source (except the history). I further declare that this work has not been submitted for award of any other degree / diploma. The university may take action if the information provided is found inaccurate at any stage.

Submitted By

ACKNOWLEDGEMENTS

I am immeasurably indebted to ALLAH ALMIGHTY, the propitious, the benevolent and sovereign whose blessings and glory flourished my thoughts and thrived my ambitions, giving me talented teachers, affectionate parents, beloved brother, sweet sisters and unique friends. Trembling lips and wet eyes praise for HOLY PROPHET (PBUH) for enlightening our conscience with the essence of faith in ALLAH, converging all his kindness and mercy upon him.The work presented in this manuscript is accomplished under the sympathetic attitude, animate directions, observant pursuit, scholarly criticism, cheering perspective and enlightened supervision of Prof.Tasleem Mustafa, Chairman at Department of Computer Science University of Agriculture, Faisalabad. His effort towards the inculcation of spirit of handwork and maintenance of professional integrity besides other valuable suggestions always serves as a beacon light through the course of my life. Earnest and devout appreciation to my supervisory committee members I owe a debt of gratitude to Mr. Tasleem Mustafa, chairman of Dept of Computer Science Faisalabad who extended all possible help for the smooth execution of studies reported here.Words are lacking to express my humble obligations to my parents in grateful appreciation of their pray, help, kindness, understanding and moral support, when I needed. Special love and thanks to our ALLAH.

Abstract

The aim of this project is to make an HTML Editor which makes it easy to make and edit the existing HTML pages. It strikes to make an editor which can change the HTML coding at the Run-Time and then show these changes to the user at the very same time so that a user can see what are the effects of the changes on the web page design and its elements.This editor also has a built-in Web-Browser which enables a user to see the web-page he/she is designing and also to surf the internet if need be. Hence it is an easy to use Editor which cuts the need of writing an HTML code in a notepad and then opening a separate Browser again and again to watch the changes in design of the Web-Page.Also a user is able to get the Source-Code of a web-Page in the rich textbox which makes it easy to view the design of a developed web-page and also to use its coding for your own web-page.

Table of Contents

Chapter 1 Introduction11 Introduction11.1 Introduction to the Project11.2 Existing Systems11.3 Proposed System21.3.1 WYSIWYGHTML Editors21.4 Problem in previous system21.5 Developed System31.6 System objectives41.7 System Requirements41.7.1 Hardware Requirements:41.7.2 Software Requirements:41.8 SELECTED SOFTWARE41.8.1 Visual Studio 201341.8.2 .NET Framework51.9 Programming Language51.9.1 Visual Basic5Chapter 2 Methodology6SYSTEM ANALYSIS62.1 INTRODUCTION62.2 ANALYSIS MODEL62.3 WATER FALL MODEL72.3.1 System Requirements82.3.2 System Analysis82.3.3 System Design82.3.4 System Development92.3.5 System Implementation92.3.6 System Testing92.3.7 Advantages Of Waterfall Model92.4 FUNCTIONAL FEATURES OF THE MODEL112.4.1 INPUTS:112.4.2 OUTPUTS:112.5 Use-Case Diagram of the Real-Time HTML Editor122.6 DFD Diagram of Real-Time HTML Editor132.7 Class Diagram of Real-Time HTML Editor142.8 ER Diagram of Real-Time HTML Editor152.9 System Architecture of Real-Time HTML Editor162.10 Sequence Diagram of Real-Time HTML Editor172.10.1 Sequence Diagram when used as HTML Editor172.10.2 Sequence Diagram when used as Web Browser182.11 Tools of vb.net used to create the Editor192.11.1 Dialog Boxes202.11.2 ToolStripMenuItem, ContextMenuStrip202.11.3 Adding the Cut, Copy and Paste Functionalities in a Form212.11.4 The Regex Class212.11.5 Web Browser212.11.6 Timer212.11.7 ProgressBar Control22Chapter 3 Results233.1 Results.233.2 User Manual243.2.1 Welcome Form253.2.3 The OpenDialogue Box273.2.4 Editor when being used a Web-Browser283.2.5 Getting Inner HTML Code of a Website29Chapter4 Summary304.1 Summary30

List of Figures

Figure 1 : Use Case Diagram of Editor12Figure 2 : DFD Diagram of Editor13Figure 3 : Class Diagram of Editor14Figure 4 : ER Diagram of Editor15Figure 5 : Architecture of the HTML Editor16Figure 6 : Sequence Diagram when used as Editor17Figure 7 : Sequence Diagram when used as Web Browser18Figure 8 : User Manual24Figure 9 : Welcome Screen25Figure 10 : Real-time HTML Editor with HTML Page26Figure 11 : Open DialogueBox27Figure 12 : Real-time HTML Editor used as a Web Browser28Figure 13 : Real-time HTML Editor getting the Inner HTML-Code of a web-page29

1

Chapter 1Introduction1 IntroductionAnHTML editoris acomputer programfor editingHTML, the mark up of awebpage. HTML (Hypertext Mark-up Language) is the set ofmarkupsymbols or codes inserted in a file intended for display on a World Wide Webbrowserpage. The markup tells the Web browser how to display a Web page's words and images for the user. Each individual markup code is referred to as an element (but many people also refer to it as atag). Some elements come in pairs that indicate when some display effect is to begin and when it is to end. HTML is a formal Recommendation by the World Wide Web Consortium (W3C) and is generally adhered to by the major browsers, Microsoft's Internet Explorer and Netscape's Navigator, which also provide some additional non-standard codes.1.1 Introduction to the ProjectReal-Time HTML Editor is like a WYSIWYG Editor in which you can see what your web-page would look like at the development time in the Web Browser.It is made in vb.net using Visual Studio 2013 using Windows Form Application for development.It is a Desktop Application and can be used in any OS environment.1.2 Existing SystemsCurrently HTML Pages can be written on any text editor like Notepad and then it can be seen on any Web-Browser like Chrome and Internet Explorer etc.Web browserscan read HTML files and render them into visible or audible web pages. Browsers do not display the HTML tags and scripts, but use them to interpret the content of the page. HTML describes the structure of awebsitesemanticallyalong with cues for presentation, making it a markup language, rather than aprogramming language.Although theHTMLmark up of a web page can be written with anytext editor, specialized HTML editors can offer convenience and added functionality.

1.3 Proposed System1.3.1 WYSIWYGHTML Editors A WYSIWYG (pronounced "wiz-ee-wig") editor or program is one that allows a developer to see what the end result will look like while the interface or document is being created. WYSIWYG is an acronym for "what you see is what you get". A WYSIWYG editor can be contrasted with more traditional editors that require the developer to enter descriptive codes (ormarkup) and do not permit an immediate way to see the results of the markup. The first true WYSIWYG editor was a word processing program called Bravo. Invented by Charles Simonyi at the Xerox Palo Alto Research Center in the 1970s, it became the basis for Simonyi's work at Microsoft and evolved into two other WYSIWYG applications called Word andExcel.WYSIWYGHTML editors provide an editing interface which resembles how the page will be displayed in aweb browser. These editors may be stand-alone programs, such asAdobe DreamweaverorMicrosoft FrontPage(now discontinued), or come in the form of browser extensions and allow editing directly within the web browser. Because using a WYSIWYG editor may not require any HTML knowledge, they are often easier for an inexperienced computer user to get started with.The WYSIWYG view is achieved by embedding alayout enginebased upon one used in a web browser. The layout engine will have been considerably enhanced by the editor's developers to allow for typing, pasting, deleting and manipulation of the content. The goal is that, at all times during editing, therenderedresult should represent what will be seen later in a typical web browser.HTML is a structuredmark-up language. There are certain rules on how HTML must be written if it is to conform toW3Cstandards for theWorld Wide Web.A given HTML document will have an inconsistent appearance on various platforms and computers for several reasons:1.4 Problem in previous systemFollowing are the problems in the previous systems: Different browsers and applications will render the same mark-up differently. The same page may display slightly differently in Internet Explorer and Firefox on a high-resolution screen, but it will look very different in the perfectly valid text-onlyLynx browser. It needs to be rendered differently again on a PDA, an internet-enabled television and on a mobile phone. Usability in a speech or Braille browser, or via a screen-reader working with a conventional browser, will place demands on entirely different aspects of the underlying HTML

Browsers and computer graphics systems have a range of user settings. Resolution, font size, colour, contrast etc can all be adjusted at the user's discretion, and many modern browsers allow even more user control over page appearance. All an author can do is suggest an appearance.

Web browsers, like all computer software, havebugs They may not conform to current standards. It is hopeless to try to design Web pages around all of the common browsers' current bugs: each time a new version of each browser comes out, a significant proportion of the World Wide Web would need re-coding to suit the new bugs and the new fixes.

WYSIWYG editors let you ignore certain aspects that are important to say the least. For instance, the need for the image ALT attribute should be explicitly mentioned by the editors and images should not be included without the ALT text. If the purpose of a WYSIWYG editor is to hold a beginner's hand and guide him/her through the process of creating a web page, the programs should tell the importance of certain HTML attributes and tags.

1.5 Developed SystemReal-Time HTML Editor is like a WYSIWYG Editor in which you can see what your web-page would look like at the development time in the Web Browser.Following are the key features of Real-Time HTML Editor;

HTML Syntax Highlighting. WYSIWG HTML Editor. Type directly in the HTML view. Split view which enables you to see the design of your web-page as it appears in the web-browser. Built-in Web Browser which also can be used for internet surfing. Load the HTML Source-Code of a web-page opened in the Browser into the Rich Textbox. Load and Save HTML Files. SelectAll, Cut, Copy, Paste and Undo Function. Open a New File which already has starting HTML Tags.

1.6 System objectives Most editors also offer a HTML code viewer in which the HTML code of the web page is displayed.So in essence, HTML editors make it very simple for you to create a web page without digging through the intricacies of HTML.

Ability to type HTML code and see how it looks like at the same time. What you see is what you get HTML Editor.WYSIWYG HTML Editor. User friendly and easy to learn. For simple edits, it is often faster to make changes to a page using editor. Because you have to learn both HTML and the editor functions itself, a beginner will find a text editor more difficult to use. Some people find text editors more difficult to design pages in because they can't visualize how the page will look from just the HTML. This Editor can be of help here as it is more easy to use. Anyone can create web sites and put them online Create web sites quickly Provide a platform to start learn HTML1.7 System Requirements1.7.1 Hardware Requirements:1 PIV 2.8 GHz Processor and Above2 RAM 512MB and Above3 HDD 20 GB Hard Disk Space and Above1.7.2 Software Requirements: 1 WINDOWS OS (vista / 7 / 8 / 10)2 Visual Studio .Net 2013 Edition3 Internet Information Server 5.0 (IIS)4 Visual Studio .Net Framework (3.5,4) 1.8 SELECTED SOFTWARE1.8.1 Visual Studio 2013State-of-the-art tools and services that you can use to create great apps for devices, the cloud, and everything in between.Microsoft Visual Studiois anintegrated development environment(IDE) fromMicrosoft. It is used to developcomputer programsforMicrosoft Windows, as well asweb sites,web applicationsandweb services. Visual Studio uses Microsoft software development platforms such asWindows API,Windows Forms,Windows Presentation Foundation,Store andMicrosoft Silverlight. It can produce bothnative codeandmanaged code.1.8.2 .NET FrameworkThe .NET Framework is a new computing platform that simplifies application development in the highly distributed environment of the Internet. The .NET Framework is designed to fulfil the following objectives:

To provide a consistent object-oriented programming environment whether object code is stored and executed locally, executed locally but Internet-distributed, or executed remotely. to provide a code-execution environment that minimizes software deployment and versioning conflicts. to provide a code-execution environment that guarantees safe execution of code, including code created by an unknown or semi-trusted third party. to provide a code-execution environment that eliminates the performance problems of scripted or interpreted environments. To make the developer experience consistent across widely varying types of applications, such as Windows-based applications and Web-based applications.

1.9 Programming LanguageProgramming language of this Editor is VISUAL BASIC.1.9.1 Visual BasicVisual Basic .NET, the next generation of the Visual Basic language, is a fast and easy way to create .NET-based applications, including XML Web services and Web applications.Visual Basic .NET has many new and improved features that make it a powerful object-oriented programming language, including inheritance, interfaces, and overloading. Other new language features include free threading and structured exception handling. Visual Basic .NET also fully integrates the .NET Framework and the Common Language Runtime, which provide language interoperability, garbage collection, enhanced security, and improved versioning support.A programmer can create an application using thecomponentsprovided by the Visual Basic program itself. Over time the community of programmers have developed new third party components, keeping this programming language to modern standards.Programs written in Visual Basic can also use theWindows API, which requires external function declarations.Chapter 2MethodologySYSTEM ANALYSIS2.1 INTRODUCTIONAfter analysing the requirements of the task to be performed, the next step is to analyse the problem and understand its context. The first activity in the phase is studying the existing system and other is to understand the requirements and domain of the new system. Both the activities are equally important, but the first activity serves as a basis of giving the functional specifications and then successful design of the proposed system. Understanding the properties and requirements of a new system is more difficult and requires creative thinking and understanding of existing running system is also difficult, improper understanding of present system can lead diversion from solution.2.2 ANALYSIS MODELThe model that is basically being followed is the WATER FALL MODEL, which states that the phases are organized in a linear order. First of all the feasibility study is done. Once that part is over the requirement analysis and project planning begins. If system exists one and modification and addition of new module is needed, analysis of present system can be used as basic model. The design starts after the requirement analysis is complete and the coding begins after the design is complete. Once the programming is completed, the testing is done. In this model the sequence of activities performed in a software development project are: -

1 Requirement Analysis2 Project Planning3 System design4 Detail design5 Coding6 Unit testing7 System integration & testing

2.3 WATER FALL MODELWATER FALL MODEL was being chosen because all requirements were known beforehand and the objective of our software development is the computerization/automation of an already existing manual working system.

Communicated RequirementsRequirements SpecificationDesign SpecificationExecutable Software ModulesIntegrated Software ProductDelivered Software ProductChanged RequirementsRequirements EngineeringDesignProgrammingIntegrationDeliveryMaintenance

The Waterfall Model was first Process Model to be introduced. It is also referred to as a linear-sequential life cycle model. It is very simple to understand and use. In a waterfall model, each phase must be completed before the next phase can begin and there is no overlapping in the phases.Waterfall model is the earliest SDLC approach that was used for software development.The waterfall Model illustrates the software development process in a linear sequential flow; hence it is also referred to as a linear-sequential life cycle model. This means that any phase in the development process begins only if the previous phase is complete. In waterfall model phases do not overlap.Following are the different phases of the Waterfall Model:

2.3.1 System Requirements The first phase involves understanding what you need to design and what is its function, purpose etc. These requirements are presented to the team of programlly .it ensuremers.If this phase is completed successfully; it ensures a smooth working of the remaining phases. All possible requirements of the system to be developed are captured in this phase and documented in a requirement specification doc. In communication phase the major task performed is requirement gathering which helps in finding out exact need of customer. Once all the needs of the customer are gathered the next step is planning.2.3.2 System AnalysisSystem analysis is the second phase of the waterfall model also called as fact finding phase. Analysis is the process of studying a problem to find the best solution of the problem. The purpose of this phase is to learn exactly how the current system operates. In planning major activities like planning for schedule, keeping tracks on the processes and the estimation related to the project are done. Planning is even used to find the types of risks involved throughout the projects. Planning describes how technical tasks are going to take place and what resources are needed and how to use them.2.3.3 System DesignSystems designis the process of defining the architecture, components, modules, interfaces, and data for asystemto satisfy specified requirements.Systems designcould be seen as the application ofsystemstheory to product development.The requirement specifications from first phase are studied in this phase and system design is prepared. System Design helps in specifying hardware and system requirements and also helps in defining overall system architecture.2.3.4 System DevelopmentSystems developmentis the process of defining, designing, testing, and implementing a new software application or program. The actual coding of the software is done in this phase. This coding is done on the basis of the model designed in the modeling phase. So in this phase software is actually developed and tested.2.3.5 System ImplementationSystems implementation is the construction of the new system and the delivery of that system into production (that is, the day-to-day business or organization operation). With inputs from system design, the system is first developed in small programs called units, which are integrated in the next phase. Each unit is developed and tested for its functionality which is referred to as Unit Testing. In this last phase the product is actually rolled out or delivered & installed at customers end and support is given if required. A feedback is taken from the customer to ensure the quality of the product.2.3.6 System TestingSystem testingof software or hardware istestingconducted on a complete, integratedsystemto evaluate thesystem'scompliance with its specified requirements.System testingfalls within the scope of black boxtesting, and as such, should require no knowledge of the inner design of the code or logic. There are some issues which come up in the client environment. To fix those issues patches are released. Also to enhance the product some better versions are released. Maintenance is done to deliver these changes in the customer environment.2.3.7 Advantages of Waterfall ModelHere are few of the advantages of this model: Thewaterfall modelis the oldest and most widely used model in the field of software development. There are certain advantages of this model, which makes it, one of the most widely, used models as yet. Being a linear model, it is very simple to implement. The amount of resources required to implement this model are minimal. Documentation is produced at every stage of the softwares development. This makes understanding the product designing procedure, simpler. After every major stage of software coding, testing is done to check the correct running of the code. The waterfall methodology stresses meticulous record keeping. Having such records allows for the ability to improve upon the existing program in the future. With the waterfall methodology, the client knows what to expect. Theyll have an idea of the size, cost, and timeline for the project. Theyll have a definite idea of what their program will do in the end. In the case of employee turnover, waterfalls strong documentation allows for minimal project impact.

2.4 FUNCTIONAL FEATURES OF THE MODELAs far as the project is developed the functionality is simple, the objective of the proposal is to make it possible for the user to edit and write HTML codes and then watch these changes at the run-time. User does not have to open a separate Browser to view these changes and web-pages; instead they can see it at the very same time.

INPUT AND OUTPUTThe main inputs, outputs and major functions of the system are as follows

2.4.1 INPUTS:1. User opens a HTML file.2. User makes a new HTML File.3. User can copy, paste and select the text in the page.4. User requests the search.5. User can edit the details and so on.

2.4.2 OUTPUTS:1. User can watch the pages in Browser.2. Users receive requested URL.3. Displays search result.4. User can get the Source-Code of a page opened in the Browser.

2.5 Use-Case Diagram of the Real-Time HTML EditorAuse case diagramat its simplest is a representation of a user's interaction with the system that shows the relationship between the user and the differentuse casesin which the user is involved. A use case diagram can identify the different types of users of a system and the different use cases and will often be accompanied by other types of diagrams as well.The following Use-Case Diagram shows the interaction of a user with Real-Time HTML Editor and it shows the different actions that the user can perform in this system.

EditorEditorFigure 12.6 DFD Diagram of Real-Time HTML EditorAData Flow Diagram(DFD) is a graphical representation of the "flow" of data through an information system, modeling its process aspects. ADFDis often used as a preliminary step to create an overview of the system, which can later be elaborated.

Figure 2

2.7 Class Diagram of Real-Time HTML Editor Aclass diagramin the Unified Modelling Language (UML) is a type of static structurediagramthat describes the structure of a system by showing the system'sclasses, their attributes, operations (or methods), and the relationships among objects

Figure 3

2.8 ER Diagram of Real-Time HTML Editor Anentity-relationship diagramis a data modelling technique that creates a graphical representation of the entities, and the relationships between entities.

Figure 42.9 System Architecture of Real-Time HTML Editor

Figure 5ExplanationThis HTML Editor has two container panes.Container 1:In first container there is a rich textbox which enables a user to write and edit html pages. Source code of any HTML file can be opened and edited here.Container 2:In the second container there is Web-Browser which enables a person to see the web page design whose code it being written in the Rich Textbox .this Browser can also be used for separate internet surfing.

2.10 Sequence Diagram of Real-Time HTML EditorUML sequence diagrams model the flow of logic within your system in a visual manner, enabling you both to document and validate your logic, and are commonly used for both analysis and design purposes. Sequence diagrams are the most popular UML artifact for dynamic modeling, which focuses on identifying the behavior within your system. Other dynamic modeling techniques includeactivity diagramming,communication diagramming,timing diagramming, andinteraction overview diagramming. Sequence diagrams, along withclass diagramsandphysical data modelsare in my opinion the most important design-level models for modern business application development2.10.1 Sequence Diagram when used as HTML EditorFollowing is the sequence diagram of Real-Time HTML Editor when it is used only as an Editor for an HTML page means when the user wants to design or edit an HTML page. Here the user can edit, read or view the actual page.

EditorVariance Text FieldReadingActual Text Field

Figure 6

2.10.2 Sequence Diagram when used as Web BrowserFollowing is the sequence diagram of Real-Time HTML Editor when it is used only as a Web-Browser for the navigation of a URL.

Figure 7

2.11 Tools of vb.net used to create the EditorThere are many tools available in visual studio 2013 for visual based programming. The tools that I used for my Editor are as follows:

ImagesControl NameDescription

PointerUsed to move and resize controls and forms.

ButtonThis Control triggers an action when accessed.

LabelDisplays a label text.

List BoxControl that lists number of items.

Picture BoxDisplay image files

Progress BarDisplay the progress of a task.

Rich TextboxAllows editing, inputting rich text.

Text BoxControl used to input or display text.

Web BrowserAllows opening an html document in form.

2.11.1 Dialog Boxes

2.11.2 ToolStripMenuItem, ContextMenuStripWindows Forms contain a rich set of classes for creating your own custom menus with modern appearance, look and feel. TheMenuStrip,ToolStripMenuItem,ContextMenuStripcontrols are used to create menu bars and context menus efficiently.

S.N.Control & Description

1MenuStripIt provides a menu system for a form.

2ToolStripMenuItemIt represents a selectable option displayed on aMenuStriporContextMenuStrip. The ToolStripMenuItem control replaces and adds functionality to the MenuItem control of previous versions.

2.11.3 Adding the Cut, Copy and Paste Functionalities in a FormThe methods exposed by theClipBoardclass are used for adding the cut, copy and paste functionalities in an application. The ClipBoard class provides methods to place data on and retrieve data from the system Clipboard. KeyDown occurs when a key is pressed down and the control has focus KeyPress occurs when a key is pressed and the control has focus KeyUp occurs when a key is released while the control has focus 2.11.4 The Regex ClassThe Regex class is used for representing a regular expression. In Real-Time HTML Editor, Regular Expressions are used for coloring the tags of HTML with a different color in the Rich Textbox. By using Regex class the color of the tags can be changed which make it more visible in the layout page.2.11.5 Web BrowserThere is a built-in web-browser which can be used to watch the html code design and also to surf the internet. It can also capture the code of the opened web-page by pressing the Get-Source-Code button.The other features of the Browser are as follow: Search for a URL Refresh GoForward GoBackward Get the Source Code of a Page and display it in the Rich Textbox2.11.6 TimerTimer Control plays an important role in the Client side programming and Server side programming, also used in Windows Services. By using this Timer Control, windows allow you to control when actions take place without the interaction of another thread.2.11.7 ProgressBar ControlIt represents a Windows progress bar control. It is used to provide visual feedback to your users about the status of some task. It shows a bar that fills in from left to right as the operation progresses.

Chapter 3Results3.1 ResultsFollowing are the results of the final product: This Real-Time HTML Editor can perform all the functionalities that are mentioned in the key features of the Editor. It makes it easy to design web pages in a user friendly environment. HTML editor is great tools for beginners to quickly create web pages and put them on the net. The presence of a fully functional web-Browser make it easy to surf the internet if you have some problem in understanding the design of the page or it can be used separately as a browser. We can get the source code of a web-page opened in the browser which can be useful in understanding the layout and different elements on that page and can be educationally used.

3.2 User ManualFollowing figure shows a description of all the components and their functionalities.

Figure 8

3.2.1 Welcome Form

This form appears at the start of the Real-Time HTML Editor. This welcome form has a progress bar which is controlled by the timer.

Figure 9

3.2.2 The Real-Time HTML Editor with an HTML-PageThe below figure shows an HTML page being opened in the Real-Time HTML Editor. The user can see the source code of the page in the Rich Textbox while the page design is loaded in the web-Browser.

Figure 10

3.2.3 The OpenDialogue BoxThe following figure shows the OpenDialogue Box that appears when the user presses the OPEN button in the Editor to open a HTML page. Here the user can chose a file with .html or .htm extension to be loaded in the Editor.

Figure 11

3.2.4 Editor when being used a Web-BrowserThe following figure shows the Editor being used as a Stand-Alone Web-Browser. User can enter a URL in the textbox and then press Enter and then can see the required web-page in the second panel which contains a web-browser.

Figure 12

3.2.5 Getting Inner HTML Code of a WebsiteBy pressing the GET-Source-Code button the inner html code of a website being opened in the web browser can be loaded into the text area and then this code can be save in any location. The following figure shows the Source-Code of www.facebook .com being loaded into the RichTextarea.

Figure 13

Chapter4 Summary4.1 Summary

It has been a great pleasure for me to work on this exciting and challenging project.Real-Time HTML Editor is like a WYSIWYG Editor in which you can see what your web-page would look like at the development time in the Web Browser.Some people find text editors more difficult to design pages in because they can't visualize how the page will look from just the HTML. This Editor can be of help here as it is more easy to use.Apart from that this Editor can also be used as a stand-alone Web-Browser so that a user can browse a website if he/she encounters a problem. Also, a user can get the Source code of a web page in the rich textbox and save that source code for the future use. This source code can be helpful in learning about the design of an already developed web-page. Most editors also offer a HTML code viewer in which the HTML code of the web page is displayed.So in essence, HTML editors make it very simple for you to create a web page without digging through the intricacies of HTML.Ability to type HTML code and see how it looks like at the same time. What you see is what you get HTML Editor.WYSIWYG HTML Editor. User friendly and easy to learn. For simple edits, it is often faster to make changes to a page using editor.Because you have to learn both HTML and the editor functions itself, a beginner will find a text editor more difficult to use. Some people find text editors more difficult to design pages in because they can't visualize how the page will look from just the HTML. This Editor can be of help here as it is more easy to use.Anyone can create web sites and put them online Create web sites quicklyProvide a platform to start learn HTML

31


Recommended