WO2016024646A1

WO2016024646A1 - Web content authoring device and control method thereof

Info

Publication number: WO2016024646A1
Application number: PCT/KR2014/007436
Authority: WO
Inventors: 이세진; 이용찬
Original assignee: 주식회사 다빈치소프트웨어연구소
Priority date: 2014-08-11
Filing date: 2014-08-11
Publication date: 2016-02-18

Abstract

Provided are a web content authoring device, a control method thereof, a recording medium having recorded therein a program for executing the control method, and an application stored in the medium to be combined with hardware and thereby execute the control method. A method for controlling a web content authoring device for authoring a web page including at least one web component according to the present invention comprises the steps of: displaying at least one web component; sensing that a user selects a web component; displaying an event list including at least one event item after sensing the selection of the web component; sensing that a user selects the event item included in the event list; displaying an action list including at least one action item after sensing the selection of the event item; sensing that a user selects the action item included in the action list; and, after sensing the selection of the action item, generating a client script which allows an action corresponding to the sensed action item selection to be conducted in the case of occurrence of an event which corresponds to the sensed event item selection regarding the sensed web component selection.

Description

Web content authoring device and its control method

The present invention relates to a web content authoring apparatus and a control method thereof, a recording medium on which a program for executing the control method is recorded, and an application stored in the medium to execute the control method in combination with hardware. An apparatus for authoring a client script included in a web page, a control method thereof, a recording medium having recorded thereon a program for executing the control method, and an application stored in the medium in combination with hardware to execute the control method.

The web content (for example, a web page or a web application) may include at least one component. For example, the web page may include various components such as an image component, a button component, and a link component.

However, due to the nature of these web contents, all the components generate the specified event according to the situation and call the necessary action according to the characteristic of the corresponding event.

To do this, web content developers write action functions to be executed when a specific event occurs for each component.

However, in general, the writing of action functions corresponding to each event of a component is written in a predefined programming language (for example, a JavaScript language), which is why people who are not familiar with such programming languages (for example, web content planners or It is not easy for a web developer to develop web content.

In addition, even if a developer directly codes using such a programming language, an error may occur, and a lot of time is required.

[Preceding technical literature]

Patent Publication No. 10-2010-0056938

SUMMARY OF THE INVENTION The present invention has been made to solve the above-mentioned conventional problems, and an object thereof is to facilitate the use of components included in web content and to produce web content even if the developer is not able to use a specific programming language. A web content authoring apparatus and a control method thereof, a recording medium on which a program for executing the control method is recorded, and an application stored in the medium in combination with hardware to execute the control method are provided.

In order to achieve the above object, a web content authoring apparatus for authoring a web page including at least one web component according to the present invention comprises: a display unit; A display controller configured to display at least one web component, an event list including at least one event item, and an action list including at least one action item on the display unit; A primary sensor for detecting a web component selection of a user; A secondary detector for detecting a user's selection of an event item included in the event list; A tertiary detector for detecting a user's selection of an action item included in the action list; After the selection of the action item is detected by the tertiary detector, when the event corresponding to the event item in which the selection is detected by the secondary detector for the web component detected by the primary detector is generated, the tertiary And a script generator configured to generate a client script to perform an action corresponding to the action item whose selection is detected by the detector, wherein the display controller displays the event list after the web component is detected by the primary detector. And after the selection of the event item is detected by the secondary detector, the action list is displayed.

In addition, to achieve the above object, a method of controlling a web content authoring apparatus for authoring a web page including at least one web component according to the present invention includes: displaying at least one web component; Detecting a web component selection of the user; Displaying an event list including at least one event item after the web component selection is detected; Detecting a user's selection of an event item included in the event list; Displaying an action list including at least one action item after selection of the event item is detected; Detecting a user's selection of an action item included in the action list; After the selection of the action item is detected, a client script for performing an action corresponding to the action item in which the selection is detected when an event corresponding to the event item in which the selection is detected is detected for the web component in which the selection is detected. It comprises a step of generating.

1 is a functional block diagram of a web content authoring apparatus according to an embodiment of the present invention.

2 is a diagram illustrating a screen configuration state where a web authoring tool is executed in a web content authoring apparatus;

3 is a diagram illustrating an example of an event list;

4 is a diagram illustrating an example of an action list selectable from a specific event item;

5 is a control flowchart of a web content authoring apparatus according to an embodiment of the present invention.

Hereinafter, the present invention will be described in detail with reference to the accompanying drawings.

Hereinafter, each embodiment according to the present invention is only one example to help understanding of the present invention, and the present invention is not limited to these embodiments. In particular, the present invention may be composed of a combination of at least one or more of individual configurations, individual functions, or individual steps included in each embodiment.

As illustrated in FIG. 1, the web content authoring apparatus 100 according to an exemplary embodiment of the present invention may include a display 110, a display controller 120, a primary sensor 130, and a secondary sensor 140. It may be configured to include a tertiary sensor 150, a script generator 160, a web page generator 170, an input unit 180, and a storage unit 190.

The display 110 displays a web content (hereinafter, referred to as a “web page”) authoring process, and may include, for example, a liquid crystal display (LCD).

The input unit 180 performs a function of receiving a user's input. The input unit 180 may include a keypad including at least one push button, or may include a touch pad that senses a touch input. Various configurations are possible as well.

In particular, when the input unit 180 is configured to include a touch pad, the input unit 180 may be combined with the display unit 110 described above to have a touch screen form.

The display controller 120 controls the display 110 to display at least one web component, an event list including at least one event item, and an action list including at least one action item.

Herein, the display control unit 120 includes a web component selected by a user among web components included in a predetermined web component display area among the areas displayed on the display 110 in an authoring area which is another area on the display 110. I can display it.

As another example, the display controller 120 may extract a web component from a web page designated by a user among previously stored web pages and display the web component on the display 110.

In this case, the display controller 120 should be configured to include a function of parsing or interpreting a web page.

In particular, the display controller 120 displays the event list after the web component selection is detected by the primary sensor 130, and displays the action list after the selection of the event item is detected by the secondary sensor 140. For example, the first sensor 130 and the second sensor 140 will be described in detail later.

Here, the event item included in the event list may be previously stored in the storage 190 by being matched with a web component of which the selection is detected by the primary sensor 130.

That is, the storage 190 may match and store each web component and an event item available in the web component, and the display controller 120 may match event items matched to the web component detected by the user. Extracting from the storage 190 generates and displays an event list.

Similarly, the action item included in the action list is matched with at least one of a web component in which a selection is detected by the primary sensor 130 and an event item in which a selection is detected by the secondary sensor 140, and the storage unit 190. It may be previously stored in.

Here, the web component refers to a component included in web content such as a web page, and for example, various components included in web content such as an image component, a button component, and a link component. In other words, the component that uses the <img> tag among the html tags can be called an image component, and the component that uses the button attribute of the <input> tag can be called a button component, and the component that uses the <a> tag. An element can be called a link component.

In particular, in the case of a web page, a web component may mean all components to which 'id' is assigned in an html tag.

An event item corresponds to each event, where an event occurs on each web component, for example, after a web page has been created, according to the user's choice to view that web page. OnMouseOver event that occurs when placed on the web component, OnClick event that occurs when the user clicks on the web component using the mouse pointer. Since the event itself is only known technology, a detailed description thereof will be omitted.

An action item corresponds to each action performed in response to an event occurrence. For example, when a user clicks on a particular web component to select it, all of the actions that change the shape or image of another web component or cause a link to a specific site are performed. Corresponds to the action.

The primary detector 130 detects a user's web component selection, and the secondary detector 140 detects a user's selection of an event item included in an event list. The difference detecting unit 150 detects a user's selection of an action item included in the action list.

After the selection of the action item is detected by the tertiary detector 150, the script generator 160 selects the second component 140 for the web component whose selection is detected by the primary detector 130. When the event corresponding to the detected event item is generated, the tertiary detector 150 generates a client script to perform an action corresponding to the action item whose selection is detected.

For example, a selection for the first web component is detected by the primary detector 130, a selection of an OnMouseOver event item is detected by the secondary detector 140, and a specific site is detected by the third detector 150. For example, when an action selection corresponding to a connection to "kipo.go.kr" is detected, the script generator 160 may determine that the site "when a user who views a web page later places a mouse pointer on the first web component. kipo.go.kr "automatically generates a script (for example, JavaScript) to link to.

That is, the script generated by the script generator 160 may include code for detecting the position of the mouse pointer on the first web component and, in this case, code for connecting to "kipo.go.kr". .

The web page generation unit 170 generates a web page including both a web component displayed on the display 110 by the display control unit 120 and a client script generated by the script generation unit 160, and then stores the storage page 190. A function of storing the information is stored at 190.

When a web page includes both a web component and a client script related to the web component, when the web page viewer causes an event defined in the client script to occur for the web component as described above, the client script is defined in the client script. Action is performed automatically.

2 is an example of a screen display for authoring web content in the web content authoring apparatus 100 according to an embodiment of the present invention.

The component editor 112 is an area for creating at least one web component or displaying the generated web component, the property editor 113 is an area for defining characteristics of each web component, and the page editor 115 is at least one. This area is used to create a web page or to display a previously created web page. The layout editor creates a web page that selects at least one web page included in the page editor and adds or deletes a web component to the web page. The action editor is an area for defining events and actions for web components included in the layout editor.

This screen configuration is only an example and can be variously changed.

3 illustrates an example in which an event list including at least one event item described above is displayed on the display 110.

In this case, OnLoad, OnInit, OnShow, etc., each corresponds to an event item. For example, OnLoad means an event that occurs when a web page is loaded and displayed on a user terminal. OnClick means that a user clicks a mouse or touches a specific component. An event that occurs when you click.

When the developer selects an OnLoad item while the event list as shown in FIG. 3 is displayed, a screen for selecting an action may be displayed as shown in FIG. 4.

For example, if the developer selects the Set Property item 220, the Target item 221 and the Property item 222 may be displayed. The user selects Button1 from the Target item 221 and the Property item 222. In the case of selecting Checked in, the web content authoring apparatus 100 generates a corresponding client script (for example, JavaScript) code. The generated client script code indicates when the corresponding web page is displayed on the user terminal. The code that detects it and the code that causes Button1 in the Web page to be checked at that moment are included.

The above example corresponds to the case where the entire web page is a web component.

As another example, assuming that a developer selects a first web component (eg, Button3) included in a web page, selects an OnMouseOver item of FIG. 3, and selects an action item as shown in FIG. 4, the generated client The script code includes a code that detects an event that occurs when the user moves the mouse pointer over Button3 while the corresponding web page is displayed on the user terminal, and at that moment, Button1 included in the web page is checked. Contains code that makes it possible.

5 is a diagram illustrating a control flow of the web content authoring apparatus 100 according to an embodiment of the present invention.

At the request of the developer, the web content storage device executes the authoring tool (step S1). According to the execution of the authoring tool, the screen configuration as illustrated in FIG. 2 may be displayed. At this time, a blank screen appears in the layout editor of FIG. 2 (step S3).

When the user generates a web page in the page editor 115 of FIG. 2, the web content authoring apparatus 100 displays an empty web page in the layout editor (step S5), and the web content authoring apparatus ( 100 may add a UI component to the added web page (step S7).

In this manner, the web page of the layout editor may include a plurality of web components.

Thereafter, when the user selects any one of the added web components, the web content authoring apparatus 100 designates the selected web component (step S9), and the web content authoring apparatus according to the user's selection using the action editor (step S9). 100 designates an event item and an action item (step S11).

Thereafter, the web content authoring apparatus 100 automatically generates a JavaScript code for performing a specific action when a specific event occurs in a specific web component according to the previously specified content and includes it in the corresponding web page (step S13).

Subsequently, the web content authoring apparatus 100 generates and stores a web page including both the web component added to the web page and the generated JavaScript (step S15).

When the generated web page is displayed on the user terminal and an event defined in the client script code occurs for a specific web component included in the web page, the specific action defined in the client script code may be performed. It is.

According to the web content authoring apparatus 100 described above, a developer does not need to detect a specific event occurrence for a specific web component and manually code a client script in which a specific function is performed, thereby shortening client script coding time. You can reduce mistakes that can occur during manual coding.

In addition, you can easily write your own client script code by looking at the intuitive list (ie event list or action list) and making the necessary choices to write the client script code. There is an advantage to that.

On the other hand, the process of performing each of the above-described embodiments can be performed by a program or an application stored in a predetermined recording medium (for example, computer readable). Here, the recording medium includes both an electronic recording medium such as a random access memory (RAM), a magnetic recording medium such as a hard disk, an optical recording medium such as a compact disk (CD), and the like.

In this case, the program stored in the recording medium may be executed on hardware such as a computer or a smartphone to perform the above-described embodiments. In particular, at least one of the functional blocks of the web content authoring apparatus 100 according to the present invention described above may be implemented by such a program or application.

As described above, according to the present invention, since script generation for performing a specific action according to a specific event occurrence for a specific web component included in web content is performed by an intuitive selection of a developer, the script code is generated manually. This reduces errors and shortens script code generation time.

In particular, simply select items on the intuitive interface to generate script code, so designers who do not know the syntax of the script code can easily generate the necessary script code.

Claims

A control method of a web content authoring apparatus for authoring a web page including at least one web component,

(a) displaying at least one web component;

(b) detecting a user's selection of web components;

(c) displaying an event list including at least one event item after detecting the web component selection in step (b);

(d) detecting a user's selection of an event item included in the event list;

(e) displaying an action list including at least one action item after detecting selection of an event item in step (d);

(f) detecting a user's selection of an action item included in the action list;

(g) after the selection of the action item is detected in step (f), when an event corresponding to the event item in which the selection is detected in step (d) for the web component in which the selection is detected in step (b) And generating a client script for performing an action corresponding to the action item whose selection is detected in the step (f).
The method of claim 1,

The event item included in the event list of the step (c) is matched with the web component of the selection detected in the step (b) and stored in advance.
The method of claim 1,

The action item included in the action list of step (e) is stored in advance and matched with at least one of a web component in which a selection is detected in step (b) and an event item in which a selection is detected in step (d). A control method of a web content authoring apparatus.
The method of claim 1,

And generating a web page including both the web component displayed in the step (a) and the client script generated in the step (g).
The method of claim 1,

And in the step (a), display a web component selected by a user among web components included in the web component display area in the authoring area.
The method of claim 1,

In the step (a), the web component authoring method, characterized in that for extracting and displaying a web component from a web page specified by the user of the previously stored web page.
A computer-readable recording medium having recorded thereon a program for executing the method of any one of claims 1 to 6.
An application stored on a medium in combination with hardware to execute the method of any one of claims 1 to 6.
In the web content authoring apparatus for authoring a web page including at least one web component,

A display unit;

A display controller configured to display at least one web component, an event list including at least one event item, and an action list including at least one action item on the display unit;

A primary sensor for detecting a web component selection of a user;

A secondary detector for detecting a user's selection of an event item included in the event list;

A tertiary detector for detecting a user's selection of an action item included in the action list;

After the selection of the action item is detected by the tertiary detector, when the event corresponding to the event item in which the selection is detected by the secondary detector for the web component detected by the primary detector is generated, the tertiary Including a script generation unit for generating a client script to perform an action corresponding to the action item is detected in the detection unit,

The display control unit may display the event list after the selection of the web component is detected by the primary sensing unit and the action list after the selection of the event item is detected by the secondary sensing unit. Authoring device.
The method of claim 9,

And the event item included in the event list is pre-stored by being matched with a web component of which the selection is detected by the primary detection unit.
The method of claim 9,

The action item included in the action list is pre-stored by matching at least one of a web component whose selection is detected by the primary sensing unit and an event item whose selection is detected by the secondary sensing unit. Device.
The method of claim 9,

And a web page generator for generating a web page including both a web component displayed on the display by the display controller and a client script generated by the script generator.
The method of claim 9,

And the display controller is configured to display a web component selected by a user among web components included in the web component display area in an authoring area.
The method of claim 9,

And the display control unit extracts and displays a web component from a web page designated by a user among previously stored web pages.