TapeStry Getting Started (Pick)

xiaoxiao2021-03-06  16

Introduction

Jakarta Tapestry is an open source Java web application framework. You may say: "Datong is a small thing." Most

In the case, I agree with your point of view, however, as long as speaking a little time study, you will find that Tapestry is very different from other frames, it is worth serious.

Tapestry is a control-based framework for developing a web application similar to developing traditional GUI applications. You don't have to focus on the operation-centric servlet api with Tapestry (Operation-Centric) Servlet API. Quote a sentence on the TapeStry website: "TapeStry uses objects (Objects), method (Properties) replaces past URLs and query parameters, reinterpretation of web application development. Tapestry 3.0 is about to be released, it has a lot of improvements and new features.

Tapestry's goal

Simplicity

The Tapestry application is less code compared to traditional servlet applications. Most traditional servlet applications contain the following bored

Duplicate tasks: parse the query parameters, process the HTTPSession object, and build URLs. TapeStry eliminates many of the non-interest "Connect" code in traditional ServelT applications ("Plumbing" Code) enables developers to concentrate on the application logic.

consistency

Tapestry provides a consistent way for the page of the development web application. This helps to eliminate traditional servlet applications. Since all the pages in all Tapestry applications are used to organize the same accessible controls, the working mode is similar.

effectiveness

The TapeStr application has a height of upgradeability, which utilizes the cache and the object pool minimizes the processing time of each request. The TapeStry app has properties that are similar to traditional servlet applications.

Error feedback

Anyone developing a servlet / JSP application has no question: I have a similar experience: in order to find any mistakes in the web.xml file, you have to spend a lot of time to view the stack information in your browser. TapeStry has excellent error reporting methods, which is most worth mentioning that it will point out which file and that line leads to errors.

Compare with Struts

Since Apache Struts may be the most widely used web application framework today, TapeStry is the only fair. Here are some observations, they come from several simple Tapestry applications developed for this article and have experienced a few Struts projects.

Struts Advantages

1 A servlet / JSP developer is familiar with Struts without having to take too long. However, TapeStry's learning curve presides a little because it is not the same as the popular web application framework.

2 Struts is widely accepted and used in the Java community. Find a good Struts developer for your project is not difficult, Tapestry has recently won some attention in the developer community, but there are still many Java veterans who don't know what Tapestry is.

3 Since Struts is used in a wide range of use, there are many Struts resources available for reference. Compared to most open source software, TapeStry has a very considerable resource and document, but there is still a gap compared to Struts.

Advantages of Tapestry

1 You have developed a Tapestry app without paying attention to the Servlet API, you don't have to write some typical "connection" code for your servlet. Although Struts simplifies work, the servlet API is still you need to face.

2 Tapestry Page Template In addition to several special attributes and identifies are a standard HTML file. If you are an HTML design master in the development group, you don't understand Java or JSP, which brings you very convenient.

3 Because the TapeStry page is a standard HTML, you can edit and preview this page with the HTML you have obtained (Wysiwyg) editor. When a page needs to modify its appearance does not need to notify the server to restore the JSP.4 Tapestry does not require a sufficient, the entire application scope profile. Each page in TapeStry App is independent, changing a page does not affect the developer developer to develop other pages, because there is no configuration file to browse all pages together.

5 Tapestry has an excellent error report. If you make a mistake in a page of the template or page specification, TapeStry will indicate the line number that causes the error.

6 Developed with TapeStry is a fun. This way, it seems that it seems to be old, but use Tapestry to develop a web application more natural and interesting than other popular frameworks. Developing TapeStry is to apply a control-based architecture that is very similar to developing traditional GUI applications.

TapeStry architecture

The TapeStry framework is an extension of the standard servlet API. It requires J2SDK1.2 or higher J2SDK and a compatible application server / servlet container with servlet API 2.2 (or higher).

A TapeStry application consists of many pages with unique names. A page consists of a template and some of the accessible controls. Templates consist of standard HTML tags and some additional properties and tags, these additional properties and tags are to tell the Tapestry Framework These pages are composed of TapeSTRY controls.

Simple Tapestry Application

For the best description, build a TapeStry page, we can take a look at the code for this Pig Latin translator. This app has only one page. Enter a text value in this page to translate it into Pig Latin, then display the translated value to the user.

Each page consists of 3 parts in the TapeStry application: an HTML template, a page specification file, a Java class.

Here is this page screen graphic:

The page template is composed of a standard HTML tag and some additional properties and tags, which are to tell the Tapestry Framework These pages consist of TapeStry controls. The page template is stored in the root directory of the web application. Typically, TapeStry will find and present a page called "Home" at startup. Although we can change this behavior, it will be simpler in accordance with TapeStry.

Home.html Tapestry Pig Latin Translator </ Title> </ head> <body> <h1> Pig Latin Translator </ h1> <form jwcid = "@ form" 1 listener = "OGNL : listeners.Submit "2> <table border =" 1 "> <tr> <td> value to translate: </ td> <TD> <input type =" jwcid = "@ textfield" 3 value = "OGNL : InputValue "/> </ td> <tr> <tr> <td> Pig Latin: </ td> <td> <jwcid =" @ INSERT "4 value =" OGNL: PIGLATINVALUE "/> </ td> </ tr> </ table> <input type = "submit" jwcid = "@ submit" 5 value = "translate" /> </ form> </ body> </ html> page template is ordinary HTML, only a small part of TapeStry unique properties and labels. The advantage of this template mechanism is that the TapeStry page template can create and preview in an editor that is visible. Describe the identity of the TapeStry control section is limited and protruded.</p> <p>The JWCID in the identity is the Java Web Component ID of the TapeStry control applied. In the above code break, we are implicitly used controls. Implicit control refers to the controls used directly in the page template,. JWCID's prefix '@' symbol is to inform TapeStry The statement uses an implicit control.</p> <p>Four controls were used in the top of the Pig Latin Translator page: Form1, TextField 3, INSERT4 and SUBMIT 5. They are just four of the Tapestry framework that contains more than 40 controls. In the following example, we will see how to use explicit controls. Explicit controls refer to controls that are represented after declaring in the page specification file.</p> <p>In the previous HTML template, the parameters are specified for the control while using the control. For example, the control Form1 has a listner 2 parameter It specifies the method name of the page class call when the form is submitted. That OGNL: The prefix uses the HTML template through the page, pointing to Object Graph Navigation Language (OGNL). OGNL is a powerful open source expression language that binds properties of the page within the page to the properties of the page class.</p> <p>Now let's take a look at the page specification file. The page specification file is an extension-name XML file. This file has many duties. The most basic is the Java class corresponding to the specified page in numerous duties. The page specification file is stored in the web_inf directory of WebApp.</p> <p>Home.page <? XML Version = "1.0"?> <! Doctype page-specification public "- // apache software Foundation // TapeStry Specification 3.0 // en" "http://jakarta.apache.org/tapestry/dtd /Tapestry_3_0.dtd> <page-specification class = "Home"> <property-specification name = "inputValue" type = "java.lang.String" /> <property-specification name = "pigLatinValue" type = "java.lang .String "/> </ page-specification> The root element of the page specification file has a class's property, which specifies the Java class corresponding to this page. This class must implement the org.apache.tapestry.Ipage interface. Page specification The page defines two properties (Property) elements so that Tapestry creates new properties in the page class.</p> <p>The TapeStry framework provides org.apache.tapestry.html.baSepage Class, which implements an ipage interface. The page class is stored in a web-inf / class directory, and other classes you need to use your web application.</p> <p>Home.java Import Org.Apache.tapestry.html.basepage; import org.apache.tapestry.irequestcycle;</p> <p>Public Abstract Class Home Extends Basepage {Public Abstract String getInputValue (); public Abstract void setInputValue;</p> <p>Public Abstract string getpiglatinvalue (); public abstract void setpiglatinvalue (String PiglatinValue);</p> <p>Public void submit (IRequestcycle Cycle) {string infutValue = getInputValue (); string PiglatinValue = new PiglatInTranslator (); setpiglatinvalue (Piglatinvalue);}}</p> <p>The first thing you have to remind may be that this class is an abstract class. It also has several abstraction methods to access the InputValue, the PiglatinValue property. Here, TapeStry uses the function of creating subclasses at runtime, which creates the properties you declared in the page specification and generate the appropriate access method.</p> <p>The Submit method of the page class when the form is submitted. Why is this this? Because we specify the Listener property of the FORM control in the page template as: OGNL: Listener.SUBMIT. This means that a listner called Submit will be accessed by the page class Listener.</p> <p>All page classes and control classes are inherited from org.apache.tapestry.abstractComponent. This class is called a property called Listeners. When the Submit method is complete, the page will display the translated words. Finally, the web.xml this web release description file is released. Tapestry, like many other popular web application frameworks, consisting of a servlet, but also a release description file. That release description file should be stored in the web-inflicity.</p> <p>Web.xml <? XML Version = "1.0"?> <! doctype web-app public "- // sun microsystems, incaps//dtd Web Application 2.3 // en" "http://java.sun.com/ DTD / WEB-APP_2_3.DTD> <web-app> <display-name> Tapestry Pig Latin Translator </ Display-Name></p> <p><servlet> <servlet-name> TapeStry </ servlet-name> <servlet-class> org.apache.tapestry.ApplicationServlet </ servlet-class> <load-on-startup> 1 </ loading-on-startup> < / servlet></p> <p><servlet-mapping> <servlet-name> TapeStry </ servlet-name> <url-pattern> / app </ url-pattern> </ servlet-maping> </ web-app></p> <p>Although Pig Latin translation applications are very simple, it will allow you to have a basic understanding of the three components of a page in Tapestry applications. It also shows a page that creates a Tapestry application only needs to write how few code.</p> <p>Form input verification</p> <p>TapeStry provides some controls to check the user's input. The calibration subsystem is the core of the ValidField control. In the following login application we will use the ValidField control. The ValidField control is within the form and provides useful feedback and visual error prompts to the client's check.</p> <p>Regionalization</p> <p>In TapeStry, regionalization is quite simple. TapeStry allows us to zone of text and graphics. For the content of the regional page, you can add a Properties file to each, or provide a regional template. Provides a resource file for each page to manage and maintain a huge global application range of resource files. If the areaization of the page is not only the area of ​​text information, such as the display of the page, the configuration is different, so that the area-based page template can be used. We will use the TapeStry area in the following login applications.</p> <p>Create control</p> <p>More than 40 self-contained controls are available at TapeStry. If you want to know more about TapeStry's own control, please refer to TapeStry Component Reference. To see the application example of TapeStry to access TapeStry Component Workbench. If you find that you need a Tapestry itself does not provide control, you You can create one yourself. Creating your own TapeStry control is similar to the creation of a page. A typical TapeSTRY control is made by a control specification file (XML document), an HTML control template, a Java class that implements the org.apache.tapestry.icomponent interface. This topic is a bit beyond the scope of this article, but if you are interested in learning how to create your own TapeStry control, you can refer to Tapestry's original man, the author of Tapestry In Action, the DESIGNING Tapestry Mega-Components written by the HOWARD LEWIS Ship. TapeStry login application</p> <p>You have seen some basic features of Tapestry in the Pig Latin translator application. Instead of using a complex application showing all the features of Tapestry, you can't get angry, it is better to make you feel a little about TapeStry through some simple applications. The app shows how TapeStry handles page navigation, regionalization, verification, and other features.</p> <p>Here is a screen graphic of a home page, followed by its page template.</p> <p>Home.html <html> <head> <title> Welcome to the Tapestry Login Application </ Title> </ head></p> <p><body> <H1> Welcome to the Tapestry Login Application </ h1> <span jwcid = "@ PageLink" 1 Page = "login"> login </ span> </ body> </ html> page template for this Home page In addition to a JWCID property definition, it is a standard HTML other than a TapeStry PageLink1 control.</p> <p>The PageLink control generates a hyperlink pointing to the Login page. Since the home page does not have any dynamic behavior, it does not require the page specification and the Java class corresponding to the page.</p> <p>Here is the screen graphic of the Login page, followed by its page template.</p> <p>Login.html <html> <head> <title> <span key = "title"> 1Login </ span> </ title> </ head></p> <p><body jwcid = "@ body"> 2 <span jwcid = "@ conditional" Condition = "OGNL: beans.delegate.haserro"> 3 <div style = "color: red"> <span jwcid = "@ delegator" delegate = "OGNL: Beans.delegate.Firsterror"> 4 Error Message </ span> </ div> </ span> <p style = "font-weight: bold"> <span key = "hint"> hint: your password Is Your UserName Spelled Backwards. </ span> </ p> <form jwcid = "@ form" listener = "OGNL: listener.login" Delegate = "OGNL: Beans.delegate> 5 <Table> <TR> <TD Align = "right"> <span jwcid = "@ FieldLabel" Field = "OGNL: Components.InputuserName" 6> username: </ span> </ td> <td> <input type = "text" jwcid = "inputusername" 7 value = "simpson_h"</p> <p>Size = "30" /> </ td> </ tr></p> <p><TR> <TD align = "Right"> <span jwcid = "@ FieldLabel" field = "OGNL: Components.InputPassword"> Password: </ span> </ td> <td> <input type = "text" jwcid = "INPUTPASSWORD" hidden = "true" value = "" "SIZE =" 30 "/> </ td> </ tr></p> <p><TR> <TD COLSPAN = "2" align = "center"> <input type = "submit" jwcid = "@ Submit" value = "message: login" /> </ td> </ tr> </ table> </ form> </ body> </ html></p> <p>Most of this page template is usually HTML. We can see the regionalization characteristics of Tapestry from the page template: it uses a span element, this span element comes with a property called Key, the value of Key maps to a property in the login.properties file. A Body control is declared because it is required for the client's JavaScript verification.</p> <p>Set the Delegate property to Form Component to activate the form input verification. The delegate property is the implementation class of Org.Apache.tapestry.valid.ivalidationDelegate, declared in the page specification. If the verification error occurs, we use the Conditional Component 3 control to determine if Delegate has any errors. If you have the first error 4 to the user. If the OGNL expression OGNL: beans.delegate.haserrors is true, the Conditional control will display its content entity. All page classes and control classes are inherited from AbstractComponent to a property called Beans. This beans attribute is an instance of org.apache.tapestry.ibeanProvider, which uses it to obtain Beans.FieldLabel6 defined in the page specification file by name, which is used to display labels for the InputUserName Validfield control. This FieldLabel control is also used with a form. The verification agent collaboration indicates the input field containing the error. The InputUserName7 control is an example of a display control. Explicit controls refer to controls declared on page specification files. InputUserName and InputPassword controls are explicit, they are combined with FieldLabel to display their DisplayName properties.</p> <p>The following is the resource file of the login page. Login.Properties is equipped with page specification and stored in a web-inflicity. Login.properties title = Login to the Application hint = Hint: Your password is your username spelled backwards login = Login username = Username:. Password = Password: invalidpassword = Invalid Password Here is the page specification for the Login page Login.page <. XML Version = "1.0"?> <! doctype page-specification public "- // Apache Software Foundation // TapeStry Specification 3.0 // en" "http://jakarta.apache.org/tapestry/dtd/tapestry_3_0.dtd ></p> <p><page-specification class = "com.ociweb.tapestry.login"> <bean name = "delegate" class = "org.apache.tapestry.valid.validationdeLegate" /> 1</p> <p><Bean name = "requiredValidator" ② class = "org.apache.tapestry.valid.StringValidator"> <set-property name = "required" expression = "true" /> <set-property name = "clientScriptingEnabled" expression = " True "/> </ bean></p> <p><Property-Specification Name = "Username" type = "java.lang.string" /> <property-specification name = "password" type = "java.lang.string" /></p> <p><Component id = "inputUsername" type = "ValidField"> ③ <message-binding name = "displayName" key = "username" /> ④ <binding name = "validator" expression = "beans.requiredValidator" /> ⑤ <binding Name = "value" expression = "username" /> 6 </ component></p> <p><Component id = "inputPassword" type = "ValidField"> ⑦ <message-binding name = "displayName" key = "password" /> <binding name = "validator" expression = "beans.requiredValidator" /> <binding name = "Value" expression = "password" /> </ component> </ page-specification></p> <p>The Class property of the page-specification element and the two Property-Specification elements are similar to the Pig Latin translator.</p> <p>You will find the first new thing -bean element 1, bean elements put a org.apache.tapestry.valid.validationDelegate</p> <p>The instance specifies the name "delegate". The FORM control in the page HTML template sets its parameters delegate to OGNL: beans.delegate, pointing to this org.Apache.tapestry.valid.validationDelegate instance. The bean element 2 specifies the instance of an org.apache.tapestry.valid.StringValidator to verify it for verification. This bean's Required property is set to TRUE indicates that the domain of this bean must be verified. This bean's ClientScriptingNableEnableD property is set to TURE, indicating that the JavaScript verification function of the domain client using this bean is activated. The RequiredValidator bean is used to verify the contents of InputUserName and InputPassword.</p> <p>Control INPUTUSERNAME 3 is specified as ValidField, ValidField is a special version of the Tapestry Verify subsystem. TEXTFIELD control. The message-binding element is used to specify the value of the DisplayName parameter of the InputUserName control, which is obtained from the login.properties file with "username" for the keyword. The Validator parameter for the InputUserName control is set to RequiredValidator Bean, which is the 5 in the page specification. The value of the control value is bound to the UserName property of the page Java class. Control INPUTPASSWORD control specification with control INPUTUSERNAME is almost similar, in addition to the properties of the keywords for acquiring DisplayName and binding page Java classes.</p> <p>Using the ValidField control and providing a validationDelegate for the form (Form), we activate the verification function of the Login form. In addition to the server-side verification, TapeStry also provides client authentication (using JavaScript). Below is the screen capture of a JavaScript error dialog box popping up when the user submits a form without providing a value for the UserName domain.</p> <p>Below is the screen capture of a JavaScript error dialog box when the user is submitted to a form without providing a value for the Password domain.</p> <p>Below is the Java class corresponding to the Login page.</p> <p>Login.java package com.ociweb.tapestry;</p> <p>import org.apache.tapestry.html.BasePage; import org.apache.tapestry.IRequestCycle; import org.apache.tapestry.valid.ValidationConstraint; import org.apache.tapestry.valid.IValidationDelegate; public abstract class Login extends BasePage {public Abstract string getusername (); public abstract void setusername;</p> <p>Public Abstract string getPassword (); public abstract void setpassword (String password);</p> <p>public void login (IRequestCycle cycle) {String username = getUsername (); String password = getPassword (); StringBuffer sb = new StringBuffer (username); String validPassword = sb.reverse () toString ();. if (password.equals ( validPassword)) {cycle.activate ( "Success"); ①} else {String errorMessage = getMessage ( "invalidpassword"); ② IValidationDelegate validationDelegate = (IValidationDelegate) getBeans () getBean ( "delegate");. ③ validationDelegate.record ( ErrorMessage, ValidationConstRAINT.CONSISTENCY); 4}}} Like the Pig Latin translation, our page class is also abstract, it has an abstract method to access the properties defined in the page specification (Properties). TapeStry creates username and password properties at runtime. The Login method is just a simple verification whether the user-entered password value is just the reverse of the username. If the password is verified, the user will be led by the Success Page1.</p> <p>If the password is incorrect, we use the keyword "invalidpassword" through the GetMessage () method inherited from org.apache.tapestry.abstractComponent, search the corresponding resource from login.properties 2. We need to record the password error message to the page of the page defined in the page specification. Validation delegate. We can use our name to be specified in the page specification, from the page Beans property 3 in the page Beans attribute. Finally, we call org.apache.tapestry.valid.iValidationDelegate's Record method to save the error message to be displayed to the user. Below is the screen graphic after the user enters the submitted submission. Here is the page template for the Success page. The page template of the SUCCESS page contains only the HTML ID, so it does not require page specification and page</p> <p>Java class.</p> <p>Success.html <html> <head> <title> surcessful login </ title> </ head> <body> <p> congratulation! You have successfully logged on. </ P> </ body> </ html> summary</p> <p>I hope this article has already showed you how simple TapeStry framework is building a web application, however. TapeStry and most mainstream web application frameworks are that it allows you to develop in a control-based manner, rather than developing in operation. If this article arouses your interest, I suggest you download it down and use it your own simple web application. By feeling a simple application, this is the only way you understand the advantages of this framework. If you want to use Tapestry in your next project, I strongly recommend that you purchase Tapestry In Action this book. I have this book and I am very satisfied with it.</p> <p>References1 Zip File with all source code and war files from the article. (12k)</p> <p>Http://www.ociweb.com/jnb/jnb2004_05.zip2 TapeStry Home Page http://jakarta.apache.org/tapestry/3 Tapestry In action page http://www.manning.com/lewisship/4 Tapestry Wiki Http://jakarta.apache.org/tapestry/wiki_frame.html5 Ognl Page http://www.ognl.org/6 Tapestry Component Reference</p> <p>http://jakarta.apache.org/tapestry/doc/componentreference/index.html7 Tapestry Component Workbench http://www.t-deli.com/app8 designing Tapestry Mega-Components</p> <p>http://www.onjava.com/pub/a/onjava/2001/11/21/tapestry.html</p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-45662.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="45662" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.042</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'rk047aB9_2BJOSaOgD9qsqZ1p4Jg2xVm4Twi2wV_2BeSvcHf_2B1LNg_2F6wBhO5gP4pWZ3TgHodGXAFiQY4q8Adk_2F9MKg_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>