Ivan Lagunov's Blog

Quite a while ago I had users complaining they could not use my application from another secure network zone. It appeared the root cause was in using Yahoo CDN for serving YUI resources while there was no internet access in that specific network zone. Also living behind a proxy, our regular users used to suffer from longer delays from time to time due to proxying. An obvious solution turned out to be using a locally served YUI. For this a combo loader is required if you care about efficiency on Production. Installation To start with, there are several alternative open-source tools that can be used for combo loading: Official PHP loader by Yahoo – is obsolete and is said not to work with any version over 3.3.0. CGI script combo – I cannot say much about it besides that it's 3 years old. Node.js combo handler – is kept updated and is the one that I decided to use. The Node.js combo handler is supplied with rather self-contained README file at github. Nevertheless, I...

I've concluded an older post with a promise to investigate the issues of integration of Play Framework with RequireJS and YUI . Finally I've got some time to resolve all issues so I'm going to showcase a working sample multi-page project in this article. Sample project. Issues. Sample project Play Framework offers a nice official tutorial for RequireJS-support . However, it appeared that not all RequireJS features are fully supported by Play Framework yet (see below in Issues section). So it required some tuning before everything started working. I've published a sample project on github so you're welcome to look into it. Some of the issues that I faced are described in the section below. Here I'm going to show a couple of screenshots of the sample application. This is how one page of the application looks like: Below is the screenshot of the network tab of the Google Chrome developer tools showing all page resources in the production mode. You c...

Recently I've worked on the application making cross-domain ajax calls with YUI . While YUI offers io-xdr module for making cross-domain requests via Flash transport , it seems to me quite unnatural as it leads to unnecessary complexity. Moreover, io-xdr was marked deprecated several months ago without explicit mentioning the preferred way. An obvious alternative is using XMLHttpRequest as a transport for cross-domain requests. However, it has some limitations and undocumented pitfalls that I'd like to review in this post. Cross-Domain request using XMLHttpRequest. YUI IO Utility. YUI Datasource IO. Cross-Domain request using XMLHttpRequest Cross-domain requests can be sent using a common XMLHttpRequest object. The only requirement is that the server must be configured to properly handle those requests. Specifically, it should set the Access-Control-Allow-Origin response header according to Cross-Origin Resource Sharing specification . For more details and good tuto...

My first Play Framework application has recently gone live. This time it was the Java version of the framework, next time I may move on to Scala finally. Nevertheless, I've learned a lot and will try to share some knowledge here. The application is meant for managing the data stored in the Dydra graph database ( RDF & SPARQL ). It's a thick client application meaning that the data loading happens in the client JavaScript layer via JSON requests, while routing and user authentication is done by means of Play Framework. Also I've made use of the RequireJS support in Play Framework for dynamic JS module loading. For the UI I've chosen a well-known YUI library . More details are following below. Application architecture. User model and authentication. Dydra database layer and SPARQL client. JavaScript logic and YUI. RequireJS module loading. Application architecture As any web application, this one can be described in terms of MVC pattern . Play Framewor...

This article presents a nice way how to save some user-defined input on server and make browser wait for it before proceeding with navigation. This will be shown in a context of my use case that consists in a Cocoon Java application that allows exporting page in PDF format. Exported page is being generated by a specific Java Servlet as soon as the client browser redirects to the corresponding URL. Now assume that the end user wants to set a custom title for the exported page. Thus, we need some kind of interruption when the user clicks on the 'Export' link. It'll be implemented using nice  YUI3-based Transaction utility  and YUI3 Panel shown below: Initialize YUI3 To get started with YUI3, you should perform two steps: Load the YUI javascript file on your web page. Create and configure a new YUI instance. Please refer to this manual for code snippets. The only difference is that we'll use two modules: io and panel . Module io is required for transaction ...

This is a fully UI related article about YUI3 Calendar widget . Whereas official documentation page and provided examples ( here and here ) are good enough to start with, there are still many pitfalls when you're going to customize the widget. My use case required a date range selection feature with a nice calendar window open only when a user clicks on text input fields. Also the selected day should be highlighted in the calendar whenever a user clicks again on the filled text input field ( a nice example with YUI2 Calendar widget ). This is how one date input field looks like: Add calendar container and date fields on the web page First of all you need to add a container div for the calendar: <div id="calendar-container"> </div> You will provide this id to the Calendar constructor later either as a bounding box or a content box . The difference is in html markup generated by YUI3. I'll use a bounding box below in order to manipulate position ...